[Trunk|Library]: In Landing Pages: cut description up to 270 characters and add 'view more/less' functionality.
git-svn-id: https://svn.driver.research-infrastructures.eu/driver/dnet40/modules/uoa-services-library/trunk/ng-openaire-library/src/app@55059 d315682c-612b-4755-9ff5-7f18f6832af3
This commit is contained in:
parent
f28d8a3b44
commit
0e66e3ac90
|
@ -55,9 +55,19 @@
|
|||
</li>
|
||||
</ul>
|
||||
<hr *ngIf="datasetInfo.description" >
|
||||
|
||||
<div *ngIf="datasetInfo.description" class="uk-margin-bottom uk-text-justify descriptionText">
|
||||
{{datasetInfo.description}}
|
||||
<span>{{datasetInfo.description.substring(0, showNumDescription)}}</span
|
||||
><span *ngIf="showNumDescription > thresholdDescription">
|
||||
<a (click)="showNumDescription = thresholdDescription; scroll()">
|
||||
View less
|
||||
</a>
|
||||
</span
|
||||
><span *ngIf="showNumDescription == thresholdDescription && datasetInfo.description.length > thresholdDescription">...</span
|
||||
><span *ngIf="showNumDescription == thresholdDescription && datasetInfo.description.length > thresholdDescription" class="uk-text-right">
|
||||
<a (click)="showNumDescription = datasetInfo.description.length;">
|
||||
View more
|
||||
</a>
|
||||
</span>
|
||||
</div>
|
||||
|
||||
<!-- <div class="uk-clearfix"><div class="uk-float-right uk-margin-top">
|
||||
|
|
|
@ -29,6 +29,9 @@ export class DatasetComponent {
|
|||
public showAllDownloadFrom: boolean = false;
|
||||
public showAllPublishedIn: boolean = false;
|
||||
|
||||
public thresholdDescription: number = 270;
|
||||
public showNumDescription: number = 270;
|
||||
|
||||
// Metrics tab variables
|
||||
public metricsClicked: boolean;
|
||||
public viewsFrameUrl: string;
|
||||
|
@ -99,9 +102,7 @@ export class DatasetComponent {
|
|||
this.downloadsFrameUrl = this.properties.framesAPIURL+'merge.php?com=query&data=[{"query":"resRepoDownloads", "resTitle":"'+this.datasetId+'", "table":"","fields":[{"fld":"sum","agg":"sum","type":"column","yaxis":1,"c":false}],"xaxis":{"name":"month","agg":"sum"},"group":" ","color":"","type":"chart","size":30,"sort":"xaxis","xStyle":{"r":-30,"s":"0","l":"-","ft":"-","wt":"-"},"title":"","subtitle":"","xaxistitle":"Repository","yaxisheaders":["Monthly downloads"],"generalxaxis":"","theme":0,"in":[],"filters":[{"name":"","values":[""],"to":"-1"}]}]&info_types=["column"]&stacking=normal&steps=false&fontFamily=Courier&spacing=[5,0,0,0]&style=[{"color":"rgba(0, 0, 0, 1)","size":"18"},{"color":"rgba(0, 0, 0, 1)","size":"18"},{"color":"000000","size":""},{"color":"000000","size":""}]&backgroundColor=rgba(255,255,255,1)&colors[]=rgba(67, 67, 72, 1)&colors[]=rgba(144, 237, 125, 1)&colors[]=rgba(247, 163, 92, 1)&colors[]=rgba(128, 133, 233, 1)&colors[]=rgba(241, 92, 128, 1)&colors[]=rgba(228, 211, 84, 1)&colors[]=rgba(43, 144, 143, 1)&colors[]=rgba(244, 91, 91, 1)&colors[]=rgba(145, 232, 225, 1)&xlinew=0&ylinew=1&legends=true&tooltips=true&persistent=false';
|
||||
/*this.downloadsFrameUrl = this.properties.framesAPIURL+'merge.php?com=query&data=[{"query":"resRepoDownloadTimeline", "resTitle":"'+this.datasetId+'", "table":"","fields":[{"fld":"sum","agg":"sum","type":"column","yaxis":1,"c":false}],"xaxis":{"name":"month","agg":"sum"},"group":" ","color":"","type":"chart","size":30,"sort":"xaxis","xStyle":{"r":-30,"s":"0","l":"-","ft":"-","wt":"-"},"title":"","subtitle":"","xaxistitle":"Repository","yaxisheaders":["Monthly downloads"],"generalxaxis":"","theme":0,"in":[],"filters":[{"name":"","values":[""],"to":"-1"}]}]&info_types=["column"]&stacking=normal&steps=false&fontFamily=Courier&spacing=[5,0,0,0]&style=[{"color":"rgba(0, 0, 0, 1)","size":"18"},{"color":"rgba(0, 0, 0, 1)","size":"18"},{"color":"000000","size":""},{"color":"000000","size":""}]&backgroundColor=rgba(255,255,255,1)&colors[]=rgba(67, 67, 72, 1)&colors[]=rgba(144, 237, 125, 1)&colors[]=rgba(247, 163, 92, 1)&colors[]=rgba(128, 133, 233, 1)&colors[]=rgba(241, 92, 128, 1)&colors[]=rgba(228, 211, 84, 1)&colors[]=rgba(43, 144, 143, 1)&colors[]=rgba(244, 91, 91, 1)&colors[]=rgba(145, 232, 225, 1)&xlinew=0&ylinew=1&legends=true&tooltips=true';
|
||||
*/
|
||||
if (typeof document !== 'undefined') {
|
||||
this.element.nativeElement.scrollIntoView();
|
||||
}
|
||||
this.scroll();
|
||||
});
|
||||
|
||||
}
|
||||
|
@ -201,6 +202,12 @@ export class DatasetComponent {
|
|||
return Array.from(map.keys());
|
||||
}
|
||||
|
||||
public scroll() {
|
||||
if (typeof document !== 'undefined') {
|
||||
this.element.nativeElement.scrollIntoView();
|
||||
}
|
||||
}
|
||||
|
||||
private handleError(message: string, error) {
|
||||
console.error("Research Data Landing Page: "+message, error);
|
||||
}
|
||||
|
|
|
@ -42,7 +42,18 @@
|
|||
</ul>
|
||||
<hr *ngIf="orpInfo.description">
|
||||
<div *ngIf="orpInfo.description" class="uk-margin-bottom uk-text-justify descriptionText">
|
||||
{{orpInfo.description}}
|
||||
<span>{{orpInfo.description.substring(0, showNumDescription)}}</span
|
||||
><span *ngIf="showNumDescription > thresholdDescription">
|
||||
<a (click)="showNumDescription = thresholdDescription; scroll()">
|
||||
View less
|
||||
</a>
|
||||
</span
|
||||
><span *ngIf="showNumDescription == thresholdDescription && orpInfo.description.length > thresholdDescription">...</span
|
||||
><span *ngIf="showNumDescription == thresholdDescription && orpInfo.description.length > thresholdDescription" class="uk-text-right">
|
||||
<a (click)="showNumDescription = orpInfo.description.length;">
|
||||
View more
|
||||
</a>
|
||||
</span>
|
||||
</div>
|
||||
|
||||
<ul class="custom-accordion" uk-accordion>
|
||||
|
|
|
@ -29,6 +29,9 @@ export class OrpComponent {
|
|||
public showAllDownloadFrom: boolean = false;
|
||||
public showAllPublishedIn: boolean = false;
|
||||
|
||||
public thresholdDescription: number = 270;
|
||||
public showNumDescription: number = 270;
|
||||
|
||||
// Metrics tab variables
|
||||
public metricsClicked: boolean;
|
||||
public viewsFrameUrl: string;
|
||||
|
@ -95,9 +98,7 @@ export class OrpComponent {
|
|||
|
||||
this.downloadsFrameUrl = this.properties.framesAPIURL+'merge.php?com=query&data=[{"query":"resRepoDownloads", "resTitle":"'+this.orpId+'", "table":"","fields":[{"fld":"sum","agg":"sum","type":"column","yaxis":1,"c":false}],"xaxis":{"name":"month","agg":"sum"},"group":" ","color":"","type":"chart","size":30,"sort":"xaxis","xStyle":{"r":-30,"s":"0","l":"-","ft":"-","wt":"-"},"title":"","subtitle":"","xaxistitle":"Repository","yaxisheaders":["Monthly downloads"],"generalxaxis":"","theme":0,"in":[],"filters":[{"name":"","values":[""],"to":"-1"}]}]&info_types=["column"]&stacking=normal&steps=false&fontFamily=Courier&spacing=[5,0,0,0]&style=[{"color":"rgba(0, 0, 0, 1)","size":"18"},{"color":"rgba(0, 0, 0, 1)","size":"18"},{"color":"000000","size":""},{"color":"000000","size":""}]&backgroundColor=rgba(255,255,255,1)&colors[]=rgba(67, 67, 72, 1)&colors[]=rgba(144, 237, 125, 1)&colors[]=rgba(247, 163, 92, 1)&colors[]=rgba(128, 133, 233, 1)&colors[]=rgba(241, 92, 128, 1)&colors[]=rgba(228, 211, 84, 1)&colors[]=rgba(43, 144, 143, 1)&colors[]=rgba(244, 91, 91, 1)&colors[]=rgba(145, 232, 225, 1)&xlinew=0&ylinew=1&legends=true&tooltips=true&persistent=false';
|
||||
|
||||
if (typeof document !== 'undefined') {
|
||||
this.element.nativeElement.scrollIntoView();
|
||||
}
|
||||
this.scroll();
|
||||
});
|
||||
|
||||
}
|
||||
|
@ -187,6 +188,12 @@ export class OrpComponent {
|
|||
return Array.from(map.keys());
|
||||
}
|
||||
|
||||
public scroll() {
|
||||
if (typeof document !== 'undefined') {
|
||||
this.element.nativeElement.scrollIntoView();
|
||||
}
|
||||
}
|
||||
|
||||
private handleError(message: string, error) {
|
||||
console.error("Other Research Product Landing Page: "+message, error);
|
||||
}
|
||||
|
|
|
@ -88,7 +88,18 @@
|
|||
</ul>
|
||||
<hr *ngIf="publicationInfo.description">
|
||||
<div *ngIf="publicationInfo.description" class="uk-margin-bottom uk-text-justify descriptionText">
|
||||
{{publicationInfo.description}}
|
||||
<span>{{publicationInfo.description.substring(0, showNumDescription)}}</span
|
||||
><span *ngIf="showNumDescription > thresholdDescription">
|
||||
<a (click)="showNumDescription = thresholdDescription; scroll()">
|
||||
View less
|
||||
</a>
|
||||
</span
|
||||
><span *ngIf="showNumDescription == thresholdDescription && publicationInfo.description.length > thresholdDescription">...</span
|
||||
><span *ngIf="showNumDescription == thresholdDescription && publicationInfo.description.length > thresholdDescription" class="uk-text-right">
|
||||
<a (click)="showNumDescription = publicationInfo.description.length;">
|
||||
View more
|
||||
</a>
|
||||
</span>
|
||||
</div>
|
||||
|
||||
|
||||
|
|
|
@ -29,6 +29,9 @@ export class PublicationComponent {
|
|||
public showAllCollectedFrom: boolean = false;
|
||||
public showAllDownloadFrom: boolean = false;
|
||||
|
||||
public thresholdDescription: number = 270;
|
||||
public showNumDescription: number = 270;
|
||||
|
||||
// Metrics tab variables
|
||||
public metricsClicked: boolean;
|
||||
public viewsFrameUrl: string;
|
||||
|
@ -111,9 +114,7 @@ export class PublicationComponent {
|
|||
|
||||
this.downloadsFrameUrl =this.properties.framesAPIURL+'merge.php?com=query&data=[{"query":"resRepoDownloads", "resTitle":"'+this.articleId+'", "table":"","fields":[{"fld":"sum","agg":"sum","type":"column","yaxis":1,"c":false}],"xaxis":{"name":"month","agg":"sum"},"group":" ","color":"","type":"chart","size":30,"sort":"xaxis","xStyle":{"r":-30,"s":"0","l":"-","ft":"-","wt":"-"},"title":"","subtitle":"","xaxistitle":"Repository","yaxisheaders":["Monthly downloads"],"generalxaxis":"","theme":0,"in":[],"filters":[{"name":"","values":[""],"to":"-1"}]}]&info_types=["column"]&stacking=normal&steps=false&fontFamily=Courier&spacing=[5,0,0,0]&style=[{"color":"rgba(0, 0, 0, 1)","size":"18"},{"color":"rgba(0, 0, 0, 1)","size":"18"},{"color":"000000","size":""},{"color":"000000","size":""}]&backgroundColor=rgba(255,255,255,1)&colors[]=rgba(67, 67, 72, 1)&colors[]=rgba(144, 237, 125, 1)&colors[]=rgba(247, 163, 92, 1)&colors[]=rgba(128, 133, 233, 1)&colors[]=rgba(241, 92, 128, 1)&colors[]=rgba(228, 211, 84, 1)&colors[]=rgba(43, 144, 143, 1)&colors[]=rgba(244, 91, 91, 1)&colors[]=rgba(145, 232, 225, 1)&xlinew=0&ylinew=1&legends=true&tooltips=true&persistent=false';
|
||||
|
||||
if (typeof document !== 'undefined') {
|
||||
this.element.nativeElement.scrollIntoView();
|
||||
}
|
||||
this.scroll();
|
||||
});
|
||||
}
|
||||
|
||||
|
@ -290,6 +291,12 @@ export class PublicationComponent {
|
|||
public getKeys( map) {
|
||||
return Array.from(map.keys());
|
||||
}
|
||||
|
||||
public scroll() {
|
||||
if (typeof document !== 'undefined') {
|
||||
this.element.nativeElement.scrollIntoView();
|
||||
}
|
||||
}
|
||||
/*
|
||||
start(i: number, bioentitiesPage: number) {
|
||||
let sum = 0;
|
||||
|
|
|
@ -53,7 +53,18 @@
|
|||
</ul>
|
||||
<hr *ngIf="softwareInfo.description" >
|
||||
<div *ngIf="softwareInfo.description" class="uk-margin-bottom uk-text-justify descriptionText">
|
||||
{{softwareInfo.description}}
|
||||
<span>{{softwareInfo.description.substring(0, showNumDescription)}}</span
|
||||
><span *ngIf="showNumDescription > thresholdDescription">
|
||||
<a (click)="showNumDescription = thresholdDescription; scroll()">
|
||||
View less
|
||||
</a>
|
||||
</span
|
||||
><span *ngIf="showNumDescription == thresholdDescription && softwareInfo.description.length > thresholdDescription">...</span
|
||||
><span *ngIf="showNumDescription == thresholdDescription && softwareInfo.description.length > thresholdDescription" class="uk-text-right">
|
||||
<a (click)="showNumDescription = softwareInfo.description.length;">
|
||||
View more
|
||||
</a>
|
||||
</span>
|
||||
</div>
|
||||
|
||||
<!-- <div class="uk-clearfix"><div class="uk-button-group uk-float-right uk-margin-top">
|
||||
|
|
|
@ -28,6 +28,9 @@ export class SoftwareComponent {
|
|||
public showAllDownloadFrom: boolean = false;
|
||||
public showAllPublishedIn: boolean = false;
|
||||
|
||||
public thresholdDescription: number = 270;
|
||||
public showNumDescription: number = 270;
|
||||
|
||||
// Metrics tab variables
|
||||
public metricsClicked: boolean;
|
||||
public viewsFrameUrl: string;
|
||||
|
@ -94,9 +97,7 @@ export class SoftwareComponent {
|
|||
this.downloadsFrameUrl = this.properties.framesAPIURL+'merge.php?com=query&data=[{"query":"resRepoDownloads", "resTitle":"'+this.softwareId+'", "table":"","fields":[{"fld":"sum","agg":"sum","type":"column","yaxis":1,"c":false}],"xaxis":{"name":"month","agg":"sum"},"group":" ","color":"","type":"chart","size":30,"sort":"xaxis","xStyle":{"r":-30,"s":"0","l":"-","ft":"-","wt":"-"},"title":"","subtitle":"","xaxistitle":"Repository","yaxisheaders":["Monthly downloads"],"generalxaxis":"","theme":0,"in":[],"filters":[{"name":"","values":[""],"to":"-1"}]}]&info_types=["column"]&stacking=normal&steps=false&fontFamily=Courier&spacing=[5,0,0,0]&style=[{"color":"rgba(0, 0, 0, 1)","size":"18"},{"color":"rgba(0, 0, 0, 1)","size":"18"},{"color":"000000","size":""},{"color":"000000","size":""}]&backgroundColor=rgba(255,255,255,1)&colors[]=rgba(67, 67, 72, 1)&colors[]=rgba(144, 237, 125, 1)&colors[]=rgba(247, 163, 92, 1)&colors[]=rgba(128, 133, 233, 1)&colors[]=rgba(241, 92, 128, 1)&colors[]=rgba(228, 211, 84, 1)&colors[]=rgba(43, 144, 143, 1)&colors[]=rgba(244, 91, 91, 1)&colors[]=rgba(145, 232, 225, 1)&xlinew=0&ylinew=1&legends=true&tooltips=true&persistent=false';
|
||||
/*this.downloadsFrameUrl = this.properties.framesAPIURL+'merge.php?com=query&data=[{"query":"resRepoDownloadTimeline", "resTitle":"'+this.softwareId+'", "table":"","fields":[{"fld":"sum","agg":"sum","type":"column","yaxis":1,"c":false}],"xaxis":{"name":"month","agg":"sum"},"group":" ","color":"","type":"chart","size":30,"sort":"xaxis","xStyle":{"r":-30,"s":"0","l":"-","ft":"-","wt":"-"},"title":"","subtitle":"","xaxistitle":"Repository","yaxisheaders":["Monthly downloads"],"generalxaxis":"","theme":0,"in":[],"filters":[{"name":"","values":[""],"to":"-1"}]}]&info_types=["column"]&stacking=normal&steps=false&fontFamily=Courier&spacing=[5,0,0,0]&style=[{"color":"rgba(0, 0, 0, 1)","size":"18"},{"color":"rgba(0, 0, 0, 1)","size":"18"},{"color":"000000","size":""},{"color":"000000","size":""}]&backgroundColor=rgba(255,255,255,1)&colors[]=rgba(67, 67, 72, 1)&colors[]=rgba(144, 237, 125, 1)&colors[]=rgba(247, 163, 92, 1)&colors[]=rgba(128, 133, 233, 1)&colors[]=rgba(241, 92, 128, 1)&colors[]=rgba(228, 211, 84, 1)&colors[]=rgba(43, 144, 143, 1)&colors[]=rgba(244, 91, 91, 1)&colors[]=rgba(145, 232, 225, 1)&xlinew=0&ylinew=1&legends=true&tooltips=true';
|
||||
*/
|
||||
if (typeof document !== 'undefined') {
|
||||
this.element.nativeElement.scrollIntoView();
|
||||
}
|
||||
this.scroll();
|
||||
});
|
||||
|
||||
}
|
||||
|
@ -194,6 +195,12 @@ export class SoftwareComponent {
|
|||
return Array.from(map.keys());
|
||||
}
|
||||
|
||||
public scroll() {
|
||||
if (typeof document !== 'undefined') {
|
||||
this.element.nativeElement.scrollIntoView();
|
||||
}
|
||||
}
|
||||
|
||||
private handleError(message: string, error) {
|
||||
console.error("Software Landing Page: "+message, error);
|
||||
}
|
||||
|
|
Loading…
Reference in New Issue