[Library | Trunk]: Change b2note button position and change condition if b2note url propert exists

git-svn-id: https://svn.driver.research-infrastructures.eu/driver/dnet40/modules/uoa-services-library/trunk/ng-openaire-library/src/app@60187 d315682c-612b-4755-9ff5-7f18f6832af3
This commit is contained in:
k.triantafyllou 2021-01-05 13:25:02 +00:00
parent e5470490da
commit a1cf4bcd15
5 changed files with 72 additions and 34 deletions

View File

@ -4,7 +4,7 @@ import {properties} from "../../../environments/environment";
export class ConnectHelper {
public static getCommunityFromDomain(domain: string): string{
//domain = "beta.covid-19.openaire.eu"; //for testing
domain = "beta.covid-19.openaire.eu"; //for testing
domain = domain.indexOf("//") != -1? domain.split("//")[1]:domain; //remove https:// prefix
if (domain.indexOf('openaire.eu') === -1) {
return null;

View File

@ -1,10 +1,20 @@
import {Component, ElementRef, HostListener, Input, OnDestroy, OnInit, ViewChild} from "@angular/core";
import {
Component,
ElementRef,
EventEmitter,
HostListener,
Input,
OnDestroy,
OnInit,
Output,
ViewChild
} from "@angular/core";
import {Annotation, AnnotationService} from "./annotation.service";
import {ResultLandingInfo} from "../../utils/entities/resultLandingInfo";
import {EnvProperties} from "../../utils/properties/env-properties";
import {properties} from "../../../../environments/environment";
import {UserManagementService} from "../../services/user-management.service";
import {COOKIE} from "../../login/utils/helper.class";
import {COOKIE, User} from "../../login/utils/helper.class";
import {Subscriber} from "rxjs";
@Component({
@ -12,7 +22,7 @@ import {Subscriber} from "rxjs";
template: `
<div class="sideInfoTitle uk-margin-small-bottom">Annotations</div>
<div class="b2note">
<form ngNoForm *ngIf="pid && user"
<form #form ngNoForm *ngIf="pid && user"
[action]="properties.b2noteAPIURL + 'widget'"
method="post"
target="b2note_iframe"
@ -27,24 +37,8 @@ import {Subscriber} from "rxjs";
type="hidden"
name="pid_tofeed"
[value]="pid">
<!--URL of the record contents for downloading-->
<button class="uk-flex uk-flex-middle uk-button"
(click)="toggleAnnotation($event)"
type="submit"
title="Click to annotate this page using B2Note.">
<img src="assets/common-assets/b2note.png" width="48" height="24">
<span>add annotation</span>
</button>
</form>
<div *ngIf="!pid || !user">
<button class="uk-flex uk-flex-middle disabled"
[title]="!pid?'Annotations are only available for resources with a PID (persistent identifier) like DOI, handle, PMID':
'Annotations are only available for logged in users'">
<img src="assets/common-assets/b2note.png" width="48" height="24">
<span>add annotation</span>
</button>
</div>
<div *ngIf="loading" class="loading-gif uk-margin-medium-top"></div>
<loading *ngIf="loading" class="uk-margin-medium-top"></loading>
<ul *ngIf="annotations && !loading" class="uk-list uk-list-divider">
<li *ngFor="let annotation of annotations.slice(0, visibleAnnotations); let i=index" uk-grid
class="uk-flex uk-flex-top uk-margin-remove-left">
@ -54,7 +48,8 @@ import {Subscriber} from "rxjs";
<ul class="uk-width-expand uk-list uk-margin-remove-top" *ngIf="annotation.targets">
<li *ngFor="let target of annotation.targets.slice(0, annotation.targetSize)">
<a *ngIf="target.url" [href]="target.url" target="_blank">{{target.id}}</a>
<a *ngIf="!target.url" routerLink="/search/advanced/research-outcomes" [queryParams]="searchPid(target.id)">{{target.id}}</a>
<a *ngIf="!target.url" routerLink="/search/advanced/research-outcomes"
[queryParams]="searchPid(target.id)">{{target.id}}</a>
</li>
<li *ngIf="annotation.targetSize < annotation.targets.length"><a
(click)="open(i)">+ {{annotation.targets.length - annotation.targetSize}}
@ -95,7 +90,13 @@ export class AnnotationComponent implements OnInit, OnDestroy {
public user;
public visibleAnnotations: number;
public loading: boolean = false;
public submitted: boolean = false;
@Output()
public userEmitter: EventEmitter<User> = new EventEmitter<User>();
@Output()
public pidEmitter: EventEmitter<string> = new EventEmitter<string>();
@ViewChild('iframe') iframe: ElementRef;
@ViewChild('form') form: ElementRef;
private subscriptions: any[] = [];
constructor(private annotationService: AnnotationService,
@ -117,6 +118,7 @@ export class AnnotationComponent implements OnInit, OnDestroy {
ngOnInit(): void {
this.subscriptions.push(this.userManagementService.getUserInfo().subscribe(user => {
this.user = user;
this.userEmitter.emit(this.user);
}));
this.visibleAnnotations = this.annotationSize;
if (typeof window !== "undefined") {
@ -139,9 +141,14 @@ export class AnnotationComponent implements OnInit, OnDestroy {
if (this.pid) {
this.getAnnotations();
}
this.pidEmitter.emit(this.pid);
}
}
public get enabled(): boolean {
return this.pid && this.user;
}
private clearSubscriptions() {
this.subscriptions.forEach(subscription => {
if (subscription instanceof Subscriber) {
@ -196,7 +203,7 @@ export class AnnotationComponent implements OnInit, OnDestroy {
});
}
public searchPid(pid: string): { [k: string]: any;} {
public searchPid(pid: string): { [k: string]: any; } {
return {
f0: 'pid',
fv0: pid,
@ -204,24 +211,23 @@ export class AnnotationComponent implements OnInit, OnDestroy {
}
}
ngOnDestroy()
:
void {
ngOnDestroy() {
this.clearSubscriptions();
}
public
toggleAnnotation(event) {
if (this.visible) {
event.preventDefault();
} else if(!this.submitted) {
this.form.nativeElement.submit();
this.submitted = true;
}
this.visible = !this.visible;
}
open(i: number) {
this.annotations.forEach((annotation, index) => {
if(index != i) {
if (index != i) {
annotation.targetSize = 3;
} else {
annotation.targetSize = annotation.targets.length

View File

@ -3,9 +3,10 @@ import {AnnotationComponent} from "./annotation.component";
import {CommonModule} from "@angular/common";
import {DragDropModule} from "@angular/cdk/drag-drop";
import {RouterModule} from "@angular/router";
import {LoadingModule} from "../../utils/loading/loading.module";
@NgModule({
imports: [CommonModule, DragDropModule, RouterModule],
imports: [CommonModule, DragDropModule, RouterModule, LoadingModule],
declarations: [AnnotationComponent],
exports: [AnnotationComponent]
})

View File

@ -100,6 +100,22 @@
<span class="uk-margin-small-left">Cite this {{getTypeName()}}</span>
</a>
</li>
<li *ngIf="properties.b2noteAPIURL">
<a *ngIf="user && pid" class="uk-link-text uk-text-bold uk-text-uppercase" (click)="annotation.toggleAnnotation($event)">
<span class="uk-icon-button uk-button-primary uk-icon">
<img src="assets/common-assets/b2note.png">
</span>
<span class="uk-margin-small-left">add annotation</span>
</a>
<span *ngIf="!pid || !user" class="uk-link-text uk-text-bold uk-text-uppercase disabled"
[attr.uk-tooltip]="!pid?'Annotations are only available for resources with a PID (persistent identifier) like DOI, handle, PMID':
'Annotations are only available for logged in users'">
<span class="uk-icon-button uk-button-primary uk-icon disabled">
<img src="assets/common-assets/b2note.png">
</span>
<span class="uk-margin-small-left">add annotation</span>
</span>
</li>
<!-- Metrics -->
<li *ngIf="hasAltMetrics || hasMetrics" class="uk-margin-medium-top">
<div uk-grid
@ -484,8 +500,8 @@
</div>
</div>
<!-- B2 Note-->
<div *ngIf="properties.environment !== 'production' && properties.adminToolsPortalType !== 'monitor' && properties.adminToolsPortalType !== 'aggregator' && resultLandingInfo" class="uk-margin-medium-top">
<b2note [id]="id" [landingInfo]="resultLandingInfo"></b2note>
<div *ngIf="properties.b2noteAPIURL && resultLandingInfo" class="uk-margin-medium-top">
<b2note #annotation [id]="id" [landingInfo]="resultLandingInfo" (userEmitter)="userInit($event)" (pidEmitter)="pidInit($event)"></b2note>
</div>
</div>
</div>

View File

@ -20,6 +20,8 @@ import {StringUtils} from "../../utils/string-utils.class";
import {properties} from "../../../../environments/environment";
import {ISVocabulariesService} from "../../utils/staticAutoComplete/ISVocabularies.service";
import {Subscriber} from "rxjs";
import {AnnotationComponent} from "../annotation/annotation.component";
import {User} from "../../login/utils/helper.class";
@Component({
@ -98,6 +100,9 @@ export class ResultLandingComponent {
'Title', 'Authors', 'Access rights',
'Publisher information', 'Funding Information',
'Persistent identifiers', 'Other'];
public user: User;
public pid: string;
@ViewChild("annotation") annotation: AnnotationComponent;
constructor(private _resultLaningService: ResultLandingService,
private _vocabulariesService: ISVocabulariesService,
@ -112,8 +117,7 @@ export class ResultLandingComponent {
private metricsService: MetricsService,
private cdr: ChangeDetectorRef,
private _location: Location,
private indexInfoService: IndexInfoService,
private fb: FormBuilder) {
private indexInfoService: IndexInfoService) {
}
ngOnInit() {
@ -214,6 +218,17 @@ export class ResultLandingComponent {
this._vocabulariesService.clearSubscriptions();
}
public userInit(event) {
this.user = event;
this.cdr.detectChanges();
}
public pidInit(event) {
this.pid = event;
this.cdr.detectChanges();
}
public getTypeName(): string {
if (this.type === "dataset") {
return "research data";