Add LowCollector & rename Supervisor to Monitoring

[src/xds/xds-agent.git] / webapp / src / app / pages / monitoring / monitoring-config.component.ts

diff --git a/webapp/src/app/pages/supervision/supervision-config.component.ts b/webapp/src/app/pages/monitoring/monitoring-config.component.ts
similarity index 70%
rename from webapp/src/app/pages/supervision/supervision-config.component.ts
rename to webapp/src/app/pages/monitoring/monitoring-config.component.ts
index e96b936..2a5a84b 100644 (file)
--- a/webapp/src/app/pages/supervision/supervision-config.component.ts
+++ b/webapp/src/app/pages/monitoring/monitoring-config.component.ts
@@ -1,6 +1,6 @@
 /**
 * @license
-* Copyright (C) 2017-2018 "IoT.bzh"
+* Copyright (C) 2017-2019 "IoT.bzh"
 * Author Sebastien Douheret <sebastien@iot.bzh>
 *
 * Licensed under the Apache License, Version 2.0 (the "License");
@@ -16,30 +16,33 @@
 * limitations under the License.
 */
 
-import { Component, OnInit, AfterViewInit, ViewEncapsulation } from '@angular/core';
-import { Injectable, Inject } from '@angular/core';
+import { Component, OnInit, AfterViewInit, ViewEncapsulation, Inject } from '@angular/core';
 import { DOCUMENT } from '@angular/common';
 import * as d3 from 'd3';
+import { Router } from '@angular/router';
 
-import { SupervisionService, AglTopology } from '../../@core-xds/services/supervision.service';
+import { MonitoringService, AglTopology } from '../../@core-xds/services/monitoring.service';
 import { AlertService } from '../../@core-xds/services/alert.service';
+import { BehaviorSubject } from 'rxjs/BehaviorSubject';
+import { Subscription } from 'rxjs/Subscription';
 
 interface WsCheckbox {
-  name: string;
-  pid: number;
+  topo: AglTopology;
   value: boolean;
-  disabled: boolean;
   tooltip: string;
 }
 
 @Component({
-  selector: 'xds-supervision',
-  styleUrls: ['./supervision-config.component.scss'],
-  templateUrl: './supervision-config.component.html',
+  selector: 'xds-monitoring',
+  styleUrls: ['./monitoring-config.component.scss'],
+  templateUrl: './monitoring-config.component.html',
   encapsulation: ViewEncapsulation.None,  // workaround about https://github.com/angular/angular/issues/7845
 })
-export class SupervisionConfigComponent implements OnInit, AfterViewInit {
+export class MonitoringConfigComponent implements OnInit, AfterViewInit {
 
+  aglTopoInit = new BehaviorSubject(false);
+  // FIXME: use Map instead of array and use '| keyvalue' for ngfor loop (but angular > 6.1 requested)
+  // daemonCheckboxes: Map<string, WsCheckbox> = new Map<string, WsCheckbox>();
   daemonCheckboxes: WsCheckbox[] = [];
   starting = false;
   stopping = false;
@@ -47,26 +50,32 @@ export class SupervisionConfigComponent implements OnInit, AfterViewInit {
   private graph: any;
   private svg: any;
   private links = [];
+  private _aglTopoSub: Subscription;
 
   constructor(@Inject(DOCUMENT) private document: Document,
-    private supervisorSvr: SupervisionService,
+    private router: Router,
+    private monitoringSvr: MonitoringService,
     private alert: AlertService,
   ) {
 
   }
 
   ngOnInit() {
-
   }
 
   ngAfterViewInit() {
     this.getAGLTopo();
+    this.aglTopoInit.next(true);
   }
 
   getAGLTopo() {
-    this.supervisorSvr.getTopo().subscribe(topo => {
+    if (this._aglTopoSub !== undefined) {
+      this._aglTopoSub.unsubscribe();
+    }
+
+    this._aglTopoSub = this.monitoringSvr.getTopo().subscribe(topo => {
       this.graphAGLBindings(topo);
-      this.updateCheckboxes(topo);
+      this.createCheckboxes(topo);
     });
   }
 
@@ -74,11 +83,21 @@ export class SupervisionConfigComponent implements OnInit, AfterViewInit {
     this.starting = true;
 
     const dmArr = [];
-    this.daemonCheckboxes.forEach(dm => dm.value && dmArr.push(dm.pid));
+    this.daemonCheckboxes.forEach(dm => dm.value && dmArr.push(dm.topo.pid));
+
+    this.monitoringSvr.startTrace({ pids: dmArr }).subscribe(res => {
+      // console.log('Trace Started: res', res);
+
+      this.monitoringSvr.startLowCollector(null).subscribe((/*res*/) => {
+        // console.log('Low Collector Started: res', res);
+        this.alert.info('Monitoring successfully started');
+        this.starting = false;
+
+      }, err => {
+        this.starting = false;
+        this.alert.error(err);
+      });
 
-    this.supervisorSvr.startTrace({ pids: dmArr }).subscribe(res => {
-      this.starting = false;
-      this.alert.info('Monitoring successfully started');
     }, err => {
       this.starting = false;
       this.alert.error(err);
@@ -87,15 +106,29 @@ export class SupervisionConfigComponent implements OnInit, AfterViewInit {
 
   onStopTrace() {
     this.stopping = true;
-    this.supervisorSvr.stopTrace({}).subscribe(res => {
-      this.stopping = false;
-      this.alert.info('Monitoring successfully stopped');
+    this.monitoringSvr.stopTrace({}).subscribe(res => {
+      // console.log('Trace Stopped: res', res);
+
+      this.monitoringSvr.stopLowCollector().subscribe((/*res*/) => {
+        // console.log('Low Collector Stopped: res', res);
+        this.alert.info('Monitoring successfully started');
+        this.stopping = false;
+
+      }, err => {
+        this.stopping = false;
+        this.alert.error(err);
+      });
+
     }, err => {
       this.stopping = false;
       this.alert.error(err);
     });
   }
 
+  showGraph() {
+    this.router.navigate([`/pages/monitoring/graph`]);
+  }
+
   isStartBtnDisable(): boolean {
     return this.starting;
   }
@@ -104,18 +137,42 @@ export class SupervisionConfigComponent implements OnInit, AfterViewInit {
     return this.stopping;
   }
 
-  private updateCheckboxes(topo: AglTopology[]) {
-    this.daemonCheckboxes = [];
+  isDaemonDisabled(name: string): boolean {
+    let sts = false;
+    // FIXME - better to use map
+    // with Map
+    // if (this.daemonCheckboxes.has(name)) {
+    //   sts = this.daemonCheckboxes[name].value;
+    // }
+    this.daemonCheckboxes.forEach(e => {
+      if (e.topo.name === name) {
+        sts = true;
+      }
+    });
+    return sts;
+  }
+
+  private createCheckboxes(topo: AglTopology[]) {
+
+    // let newDaemonChB: Map<string, WsCheckbox> = new Map<string, WsCheckbox>();
+    const newDaemonChB: WsCheckbox[] = [];
+    let prevVal = false;
+    this.daemonCheckboxes.forEach(e => {
+      if (e.topo.name === name) {
+        prevVal = e.value;
+      }
+    });
     topo.forEach(elem => {
-      this.daemonCheckboxes.push({
-        name: elem.name,
-        pid: elem.pid,
-        value: false,
-        disabled: false,
-        tooltip: 'Daemon ' + elem.name + ' (pid ' + elem.pid + ')',
+      // with Map
+      // newDaemonChB.set(elem.name, {
+      newDaemonChB.push({
+        topo: Object.assign({}, elem),
+        value: prevVal,
+        tooltip: 'Daemon binding ' + elem.name + ' (pid ' + elem.pid + ')',
       });
     });
 
+    this.daemonCheckboxes = newDaemonChB;
   }