From 99df35282e88b6810b3dcbd7e64668ae325fef37 Mon Sep 17 00:00:00 2001
From: Piotr Pekala <piotrpawelpekala@gmail.com>
Date: Wed, 7 Aug 2019 05:19:54 -0700
Subject: [PATCH] Button on map to show/hide console

---
 src/app/app.module.ts                             |  2 ++
 .../log-console/log-console.component.ts          | 15 +++++++++++++--
 .../log-console/log-events-datasource.ts          |  9 +++++++++
 .../project-map/project-map.component.html        |  9 +++++++--
 .../project-map/project-map.component.scss        |  4 ++++
 .../project-map/project-map.component.ts          |  5 +++++
 6 files changed, 40 insertions(+), 4 deletions(-)
 create mode 100644 src/app/components/project-map/log-console/log-events-datasource.ts

diff --git a/src/app/app.module.ts b/src/app/app.module.ts
index a474e6e7..8a247a42 100644
--- a/src/app/app.module.ts
+++ b/src/app/app.module.ts
@@ -192,6 +192,7 @@ import { MapSettingService } from './services/mapsettings.service';
 import { ProjectMapMenuComponent } from './components/project-map/project-map-menu/project-map-menu.component';
 import { HelpComponent } from './components/help/help.component';
 import { LogConsoleComponent } from './components/project-map/log-console/log-console.component';
+import { LogEventsDataSource } from './components/project-map/log-console/log-events-datasource';
 
 if (environment.production) {
   Raven.config('https://b2b1cfd9b043491eb6b566fd8acee358@sentry.io/842726', {
@@ -354,6 +355,7 @@ if (environment.production) {
     LinksDataSource,
     NodesDataSource,
     SymbolsDataSource,
+    LogEventsDataSource,
     SelectionManager,
     InRectangleHelper,
     DrawingsDataSource,
diff --git a/src/app/components/project-map/log-console/log-console.component.ts b/src/app/components/project-map/log-console/log-console.component.ts
index 956b9579..7e8728ce 100644
--- a/src/app/components/project-map/log-console/log-console.component.ts
+++ b/src/app/components/project-map/log-console/log-console.component.ts
@@ -9,6 +9,7 @@ import { Drawing } from '../../../cartography/models/drawing';
 import { Link } from '../../../models/link';
 import { Node } from '../../../cartography/models/node';
 import { Port } from '../../../models/port';
+import { LogEventsDataSource } from './log-events-datasource';
 
 
 @Component({
@@ -34,7 +35,8 @@ export class LogConsoleComponent implements OnInit, AfterViewInit, OnDestroy {
     constructor(
         private projectWebServiceHandler: ProjectWebServiceHandler,
         private nodeService: NodeService,
-        private nodesDataSource: NodesDataSource
+        private nodesDataSource: NodesDataSource,
+        private logEventsDataSource: LogEventsDataSource
     ) {}
     
     ngOnInit() {
@@ -56,6 +58,7 @@ export class LogConsoleComponent implements OnInit, AfterViewInit, OnDestroy {
     }
 
     ngAfterViewInit() {
+        this.console.nativeElement.innerHTML = this.logEventsDataSource.getItems()[0] ? this.logEventsDataSource.getItems()[0] : '';
         this.console.nativeElement.scrollTop = this.console.nativeElement.scrollHeight;
     }
 
@@ -130,8 +133,16 @@ export class LogConsoleComponent implements OnInit, AfterViewInit, OnDestroy {
         this.command = '';
     }
 
+    clearConsole() {
+        this.console.nativeElement.innerHTML = '';
+        this.console.nativeElement.scrollTop = this.console.nativeElement.scrollHeight;
+    }
+
     showMessage(message: string) {
-        this.console.nativeElement.innerHTML += message += "<br />";
+        this.logEventsDataSource.clear();
+        this.logEventsDataSource.add(this.console.nativeElement.innerHTML + message + " <br />");
+
+        this.console.nativeElement.innerHTML += message += " <br />";
         this.console.nativeElement.scrollTop = this.console.nativeElement.scrollHeight;
     }
 
diff --git a/src/app/components/project-map/log-console/log-events-datasource.ts b/src/app/components/project-map/log-console/log-events-datasource.ts
new file mode 100644
index 00000000..29fa4801
--- /dev/null
+++ b/src/app/components/project-map/log-console/log-events-datasource.ts
@@ -0,0 +1,9 @@
+import { Injectable } from '@angular/core';
+import { DataSource } from '../../../cartography/datasources/datasource';
+
+@Injectable()
+export class LogEventsDataSource extends DataSource<string> {
+  protected getItemKey(log: string) {
+    return log;
+  }
+}
diff --git a/src/app/components/project-map/project-map.component.html b/src/app/components/project-map/project-map.component.html
index 980d3ed2..8272bc55 100644
--- a/src/app/components/project-map/project-map.component.html
+++ b/src/app/components/project-map/project-map.component.html
@@ -49,7 +49,7 @@
       </mat-menu>
 
       <mat-toolbar-row>
-        <button matTooltip="Show/hide interface labels" mat-icon-button [matMenuTriggerFor]="viewMenu"><mat-icon>view_module</mat-icon></button>
+        <button matTooltip="Map settings" mat-icon-button [matMenuTriggerFor]="viewMenu"><mat-icon>view_module</mat-icon></button>
       </mat-toolbar-row>
 
       <mat-menu #viewMenu="matMenu" [overlapTrigger]="false">
@@ -57,6 +57,9 @@
           <mat-checkbox [ngModel]="project.show_interface_labels" (change)="toggleShowInterfaceLabels($event.checked)">
             Show interface labels
           </mat-checkbox>
+          <mat-checkbox [ngModel]="isConsoleVisible" (change)="toggleShowConsole($event.checked)">
+            Show console
+          </mat-checkbox>
         </div>
       </mat-menu>
 
@@ -120,4 +123,6 @@
 <app-node-label-dragged [server]="server"></app-node-label-dragged>
 <app-text-added [server]="server" [project]="project" (drawingSaved)="onDrawingSaved()"> </app-text-added>
 <app-text-edited [server]="server"></app-text-edited>
-<app-log-console [server]="server" [project]="project"></app-log-console>
+<div [ngClass]="{ visible: !isConsoleVisible }">
+    <app-log-console [server]="server" [project]="project"></app-log-console>
+</div>
diff --git a/src/app/components/project-map/project-map.component.scss b/src/app/components/project-map/project-map.component.scss
index 49f1556a..553b5a13 100644
--- a/src/app/components/project-map/project-map.component.scss
+++ b/src/app/components/project-map/project-map.component.scss
@@ -230,3 +230,7 @@ g.node text,
 .context-menu-items .mat-menu-item:focus {
   background: none;
 }
+
+.visible {
+  display: none;
+}
diff --git a/src/app/components/project-map/project-map.component.ts b/src/app/components/project-map/project-map.component.ts
index 002d167b..df1c5cdd 100644
--- a/src/app/components/project-map/project-map.component.ts
+++ b/src/app/components/project-map/project-map.component.ts
@@ -68,6 +68,7 @@ export class ProjectMapComponent implements OnInit, OnDestroy {
   public server: Server;
   public ws: WebSocket;
   public isProjectMapMenuVisible: boolean = false;
+  public isConsoleVisible: boolean = false;
 
   tools = {
     selection: true,
@@ -362,6 +363,10 @@ export class ProjectMapComponent implements OnInit, OnDestroy {
     this.project.show_interface_labels = enabled;
   }
 
+  public toggleShowConsole(visible: boolean) {
+    this.isConsoleVisible = visible;
+  }
+
   public hideMenu() {
     this.projectMapMenuComponent.resetDrawToolChoice()
     this.isProjectMapMenuVisible = false;