mrtoth/frontend-tutorial-framework
1
0
Fork 0
mirror of https://github.com/avatao-content/frontend-tutorial-framework synced 2025-01-15 21:41:55 +00:00
Code Issues Releases Wiki Activity

Implement dashboard layout manipulation from backend

Browse Source
This commit is contained in:
Kristóf Tóth 2018-03-20 15:52:40 +01:00
parent 809b78056d
commit 138fccbe77
2 changed files with 26 additions and 3 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

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

@ -1,6 +1,8 @@
import { Component, OnDestroy, OnInit } from '@angular/core';
import { Component, OnDestroy, OnInit, ChangeDetectorRef } from '@angular/core';
import { DeploymentNotificationService } from '../services/deployment-notification.service';
import { Subscription } from 'rxjs/Subscription';
import { WebSocketService } from '../services/websocket.service';
import { LayoutCommand } from './layout-command';
@Component({
selector: 'app-dashboard',
@ -8,18 +10,35 @@ import { Subscription } from 'rxjs/Subscription';
styleUrls: ['./dashboard.component.scss']
})
export class DashboardComponent implements OnInit, OnDestroy {
deploying = false;
deploymentNotificationSubscription: Subscription;
layout = 'vraw-open';
command_handlers = {'layout': this.layoutHandler.bind(this)};
constructor(private deploymentNotificationService: DeploymentNotificationService) {}
constructor(private deploymentNotificationService: DeploymentNotificationService,
private webSocketService: WebSocketService,
private changeDetectorRef: ChangeDetectorRef) {}
ngOnInit() {
this.webSocketService.connect();
this.webSocketService.observeKey<LayoutCommand>('dashboard').subscribe((event) => {
this.command_handlers[event.data.command](event.data);
this.changeDetectorRef.detectChanges();
});
this.deploymentNotificationSubscription = this.deploymentNotificationService.deploying.subscribe(
(deploying) => this.deploying = deploying
);
}
layoutHandler(data: LayoutCommand) {
if (data.layout.match('vraw-open|vraw-closed|hraw|default-open|default-closed')) {
this.layout = data.layout;
}
else {
console.log('Invalid webide layout "' + data.layout + '" received!');
}
}
ngOnDestroy() {
if (this.deploymentNotificationSubscription) {
this.deploymentNotificationSubscription.unsubscribe();

4
src/app/dashboard/layout-command.ts Normal file
View File

@ -0,0 +1,4 @@
export class LayoutCommand {
command: string;
layout: string;
}