MaDgIK
/
openaire-library
13
0
Fork 0
Code Issues Pull Requests Projects Releases Wiki Activity

[Library | Trunk]: Annotations add list of related annotations resources 

git-svn-id: https://svn.driver.research-infrastructures.eu/driver/dnet40/modules/uoa-services-library/trunk/ng-openaire-library/src/app@59962 d315682c-612b-4755-9ff5-7f18f6832af3
This commit is contained in:
k.triantafyllou 2020-11-25 16:09:36 +00:00
parent fd31ff1556
commit 3dfe33b5c7
8 changed files with 176 additions and 96 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

94
landingPages/annotation/annotation.component.ts
View File

@ -22,11 +22,6 @@ import {Subscriber} from "rxjs";
type="hidden"
name="recordurl_tofeed"
[value]="url">
<!--URL of the record contents for downloading-->
<input
type="hidden"
name="subject_tofeed"
[value]="pid">
<!--PID of the annotated record-->
<input
type="hidden"
@ -51,15 +46,18 @@ import {Subscriber} from "rxjs";
</div>
<div *ngIf="loading" class="loading-gif uk-margin-medium-top"></div>
<ul *ngIf="annotations && !loading" class="uk-list uk-list-divider">
<li *ngFor="let annotation of annotations.slice(0, visibleAnnotations)" uk-grid
<li *ngFor="let annotation of annotations.slice(0, visibleAnnotations); let i=index" uk-grid
class="uk-flex uk-flex-top uk-margin-remove-left">
<div [ngClass]="annotation.type" class="uk-width-auto">{{annotation.type}}</div>
<div [class.uk-width-1-3]="annotation.urls" [class.uk-width-1-6@s]="annotation.urls">{{annotation.text}}</div>
<ul class="uk-width-expand uk-list uk-margin-remove-top" *ngIf="annotation.urls">
<li *ngFor="let url of annotation.urls.slice(0, annotation.urlSize)"><a [href]="url"
target="_blank">{{url}}</a></li>
<li *ngIf="annotation.urlSize < annotation.urls.length"><a
(click)="annotation.urlSize = annotation.urls.length">+ {{annotation.urls.length - annotation.urlSize}}
<div [ngClass]="annotation.type" class="type">{{annotation.type}}</div>
<div [class.uk-width-1-3]="annotation.targets"
[class.uk-width-1-6@s]="annotation.targets">{{annotation.text}}</div>
<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>
</li>
<li *ngIf="annotation.targetSize < annotation.targets.length"><a
(click)="open(i)">+ {{annotation.targets.length - annotation.targetSize}}
more</a></li>
</ul>
</li>
@ -72,11 +70,9 @@ import {Subscriber} from "rxjs";
</div>
<div [class.uk-hidden]="!visible">
<div class="widget-container" cdkDrag>
<!--Close button, should be bound to hide the widget-->
<button type="button" class="close" aria-label="Close" (click)="toggleAnnotation($event)">
<span aria-hidden="true">×</span>
</button>
<!--The glorious iframe with the running app!-->
<iframe #iframe id="b2note_iframe" name="b2note_iframe" class="b2note-iframe">
</iframe>
</div>
@ -156,26 +152,80 @@ export class AnnotationComponent implements OnInit, OnDestroy {
}
private getAnnotations() {
if(!this.annotations || this.annotations.length === 0) {
if (!this.annotations || this.annotations.length === 0) {
this.loading = true;
}
this.subscriptions.push(this.annotationService.getAllAnnotations(this.properties, this.pid).subscribe(annotations => {
this.annotations = annotations;
this.annotations.forEach(annotation => {
annotation.urlSize = 3;
this.subscriptions.push(this.annotationService.getAllAnnotations(this.pid).subscribe(annotations => {
this.annotations.forEach((annotation, index) => {
if (!annotations.find(element => element.type === annotation.type && element.text === annotation.text)) {
this.annotations.splice(index, 1);
}
});
annotations.forEach(annotation => {
if (!this.annotations.find(element => element.type === annotation.type && element.text === annotation.text)) {
annotation.targetSize = 3;
this.annotationService.getAnnotationsTargets(annotation.text, annotation.type).subscribe(targets => {
annotation.targets = targets.filter(target => target.id !== this.pid);
/*for(let i = 0; i < 10; i++) {
annotation.targets.push(targets[0]);
}*/
});
this.annotations.push(annotation);
}
});
this.annotations = this.sort(this.annotations);
this.loading = false;
}, error => {
this.loading = false;
}));
}
ngOnDestroy(): void {
public sort(annotations: Annotation[]): Annotation[] {
return annotations.sort((a, b) => {
if (a.type === b.type) {
return 1;
} else if (a.type === 'semantic') {
return -1;
} else if (b.type === 'semantic') {
return 1;
} else if (a.type === 'keyword') {
return -1;
} else if (b.type === 'keyword') {
return 1;
}
});
}
public searchPid(pid: string): { [k: string]: any;} {
return {
f0: 'pid',
fv0: pid,
qf: false
}
}
ngOnDestroy()
:
void {
this.clearSubscriptions();
}
public toggleAnnotation(event) {
public
toggleAnnotation(event) {
if (this.visible) {
event.preventDefault();
}
this.visible = !this.visible;
}
open(i: number) {
this.annotations.forEach((annotation, index) => {
if(index != i) {
annotation.targetSize = 3;
} else {
annotation.targetSize = annotation.targets.length
}
});
}
}

2
landingPages/annotation/annotation.css
View File

@ -2,7 +2,7 @@
position: fixed;
left: 50%;
top: 50%;
z-index: 5;
z-index: 1000;
padding: 19px;
margin-left: -167px;
margin-top: -311px;

3
landingPages/annotation/annotation.module.ts
View File

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

77
landingPages/annotation/annotation.service.ts
View File

@ -3,12 +3,18 @@ import {HttpClient} from "@angular/common/http";
import {Observable} from "rxjs";
import {EnvProperties} from "../../utils/properties/env-properties";
import {map} from "rxjs/operators";
import {properties} from "../../../../environments/environment";
export interface AnnotationTarget {
id: string;
url: string;
}
export interface Annotation {
text: string;
type: 'semantic' | 'keyword' | 'comment';
urls?: string[];
urlSize?: number;
targets?: AnnotationTarget[];
targetSize?: number;
}
@Injectable({
@ -21,20 +27,28 @@ export class AnnotationService {
constructor(private http: HttpClient) {
}
getAllAnnotations(properties: EnvProperties, source: string): Observable<Annotation[]> {
let url = properties.b2noteAPIURL + this.api + 'annotations?type[]=semantic&type[]=keyword&type[]=comment&format=json-ld&download=false&target-source=' + encodeURIComponent(source);
getAllAnnotations(source: string): Observable<Annotation[]> {
let url = properties.b2noteAPIURL + this.api + 'annotations?target-id=' + encodeURIComponent(source);
return this.http.get<Annotation[]>(url).pipe(map((response: any[]) => {
return this.parseAnnotations(response);
}));
}
getAnnotationsTargets(value: string, type: 'semantic' | 'keyword' | 'comment'): Observable<AnnotationTarget[]> {
let url = properties.b2noteAPIURL + this.api + 'annotations?value=' + encodeURIComponent(value);
return this.http.get<AnnotationTarget[]>(url).pipe(map((response: any[]) => {
return this.parseAnnotationTargets(response, type);
}));
}
private parseAnnotations(response: any[]): Annotation[] {
let annotations: Annotation[] = [];
if(response && response.length > 0) {
if (response && response.length > 0) {
response.forEach(value => {
if (value.visibility === 'public') {
let body = value.body;
if(body.type === 'TextualBody') {
if(body.purpose === 'tagging') {
if (body.type === 'TextualBody') {
if (body.purpose === 'tagging') {
annotations.push({
text: body.value,
type: "keyword"
@ -47,35 +61,50 @@ export class AnnotationService {
}
} else {
let items = body.items;
let urls: string[] = [];
let text: string = null;
items.forEach(item => {
if(item.type === 'SpecificResource') {
urls.push(item.source);
} else if(item.type === 'TextualBody') {
if (item.type === 'TextualBody') {
text = item.value;
}
});
annotations.push({
text: text,
type: "semantic",
urls: urls
type: "semantic"
});
}
}
});
}
return annotations;
}
private parseAnnotationTargets(response: any[], type: 'semantic' | 'keyword' | 'comment'): AnnotationTarget[] {
let targets: AnnotationTarget[] = [];
if (response && response.length > 0) {
response.forEach(value => {
if (value.visibility === 'public') {
let body = value.body;
if (body.type === 'TextualBody') {
if (body.purpose === 'tagging' && type === 'keyword') {
targets.push({
id: value.target.id,
url: value.target.source
});
} else if(type === 'comment'){
targets.push({
id: value.target.id,
url: value.target.source
});
}
} else if(type === 'semantic'){
targets.push({
id: value.target.id,
url: value.target.source
});
}
return annotations.sort((a, b) => {
if(a.type === b.type) {
return 0;
} else if (a.type === 'semantic') {
return -1;
} else if(b.type === 'semantic') {
return 1;
} else if(a.type === 'keyword') {
return -1;
} else if(b.type === 'keyword') {
return 1;
}
});
}
return targets;
}
}

2
landingPages/dataProvider/dataProvider.component.html
View File

@ -75,7 +75,7 @@
<!-- Metrics -->
<li *ngIf="hasMetrics" class="uk-margin-medium-top">
<div class="uk-text-center uk-flex uk-flex-middle uk-flex-center">
<div>
<div [class.uk-hidden]="!(totalViews && totalDownloads && pageViews)">
<metrics [pageViews]="pageViews"
[id]="datasourceId" [entityType]="'datasources'" [entity]="'Content Provider'"
[viewsFrameUrl]="viewsFrameUrl" [downloadsFrameUrl]="downloadsFrameUrl"

2
landingPages/project/project.component.html
View File

@ -386,7 +386,7 @@
<!-- Metrics -->
<li *ngIf="hasMetrics" class="uk-margin-medium-top">
<div class="uk-text-center uk-flex uk-flex-middle uk-flex-center">
<div>
<div [class.uk-hidden]="!(totalViews && totalDownloads && pageViews)">
<metrics [pageViews]="pageViews"
[id]="projectId" [entityType]="'projects'" [entity]="'project'"
[viewsFrameUrl]="viewsFrameUrl" [downloadsFrameUrl]="downloadsFrameUrl"

6
landingPages/project/project.component.ts
View File

@ -44,9 +44,9 @@ export class ProjectComponent {
public metricsClicked: boolean;
public viewsFrameUrl: string;
public downloadsFrameUrl: string;
private totalViews: number;
private totalDownloads: number;
private pageViews: number;
public totalViews: number;
public totalDownloads: number;
public pageViews: number;
// Statistics tab variables
public statsClicked: boolean;

2
landingPages/result/resultLanding.component.html
View File

@ -104,7 +104,7 @@
<li *ngIf="hasAltMetrics || hasMetrics" class="uk-margin-medium-top">
<div uk-grid
class="uk-child-width-1-3 uk-text-center uk-flex uk-flex-middle uk-flex-center uk-padding-remove-left">
<div *ngIf="hasMetrics">
<div *ngIf="hasMetrics" [class.uk-hidden]="!(totalViews && totalDownloads && pageViews)">
<metrics [pageViews]="pageViews"
[id]="id" [entityType]="'results'" [entity]="title"
[viewsFrameUrl]="viewsFrameUrl" [downloadsFrameUrl]="downloadsFrameUrl"