MaDgIK
/
explore-services
13
0
Fork 0
Code Issues Pull Requests Projects Releases 22 Wiki Activity

Merge remote-tracking branch 'origin/develop' into angular-16

This commit is contained in:
Konstantinos Triantafyllou 2023-10-10 17:17:02 +03:00
parent f948757eb2 f851fbefed
commit 642509a1f5
10 changed files with 358 additions and 206 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

3
explore/src/app/deposit/deposit.module.ts
View File

@ -12,7 +12,6 @@ import {DepositFirstPageModule} from "../openaireLibrary/deposit/depositFirstPag
import {ZenodoCommunitiesService} from "../openaireLibrary/connect/zenodoCommunities/zenodo-communities.service"; import {ZenodoCommunitiesService} from "../openaireLibrary/connect/zenodoCommunities/zenodo-communities.service";
import {CommunityService} from "../openaireLibrary/connect/community/community.service"; import {CommunityService} from "../openaireLibrary/connect/community/community.service";
import {SearchZenodoCommunitiesService} from "../openaireLibrary/connect/zenodoCommunities/searchZenodoCommunities.service";
@NgModule({ @NgModule({
imports: [ imports: [
@ -26,6 +25,6 @@ import {SearchZenodoCommunitiesService} from "../openaireLibrary/connect/zenodoC
OpenaireDepositComponent, OpenaireDepositComponent,
], ],
providers: [PreviousRouteRecorder, IsRouteEnabled, providers: [PreviousRouteRecorder, IsRouteEnabled,
ZenodoCommunitiesService, CommunityService, SearchZenodoCommunitiesService] ZenodoCommunitiesService, CommunityService]
}) })
export class LibDepositModule { } export class LibDepositModule { }

4
explore/src/app/deposit/searchDataprovidersToDeposit.module.ts
View File

@ -9,8 +9,6 @@ import {SearchDataprovidersToDepositModule} from '../openaireLibrary/deposit/sea
import {PreviousRouteRecorder} from '../openaireLibrary/utils/piwik/previousRouteRecorder.guard'; import {PreviousRouteRecorder} from '../openaireLibrary/utils/piwik/previousRouteRecorder.guard';
import {IsRouteEnabled} from '../openaireLibrary/error/isRouteEnabled.guard'; import {IsRouteEnabled} from '../openaireLibrary/error/isRouteEnabled.guard';
import {ZenodoCommunitiesServiceModule} from '../openaireLibrary/connect/zenodoCommunities/zenodo-communitiesService.module'; import {ZenodoCommunitiesServiceModule} from '../openaireLibrary/connect/zenodoCommunities/zenodo-communitiesService.module';
import {SearchZenodoCommunitiesServiceModule} from '../openaireLibrary/connect/zenodoCommunities/searchZenodoCommunitiesService.module';
import {CommunityService} from '../openaireLibrary/connect/community/community.service'; import {CommunityService} from '../openaireLibrary/connect/community/community.service';
@NgModule({ @NgModule({
@ -18,7 +16,7 @@ import {CommunityService} from '../openaireLibrary/connect/community/community.s
CommonModule, FormsModule, CommonModule, FormsModule,
SearchDataprovidersToDepositModule, SearchDataprovidersToDepositModule,
SearchDataprovidersToDepositRoutingModule, SearchDataprovidersToDepositRoutingModule,
ZenodoCommunitiesServiceModule, SearchZenodoCommunitiesServiceModule ZenodoCommunitiesServiceModule
], ],
declarations: [ declarations: [
OpenaireSearchDataprovidersToDepositComponent OpenaireSearchDataprovidersToDepositComponent

203
explore/src/app/funders/funders.component.html
View File

@ -1,13 +1,14 @@
<schema2jsonld *ngIf="url" [URL]="url" [name]="pageTitle" type="other" [description]="pageDescription"></schema2jsonld> <schema2jsonld *ngIf="url" [URL]="url" [name]="pageTitle" type="other" [description]="pageDescription"></schema2jsonld>
<div class="funders"> <div class="funders">
<div class="uk-background-muted">
<div class="uk-container uk-container-large uk-section uk-section-small uk-padding-remove-bottom"> <div class="uk-container uk-container-large uk-section uk-section-small uk-padding-remove-bottom">
<div class="uk-padding-small uk-padding-remove-horizontal"> <div class="uk-padding-small uk-padding-remove-horizontal">
<breadcrumbs [breadcrumbs]="breadcrumbs"></breadcrumbs> <breadcrumbs [breadcrumbs]="breadcrumbs"></breadcrumbs>
</div> </div>
</div> </div>
<div class="uk-container uk-container-large uk-section" uk-scrollspy="target: [uk-scrollspy-class]; cls: uk-animation-slide-bottom-medium; delay: 200"> <div class="uk-container uk-container-large uk-section" uk-scrollspy="target: [uk-scrollspy-class]; cls: uk-animation-slide-bottom-medium; delay: 200">
<div class="uk-grid uk-grid-large uk-grid-stack uk-padding-small" uk-grid> <div class="uk-grid uk-grid-large uk-grid-stack uk-flex-middle uk-padding-small" uk-grid>
<div class="uk-width-1-2@m uk-width-1-1@s uk-flex uk-flex-column uk-flex-center"> <div class="uk-width-1-2@m uk-width-1-1 uk-flex uk-flex-column uk-flex-center">
<span class="uk-align-left uk-margin-remove-bottom uk-flex uk-flex-middle"> <span class="uk-align-left uk-margin-remove-bottom uk-flex uk-flex-middle">
<span class="custom-coins-dot"></span> <span class="custom-coins-dot"></span>
<span uk-scrollspy-class class="uk-text-large funders-title">Funders</span> <span uk-scrollspy-class class="uk-text-large funders-title">Funders</span>
@ -16,26 +17,57 @@
<h1 uk-scrollspy-class class="uk-h1 uk-margin-remove-top"> <h1 uk-scrollspy-class class="uk-h1 uk-margin-remove-top">
<span>Be an integral part of the open R&I ecosystem<span class="custom-handshake-dot"></span></span> <span>Be an integral part of the open R&I ecosystem<span class="custom-handshake-dot"></span></span>
</h1> </h1>
<div *ngIf="showContentWithNumbers" uk-scrollspy-class> <div uk-scrollspy-class>
Welcome to the Funders' page on OpenAIRE Explore. This dedicated hub spotlights our ever-growing extensive network of funding partners: Welcome to the Funders’ page on OpenAIRE Explore. Discover key details about each funder, their commitment to open access, and the impactful research they enable. Our aim? To foster transparency, inspire collaboration.
<!-- Welcome to the Funders' page on OpenAIRE Explore. This dedicated hub spotlights our ever-growing extensive network of funding partners:
{{formatNumber(projectsNumber)}} grants from {{formatNumber(projectsNumber)}} grants from
{{formatNumber(fundersNumber)}} funders currently linked to {{formatNumber(fundersNumber)}} funders currently linked to
{{formatNumber(researchProductsNumber)}} funded research outputs. {{formatNumber(researchProductsNumber)}} funded research outputs.
Discover key details about each funder, their commitment to open access, and the impactful research they enable. Discover key details about each funder, their commitment to open access, and the impactful research they enable.
Our aim? To foster transparency, inspire collaboration. Our aim? To foster transparency, inspire collaboration. -->
</div> </div>
<div class="uk-margin-medium-top" uk-scrollspy-class> <div class="uk-margin-medium-top" uk-scrollspy-class>
<a class="uk-button uk-button-primary uk-text-uppercase" target="_blank" href="https://www.openaire.eu/funders-how-to-join-guide"> <a class="uk-button uk-button-primary uk-text-uppercase" target="_blank" href="https://www.openaire.eu/funders-how-to-join-guide">
Join Us Join Us
</a> </a>
</div> </div>
<div *ngIf="showContentWithNumbers" class="uk-margin-medium-top" uk-scrollspy-class>
<div class="uk-grid uk-grid-divider" uk-grid>
<div class="uk-flex uk-flex-column uk-flex-center">
<span class="uk-h4 uk-text-primary uk-margin-xsmall-bottom">
{{formatNumber(projectsNumber)}}+
</span>
<span class="uk-text-uppercase">
grants
</span>
</div>
<div class="uk-flex uk-flex-column uk-flex-center">
<span class="uk-h4 uk-text-primary uk-margin-xsmall-bottom">
{{formatNumber(fundersNumber)}}
</span>
<span class="uk-text-uppercase">
funders
</span>
</div>
<div class="uk-flex uk-flex-column uk-flex-center">
<span class="uk-h4 uk-text-primary uk-margin-xsmall-bottom">
{{formatNumber(researchProductsNumber)}}+
</span>
<span class="uk-text-uppercase">
funded research outputs
</span>
</div> </div>
</div> </div>
<div class="uk-width-1-2@m uk-width-1-1@s uk-text-center" uk-scrollspy-class> </div>
</div>
</div>
<div class="uk-width-1-2@m uk-width-1-1 uk-text-center" uk-scrollspy-class>
<img src="assets/explore-assets/funders/funders.png" loading="lazy"> <img src="assets/explore-assets/funders/funders.png" loading="lazy">
</div> </div>
</div> </div>
</div> </div>
</div>
<ng-container *ngIf="showLoading"> <ng-container *ngIf="showLoading">
<div class="uk-container uk-container-large uk-section"> <div class="uk-container uk-container-large uk-section">
<loading></loading> <loading></loading>
@ -43,51 +75,57 @@
</ng-container> </ng-container>
<ng-container *ngIf="!showLoading && funders?.length"> <ng-container *ngIf="!showLoading && funders?.length">
<div class="uk-container uk-container-large" uk-height-match="target: .percentage;"> <div class="uk-container uk-container-large" uk-height-match="target: .percentage;">
<div id="target" class="uk-section" uk-height-match="target: .alias;"> <div id="target" class="uk-section uk-padding-remove-top uk-margin-top" uk-height-match="target: .alias;">
<!-- sorting desktop view --> <div>
<div class="uk-visible@m"> <div *ngIf="funders" class="uk-padding-small uk-padding-remove-vertical uk-margin-medium-bottom uk-flex uk-flex-wrap uk-flex-middle uk-flex-between">
<div *ngIf="groupedFunders" class="uk-padding-small uk-padding-remove-vertical uk-margin-medium-bottom uk-flex uk-flex-middle uk-flex-between"> <div class="uk-flex uk-flex-wrap uk-flex-middle uk-flex-between uk-width-auto@m uk-width-1-1 uk-margin-top">
<ul class="uk-nav uk-nav-default uk-flex uk-flex-wrap"> <div class="uk-width-small uk-margin-medium-right">
<li *ngFor="let item of groupedFunders; let i = index;" class="uk-margin-right" [class.uk-margin-left]="i != 0"
[class]="index == i ? 'uk-active':''" (click)="changeDisplayedFunders(i)">
<a class="uk-padding-remove">{{item.group}}</a>
</li>
</ul>
<div class="uk-width-medium">
<div input <div input
type="select" placeholder="Show" inputClass="flat x-small" type="select" placeholder="Show" inputClass="border-bottom"
[options]="options" [(value)]="sortBy" [disabled]="isDisabled" [options]="showOptions" [(value)]="show" (valueChange)="filtering()">
(valueChange)="sortByChanged()"></div>
</div> </div>
</div> </div>
</div> <div class="uk-width-small uk-margin-medium-right">
<!-- sorting mobile view -->
<div class="uk-hidden@m">
<div *ngIf="groupedFunders" class="uk-padding-small uk-padding-remove-vertical uk-margin-bottom uk-flex uk-flex-column uk-flex-middle">
<div class="uk-width-medium">
<div input <div input
type="select" placeholder="Show" inputClass="flat x-small" type="select" placeholder="Sort by" inputClass="border-bottom"
[options]="options" [(value)]="sortBy" [disabled]="isDisabled" [options]="sortOptions" [(value)]="sortBy" (valueChange)="sortByChanged()">
(valueChange)="sortByChanged()"></div>
</div> </div>
<div class="uk-padding uk-padding-remove-horizontal" >
<div class="uk-margin-left uk-margin-small-bottom uk-text-meta uk-text-small">
Sort Alphabetically
</div> </div>
<ul class="uk-nav uk-nav-default uk-grid uk-grid-small uk-child-width-1-6" uk-grid> <div class="uk-width-xsmall">
<li *ngFor="let item of groupedFunders; let i = index;" <div input
[class]="index == i ? 'uk-active':''" (click)="changeDisplayedFunders(i)"> type="select" placeholder="Results per page" inputClass="border-bottom"
<a class="uk-padding-remove">{{item.group}}</a> [options]="pageOptions" [(value)]="pageSize" (valueChange)="sizeChanged($event)">
</li>
</ul>
</div> </div>
</div> </div>
</div> </div>
<div class="uk-flex uk-flex-middle uk-width-auto@m uk-width-1-1 uk-margin-top">
<div search-input [searchControl]="keywordControl" searchInputClass="border-bottom" iconPosition="right"
placeholder="Search funder" [disabled]="showLoading" class="uk-width-auto@m uk-width-medium@s uk-width-1-1">
</div>
<div class="uk-visible@m uk-flex uk-flex-middle uk-margin-medium-left">
<a (click)="gridView = true"
class="uk-link-reset custom-view-button" [ngClass]="gridView ? 'active' : ''">
<icon [name]="'apps'" [ratio]="1.5" [type]="'round'" [flex]="true"></icon>
</a>
<a (click)="gridView = false"
class="uk-link-reset custom-view-button uk-margin-xsmall-left" [ngClass]="gridView ? '' : 'active'">
<icon [name]="'view_list'" [ratio]="1.5" [type]="'round'" [flex]="true"></icon>
</a>
</div>
</div>
</div>
</div>
<div class="uk-margin-large-bottom" uk-height-match="target: .name;"> <div class="uk-margin-large-bottom" uk-height-match="target: .name;">
<div class="uk-grid uk-child-width-1-2@m uk-child-width-1-3@l uk-padding-small" <div *ngIf="!displayedFunders || displayedFunders?.length == 0" class="uk-text-center uk-margin-large-top">
No funders available
</div>
<div class="uk-grid uk-padding-small" [ngClass]="gridView ? 'uk-child-width-1-2@m uk-child-width-1-3@l' : 'uk-child-width-1-1'"
uk-grid uk-height-match="target: .info;"> uk-grid uk-height-match="target: .info;">
<div *ngFor="let funder of groupedFunders[index].data.slice((currentPage-1)*pageSize, currentPage*pageSize)"> <div *ngFor="let funder of displayedFunders.slice((currentPage-1)*pageSize, currentPage*pageSize)">
<div class="uk-card uk-card-default uk-card-hover uk-card-body funder"> <!-- funder's card for GRID view -->
<ng-container *ngIf="gridView || isMobile; else elseBlock">
<div class="uk-card uk-card-default uk-card-hover uk-card-body funder-grid">
<!-- OA % --> <!-- OA % -->
<div class="percentage uk-flex uk-flex-right uk-margin-bottom"> <div class="percentage uk-flex uk-flex-right uk-margin-bottom">
<div *ngIf="funder.openAccessResearchProducts && funder.researchProducts" class="uk-text-center"> <div *ngIf="funder.openAccessResearchProducts && funder.researchProducts" class="uk-text-center">
@ -95,9 +133,9 @@
<span class="uk-margin-xsmall-right open-access"> <span class="uk-margin-xsmall-right open-access">
<icon name="open_access" [flex]="true" [ratio]="1"></icon> <icon name="open_access" [flex]="true" [ratio]="1"></icon>
</span> </span>
<h6 class="uk-margin-remove">{{(funder.openAccessResearchProducts / funder.researchProducts) * 100 | number : '1.0-0'}}%</h6> <h6 class="uk-margin-remove">{{funder.openAccessPercentage}}%</h6>
</div> </div>
<span>Open Access</span> <span class="uk-h6 uk-text-small">Open Access</span>
</div> </div>
</div> </div>
<!-- funder logo --> <!-- funder logo -->
@ -163,13 +201,90 @@
</div> </div>
</div> </div>
</div> </div>
</ng-container>
<!-- funder's card for LIST view -->
<ng-template #elseBlock>
<div class="uk-card uk-card-default uk-card-hover uk-padding-small funder-list">
<div class="uk-grid uk-grid-divider uk-grid-small" uk-grid>
<div class="uk-width-expand uk-flex uk-flex-middle">
<div class="uk-width-1-6 uk-flex uk-flex-middle uk-flex-center">
<img *ngIf="funder.logoUrl; else elseBlock" [src]="funder | logoUrl" [alt]="funder.name + ' logo'" class="uk-height-max-xsmall uk-blend-multiply">
<ng-template #elseBlock>
<img src="assets/common-assets/placeholder.png" alt="OpenAIRE placeholder logo" class="uk-height-max-xsmall uk-blend-multiply">
</ng-template>
</div>
<div class="uk-width-expand uk-margin-medium-left">
<div class="name uk-h6 uk-text-truncate">
<ng-container *ngIf="funder.name">
{{funder.name}}
</ng-container>
<ng-container *ngIf="funder.alias" >
<span class="uk-text-uppercase">
({{funder.alias}})
</span>
</ng-container>
</div>
<div class="uk-grid uk-grid-divider uk-flex-nowrap" uk-grid>
<div *ngIf="funder.monitorDashboard">
<a *ngIf="funder.monitorDashboard && funder.monitorDashboardStatus != 'PRIVATE' && funder.monitorDashboardStatus != 'RESTRICTED'"
class="uk-display-inline-block uk-text-uppercase uk-button uk-button-text"
target="_blank" [href]="'https://'+(properties.environment =='beta' || properties.environment =='development'?'beta.':'')+'monitor.openaire.eu/dashboard/'+funder.alias">
<span class="uk-flex uk-flex-middle">
<img src="assets/common-assets/common/Symbol.png" alt="OpenAIRE logo"
class="uk-margin-xsmall-right" style="width: 17px; height: 17px;">
<span class="monitor-dashboard-link uk-text-uppercase">Monitor Dashboard</span>
</span>
</a>
<span *ngIf="funder.monitorDashboard && funder.monitorDashboardStatus == 'RESTRICTED'"
class="uk-flex uk-flex-middle">
<img src="assets/common-assets/common/Symbol.png" alt="OpenAIRE logo"
class="uk-margin-xsmall-right" style="width: 17px; height: 17px;">
<span class="monitor-dashboard-link uk-text-uppercase uk-text-bold uk-text-small">Monitor Dashboard</span>
<icon class="uk-margin-xsmall-left" name="closed_access" [flex]="true" [ratio]="1"></icon>
</span>
</div>
<div>
<a *ngIf="funder.projects"
class="uk-display-inline-block uk-text-uppercase uk-button uk-button-text"
[routerLink]="properties.searchLinkToProjects" [queryParams]="{'funder': urlEncodeAndQuote(funder.id)}">
<span class="uk-flex uk-flex-middle">
<span>Projects ({{funder.projects | number}})</span>
</span>
</a>
</div>
<div>
<a *ngIf="funder.researchProducts"
class="uk-display-inline-block uk-text-uppercase uk-button uk-button-text"
[routerLink]="properties.searchLinkToResults" [queryParams]="{'relfunder': urlEncodeAndQuote(funder.id)}">
<span class="uk-flex uk-flex-middle">
<span>Research Products ({{funder.researchProducts | number}})</span>
</span>
</a>
</div> </div>
</div> </div>
</div> </div>
<paging-no-load *ngIf="groupedFunders[index].data.length > pageSize" </div>
<div class="uk-width-auto uk-flex uk-flex-middle uk-flex-center">
<div *ngIf="funder.openAccessResearchProducts && funder.researchProducts" class="uk-text-center">
<div class="uk-flex uk-flex-middle uk-flex-center">
<span class="uk-margin-xsmall-right open-access">
<icon name="open_access" [flex]="true" [ratio]="1"></icon>
</span>
<h6 class="uk-margin-remove">{{funder.openAccessPercentage}}%</h6>
</div>
<span class="uk-h6 uk-text-small">Open Access</span>
</div>
</div>
</div>
</div>
</ng-template>
</div>
</div>
</div>
<paging-no-load *ngIf="displayedFunders.length > pageSize"
(pageChange)="updateCurrentPage($event)" (pageChange)="updateCurrentPage($event)"
[currentPage]="currentPage" [size]="pageSize" [currentPage]="currentPage" [size]="pageSize"
[totalResults]="groupedFunders[index].data.length"> [totalResults]="displayedFunders.length">
</paging-no-load> </paging-no-load>
</div> </div>
</div> </div>

24
explore/src/app/funders/funders.component.less
View File

@ -21,16 +21,28 @@
margin-left: 10px; margin-left: 10px;
} }
.setType(@color) { .custom-view-button {
border-bottom: 4px solid fade(@color, 30%); padding: 4px;
background: @light-color;
border: 1px solid @disable-color;
border-radius: 4px;
icon {
color: @disable-color;
}
& .type { &.active {
color: @color; background: transparent linear-gradient(315deg, @primary-light-color 0%, @primary-dark-color 100%) 0% 0% no-repeat padding-box;
icon {
color: @light-color;
}
} }
} }
.uk-card { .uk-card {
&.funder { &.funder-grid {
.setType(@funder-color); border-bottom: 4px solid fade(@funder-color, 30%);
}
&.funder-list {
border-left: 4px solid fade(@funder-color, 30%);
} }
} }

131
explore/src/app/funders/funders.component.ts
View File

@ -1,4 +1,4 @@
import {Component, OnInit} from '@angular/core'; import {ChangeDetectorRef, Component, OnInit} from '@angular/core';
import {Router} from '@angular/router'; import {Router} from '@angular/router';
import {Subscriber, Subscription, zip} from "rxjs"; import {Subscriber, Subscription, zip} from "rxjs";
import {Meta, Title} from "@angular/platform-browser"; import {Meta, Title} from "@angular/platform-browser";
@ -14,6 +14,9 @@ import {Option} from '../openaireLibrary/sharedComponents/input/input.component'
import {StringUtils} from '../openaireLibrary/utils/string-utils.class'; import {StringUtils} from '../openaireLibrary/utils/string-utils.class';
import {HelperFunctions} from '../openaireLibrary/utils/HelperFunctions.class'; import {HelperFunctions} from '../openaireLibrary/utils/HelperFunctions.class';
import {NumberUtils} from '../openaireLibrary/utils/number-utils.class'; import {NumberUtils} from '../openaireLibrary/utils/number-utils.class';
import {LayoutService} from '../openaireLibrary/dashboard/sharedComponents/sidebar/layout.service';
import {FormBuilder, FormControl} from '@angular/forms';
import {debounceTime, distinctUntilChanged} from 'rxjs/operators';
@Component({ @Component({
selector: 'funders', selector: 'funders',
@ -29,13 +32,19 @@ export class FundersComponent implements OnInit {
properties: EnvProperties = properties; properties: EnvProperties = properties;
breadcrumbs: Breadcrumb[] = [{name: 'home', route: '/'}, {name: 'funders'}]; breadcrumbs: Breadcrumb[] = [{name: 'home', route: '/'}, {name: 'funders'}];
showLoading: boolean = true; showLoading: boolean = true;
index: number = 0; isMobile: boolean = false;
funders: any[] = []; funders: any[] = [];
groupedFunders: any[] = []; displayedFunders: any[] = [];
options: Option[]; showOptions: Option[];
sortBy: string = 'all'; sortOptions: Option[];
pageOptions: number[] = [10, 20, 30, 40];
show: string = 'all';
sortBy: string = 'alphAsc';
gridView: boolean = true;
currentPage: number = 1; currentPage: number = 1;
pageSize: number = 6; pageSize: number = 10;
keywordControl: FormControl;
keyword: string;
fundersNumber: number = 0; fundersNumber: number = 0;
researchProductsNumber: number = 0; researchProductsNumber: number = 0;
projectsNumber: number = 0; projectsNumber: number = 0;
@ -45,6 +54,7 @@ export class FundersComponent implements OnInit {
"alias": string, "alias": string,
"researchProducts": number, "researchProducts": number,
"openAccessResearchProducts": number, "openAccessResearchProducts": number,
"openAccessPercentage": number,
"projects": number, "projects": number,
"monitorDashboard": string, "monitorDashboard": string,
"monitorDashboardStatus": string, "monitorDashboardStatus": string,
@ -57,7 +67,10 @@ export class FundersComponent implements OnInit {
private seoService: SEOService, private seoService: SEOService,
private piwikService: PiwikService, private piwikService: PiwikService,
private refineFieldResultsService: RefineFieldResultsService, private refineFieldResultsService: RefineFieldResultsService,
private stakeholderService: StakeholderService) { private stakeholderService: StakeholderService,
private layoutService: LayoutService,
private cdr: ChangeDetectorRef,
private fb: FormBuilder,) {
} }
ngOnInit() { ngOnInit() {
@ -69,11 +82,25 @@ export class FundersComponent implements OnInit {
this.updateUrl(this.url); this.updateUrl(this.url);
this.updateTitle(this.pageTitle); this.updateTitle(this.pageTitle);
this.updateDescription(this.pageDescription); this.updateDescription(this.pageDescription);
this.options = [ this.subscriptions.push(this.layoutService.isMobile.subscribe(isMobile => {
this.isMobile = isMobile;
this.cdr.detectChanges();
}));
this.showOptions = [
{value: 'all', label: 'All funders'}, {value: 'all', label: 'All funders'},
{value: 'dashboard', label: 'Funders with dashboard'} {value: 'dashboard', label: 'Funders with dashboard'}
]; ];
this.sortOptions = [
{value: 'alphAsc', label: 'Alphabetically Asc. (A-Z)'},
{value: 'alphDsc', label: 'Alphabetically Dsc. (Z-A)'},
{value: 'oaDsc', label: '"Open Access %" Dsc.'}
];
this.getFunders(); this.getFunders();
this.keywordControl = this.fb.control('');
this.subscriptions.push(this.keywordControl.valueChanges.pipe(debounceTime(500), distinctUntilChanged()).subscribe(value => {
this.keyword = value;
this.filtering();
}));
} }
ngOnDestroy() { ngOnDestroy() {
@ -118,6 +145,7 @@ export class FundersComponent implements OnInit {
"alias": '', "alias": '',
"researchProducts": +queriedFunder.number, "researchProducts": +queriedFunder.number,
"openAccessResearchProducts": 0, "openAccessResearchProducts": 0,
"openAccessPercentage": 0,
"projects": 0, "projects": 0,
"monitorDashboard": '', "monitorDashboard": '',
"monitorDashboardStatus": '', "monitorDashboardStatus": '',
@ -145,6 +173,7 @@ export class FundersComponent implements OnInit {
"alias": '', "alias": '',
"researchProducts": 0, "researchProducts": 0,
"openAccessResearchProducts": 0, "openAccessResearchProducts": 0,
"openAccessPercentage": 0,
"projects": +queriedFunder.number, "projects": +queriedFunder.number,
"monitorDashboard": '', "monitorDashboard": '',
"monitorDashboardStatus": '', "monitorDashboardStatus": '',
@ -162,54 +191,26 @@ export class FundersComponent implements OnInit {
this.fundersMap.get(id).monitorDashboard = queriedFunder.alias; this.fundersMap.get(id).monitorDashboard = queriedFunder.alias;
this.fundersMap.get(id).monitorDashboardStatus = queriedFunder.visibility; this.fundersMap.get(id).monitorDashboardStatus = queriedFunder.visibility;
this.fundersMap.get(id).logoUrl = (queriedFunder.isUpload ? properties.utilsService + "/download/" : "")+ (queriedFunder.logoUrl); this.fundersMap.get(id).logoUrl = (queriedFunder.isUpload ? properties.utilsService + "/download/" : "")+ (queriedFunder.logoUrl);
// } else { }
// this.fundersMap.set(id, { });
// "id": queriedFunder.id, this.fundersMap.forEach((value) => {
// "name": queriedFunder.name, if(value.openAccessResearchProducts > 0) {
// "alias": queriedFunder.alias, value.openAccessPercentage = Math.round((value.openAccessResearchProducts / value.researchProducts) * 100);
// "researchProducts": 0,
// "openAccessResearchProducts": 0,
// "projects": 0,
// "monitorDashboard": queriedFunder.alias,
// "monitorDashboardStatus": queriedFunder.visibility,
// "logoUrl": (queriedFunder.isUpload ? properties.utilsService + "/download/" : "")+ (queriedFunder.logoUrl)
// });
} }
}); });
// convert funders map into an array // convert funders map into an array
this.funders = Array.from(this.fundersMap.values()); this.funders = Array.from(this.fundersMap.values());
// group funders based on their initial letter
this.groupFunders(this.funders);
// calculate total numbers for intro content // calculate total numbers for intro content
this.calculateNumbers(); this.calculateNumbers();
// sort funders
this.funders.sort((a, b) => a['name'].localeCompare(b['name']));
// initialize displayedFunders
this.displayedFunders = this.funders;
this.showLoading = false; this.showLoading = false;
}) })
); );
} }
private groupFunders(funders) {
if(funders.length === 0) {
return [];
}
funders.sort((a, b) => a['name'].localeCompare(b['name']));
this.index = 0;
this.groupedFunders = Object.values(
funders.reduce((acc, funder) => {
let firstLetter = funder['name'][0].toLocaleUpperCase();
if(!acc[firstLetter]) {
acc[firstLetter] = {group: firstLetter, data: [funder]};
} else {
acc[firstLetter].data.push(funder);
}
return acc;
},{})
)
if(funders.length > 1) {
this.groupedFunders.unshift({group: 'All', data: funders});
}
}
private calculateSum(array, property) { private calculateSum(array, property) {
let sum = 0; let sum = 0;
array.forEach(element => { array.forEach(element => {
@ -233,22 +234,44 @@ export class FundersComponent implements OnInit {
return formatted.number + formatted.size; return formatted.number + formatted.size;
} }
changeDisplayedFunders(i) {
this.currentPage = 1;
this.index = i;
}
urlEncodeAndQuote(str: string): string { urlEncodeAndQuote(str: string): string {
return StringUtils.quote(StringUtils.URIEncode(str)); return StringUtils.quote(StringUtils.URIEncode(str));
} }
sortByChanged() { sortByChanged() {
let displayedFunders = this.funders; switch(this.sortBy) {
if(this.sortBy == 'dashboard') { case 'alphAsc':
displayedFunders = this.funders.filter(funder => funder.monitorDashboard && funder.monitorDashboard?.length > 0 && funder.monitorDashboardStatus != 'PRIVATE'); this.funders = this.funders.sort((a, b) => a['name'].localeCompare(b['name']));
break;
case 'alphDsc':
this.funders = this.funders.sort((a, b) => b['name'].localeCompare(a['name']));
break;
case 'oaDsc':
this.funders = this.funders.sort((a, b) => b['openAccessPercentage'] - a['openAccessPercentage']);
break;
} }
this.filtering();
}
sizeChanged($event) {
this.pageSize = $event;
this.currentPage = 1;
}
filtering() {
let displayedFunders = this.funders;
if(!this.keyword){
this.keyword = '';
}
if(this.funders.length) {
displayedFunders = displayedFunders.filter(item => (item['name'] && item['name'].toLowerCase().includes(this.keyword.toLowerCase())) || (item['alias'] && item['alias'].toLowerCase().includes(this.keyword.toLowerCase())));
}
if(this.show == 'dashboard') {
displayedFunders = displayedFunders.filter(funder => funder.monitorDashboard && funder.monitorDashboard?.length > 0 && funder.monitorDashboardStatus != 'PRIVATE');
}
this.displayedFunders = displayedFunders;
this.currentPage = 1; this.currentPage = 1;
this.groupFunders(displayedFunders);
} }
public updateCurrentPage($event) { public updateCurrentPage($event) {

3
explore/src/app/funders/funders.module.ts
View File

@ -19,6 +19,7 @@ import {open_access} from '../openaireLibrary/utils/icons/icons';
import {closed_access} from '../openaireLibrary/utils/icons/icons'; import {closed_access} from '../openaireLibrary/utils/icons/icons';
import {InputModule} from '../openaireLibrary/sharedComponents/input/input.module'; import {InputModule} from '../openaireLibrary/sharedComponents/input/input.module';
import {PagingModule} from '../openaireLibrary/utils/paging.module'; import {PagingModule} from '../openaireLibrary/utils/paging.module';
import {SearchInputModule} from '../openaireLibrary/sharedComponents/search-input/search-input.module';
@NgModule({ @NgModule({
@ -26,7 +27,7 @@ import {PagingModule} from '../openaireLibrary/utils/paging.module';
FundersRoutingModule, CommonModule, RouterModule, AlertModalModule, FundersRoutingModule, CommonModule, RouterModule, AlertModalModule,
Schema2jsonldModule, SEOServiceModule, BreadcrumbsModule, LoadingModule, Schema2jsonldModule, SEOServiceModule, BreadcrumbsModule, LoadingModule,
RefineFieldResultsServiceModule, LogoUrlPipeModule, IconsModule, InputModule, RefineFieldResultsServiceModule, LogoUrlPipeModule, IconsModule, InputModule,
PagingModule PagingModule, SearchInputModule
], ],
declarations: [ declarations: [
FundersComponent FundersComponent

1
explore/src/environments/environment.beta.ts
View File

@ -33,6 +33,7 @@ export let properties: EnvProperties = {
cordisURL: "http://cordis.europa.eu/projects/", cordisURL: "http://cordis.europa.eu/projects/",
openDoarURL: "http://v2.sherpa.ac.uk/id/repository/", openDoarURL: "http://v2.sherpa.ac.uk/id/repository/",
r3DataURL: "http://service.re3data.org/repository/", r3DataURL: "http://service.re3data.org/repository/",
swhURL: "https://archive.softwareheritage.org/",
fairSharingURL: "https://fairsharing.org/", fairSharingURL: "https://fairsharing.org/",
eoscMarketplaceURL: "https://marketplace.eosc-portal.eu/services/", eoscMarketplaceURL: "https://marketplace.eosc-portal.eu/services/",
sherpaURL: "http://sherpa.ac.uk/romeo/issn/", sherpaURL: "http://sherpa.ac.uk/romeo/issn/",

1
explore/src/environments/environment.prod.ts
View File

@ -33,6 +33,7 @@ export let properties: EnvProperties = {
cordisURL: "http://cordis.europa.eu/projects/", cordisURL: "http://cordis.europa.eu/projects/",
openDoarURL: "http://v2.sherpa.ac.uk/id/repository/", openDoarURL: "http://v2.sherpa.ac.uk/id/repository/",
r3DataURL: "http://service.re3data.org/repository/", r3DataURL: "http://service.re3data.org/repository/",
swhURL: "https://archive.softwareheritage.org/",
fairSharingURL: "https://fairsharing.org/", fairSharingURL: "https://fairsharing.org/",
eoscMarketplaceURL: "https://marketplace.eosc-portal.eu/services/", eoscMarketplaceURL: "https://marketplace.eosc-portal.eu/services/",
sherpaURL: "http://sherpa.ac.uk/romeo/issn/", sherpaURL: "http://sherpa.ac.uk/romeo/issn/",

1
explore/src/environments/environment.test.ts
View File

@ -32,6 +32,7 @@ export let properties: EnvProperties = {
cordisURL: "http://cordis.europa.eu/projects/", cordisURL: "http://cordis.europa.eu/projects/",
openDoarURL: "http://v2.sherpa.ac.uk/id/repository/", openDoarURL: "http://v2.sherpa.ac.uk/id/repository/",
r3DataURL: "http://service.re3data.org/repository/", r3DataURL: "http://service.re3data.org/repository/",
swhURL: "https://archive.softwareheritage.org/",
fairSharingURL: "https://fairsharing.org/", fairSharingURL: "https://fairsharing.org/",
eoscMarketplaceURL: "https://marketplace.eosc-portal.eu/services/", eoscMarketplaceURL: "https://marketplace.eosc-portal.eu/services/",
sherpaURL: "http://sherpa.ac.uk/romeo/issn/", sherpaURL: "http://sherpa.ac.uk/romeo/issn/",

1
explore/src/environments/environment.ts
View File

@ -39,6 +39,7 @@ export let properties: EnvProperties = {
cordisURL: "http://cordis.europa.eu/projects/", cordisURL: "http://cordis.europa.eu/projects/",
openDoarURL: "http://v2.sherpa.ac.uk/id/repository/", openDoarURL: "http://v2.sherpa.ac.uk/id/repository/",
r3DataURL: "http://service.re3data.org/repository/", r3DataURL: "http://service.re3data.org/repository/",
swhURL: "https://archive.softwareheritage.org/",
fairSharingURL: "https://fairsharing.org/", fairSharingURL: "https://fairsharing.org/",
eoscMarketplaceURL: "https://marketplace.eosc-portal.eu/services/", eoscMarketplaceURL: "https://marketplace.eosc-portal.eu/services/",
sherpaURL: "http://sherpa.ac.uk/romeo/issn/", sherpaURL: "http://sherpa.ac.uk/romeo/issn/",