entities graph refresh fix, now shows red alarm

Change-Id: I29a1551be87a02761d9d4738cdfbfcf87994a28e
2017-01-29 17:09:00 +02:00 · 2017-01-29 17:09:00 +02:00 · c2e258643c
commit c2e258643c
parent 484c1e6560
1 changed files with 531 additions and 89 deletions
--- a/vitrage_dashboard/dashboard/static/dashboard/project/entities/entities.controller.js
+++ b/vitrage_dashboard/dashboard/static/dashboard/project/entities/entities.controller.js
@ -1,120 +1,562 @@
 (function () {
+
  'use strict';

+
+
+
  angular
+
    .module('horizon.dashboard.project.vitrage')
+
    .controller('EntitiesController', EntitiesController);

+
+
+
  EntitiesController.$inject = ['$scope', 'vitrageTopologySrv', '$interval'];

+
+
+
  function EntitiesController($scope, vitrageTopologySrv, $interval) {

-      //this.$interval = $interval;
-      this.model = {selected: {}};
-
-      var _this = this,
-          loadTime = 10000,
-          errorCount = 0,
-          loadInterval;
-
-      $scope.$on('graphItemClicked',function (event, data){
-          _this.selectedItem = data;
-          event.stopPropagation();
-          $scope.$digest();
-      });
-
-      this.setSelected = function(item) {
-          this.model.selected = item;
-      }
-
-      loadData();
-
-      function loadData() {
-          vitrageTopologySrv.getTopology('graph')
-              .then(function(res) {
-                  var nodes = res.data.nodes,
-                      links = res.data.links;
-
-                  _.each(links, function(link) {
-                      link.source = nodes[link.source];
-                      link.target = nodes[link.target];
-                  });


-                  if (_this.graphData) {
-                      mergeData(res.data);
-                  } else {
-                      _this.graphData = res.data;
-                      _this.graphData.ts = Date.now();
-                  }

-                  errorCount = 0;
-                  nextLoad();
-              })
-              .catch(function(res) {
-                  nextLoad(++errorCount * 2 * loadTime);
-              })
-      }
+    //this.$interval = $interval;

-      function nextLoad(mill) {
-          mill = mill || loadTime;
-          cancelNextLoad();
-          loadInterval = $interval(loadData, mill);
-      }
-
-      function cancelNextLoad() {
-          $interval.cancel(loadInterval);
-      }
-
-      function mergeData(data) {
-          //temp mess with data
-          /*var nodeIndex = rnd(0, data.nodes.length - 1);
-          var nodeCount = (data.nodes.length - 1) - nodeIndex;
-          var linkIndex = rnd(0, data.nodes.length - 1);
-          var linkCount = (data.links.length - 1) - linkIndex;
-          data.nodes.splice(nodeIndex, nodeCount);
-          data.links.splice(linkIndex, linkCount);*/
+    this.model = {selected: {}};


-          var graphNodes = $scope.vm.graphData.nodes,
-              graphLinks = $scope.vm.graphData.links;

-          if (graphNodes.length != data.nodes.length || graphLinks.length != data.links.length) {

-              graphNodes.splice(0, graphNodes.length);
-              graphLinks.splice(0, graphLinks.length);
+    var _this = this,

-              _.each(data.nodes, function(node) {
-                  graphNodes.push(node);
-              })
+      loadTime = 1000,

-              _.each(data.links, function(link) {
-                  graphLinks.push(link);
-              })
+      errorCount = 0,
+
+      loadInterval;
+
+
+
+
+    $scope.$on('graphItemClicked',function (event, data){
+
+      _this.selectedItem = data;
+
+      event.stopPropagation();
+
+      $scope.$digest();
+
+    });
+
+
+
+
+    this.setSelected = function(item) {
+
+      this.model.selected = item;
+
+    }
+
+
+
+
+    loadData();
+
+
+
+
+    function loadData() {
+
+      vitrageTopologySrv.getTopology('graph')
+
+        .then(function(res) {
+
+          var nodes = res.data.nodes,
+
+            links = res.data.links;
+
+
+
+
+          _.each(links, function(link) {
+
+            link.source = nodes[link.source];
+
+            link.target = nodes[link.target];
+
+          });
+
+
+
+
+
+
+
+          if (_this.graphData) {
+
+            mergeData(res.data);
+
+          } else {
+
+            _this.graphData = res.data;
+
+            _this.graphData.ts = Date.now();

-              $scope.vm.graphData.ts = Date.now();
          }
-      }

-      /* utils */

-      function rnd(min, max) {
-          return Math.round(Math.random() * (max- min)) + min;
-      }

-      //var old = [{a: 111}, {a: 222}, {a: 333}, {a: 444}];
-      //var newa = [{a:111}, {a: 444}, {a: 777}, {a: 999}];
-      //var onlyInOld = onlyIn(old, newa, 'a');
-      //var onlyInNew = onlyIn(newa, old, 'a');
-      function onlyIn(a1, a2, prop) {
-          prop = prop || 'id';
-          return a1.filter(function(o1) {
-              return a2.filter(function(o2) {
-                      return o1[prop] === o2[prop];
-                  }).length === 0;
+
+          errorCount = 0;
+
+          nextLoad();
+
+        })
+
+        .catch(function(res) {
+
+          nextLoad(++errorCount * 2 * loadTime);
+
+        })
+
+    }
+
+
+
+
+    function nextLoad(mill) {
+
+      mill = mill || loadTime;
+
+      cancelNextLoad();
+
+      loadInterval = $interval(loadData, mill);
+
+    }
+
+
+
+
+    function cancelNextLoad() {
+
+      $interval.cancel(loadInterval);
+
+    }
+
+
+
+
+    function mergeData(data) {
+
+      //temp mess with data
+
+      /*var nodeIndex = rnd(0, data.nodes.length - 1);
+
+       var nodeCount = (data.nodes.length - 1) - nodeIndex;
+
+       var linkIndex = rnd(0, data.nodes.length - 1);
+
+       var linkCount = (data.links.length - 1) - linkIndex;
+
+       data.nodes.splice(nodeIndex, nodeCount);
+
+       data.links.splice(linkIndex, linkCount);*/
+
+
+
+
+
+
+
+      var graphNodes = $scope.vm.graphData.nodes,
+
+        graphLinks = $scope.vm.graphData.links;
+
+
+
+
+      if (graphNodes.length != data.nodes.length || graphLinks.length != data.links.length) {
+
+
+
+
+        graphNodes.splice(0, graphNodes.length);
+
+        graphLinks.splice(0, graphLinks.length);
+
+
+
+
+        _.each(data.nodes, function(node) {
+
+          graphNodes.push(node);
+
+        })
+
+
+
+
+        _.each(data.links, function(link) {
+
+          graphLinks.push(link);
+
+        })
+
+
+
+
+        $scope.vm.graphData.ts = Date.now();
+
+
+
+
+
+
+
+
+
+
+
+
+
+        /* temp stuff */
+
+        d3.selectAll('.node .icon')
+
+          .attr('text-anchor', 'middle')
+
+          .attr('dominant-baseline', 'central')
+
+          .attr('transform', 'scale(1)')
+
+          .attr('class', function(d) {
+
+            var category = d.category,
+
+              cls = '';
+
+
+
+
+            if (category && category.toLowerCase() === 'alarm') {
+
+              var severity = d.operational_severity;
+
+              if (severity) {
+
+                switch (severity.toLowerCase()) {
+
+                  case 'critical':
+
+                    cls = 'red';
+
+                    break;
+
+                  case 'severe':
+
+                    cls = 'orange';
+
+                    break;
+
+                  case 'warning':
+
+                    cls = 'yellow';
+
+                    break;
+
+                  case 'ok':
+
+                    cls = 'green';
+
+                    break;
+
+                  case 'n/a':
+
+                    cls = 'gray';
+
+                    break;
+
+                  default: //'DISABLED', 'UNKNOWN', 'UNDEFINED'
+
+                    cls = 'gray';
+
+                    break;
+
+                }
+
+              }
+
+            } else {
+
+              var reald = _.find(graphNodes, function(n) {
+
+                return n.id == d.id;
+
+              });
+
+              var state = reald.operational_state;
+
+              if (state) {
+
+                switch (state.toLowerCase()) {
+
+                  case 'error':
+
+                    cls = 'red';
+
+                    break;
+
+                  case 'suboptimal':
+
+                    cls = 'yellow';
+
+                    break;
+
+                  case 'n/a':
+
+                    cls = 'gray';
+
+                    break;
+
+                }
+
+              }
+
+            }
+
+            return cls;
+
          })
+
+          .style('font-size', function(d) {
+
+            var category = d.category || 'no_category',
+
+              icon_size;
+
+
+
+
+            if (category && category.toLowerCase() === 'alarm') {
+
+              icon_size = '18px';
+
+            } else {
+
+              var type = d.type || 'no_type';
+
+              switch(type.toLowerCase()) {
+
+                case 'nova.instance':
+
+                case 'nova.host':
+
+                case 'nova.zone':
+
+                case 'neutron.port':
+
+                  icon_size = '16px'; //fa-external-link-square
+
+                  break;
+
+                case 'openstack.cluster':
+
+                  icon_size = '18px'; //fa-cloud
+
+                  break;
+
+                case 'cinder.volume':
+
+                  icon_size = '22px';
+
+                  break;
+
+                case 'neutron.network':
+
+                default:
+
+                  icon_size = '20px';
+
+                  break;
+
+              }
+
+            }
+
+
+
+
+            return icon_size;
+
+          })
+
+          .style('stroke', function(d) {
+
+            var category = d.category;
+
+            if (category && category.toLowerCase() === 'alarm') {
+
+              return '18px'
+
+            }
+
+            return '20px'
+
+          })
+
+          .classed('icon', true)
+
+          .classed('fill-only', function(d) {
+
+            var type = (d.type || '').toLowerCase();
+
+            if (type && type === 'nova.host' || type === 'cinder.volume') {
+
+              return true;
+
+            }
+
+          })
+
+          .text(function(d) {
+
+            var category = d.category,
+
+              icon;
+
+
+
+
+            if (category && category.toLowerCase() === 'alarm') {
+
+              icon = '\uf0f3'; //\uf0a2'; //bell-o
+
+            } else {
+
+              var type = d.type || 'no_type';
+
+              switch(type.toLowerCase()) {
+
+                case 'nova.instance':
+
+                  icon = '\uf108'; //fa-desktop
+
+                  break;
+
+                case 'nova.host':
+
+                  icon = '\uf233'; //fa-server
+
+                  break;
+
+                case 'nova.zone':
+
+                  icon = '\uf279'; //fa-map
+
+                  break;
+
+                case 'neutron.network':
+
+                  icon = '\uf0ac'; //fa-globe
+
+                  break;
+
+                case 'neutron.port':
+
+                  icon = '\uf14c'; //fa-external-link-square
+
+                  break;
+
+                case 'cinder.volume':
+
+                  icon = '\uf0a0'; //fa-hdd-o
+
+                  break;
+
+                case 'openstack.cluster':
+
+                  icon = '\uf0c2'; //fa-cloud
+
+                  break;
+
+                default:
+
+                  icon = '\uf013'; //fa-cog
+
+                  break;
+
+              }
+
+            }
+
+            return icon
+
+          });
+
+
+
+
+
+
+
+
+
+
+
+
+
      }
+
+    }
+
+
+
+
+    /* utils */
+
+
+
+
+    function rnd(min, max) {
+
+      return Math.round(Math.random() * (max- min)) + min;
+
+    }
+
+
+
+
+    //var old = [{a: 111}, {a: 222}, {a: 333}, {a: 444}];
+
+    //var newa = [{a:111}, {a: 444}, {a: 777}, {a: 999}];
+
+    //var onlyInOld = onlyIn(old, newa, 'a');
+
+    //var onlyInNew = onlyIn(newa, old, 'a');
+
+    function onlyIn(a1, a2, prop) {
+
+      prop = prop || 'id';
+
+      return a1.filter(function(o1) {
+
+        return a2.filter(function(o2) {
+
+            return o1[prop] === o2[prop];
+
+          }).length === 0;
+
+      })
+
+    }
+
  }

-})();

+
+
+})();