MaDgIK
/
monitor
13
0
Fork 0
Code Issues Pull Requests Projects Releases 15 Wiki Activity

Fix a bug with stakeholders slider in home page

This commit is contained in:
Konstantinos Triantafyllou 2022-02-21 17:31:15 +02:00
parent f46f7d5278
commit cbddeddb93
3 changed files with 23 additions and 12 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

13
src/app/home/home.component.html
View File

@ -197,17 +197,16 @@
<!-- Tabs --> <!-- Tabs -->
<my-tabs *ngIf="!loading"> <my-tabs *ngIf="!loading">
<my-tab [tabTitle]="'All'" [tabId]="'all'" class="uk-active"> <my-tab [tabTitle]="'All'" [tabId]="'all'" class="uk-active">
<ng-container *ngTemplateOutlet="sliderTemplate; context: {slides: slider(stakeholders)}"></ng-container> <ng-container *ngTemplateOutlet="sliderTemplate; context: {slides: stakeholdersSlider.stakeholders}"></ng-container>
</my-tab> </my-tab>
<my-tab [tabTitle]="'Funders'" [tabId]="'funders'"> <my-tab [tabTitle]="'Funders'" [tabId]="'funders'">
<ng-container *ngTemplateOutlet="sliderTemplate; context: {slides: slider(funders)}"></ng-container> <ng-container *ngTemplateOutlet="sliderTemplate; context: {slides: stakeholdersSlider.funders}"></ng-container>
</my-tab> </my-tab>
<my-tab [tabTitle]="'Research Initiatives'" [tabId]="'researchInitiatives'"> <my-tab [tabTitle]="'Research Initiatives'" [tabId]="'ris'">
<ng-container <ng-container *ngTemplateOutlet="sliderTemplate; context: {slides:stakeholdersSlider.ris}"></ng-container>
*ngTemplateOutlet="sliderTemplate; context: {slides: slider(researchInitiatives)}"></ng-container>
</my-tab> </my-tab>
<my-tab [tabTitle]="'Research Institutions'" [tabId]="'researchInstitutions'"> <my-tab [tabTitle]="'Research Institutions'" [tabId]="'organizations'">
<ng-container *ngTemplateOutlet="sliderTemplate; context: {slides: slider(organizations)}"></ng-container> <ng-container *ngTemplateOutlet="sliderTemplate; context: {slides: stakeholdersSlider.organizations}"></ng-container>
</my-tab> </my-tab>
</my-tabs> </my-tabs>
<!-- Slider Template for Tab Content --> <!-- Slider Template for Tab Content -->

18
src/app/home/home.component.ts
View File

@ -28,6 +28,12 @@ export class HomeComponent {
public pageTitle = "OpenAIRE | Monitor"; public pageTitle = "OpenAIRE | Monitor";
public description = "OpenAIRE - Monitor, A new era of monitoring research. Open data. Open methodologies. Work together with us to view, understand and visualize research statistics and indicators."; public description = "OpenAIRE - Monitor, A new era of monitoring research. Open data. Open methodologies. Work together with us to view, understand and visualize research statistics and indicators.";
public stakeholders: StakeholderInfo[] = []; public stakeholders: StakeholderInfo[] = [];
public stakeholdersSlider: {
stakeholders: StakeholderInfo[][];
funders: StakeholderInfo[][];
ris: StakeholderInfo[][];
organizations: StakeholderInfo[][];
};
public selected: Stakeholder = null; public selected: Stakeholder = null;
public pageContents = null; public pageContents = null;
public divContents = null; public divContents = null;
@ -180,6 +186,12 @@ export class HomeComponent {
this.stakeholders = StakeholderInfo.toStakeholderInfo(stakeholders, this.user); this.stakeholders = StakeholderInfo.toStakeholderInfo(stakeholders, this.user);
this.sort(this.stakeholders); this.sort(this.stakeholders);
this.stakeholders = this.publicStakeholders.concat(this.privateStakeholders); this.stakeholders = this.publicStakeholders.concat(this.privateStakeholders);
this.stakeholdersSlider = {
stakeholders: this.slider(this.stakeholders),
funders: this.slider(this.funders),
ris: this.slider(this.ris),
organizations: this.slider(this.organizations)
};
} }
this.loading = false; this.loading = false;
}, },
@ -202,8 +214,8 @@ export class HomeComponent {
}) })
} }
public slider(stakeholders: StakeholderInfo[], size: number = 6): Stakeholder[][] { public slider(stakeholders: StakeholderInfo[], size: number = 6): StakeholderInfo[][] {
let slider: Stakeholder[][] = []; let slider: StakeholderInfo[][] = [];
for(let i = 0; i < (stakeholders.length/size); i++) { for(let i = 0; i < (stakeholders.length/size); i++) {
slider.push(stakeholders.slice(i*size, ((i+1)*size))); slider.push(stakeholders.slice(i*size, ((i+1)*size)));
} }
@ -226,7 +238,7 @@ export class HomeComponent {
} }
} }
get researchInitiatives(): StakeholderInfo[] { get ris(): StakeholderInfo[] {
if(this.stakeholders) { if(this.stakeholders) {
return this.stakeholders.filter(stakeholder => stakeholder.type === "ri"); return this.stakeholders.filter(stakeholder => stakeholder.type === "ri");
} else { } else {

2
src/assets/monitor-custom.css
View File

@ -50,7 +50,7 @@
/*}*/ /*}*/
main { main {
min-height: calc(100vh - 100px); min-height: calc(100vh - 90px);
} }
.monitorApp .searchForm { .monitorApp .searchForm {