mrtoth/frontend-tutorial-framework
1
0
Fork 0
mirror of https://github.com/avatao-content/frontend-tutorial-framework synced 2025-06-28 23:25:13 +00:00
Code Issues Releases Wiki Activity

Move deploy blur logic to parent component

Browse Source
This commit is contained in:
Gabor PEK
2018-03-12 15:03:38 +01:00
parent 8f4a6fd83e
commit 97ed48b408
6 changed files with 32 additions and 27 deletions
Download Patch File Download Diff File Expand all files Collapse all files

4
src/app/dashboard/dashboard.component.html
View File

@ -1,7 +1,9 @@
<div class="tfw-grid-main-components">
<div class="tfw-header"><app-header></app-header></div>
<div class="tfw-messages"><app-messages></app-messages></div>
<div class="tfw-web tao-grid-top-left"><app-login></app-login></div>
<div class="tfw-web tao-grid-top-left" [ngClass]="{ 'deploy-blur': deploying }">
<app-login></app-login>
</div>
<div class="tfw-webide"><app-webide></app-webide></div>
<div class="tfw-terminal"><app-terminal></app-terminal></div>
</div>

5
src/app/dashboard/dashboard.component.scss
View File

@ -107,3 +107,8 @@ $layout: (
}
}
.deploy-blur {
filter: blur(3px);
}

24
src/app/dashboard/dashboard.component.ts
View File

@ -1,10 +1,28 @@
import { Component } from '@angular/core';
import {Component, OnDestroy, OnInit} from '@angular/core';
import {DeploymentNotificationService} from '../services/deployment-notification.service';
import {Subscription} from 'rxjs/Subscription';
@Component({
selector: 'app-dashboard',
templateUrl: './dashboard.component.html',
styleUrls: ['./dashboard.component.scss']
})
export class DashboardComponent {
constructor() {}
export class DashboardComponent implements OnInit, OnDestroy {
deploying = false;
deploymentNotificationSubscription: Subscription;
constructor(private deploymentNotificationService: DeploymentNotificationService) {}
ngOnInit() {
this.deploymentNotificationSubscription = this.deploymentNotificationService.deploying.subscribe(
(deploying) => this.deploying = deploying
);
}
ngOnDestroy() {
if (this.deploymentNotificationSubscription) {
this.deploymentNotificationSubscription.unsubscribe();
}
}
}