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

[Monitor | Trunk]: Add condition check for animation starting only in browser. 

git-svn-id: https://svn.driver.research-infrastructures.eu/driver/dnet40/modules/uoa-monitor-portal/trunk/monitor@58872 d315682c-612b-4755-9ff5-7f18f6832af3
This commit is contained in:
Konstantinos Triantafyllou 2020-06-10 09:12:17 +00:00
parent 8481958d00
commit 7f07534d02
2 changed files with 14 additions and 11 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

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

@ -21,7 +21,7 @@
<div class="uk-container uk-container-large uk-margin-large-top uk-text-justify">
<div class="uk-margin-left uk-margin-right uk-margin-large-bottom">
<div class="uk-child-width-1-3@m uk-grid uk-grid-large" uk-grid>
<div [@1]="state.toString()" class="clickable" (click)="startCaptainsAnimation()">
<div [@1]="state.toString()" class="clickable" (click)="startAnimation()">
<h5 class="uk-margin-remove-bottom uk-text-bold">
Get a complete picture
</h5>
@ -30,7 +30,7 @@
view of your publications-data-code.
</div>
</div>
<div [@2]="state.toString()" class="clickable" (click)="startCaptainsAnimation(2)">
<div [@2]="state.toString()" class="clickable" (click)="startAnimation(2)">
<h5 class="uk-margin-remove-bottom uk-text-bold">
Monitor open science compliance
</h5>
@ -39,7 +39,7 @@
for your organization and see how you fare in EOSC.
</div>
</div>
<div [@3]="state.toString()" class="clickable" (click)="startCaptainsAnimation(3)">
<div [@3]="state.toString()" class="clickable" (click)="startAnimation(3)">
<h5 class="uk-margin-remove-bottom uk-text-bold">
Turn research results to insights
</h5>

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

@ -16,7 +16,7 @@ import {animate, state, style, transition, trigger} from "@angular/animations";
import {StakeholderService} from "../openaireLibrary/monitor/services/stakeholder.service";
import {HelperFunctions} from "../openaireLibrary/utils/HelperFunctions.class";
import {LocalStorageService} from "../openaireLibrary/services/localStorage.service";
import {Stakeholder, StakeholderInfo} from "../openaireLibrary/monitor/entities/stakeholder";
import {Stakeholder} from "../openaireLibrary/monitor/entities/stakeholder";
@Component({
selector: 'home',
@ -167,8 +167,10 @@ export class HomeComponent {
this.directLink = value;
})
});
this.initAnimations();
this.startCaptainsAnimation();
if(typeof document != "undefined") {
this.initAnimations();
this.startAnimation();
}
}
public initAnimations() {
@ -180,14 +182,14 @@ export class HomeComponent {
this.observer.observe(this.ref.nativeElement);
}
public startCaptainsAnimation(state = 1) {
public startAnimation(state = 1) {
this.clearTimeouts();
this.state = state;
this.timeouts.push(setTimeout(() => {
if (this.state < 3) {
this.startCaptainsAnimation(this.state + 1);
this.startAnimation(this.state + 1);
} else {
this.startCaptainsAnimation();
this.startAnimation();
}
}, 6000));
}
@ -214,7 +216,6 @@ export class HomeComponent {
if(this.type === null) {
return this.stakeholders.length;
} else {
console.log(this.stakeholders.filter(stakeholder => stakeholder.type === this.type).length);
return this.stakeholders.filter(stakeholder => stakeholder.type === this.type).length;
}
}
@ -322,7 +323,6 @@ export class HomeComponent {
let mod = index % 9;
if (mod === 0 || mod === 4 || mod === 8) {
this.stakeholders[index].size = 'large';
console.log(this.stakeholders[index]);
} else if (mod === 1 || mod === 5 || mod === 6) {
this.stakeholders[index].size = 'small';
} else {
@ -364,6 +364,9 @@ export class HomeComponent {
this.piwiksub.unsubscribe();
}
this.clearTimeouts();
if(this.observer) {
this.observer.disconnect();
}
}
private handleError(message: string, error): number {