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

[Trunk | Library]: Add 'landing-utils/relatedTo.component.ts' and use this in 'resultLanding.component.html' to show 'Related to' section in the APP BOX. 

git-svn-id: https://svn.driver.research-infrastructures.eu/driver/dnet40/modules/uoa-services-library/trunk/ng-openaire-library/src/app@57240 d315682c-612b-4755-9ff5-7f18f6832af3
This commit is contained in:
konstantina.galouni 2019-10-02 14:20:34 +00:00
parent 6105b39302
commit 8ae241c208
3 changed files with 54 additions and 18 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

48
landingPages/landing-utils/relatedTo.component.ts Normal file
View File

@ -0,0 +1,48 @@
import {Component, Input} from '@angular/core';
import {HelperFunctions} from "../../utils/HelperFunctions.class";
@Component({
selector: 'relatedTo',
template: `
<dl relatedTo [class]="'uk-description-list-line' + ((contexts && contexts.length > threshold) ? ' uk-margin-remove-bottom' : '')">
<dt class="sideInfoTitle">Related to</dt>
<dd class="line" *ngFor="let item of contexts.slice(0, showNum) let i=index">
<span *ngIf="!item['inline']">
<span>{{item['labelContext']}}</span>
<span *ngIf="item['labelCategory']"><span uk-icon="icon: arrow-right"></span>{{item['labelCategory']}}</span>
<span *ngIf="item['labelConcept']">: {{item['labelConcept']}}</span>
</span>
<mark *ngIf="item['inline']">
<span>{{item['labelContext']}}</span>
<span *ngIf="item['labelCategory']"><span uk-icon="icon: arrow-right"></span>{{item['labelCategory']}}</span>
<span *ngIf="item['labelConcept']">: {{item['labelConcept']}}</span>
</mark>
</dd>
</dl>
<div *ngIf="showNum > threshold" class="uk-text-right uk-margin-bottom">
<a (click)="showNum = threshold; scroll()">
View less
</a>
</div>
<div *ngIf="showNum == threshold && contexts && contexts.length > threshold" class="uk-text-right uk-margin-bottom">
<a (click)="showNum = contexts.length;">
View more
</a>
</div>
`
})
export class RelatedToComponent {
@Input() contexts: { "labelContext": string, "labelCategory": string, "labelConcept": string, "inline": boolean}[];
public threshold: number = 5;
public showNum: number = 5;
constructor () {}
ngOnInit() {}
public scroll() {
HelperFunctions.scroll();
}
}

7
landingPages/landing-utils/resultLandingUtils.module.ts
View File

@ -14,6 +14,7 @@ import {AvailableOnComponent} from './availableOn.component';
import {TabTableComponent} from './tabTable.component';
import {ShowPublisherComponent} from "./showPublisher.component";
import {ShowPublisherModule} from "./showPublisher.module";
import {RelatedToComponent} from "./relatedTo.component";
@NgModule({
@ -22,13 +23,15 @@ import {ShowPublisherModule} from "./showPublisher.module";
],
declarations: [
ShowIdentifiersComponent,ShowSubjectsComponent,
FundedByComponent,PublishedInComponent,AvailableOnComponent,TabTableComponent
FundedByComponent,PublishedInComponent,AvailableOnComponent,TabTableComponent,
RelatedToComponent
],
providers:[
],
exports: [
ShowIdentifiersComponent, ShowSubjectsComponent,
FundedByComponent, PublishedInComponent, AvailableOnComponent, TabTableComponent, ShowPublisherComponent
FundedByComponent, PublishedInComponent, AvailableOnComponent, TabTableComponent, ShowPublisherComponent,
RelatedToComponent
]
})
export class ResultLandingUtilsModule { }

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

@ -444,22 +444,7 @@
</li>
<li *ngIf="resultLandingInfo.contexts && resultLandingInfo.contexts.length >0 ">
<dl class="uk-description-list-line">
<dt class="sideInfoTitle">Related to</dt>
<dd class="line" *ngFor="let item of resultLandingInfo.contexts">
<span *ngIf="!item['inline']">
<span>{{item['labelContext']}}</span>
<span *ngIf="item['labelCategory']">-> {{item['labelCategory']}}</span>
<span *ngIf="item['labelConcept']">: {{item['labelConcept']}}</span>
</span>
<mark *ngIf="item['inline']">
<span>{{item['labelContext']}}</span>
<span *ngIf="item['labelCategory']">-> {{item['labelCategory']}}</span>
<span *ngIf="item['labelConcept']">: {{item['labelConcept']}}</span>
</mark>
</dd>
</dl>
<relatedTo [contexts]="resultLandingInfo.contexts"></relatedTo>
</li>
<!-- <li>-->
<!-- <metrics [pageViews]="pageViews" shortView=true-->