[Library | angular-14 & Explore | master]: Updated request to Crossref for bulk uploaded DOIs in linking | Added link for more information to joomla article (Canada's request).

1. sdg.component.html: Added link for more information to joomla article (Canada's request).
2. timeout-interceptor.service.ts: Excluded from timeout interceptor  properties.searchCrossrefAPIURL and properties.searchDataciteAPIURL.
3. searchDatacite.service.ts: In method "getDataciteResultByDOI()", for requests coming from file uploaded in linking added timeout to 20 sec, and for other requests timeout similar to the interceptor (6 sec for production, 12 otherwise).
4. searchCrossref.service.ts: In method "searchCrossrefByDOIs()", added timeout similar to the interceptor (6 sec for production, 12 otherwise) | Added method "searchCrossrefByDOI()", called for requests coming from file uploaded in linking.
5. bulkClaim.component.ts: Call new API method for Crossref requests for DOIs | Fixed tooltip to appear.
This commit is contained in:
Konstantina Galouni 2022-12-16 09:59:48 +02:00
parent 06f2f586a8
commit ce4b9273e0
6 changed files with 120 additions and 36 deletions

View File

@ -2,8 +2,10 @@ import {throwError as observableThrowError} from 'rxjs';
import {Injectable} from '@angular/core';
import {HttpClient} from '@angular/common/http';
import {ClaimEntity, ClaimResult} from '../claimHelper.class';
import {map} from "rxjs/operators";
import {map, timeout} from "rxjs/operators";
import {EnvProperties} from "../../../utils/properties/env-properties";
import {properties} from "../../../../../environments/environment";
import {StringUtils} from "../../../utils/string-utils.class";
@Injectable()
export class SearchCrossrefService {
@ -20,7 +22,9 @@ export class SearchCrossrefService {
}
searchCrossrefByDOIs(DOIs: string[], properties: EnvProperties, parse: boolean = false): any {
searchCrossrefByDOIs(DOIs: string[], properties: EnvProperties, parse: boolean = false, file: boolean = false): any {
let timeoutTime: number = properties.environment == "production" ? 6000 : 12000;
// let timeoutTimeForFile: number = 60000;
var doisParams = "";
for (var i = 0; i < DOIs.length; i++) {
@ -28,11 +32,21 @@ export class SearchCrossrefService {
}
let url = properties.searchCrossrefAPIURL + '?filter=' + doisParams;
return this.http.get(url)
//.map(request => <any> request.json().message)
.pipe(map(request => request['message']))
.pipe(map(request => [request["total-results"], parse ? this.parse(request['items']) : request]))
//.catch(this.handleError);
// .pipe(timeout(file ? timeoutTimeForFile : (timeoutTime)))
.pipe(timeout(timeoutTime))
.pipe(map(request => request['message']))
.pipe(map(request => [request["total-results"], parse ? this.parse(request['items']) : request]))
}
searchCrossrefByDOI(DOI: string): any {
let timeoutTimeForFile: number = 20000;
let url = properties.searchCrossrefAPIURL + '/' + StringUtils.URIEncode(DOI);
return this.http.get(url)
.pipe(timeout(timeoutTimeForFile))
.pipe(map(request => request['message']))
.pipe(map(request => this.parse(request)))
}
searchCrossrefByMultipleDOIs(dois: string[], properties: EnvProperties, parse: boolean = false): any {
let url = properties.searchCrossrefAPIURL + '?filter=doi:';
for (var i = 0; i < dois.length; i++) {
@ -56,8 +70,11 @@ export class SearchCrossrefService {
parse(response): ClaimEntity[] {
const results: ClaimEntity[] = [];
for (let i = 0; i < response.length; i++) {
const item = response[i];
let length = Array.isArray(response) ? response.length : 1;
for (let i = 0; i < length; i++) {
const item = Array.isArray(response) ? response[i] : response;
const entity: ClaimEntity = new ClaimEntity();
entity.result = new ClaimResult();
entity.result.publisher = null;

View File

@ -3,7 +3,7 @@ import {Injectable} from '@angular/core';
import {HttpClient} from '@angular/common/http';
import {EnvProperties} from '../../../utils/properties/env-properties';
import {ClaimEntity, ClaimResult} from '../claimHelper.class';
import {catchError, map} from 'rxjs/operators';
import {catchError, map, timeout} from 'rxjs/operators';
import {properties} from "../../../../../environments/environment";
@ -21,10 +21,14 @@ export class SearchDataciteService {
//.catch(this.handleError);
}
getDataciteResultByDOI(doi: string, properties: EnvProperties, parse: boolean = false): any {
getDataciteResultByDOI(doi: string, properties: EnvProperties, parse: boolean = false, file: boolean = false): any {
let timeoutTime: number = properties.environment == "production" ? 6000 : 12000;
let timeoutTimeForFile: number = 20000;
let url = properties.searchDataciteAPIURL + '/' + doi;
let key = url;
return this.http.get((properties.useCache) ? (properties.cacheUrl + encodeURIComponent(url)) : url)
.pipe(timeout(file ? timeoutTimeForFile : (timeoutTime)))
.pipe(map(request => (parse ? SearchDataciteService.parse([request["data"]])[0] : request)), catchError(err => of(null)));
}

View File

@ -21,14 +21,16 @@ declare var UIkit: any;
<div>
<!--div class="uk-text-lead">Upload a DOI csv file <helper div="link-result-bulk" tooltip=true ></helper></div>
<label for="exampleInputFile">Select a file: </label-->
<div class="js-upload uk-float-left" uk-form-custom>
<input id="exampleInputFile" class="uk-width-medium" type="file" (change)="fileChangeEvent($event)"/>
<span class="uk-link " style="text-decoration: underline;">Upload a DOI's CSV file </span>
<div class="uk-float-left">
<span class="js-upload" uk-form-custom>
<input id="exampleInputFile" class="uk-width-medium" type="file" (change)="fileChangeEvent($event)"/>
<span class="uk-link " style="text-decoration: underline;">Upload a DOI's CSV file </span>
</span>
<!--button class="uk-button portal-button" type="button" tabindex="-1" [class.disabled]="!enableUpload" ><span class="uk-margin-small-right uk-icon" >
<svg width="20" height="20" viewBox="0 0 20 20" xmlns="http://www.w3.org/2000/svg"> <polyline fill="none" stroke="#000" points="5 8 9.5 3.5 14 8 "></polyline> <rect x="3" y="17" width="13" height="1"></rect>
<line fill="none" stroke="#000" x1="9.5" y1="15" x2="9.5" y2="4"></line></svg></span> Select</button-->
<!--helper div="link-result-bulk" tooltip=true ></helper-->
<span class=" " title="{{tooltip}}" uk-tooltip><span class="uk-icon" uk-icon="icon: info; ratio: 0.8">&nbsp; </span> </span>
<span class=" " title="{{tooltip}}" uk-tooltip><span class="uk-icon" uk-icon="icon: info; ratio: 0.8">&nbsp; </span> </span>
</div>
<div *ngIf="showReport" uk-alert class="uk-alert-primary">
<a class="uk-alert-close" uk-close></a>
@ -107,17 +109,16 @@ export class BulkClaimComponent {
exceedsLimit = false;
@Input() basketLimit ;
tooltip = `
<div class="uk-padding-small uk-padding-remove-right uk-padding-remove-left">
<div >
<div><span class="uk-text-bold">CSV format:</span> <br>&quot;DOI&quot;,&quot;ACCESS_MODE&quot;,&quot;DATE&quot;</div>
<br>
<div class=" uk-text-small">
<div>- DOI is required</div>
<div>- Access mode: <br> OPEN, CLOSED, EMBARGO</div>
<div>- Embargo end date:<br> YYYY-MM-DD </div>
</div>
</div>
</div>`;
<div>
<div class="uk-margin-bottom">Up to 100 DOIs</div>
<div><span class="uk-text-bold">CSV format:</span> <br>&quot;DOI&quot;,&quot;ACCESS_MODE&quot;,&quot;DATE&quot;</div>
<br>
<div class="uk-text-small">
<div>- DOI is required</div>
<div>- Access mode: <br> OPEN, CLOSED, EMBARGO</div>
<div>- Embargo end date:<br> YYYY-MM-DD </div>
</div>
</div>`;
constructor(private _searchCrossrefService: SearchCrossrefService, private _searchDataciteService: SearchDataciteService) {
this.filesToUpload = [];
}
@ -247,11 +248,12 @@ export class BulkClaimComponent {
}
fetchResult(id: string, accessMode: string, date: string, row: number) {
this.subscriptions.push(this._searchCrossrefService.searchCrossrefByDOIs([id], this.properties, true).subscribe(
// this.subscriptions.push(this._searchCrossrefService.searchCrossrefByDOIs([id], this.properties, true, true).subscribe(
this.subscriptions.push(this._searchCrossrefService.searchCrossrefByDOI(id).subscribe(
data => {
const result:ClaimEntity = data[1][0];
if (data[1].length > 0) {
if (data.length > 0) {
const result:ClaimEntity = data[0];
this.foundIds.push(id);
result.result.accessRights = accessMode;
result.result.embargoEndDate = date;

View File

@ -18,6 +18,10 @@
</h2>
<div class="uk-width-3-4@m" uk-scrollspy-class>
We have developed a classification scheme for UN Sustainable Development Goals, to view contributions of research towards complex challenges for humanity such as climate change, biodiversity loss, pollution and poverty reduction.
<div class="uk-text-meta uk-margin-top">
For more information please visit <a href="https://www.openaire.eu/openaire-explore-introducing-sdgs-and-fos" target="_blank">https://www.openaire.eu/openaire-explore-introducing-sdgs-and-fos</a>
</div>
</div>
<div>
<!-- TODO: need a page for the description of the algorithm - to get us there from the learn more btn -->

View File

@ -9,7 +9,9 @@ export const DEFAULT_TIMEOUT = new InjectionToken<number>('defaultTimeout');
@Injectable()
export class TimeoutInterceptor implements HttpInterceptor {
private static TIMEOUT_WHITELIST = [properties.csvAPIURL, properties.registryUrl, properties.claimsAPIURL];
// timeout inside services for: properties.searchCrossrefAPIURL, properties.searchDataciteAPIURL
private static TIMEOUT_WHITELIST = [properties.csvAPIURL, properties.registryUrl, properties.claimsAPIURL,
properties.searchCrossrefAPIURL, properties.searchDataciteAPIURL];
constructor(@Inject(DEFAULT_TIMEOUT) protected defaultTimeout: number, @Inject(PLATFORM_ID) private platformId: any) {
}

View File

@ -1,10 +1,21 @@
import {Component, ViewEncapsulation, ComponentRef, ElementRef, Input, EventEmitter, Output} from '@angular/core';
import {
Component,
ViewEncapsulation,
ComponentRef,
ElementRef,
Input,
EventEmitter,
Output,
ViewChild
} from '@angular/core';
declare var UIkit: any;
@Component({
selector: 'modal-loading',
template: `
<!--uk-modal="center:true"-->
<div [class]="(!isOpen)?'uk-modal ':'uk-modal uk-open uk-animation-fade'" [open]="!isOpen" tabindex="-1" role="dialog" >
<!-- uk-modal="center:true"-->
<!-- <div [class]="(!isOpen)?'uk-modal ':'uk-modal uk-open uk-animation-fade'" [open]="!isOpen" uk-modal tabindex="-1" role="dialog" >-->
<div #loading_element class="uk-modal" [id]="id" uk-modal="container: #modal-container">
<div class="uk-modal-dialog" role="">
<!--div class="modal-content"-->
@ -23,6 +34,23 @@ import {Component, ViewEncapsulation, ComponentRef, ElementRef, Input, EventEmit
</div>
<!--/div-->
</div>
<!-- <div #element [class]="(!isOpen)?'uk-modal ':'uk-modal uk-animation-fade uk-open'" [open]="!isOpen" uk-modal="container: #modal-container">-->
<!-- <div class="uk-modal-dialog">-->
<!-- <div class="uk-modal-body uk-animation-fast uk-text-left">-->
<!-- <h4 class="text-center" >{{message}}</h4>-->
<!-- <div class="uk-animation-fade uk-margin-top uk-width-1-1" role="alert">-->
<!-- <span class="loading-gif uk-align-center" ></span>-->
<!-- </div>-->
<!-- <ng-content></ng-content>-->
<!-- </div>-->
<!-- </div>-->
<!-- </div>-->
<!--div class="uk-modal uk-open" aria-hidden="false" style="display: block; overflow-y: scroll;">
<div class="uk-modal-dialog" tabindex="">
<div class="uk-modal-spinner"></div>
@ -35,27 +63,54 @@ import {Component, ViewEncapsulation, ComponentRef, ElementRef, Input, EventEmit
* API to an open alert window.
*/
export class ModalLoading{
private static MODAL_LOADING_COUNTER: number = 0;
id: string = "modal-loading";
@Input() public message:string ="Loading";
@ViewChild('loading_element') element: ElementRef;
/**
* if the value is true alert will be visible or else it will be hidden.
*/
public isOpen:boolean=false;
// public isOpen:boolean=false;
/**
* Emitted when a ok button was clicked
* or when Ok method is called.
*/
@Output() public alertOutput:EventEmitter<any> = new EventEmitter();
constructor( public _elementRef: ElementRef){}
constructor( public _elementRef: ElementRef){
}
ngOnInit() {
ModalLoading.MODAL_LOADING_COUNTER++;
this.id = 'modal-loading-' + ModalLoading.MODAL_LOADING_COUNTER;
}
ngOnDestroy() {
if(typeof document !== "undefined") {
const element = document.getElementById("modal-loading-container");
for (let i = element.childNodes.length - 1; i >= 0; --i) {
let child: ChildNode = element.childNodes[i];
if (child['id'] == this.id) {
child.remove();
}
}
}
}
/**
* Opens a alert window creating backdrop.
*/
open(){
this.isOpen= true;
// this.isOpen= true;
UIkit.modal(this.element.nativeElement).show();
}
close(){
this.isOpen = false;
// this.isOpen = false;
UIkit.modal(this.element.nativeElement).hide();
}
}