From 138fccbe77dbb0b92c7820281d6e54a8cace0fb4 Mon Sep 17 00:00:00 2001
From: =?UTF-8?q?Krist=C3=B3f=20T=C3=B3th?= <kristof.toth@avatao.com>
Date: Tue, 20 Mar 2018 15:52:40 +0100
Subject: [PATCH] Implement dashboard layout manipulation from backend

---
 src/app/dashboard/dashboard.component.ts | 25 +++++++++++++++++++++---
 src/app/dashboard/layout-command.ts      |  4 ++++
 2 files changed, 26 insertions(+), 3 deletions(-)
 create mode 100644 src/app/dashboard/layout-command.ts

diff --git a/src/app/dashboard/dashboard.component.ts b/src/app/dashboard/dashboard.component.ts
index 5ae03b9..62733b2 100644
--- a/src/app/dashboard/dashboard.component.ts
+++ b/src/app/dashboard/dashboard.component.ts
@@ -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();
diff --git a/src/app/dashboard/layout-command.ts b/src/app/dashboard/layout-command.ts
new file mode 100644
index 0000000..e8e2f45
--- /dev/null
+++ b/src/app/dashboard/layout-command.ts
@@ -0,0 +1,4 @@
+export class LayoutCommand {
+    command: string;
+    layout: string;
+}
\ No newline at end of file