[common-assets & Library | new-theme]: Fixes for orcid dropdown in authors and increase timeout for addThis check for warning.

1. addThis.component.ts: [Bug fix] Increased timeout to 4 sec and fix check (sometimes innerText was undefined).
2. searchMyOrcidResults.component.html: [Bug fix] Removed uk-animation-fade from results and added uk-scrollspy.
3. showAuthors.component.ts: [Bug fix] Fixed copy to clipboard - data-clipboard-target was not working because we have multiple clipboards in the same page (reverted code to old way of copying).
4. timeout-interceptor.service.ts: Reverted timeout time for client.
5. utils.css: Added custom css for .orcid-dropdown input (orcid dropdown in authors).
This commit is contained in:
Konstantina Galouni 2022-05-17 12:15:15 +03:00
parent 7d563c19a8
commit 9577c7841d
4 changed files with 25 additions and 21 deletions

View File

@ -1,4 +1,14 @@
import {Component, EventEmitter, Inject, OnInit, Output, RendererFactory2, ViewEncapsulation} from '@angular/core'; import {
ChangeDetectorRef,
Component,
EventEmitter,
Inject,
OnInit,
Output,
RendererFactory2,
ViewChild,
ViewEncapsulation
} from '@angular/core';
import {ActivatedRoute} from '@angular/router'; import {ActivatedRoute} from '@angular/router';
import {DOCUMENT} from "@angular/common"; import {DOCUMENT} from "@angular/common";
import {Subscriber} from "rxjs"; import {Subscriber} from "rxjs";
@ -67,11 +77,10 @@ export class AddThisComponent implements OnInit {
} }
} }
this.subs.push(setTimeout(() => { this.subs.push(setTimeout(() => {
if(this.document.getElementById('addThis') && this.document.getElementById('addThis').innerText.length ==0){ if(this.document.getElementById('addThis') && this.document.getElementById('addThis').innerText){
this.showWarning = true; this.showWarning = true;
} }
}, 2000)); }, 4000));
}catch (e) { }catch (e) {
// console.error(e) // console.error(e)
} }

View File

@ -5,10 +5,10 @@
[totalResults]="totalResults"> [totalResults]="totalResults">
</no-load-paging> </no-load-paging>
<ul class="uk-list search-results uk-margin-remove-top"> <ul class="uk-list search-results uk-margin-remove-top" uk-scrollspy="cls: uk-animation-fade; target: .uk-card; delay: 100">
<errorMessages *ngIf="status != errorCodes.NONE" [status]="[status]" [type]="'results'"></errorMessages> <errorMessages *ngIf="status != errorCodes.NONE" [status]="[status]" [type]="'results'"></errorMessages>
<li *ngFor="let result of previewResults" class="uk-animation-fade"> <li *ngFor="let result of previewResults">
<div class="uk-card uk-card-default uk-padding"> <div class="uk-card uk-card-default uk-padding">
<div class="uk-grid uk-grid-divider"> <div class="uk-grid uk-grid-divider">
<div class="uk-width-expand@m uk-width-1-1 uk-first-column"> <div class="uk-width-expand@m uk-width-1-1 uk-first-column">

View File

@ -20,7 +20,7 @@ export class TimeoutInterceptor implements HttpInterceptor {
return next.handle(req); return next.handle(req);
} }
const timeoutValue = isPlatformServer(this.platformId)?3000:16000;//req.headers.get('timeout') || this.defaultTimeout; const timeoutValue = isPlatformServer(this.platformId)?3000:6000;//req.headers.get('timeout') || this.defaultTimeout;
const timeoutValueNumeric = Number(timeoutValue); const timeoutValueNumeric = Number(timeoutValue);
return next.handle(req).pipe(timeout(timeoutValueNumeric)); return next.handle(req).pipe(timeout(timeoutValueNumeric));
} }

View File

@ -25,7 +25,7 @@ import {properties} from "../../../../environments/environment";
</span> </span>
</a> </a>
<div *ngIf="(author.orcid || author.orcid_pending) && testBrowser" <div *ngIf="(author.orcid || author.orcid_pending) && testBrowser"
class="default-dropdown uk-margin-remove-top uk-dropdown" class="default-dropdown uk-margin-remove-top uk-dropdown orcid-dropdown"
uk-dropdown="mode:click; offset: 4" style="min-width: 465px !important;"> uk-dropdown="mode:click; offset: 4" style="min-width: 465px !important;">
<div class="uk-padding-small"> <div class="uk-padding-small">
<h6 class="uk-margin-remove">{{author.fullName}}</h6> <h6 class="uk-margin-remove">{{author.fullName}}</h6>
@ -42,11 +42,10 @@ import {properties} from "../../../../environments/environment";
<div> <div>
<div class="clipboard-wrapper uk-width-1-1 uk-flex uk-flex-middle uk-flex-center" <div class="clipboard-wrapper uk-width-1-1 uk-flex uk-flex-middle uk-flex-center"
style="min-height: 43px; min-width: 280px;"> style="min-height: 43px; min-width: 280px;">
<span id="element" class="uk-padding-small uk-text-emphasis"> <input #element class="uk-padding-small uk-text-emphasis uk-width-medium uk-disabled"
{{properties.orcidURL+(author.orcid ? author.orcid : author.orcid_pending)}} [value]="properties.orcidURL+(author.orcid ? author.orcid : author.orcid_pending)"/>
</span>
<a [class]="'uk-link copy orcid_clipboard_btn orcid_clipboard_btn_auhtor_'+i" <a [class]="'uk-link copy orcid_clipboard_btn orcid_clipboard_btn_auhtor_'+i"
data-clipboard-target="#element" title="Copy to clipboard"> title="Copy to clipboard" (click)="copyToClipboard(element)">
COPY COPY
</a> </a>
</div> </div>
@ -118,9 +117,7 @@ export class ShowAuthorsComponent {
this.testBrowser = isPlatformBrowser(platformId); this.testBrowser = isPlatformBrowser(platformId);
} }
ngOnInit() { ngOnInit() {}
this.createClipboard();
}
public onClick() { public onClick() {
if (this.modal) { if (this.modal) {
@ -144,12 +141,10 @@ export class ShowAuthorsComponent {
this.authorsModal.open(); this.authorsModal.open();
} }
private createClipboard() { copyToClipboard(element: HTMLInputElement) {
if (typeof window !== 'undefined') { element.select();
delete this.clipboard; if (typeof document !== 'undefined') {
let Clipboard; document.execCommand('copy');
Clipboard = require('clipboard');
this.clipboard = new Clipboard('.orcid_clipboard_btn');
} }
} }
} }