[Explore | Trunk]: Add numbers component to home page
git-svn-id: https://svn.driver.research-infrastructures.eu/driver/dnet40/modules/uoa-services-portal/trunk@60896 d315682c-612b-4755-9ff5-7f18f6832af3
This commit is contained in:
k.triantafyllou
parent
10604e894a
commit
f35a72360b
|
|
@ -86,35 +86,42 @@
|
|||
<li *ngFor="let range of createRange(logos[type].length) let j=index"
|
||||
class="uk-width-1-1 home-logo">
|
||||
<h1 class="uk-text-center uk-margin-bottom portal-color uk-h3">
|
||||
<span *ngIf="type=='publication' && showPublications && publicationsSize">
|
||||
<span class="uk-text-bold">{{publicationsSize.number|number}}{{publicationsSize.size}}
|
||||
<span *ngIf="type=='publication' && showPublications && numbers?.publicationsSize">
|
||||
<span
|
||||
class="uk-text-bold">{{numbers.publicationsSize.number|number}}{{numbers.publicationsSize.size}}
|
||||
publications</span><span> deduplicated</span>
|
||||
</span>
|
||||
<span *ngIf="type=='dataset' && showDatasets && (datasetsLinkedSize ||datasetsSize)">
|
||||
<span *ngIf="datasetsLinkedSize">
|
||||
<span
|
||||
*ngIf="type=='dataset' && showDatasets && (numbers?.datasetsLinkedSize || numbers?.datasetsSize)">
|
||||
<span *ngIf="numbers?.datasetsLinkedSize">
|
||||
<span
|
||||
class="uk-text-bold">{{datasetsLinkedSize.number|number}}{{datasetsLinkedSize.size}}
|
||||
class="uk-text-bold">{{numbers.datasetsLinkedSize.number|number}}{{numbers.datasetsLinkedSize.size}}
|
||||
datasets</span> interlinked with publications</span>
|
||||
<span *ngIf="datasetsSize && !datasetsLinkedSize"
|
||||
class="uk-text-bold">{{datasetsSize.number|number}}{{datasetsSize.size}}
|
||||
<span *ngIf="numbers?.datasetsSize && !numbers?.datasetsLinkedSize"
|
||||
class="uk-text-bold">{{numbers.datasetsSize.number|number}}{{numbers.datasetsSize.size}}
|
||||
research data</span>
|
||||
</span>
|
||||
<span *ngIf="type=='software' && showSoftware && (softwareSize ||softwareLinkedSize)">
|
||||
<span *ngIf="softwareLinkedSize">
|
||||
<span class="uk-text-bold
|
||||
">{{softwareLinkedSize.number|number}}{{softwareLinkedSize.size}} research
|
||||
software</span> interlinked with publications</span>
|
||||
<span *ngIf="softwareSize && !softwareLinkedSize"
|
||||
class="uk-text-bold">{{softwareSize.number|number}}{{softwareSize.size}}
|
||||
<span
|
||||
*ngIf="type=='software' && showSoftware && (numbers?.softwareSize || numbers?.softwareLinkedSize)">
|
||||
<span *ngIf="numbers?.softwareLinkedSize">
|
||||
<span
|
||||
class="uk-text-bol ">{{numbers.softwareLinkedSize.number|number}}{{numbers.softwareLinkedSize.size}}
|
||||
research
|
||||
software</span> interlinked with publications</span>
|
||||
<span *ngIf="numbers?.softwareSize && !numbers?.softwareLinkedSize"
|
||||
class="uk-text-bold">{{numbers.softwareSize.number|number}}{{numbers.softwareSize.size}}
|
||||
research software</span>
|
||||
</span>
|
||||
<span *ngIf="type=='persistent'">
|
||||
<span>Persistent identifiers and registries</span>
|
||||
</span>
|
||||
<span *ngIf="type=='funder' && showProjects && fundersSize">
|
||||
<span class="uk-text-bold">{{fundersSize.number|number}}{{fundersSize.size}}
|
||||
<span *ngIf="type=='funder' && showProjects && numbers?.fundersSize">
|
||||
<span
|
||||
class="uk-text-bold">{{numbers.fundersSize.number|number}}{{numbers.fundersSize.size}}
|
||||
funders</span><span> and</span>
|
||||
<span class="uk-text-bold"> {{projectsSize.number|number}}{{projectsSize.size}} funded grants</span>
|
||||
<span
|
||||
class="uk-text-bold"> {{numbers.projectsSize.number|number}}{{numbers.projectsSize.size}}
|
||||
funded grants</span>
|
||||
</span>
|
||||
|
||||
</h1>
|
||||
|
|
@ -168,26 +175,26 @@
|
|||
class="uk-section graph-background">
|
||||
<div class="uk-container">
|
||||
<div class="uk-flex uk-flex-top uk-child-width-1-1 uk-child-width-1-2@m" uk-grid>
|
||||
<div class="uk-flex-last@m">
|
||||
<div [class.lines-10]="!readMore" class="uk-margin-bottom multi-line-ellipsis">
|
||||
<helper [texts]="pageContents['right']"></helper>
|
||||
</div>
|
||||
<div *ngIf="!readMore" class="uk-text-center clickable" (click)="readMore = true">
|
||||
<span>Read more<span class="space" uk-icon="chevron-down"></span></span>
|
||||
</div>
|
||||
<div *ngIf="readMore" class="uk-text-center clickable" (click)="readMore = false">
|
||||
<span>Read less<span class="space" uk-icon="chevron-up"></span></span>
|
||||
</div>
|
||||
<div class="uk-flex-last@m">
|
||||
<div [class.lines-10]="!readMore" class="uk-margin-bottom multi-line-ellipsis">
|
||||
<helper [texts]="pageContents['right']"></helper>
|
||||
</div>
|
||||
<div class="uk-flex uk-flex-bottom">
|
||||
<div class="uk-width-1-3 uk-width-1-2@m">
|
||||
<img src="assets/explore-assets/graph.svg">
|
||||
</div>
|
||||
<div class="uk-padding uk-width-1-2">
|
||||
<img src="assets/common-assets/logo-large-graph.png">
|
||||
</div>
|
||||
<div *ngIf="!readMore" class="uk-text-center clickable" (click)="readMore = true">
|
||||
<span>Read more<span class="space" uk-icon="chevron-down"></span></span>
|
||||
</div>
|
||||
<div *ngIf="readMore" class="uk-text-center clickable" (click)="readMore = false">
|
||||
<span>Read less<span class="space" uk-icon="chevron-up"></span></span>
|
||||
</div>
|
||||
</div>
|
||||
<div class="uk-flex uk-flex-bottom">
|
||||
<div class="uk-width-1-3 uk-width-1-2@m">
|
||||
<img src="assets/explore-assets/graph.svg">
|
||||
</div>
|
||||
<div class="uk-padding uk-width-1-2">
|
||||
<img src="assets/common-assets/logo-large-graph.png">
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
<div *ngIf="pageContents && pageContents['right'] && pageContents['right'].length > 0"
|
||||
|
|
@ -195,6 +202,11 @@
|
|||
<helper *ngIf="pageContents && pageContents['bottom'] && pageContents['bottom'].length > 0"
|
||||
[texts]="pageContents['bottom']"></helper>
|
||||
<div class="uk-section uk-padding-remove-bottom">
|
||||
<h3 class="uk-text-center uk-margin-medium-bottom">Our growing <span class="uk-text-bold">Community</span></h3>
|
||||
<numbers #numbersComponent [defaultInit]="false" backgroundClass="numbers-background"
|
||||
(results)="numbers = $event"></numbers>
|
||||
</div>
|
||||
<!--<div class="uk-section uk-padding-remove-bottom">
|
||||
<div class="uk-container uk-text-center uk-margin-medium-bottom">
|
||||
<div class="uk-margin-medium uk-flex-center">
|
||||
<div class="uk-first-column">
|
||||
|
|
@ -285,7 +297,7 @@
|
|||
</div>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
</div>-->
|
||||
<helper *ngIf="pageContents && pageContents['left'] && pageContents['left'].length > 0"
|
||||
[texts]="pageContents['left']"></helper>
|
||||
<div class="uk-section-muted"
|
||||
|
|
|
|||
|
|
@ -1,4 +1,4 @@
|
|||
import {Component} from '@angular/core';
|
||||
import {Component, ViewChild} from '@angular/core';
|
||||
import {Subscription} from 'rxjs';
|
||||
import {ActivatedRoute, Router} from '@angular/router';
|
||||
import {Location} from '@angular/common';
|
||||
|
|
@ -21,6 +21,7 @@ import {SearchResearchResultsService} from "../openaireLibrary/services/searchRe
|
|||
import {HelperService} from "../openaireLibrary/utils/helper/helper.service";
|
||||
import {Filter} from "../openaireLibrary/searchPages/searchUtils/searchHelperClasses.class";
|
||||
import {properties} from "../../environments/environment";
|
||||
import {Numbers, NumbersComponent} from "../openaireLibrary/sharedComponents/numbers/numbers.component";
|
||||
|
||||
@Component({
|
||||
selector: 'home',
|
||||
|
|
@ -114,19 +115,7 @@ export class HomeComponent {
|
|||
public searchFields: SearchFields = new SearchFields();
|
||||
public errorCodes: ErrorCodes = new ErrorCodes();
|
||||
public routerHelper: RouterHelper = new RouterHelper();
|
||||
|
||||
public publicationsSize: any = null;
|
||||
public datasetsSize: any = null;
|
||||
public datasetsLinkedSize: any = null;
|
||||
public softwareLinkedSize: any = null;
|
||||
public softwareSize: any = null;
|
||||
public otherSize: any = null;
|
||||
public fundersSize: any = null;
|
||||
public projectsSize: any = null;
|
||||
public datasourcesSize: any = null;
|
||||
|
||||
private numResults: number = 2;
|
||||
|
||||
public numbers: Numbers;
|
||||
showPublications: boolean = false;
|
||||
showDatasets: boolean = false;
|
||||
showSoftware: boolean = false;
|
||||
|
|
@ -159,6 +148,7 @@ export class HomeComponent {
|
|||
filterOperator: "or"
|
||||
};
|
||||
public pageContents = null;
|
||||
@ViewChild("numbersComponent") numbersComponent: NumbersComponent;
|
||||
|
||||
constructor(
|
||||
private route: ActivatedRoute,
|
||||
|
|
@ -237,7 +227,7 @@ export class HomeComponent {
|
|||
if (this.showOrp) {
|
||||
this.resultTypes.values.push({name: "Other research products", id: "other", selected: true, number: 0});
|
||||
}
|
||||
this.getNumbers();
|
||||
this.numbersComponent.init(this.showDatasets, this.showSoftware, this.showPublications, this.showDatasets, this.showSoftware, this.showOrp, this.showProjects, this.showDataProviders);
|
||||
}
|
||||
},
|
||||
error => {
|
||||
|
|
@ -253,119 +243,6 @@ export class HomeComponent {
|
|||
}
|
||||
}
|
||||
|
||||
private getNumbers() {
|
||||
if (this.showPublications) {
|
||||
this.subs.push(this._searchResearchResultsService.numOfSearchResults("publication", "", this.properties).subscribe(
|
||||
data => {
|
||||
if (data && data != null && data > 0) {
|
||||
this.publicationsSize = NumberUtils.roundNumber(data);
|
||||
|
||||
}
|
||||
},
|
||||
err => {
|
||||
//console.log(err);
|
||||
this.handleError("Error getting number of publications", err);
|
||||
}
|
||||
));
|
||||
}
|
||||
if (this.showDatasets) {
|
||||
this.subs.push(this._searchResearchResultsService.numOfSearchResults("dataset", "", this.properties).subscribe(
|
||||
data => {
|
||||
if (data && data != null && data > 0) {
|
||||
this.datasetsSize = NumberUtils.roundNumber(data);
|
||||
}
|
||||
},
|
||||
err => {
|
||||
//console.log(err);
|
||||
this.handleError("Error getting number of research data", err);
|
||||
}
|
||||
));
|
||||
this.subs.push(this._searchResearchResultsService.numOfSearchResultsLinkedToPub("dataset", this.properties).subscribe(
|
||||
data => {
|
||||
if (data && data != null && data > 0) {
|
||||
this.datasetsLinkedSize = NumberUtils.roundNumber(data);
|
||||
}
|
||||
},
|
||||
err => {
|
||||
//console.log(err);
|
||||
this.handleError("Error getting number of linkedresearch data", err);
|
||||
}
|
||||
));
|
||||
|
||||
}
|
||||
if (this.showSoftware) {
|
||||
this.subs.push(this._searchResearchResultsService.numOfSearchResults("software", "", this.properties).subscribe(
|
||||
data => {
|
||||
if (data && data > 0) {
|
||||
this.softwareSize = NumberUtils.roundNumber(data);
|
||||
} else {
|
||||
this.showSoftware = false;
|
||||
}
|
||||
},
|
||||
err => {
|
||||
this.handleError("Error getting number of software data", err);
|
||||
}
|
||||
));
|
||||
this.subs.push(this._searchResearchResultsService.numOfSearchResultsLinkedToPub("software", this.properties).subscribe(
|
||||
data => {
|
||||
if (data && data != null && data > 0) {
|
||||
this.softwareLinkedSize = NumberUtils.roundNumber(data);
|
||||
}
|
||||
},
|
||||
err => {
|
||||
//console.log(err);
|
||||
this.handleError("Error getting number of linked software", err);
|
||||
}
|
||||
));
|
||||
}
|
||||
if (this.showOrp) {
|
||||
this.subs.push(this._searchResearchResultsService.numOfSearchResults("other", "", this.properties).subscribe(
|
||||
data => {
|
||||
if (data && data > 0) {
|
||||
this.otherSize = NumberUtils.roundNumber(data);
|
||||
} else {
|
||||
this.showOrp = false;
|
||||
}
|
||||
},
|
||||
err => {
|
||||
this.handleError("Error getting number of software data", err);
|
||||
}
|
||||
));
|
||||
}
|
||||
if (this.showProjects) {
|
||||
this.subs.push(this._refineFieldResultsService.getRefineFieldsResultsByEntityName(["funder"], "project", this.properties).subscribe(
|
||||
data => {
|
||||
|
||||
|
||||
if (data[0] && data[0] > 0) {
|
||||
this.projectsSize = NumberUtils.roundNumber(data[0]);
|
||||
}
|
||||
if (data[1].length > 0 && data[1][0].filterId == "funder" && data[1][0].values) {
|
||||
this.fundersSize = NumberUtils.roundNumber(data[1][0].values.length);
|
||||
}
|
||||
|
||||
},
|
||||
err => {
|
||||
//console.log(err);
|
||||
this.handleError("Error getting 'funder' field results of projects", err);
|
||||
}));
|
||||
}
|
||||
if (this.showDataProviders) {
|
||||
this.subs.push(this._searchDataprovidersService.numOfSearchDataproviders("", this.properties).subscribe(
|
||||
data => {
|
||||
if (data && data != null && data > 0) {
|
||||
this.datasourcesSize = NumberUtils.roundNumber(data);
|
||||
}
|
||||
|
||||
},
|
||||
err => {
|
||||
//console.log(err);
|
||||
this.handleError("Error getting number of content providers", err);
|
||||
}
|
||||
));
|
||||
}
|
||||
}
|
||||
|
||||
private handleError(message: string, error) {
|
||||
console.error("Home Page: " + message, error);
|
||||
}
|
||||
|
|
|
|||
|
|
@ -26,6 +26,7 @@ import {QuickSelectionsModule} from "../openaireLibrary/searchPages/searchUtils/
|
|||
import {IconsModule} from "../openaireLibrary/utils/icons/icons.module";
|
||||
import {IconsService} from "../openaireLibrary/utils/icons/icons.service";
|
||||
import {arrow_right, book, cog, database, earth} from "../openaireLibrary/utils/icons/icons";
|
||||
import {NumbersModule} from "../openaireLibrary/sharedComponents/numbers/numbers.module";
|
||||
|
||||
@NgModule({
|
||||
imports: [
|
||||
|
|
@ -38,7 +39,7 @@ import {arrow_right, book, cog, database, earth} from "../openaireLibrary/utils/
|
|||
HomeRoutingModule,
|
||||
HelperModule,
|
||||
ErrorMessagesModule,
|
||||
SEOServiceModule, OtherPortalsModule, EntitiesSelectionModule, QuickSelectionsModule, IconsModule
|
||||
SEOServiceModule, OtherPortalsModule, EntitiesSelectionModule, QuickSelectionsModule, IconsModule, NumbersModule
|
||||
],
|
||||
declarations: [
|
||||
HomeComponent
|
||||
|
|
|
|||
|
|
@ -126,7 +126,7 @@
|
|||
}
|
||||
|
||||
.numbers-background {
|
||||
background: transparent url('explore-assets/numbers_background_pattern.svg') 0 0 repeat-x padding-box;
|
||||
background: transparent url('explore-assets/numbers_background_pattern.svg') repeat-x center bottom;
|
||||
}
|
||||
|
||||
.number {
|
||||
|
|
|
|||
Loading…
Reference in New Issue