[Trunk | Library]:

1. resultLandingInfo.ts & resultLanding.service.ts & parsingFunctions.class.ts & resultLanding.component: Relations 'isSupplementTo' and 'isSupplementedBy' parsed and added as accordion items.
2. resultLanding.component: After title, a link to scroll into accordion items added (this may be removed).
3. landind-utils/tabTable.component.ts: Special icon removed from each type of research results and type name added before each result.


git-svn-id: https://svn.driver.research-infrastructures.eu/driver/dnet40/modules/uoa-services-library/trunk/ng-openaire-library/src/app@57404 d315682c-612b-4755-9ff5-7f18f6832af3
This commit is contained in:
konstantina.galouni 2019-10-17 13:24:09 +00:00
parent 5e402fa81c
commit bb731fe686
6 changed files with 117 additions and 13 deletions

View File

@ -383,13 +383,37 @@ export class ParsingFunctions {
return relatedResearchResults;
}
// publication & dataset & software & orp landing : for similarResearchResults
parseSimilarResearchResults(similarResearchResults: { "name": string, "id": string, "date": string,
// publication & dataset & software & orp landing : for supplementaryResearchResults
parseSupplementaryResearchResults(supplementaryResearchResults: { "name": string, "id": string, "date": string,
"percentage": number, "class": string}[], relation: any) :
{ "name": string, "id": string, "date": string, "percentage": number, "class": string }[] {
if(supplementaryResearchResults == undefined) {
supplementaryResearchResults = new Array<{"name": string, "id": string, "date": string,
"percentage": number, "class": string}>();
}
supplementaryResearchResults.push(this.parseRelatedOrSimilarResearchResult(relation, "trust"));
return supplementaryResearchResults;
}
// publication & dataset & software & orp landing : for supplementedByResearchResults
parseSupplementedByResearchResults(supplementedByResearchResults: { "name": string, "id": string, "date": string,
"percentage": number, "class": string}[], relation: any) :
{ "name": string, "id": string, "date": string, "percentage": number, "class": string }[] {
if(supplementedByResearchResults == undefined) {
supplementedByResearchResults = new Array<{"name": string, "id": string, "date": string,
"percentage": number, "class": string}>();
}
supplementedByResearchResults.push(this.parseRelatedOrSimilarResearchResult(relation, "trust"));
return supplementedByResearchResults;
}
// publication & dataset & software & orp landing : for similarResearchResults
parseSimilarResearchResults(similarResearchResults: { "name": string, "id": string, "date": string,
"percentage": number, "class": string}[], relation: any) :
{ "name": string, "id": string, "date": string, "percentage": number, "class": string }[] {
if(similarResearchResults == undefined) {
similarResearchResults = new Array<{"name": string, "id": string, "date": string,
"percentage": number, "class": string}>();
"percentage": number, "class": string}>();
}
similarResearchResults.push(this.parseRelatedOrSimilarResearchResult(relation, "similarity"));
return similarResearchResults;

View File

@ -22,14 +22,17 @@ import{EnvProperties} from '../../utils/properties/env-properties';
<tr *ngFor="let item of info.slice((page-1)*pageSize, page*pageSize)" class="{{item['class']}}">
<td *ngIf="item != undefined">
<!--span *ngIf="item['class'] == 'dataset'" class="glyphicon glyphicon-star" aria-hidden="true"-->
<span *ngIf="item['class'] == 'publication'" class="uk-icon" title = "Publication"><svg height="20" ratio="1" viewBox="0 0 20 20" width="20" xmlns="http://www.w3.org/2000/svg"><rect fill="none" height="16" stroke="#000" width="12" x="3.5" y="2.5"></rect><polyline fill="none" points="5 0.5 17.5 0.5 17.5 17" stroke="#000"></polyline></svg></span>
<span class="uk-icon" *ngIf="item['class'] == 'dataset'" title = "Research data" ><svg height="20" ratio="1" viewBox="0 0 20 20" width="20" xmlns="http://www.w3.org/2000/svg"><ellipse cx="10" cy="4.64" fill="none" rx="7.5" ry="3.14" stroke="#000"></ellipse><path d="M17.5,8.11 C17.5,9.85 14.14,11.25 10,11.25 C5.86,11.25 2.5,9.84 2.5,8.11" fill="none" stroke="#000"></path><path d="M17.5,11.25 C17.5,12.99 14.14,14.39 10,14.39 C5.86,14.39 2.5,12.98 2.5,11.25" fill="none" stroke="#000"></path><path d="M17.49,4.64 L17.5,14.36 C17.5,16.1 14.14,17.5 10,17.5 C5.86,17.5 2.5,16.09 2.5,14.36 L2.5,4.64" fill="none" stroke="#000"></path></svg></span>
<span class="uk-icon" *ngIf="item['class'] == 'software'" title = "Software" >
<svg height="20" ratio="1" viewBox="0 0 20 20" width="20" xmlns="http://www.w3.org/2000/svg"> <circle cx="9.997" cy="10" fill="none" r="3.31" stroke="#000"></circle> <path d="M18.488,12.285 L16.205,16.237 C15.322,15.496 14.185,15.281 13.303,15.791 C12.428,16.289 12.047,17.373 12.246,18.5 L7.735,18.5 C7.938,17.374 7.553,16.299 6.684,15.791 C5.801,15.27 4.655,15.492 3.773,16.237 L1.5,12.285 C2.573,11.871 3.317,10.999 3.317,9.991 C3.305,8.98 2.573,8.121 1.5,7.716 L3.765,3.784 C4.645,4.516 5.794,4.738 6.687,4.232 C7.555,3.722 7.939,2.637 7.735,1.5 L12.263,1.5 C12.072,2.637 12.441,3.71 13.314,4.22 C14.206,4.73 15.343,4.516 16.225,3.794 L18.487,7.714 C17.404,8.117 16.661,8.988 16.67,10.009 C16.672,11.018 17.415,11.88 18.488,12.285 L18.488,12.285 Z" fill="none" stroke="#000"></path></svg>
</span>
<span class="uk-icon" *ngIf="item['class'] == 'other'" title = "Other" ><svg width="20" height="20" viewBox="0 0 20 20" xmlns="http://www.w3.org/2000/svg" ratio="1"> <rect fill="none" stroke="#000" x="3.5" y="1.5" width="13" height="17"></rect></svg></span>
<!-- <span *ngIf="item['class'] == 'publication'" class="uk-icon" title = "Publication"><svg height="20" ratio="1" viewBox="0 0 20 20" width="20" xmlns="http://www.w3.org/2000/svg"><rect fill="none" height="16" stroke="#000" width="12" x="3.5" y="2.5"></rect><polyline fill="none" points="5 0.5 17.5 0.5 17.5 17" stroke="#000"></polyline></svg></span>-->
<!-- <span class="uk-icon" *ngIf="item['class'] == 'dataset'" title = "Research data" ><svg height="20" ratio="1" viewBox="0 0 20 20" width="20" xmlns="http://www.w3.org/2000/svg"><ellipse cx="10" cy="4.64" fill="none" rx="7.5" ry="3.14" stroke="#000"></ellipse><path d="M17.5,8.11 C17.5,9.85 14.14,11.25 10,11.25 C5.86,11.25 2.5,9.84 2.5,8.11" fill="none" stroke="#000"></path><path d="M17.5,11.25 C17.5,12.99 14.14,14.39 10,14.39 C5.86,14.39 2.5,12.98 2.5,11.25" fill="none" stroke="#000"></path><path d="M17.49,4.64 L17.5,14.36 C17.5,16.1 14.14,17.5 10,17.5 C5.86,17.5 2.5,16.09 2.5,14.36 L2.5,4.64" fill="none" stroke="#000"></path></svg></span>-->
<!-- <span class="uk-icon" *ngIf="item['class'] == 'software'" title = "Software" >-->
<!-- <svg height="20" ratio="1" viewBox="0 0 20 20" width="20" xmlns="http://www.w3.org/2000/svg"> <circle cx="9.997" cy="10" fill="none" r="3.31" stroke="#000"></circle> <path d="M18.488,12.285 L16.205,16.237 C15.322,15.496 14.185,15.281 13.303,15.791 C12.428,16.289 12.047,17.373 12.246,18.5 L7.735,18.5 C7.938,17.374 7.553,16.299 6.684,15.791 C5.801,15.27 4.655,15.492 3.773,16.237 L1.5,12.285 C2.573,11.871 3.317,10.999 3.317,9.991 C3.305,8.98 2.573,8.121 1.5,7.716 L3.765,3.784 C4.645,4.516 5.794,4.738 6.687,4.232 C7.555,3.722 7.939,2.637 7.735,1.5 L12.263,1.5 C12.072,2.637 12.441,3.71 13.314,4.22 C14.206,4.73 15.343,4.516 16.225,3.794 L18.487,7.714 C17.404,8.117 16.661,8.988 16.67,10.009 C16.672,11.018 17.415,11.88 18.488,12.285 L18.488,12.285 Z" fill="none" stroke="#000"></path></svg>-->
<!-- </span>-->
<!-- <span class="uk-icon" *ngIf="item['class'] == 'other'" title = "Other" ><svg width="20" height="20" viewBox="0 0 20 20" xmlns="http://www.w3.org/2000/svg" ratio="1"> <rect fill="none" stroke="#000" x="3.5" y="1.5" width="13" height="17"></rect></svg></span>-->
<!--/span-->
<!--a *ngIf="item['url'] != '' && item['name'] != ''" href="{{item['url']}}"-->
<div class="uk-text-muted">
{{item['class']}}
</div>
<a *ngIf="item['id'] != '' && item['name'] != '' && item['class'] == 'dataset'"
[queryParams]="{datasetId: item.id}" routerLinkActive="router-link-active" routerLink="/search/dataset">
{{item['name']}}

View File

@ -17,6 +17,14 @@
<schema2jsonld *ngIf="resultLandingInfo.record" [data]=resultLandingInfo.record
[URL]="properties.baseLink+linkToLandingPage+id"></schema2jsonld>
<showTitle [titleName]="resultLandingInfo.title" [classNames]="(properties.environment != 'production' && resultLandingInfo.deletedByInferenceIds) ? 'uk-margin-remove-bottom' : ''"></showTitle>
<div *ngIf="testBrowser" class="uk-text-small">
<a class="" (click)="gotoAccordions();">
View relations of this
<span *ngIf="type == 'publication' || type == 'software'">{{type}}</span>
<span *ngIf="type == 'dataset'">research data</span>
<span *ngIf="type == 'orp'">product</span>
</a>
</div>
<div *ngIf="properties.environment != 'production' && resultLandingInfo.deletedByInferenceIds"
class="uk-text-muted uk-text-small uk-margin-bottom" (click)="openDeletedByInference()">
The following information is the result of merging
@ -94,7 +102,7 @@
</div>
<ul class="custom-accordion" uk-accordion>
<ul #accordions class="custom-accordion" uk-accordion>
<li *ngIf="resultLandingInfo.references" (click)="activeTab='References'">
<a class="uk-accordion-title" href="#">
@ -159,6 +167,35 @@
</div>
</li>
<li *ngIf="resultLandingInfo.supplementaryResearchResults" (click)="activeTab='Supplementary Research Results'">
<a class="uk-accordion-title" href="#">
Supplementary Research Results
({{resultLandingInfo.supplementaryResearchResults.length | number}})
</a>
<div class="uk-accordion-content">
<div>
<tabTable percentageName="trust" [info]="resultLandingInfo.supplementaryResearchResults"
[properties]=properties></tabTable>
</div>
</div>
</li>
<li *ngIf="resultLandingInfo.supplementedByResearchResults" (click)="activeTab='Research Results supplemented by this product'">
<a class="uk-accordion-title" href="#">
Research Results supplemented by this
<span *ngIf="type == 'publication' || type == 'software'">{{type}}</span>
<span *ngIf="type == 'dataset'">research data</span>
<span *ngIf="type == 'orp'">research product</span>
({{resultLandingInfo.supplementedByResearchResults.length | number}})
</a>
<div class="uk-accordion-content">
<div>
<tabTable percentageName="trust" [info]="resultLandingInfo.supplementedByResearchResults"
[properties]=properties></tabTable>
</div>
</div>
</li>
<li *ngIf="resultLandingInfo.organizations" (click)="activeTab='Related Organizations'">
<a class="uk-accordion-title" href="#">
Related Organizations
@ -434,7 +471,14 @@
id="{{resultLandingInfo.identifiers.get('doi')[0]}}" type="doi">
</altmetrics>
<ul class="uk-list uk-margin-remove-bottom">
<!-- <li *ngIf="testBrowser" class="uk-text-center">-->
<!-- <button class="uk-button portal-button" (click)="gotoAccordions();">-->
<!-- View relations of this-->
<!-- <span *ngIf="type == 'publication' || type == 'software'">{{type}}</span>-->
<!-- <span *ngIf="type == 'dataset'">research data</span>-->
<!-- <span *ngIf="type == 'orp'">product</span>-->
<!-- </button>-->
<!-- </li>-->
<li *ngIf="resultLandingInfo.hostedBy_collectedFrom && resultLandingInfo.hostedBy_collectedFrom.length > 0">
<availableOn [availableOn]="resultLandingInfo.hostedBy_collectedFrom"></availableOn>
</li>

View File

@ -1,4 +1,4 @@
import {Component, Input, ViewChild} from '@angular/core';
import {Component, ElementRef, Inject, Input, PLATFORM_ID, ViewChild} from '@angular/core';
import {ActivatedRoute, Router} from '@angular/router';
import {Meta, Title} from '@angular/platform-browser';
@ -11,6 +11,7 @@ import {ResultLandingService} from './resultLanding.service';
import {SEOService} from '../../sharedComponents/SEO/SEO.service';
import {HelperFunctions} from '../../utils/HelperFunctions.class';
import {HelperService} from '../../utils/helper/helper.service';
import {isPlatformBrowser} from "@angular/common";
@Component({
@ -82,6 +83,10 @@ export class ResultLandingComponent {
public pageContents = null;
public divContents = null;
@ViewChild('accordions')
accordions: ElementRef;
testBrowser: boolean = false;
constructor(private _resultLaningService: ResultLandingService,
private _piwikService: PiwikService,
private route: ActivatedRoute,
@ -90,7 +95,9 @@ export class ResultLandingComponent {
private _title: Title,
private _router: Router,
private helper: HelperService,
private seoService: SEOService) {
private seoService: SEOService,
@Inject(PLATFORM_ID) private platformId: string) {
this.testBrowser = isPlatformBrowser(platformId);
}
ngOnInit() {
@ -405,4 +412,20 @@ export class ResultLandingComponent {
//this.alertModalDeletedByInference.okButtonText = "OK";
this.alertModalDeletedByInference.open();
}
gotoAccordions() {
//this.accordions.nativeElement.scrollIntoView();
let offsetHeight = document.getElementById('stickyNavbar').offsetHeight;
// scroll to your element
this.accordions.nativeElement.scrollIntoView(true);
// now account for fixed header
var scrolledY = window.scrollY;
if(scrolledY){
window.scroll(0, scrolledY - offsetHeight - 50);
}
}
}

View File

@ -133,6 +133,10 @@ export class ResultLandingService {
this.resultLandingInfo.similarResearchResults = this.parsingFunctions.parseSimilarResearchResults(this.resultLandingInfo.similarResearchResults, relation);
} else if(relation['to'].class == "hasAuthorInstitution") {
this.resultLandingInfo.organizations = this.parseRelatedOrganizations(this.resultLandingInfo.organizations, relation);
} else if(relation['to'].class == "isSupplementedBy") {
this.resultLandingInfo.supplementaryResearchResults = this.parsingFunctions.parseSupplementaryResearchResults(this.resultLandingInfo.supplementaryResearchResults, relation);
} else if(relation['to'].class == "isSupplementTo") {
this.resultLandingInfo.supplementedByResearchResults = this.parsingFunctions.parseSupplementedByResearchResults(this.resultLandingInfo.supplementedByResearchResults, relation);
}
}
}
@ -282,6 +286,8 @@ export class ResultLandingService {
});
}
this.resultLandingInfo.similarResearchResults = this.parsingFunctions.sortByPercentage(this.resultLandingInfo.similarResearchResults);
this.resultLandingInfo.supplementaryResearchResults = this.parsingFunctions.sortByPercentage(this.resultLandingInfo.supplementaryResearchResults);
this.resultLandingInfo.supplementedByResearchResults = this.parsingFunctions.sortByPercentage(this.resultLandingInfo.supplementedByResearchResults);
return this.resultLandingInfo;
}

View File

@ -38,6 +38,10 @@ export class ResultLandingInfo {
relatedResearchResults: Map<string, { "name": string, "id": string, "date": string, "percentage": number, "class": string}[]>;
// percentage is for similarity
similarResearchResults: { "name": string, "id": string, "date": string, "percentage": number, "class": string}[];
//isSupplementedBy
supplementaryResearchResults;
//isSupplementTo
supplementedByResearchResults;
contexts: { "labelContext": string, "labelCategory": string, "labelConcept": string, "inline": boolean}[];