From 514939ff19a8838e45934f90af039fbeea12fd40 Mon Sep 17 00:00:00 2001 From: Daniel Malachovsky Date: Tue, 9 Feb 2016 20:16:14 +0100 Subject: Design changes p. 1 - fixed some design flaws - added tunnel table into inventory detail - added filter to remove vxlan_tunnel from interfaces list in bd mnager Change-Id: Ia9f0ca737d062ed2ed57734561dbece34d20b7c3 Signed-off-by: Daniel Malachovsky --- .../src/main/resources/vpp/assets/css/vpp.css | 36 +++++++++++++++--- .../resources/vpp/controllers/bdm.controller.js | 4 +- .../vpp/controllers/inventory.controller.js | 43 ++++++++++++---------- .../resources/vpp/controllers/vpp.controller.js | 10 +++++ .../resources/vpp/services/inventory.service.js | 2 +- .../main/resources/vpp/services/vpp.services.js | 2 +- .../resources/vpp/views/bridge-domains.tpl.html | 4 +- .../resources/vpp/views/inventory-detail.tpl.html | 33 ++++++++++++++++- 8 files changed, 100 insertions(+), 34 deletions(-) diff --git a/vbd/gui/module/src/main/resources/vpp/assets/css/vpp.css b/vbd/gui/module/src/main/resources/vpp/assets/css/vpp.css index 2566d90cb..2aa42ff79 100644 --- a/vbd/gui/module/src/main/resources/vpp/assets/css/vpp.css +++ b/vbd/gui/module/src/main/resources/vpp/assets/css/vpp.css @@ -170,6 +170,7 @@ a.md-button.md-warn[disabled], .md-button.md-default-theme[disabled], .md-button .table > tbody > tr > td, .table > tfoot > tr > td { vertical-align: middle; + border-top: 1px solid rgba(221, 221, 221, 0.6); } .table > thead > tr > th.interactive { @@ -213,13 +214,18 @@ select:-webkit-autofill { } md-select-menu.md-default-theme, -md-select-menu md-option[selected] { +md-select-menu md-option[selected] div.md-text { color: orange; } -/*tab overrides*/ -md-tab.md-active { +md-select.md-default-theme, +md-select .md-select-value { + border-bottom-color: orange; +} + +md-select .md-select-value span { color: orange; +} md-input-container label { color: white !important; @@ -229,6 +235,24 @@ md-input-container.md-input-focused label { color: orange !important; } -md-option div.md-text { - color: orange !important; -} \ No newline at end of file +md-option[selected] div.md-text { + color: orange; +} + +md-option div.md-text:hover { + color: orange; +} + +md-select.md-default-theme:not([disabled]):focus, +md-select:not([disabled]):focus .md-select-value { + color: orange; +} + +md-ripple-container { + +} + +/*tab overrides*/ +md-tab-item.md-active { + color: orange; +} diff --git a/vbd/gui/module/src/main/resources/vpp/controllers/bdm.controller.js b/vbd/gui/module/src/main/resources/vpp/controllers/bdm.controller.js index e5ad012fa..7c24690c5 100644 --- a/vbd/gui/module/src/main/resources/vpp/controllers/bdm.controller.js +++ b/vbd/gui/module/src/main/resources/vpp/controllers/bdm.controller.js @@ -182,7 +182,7 @@ define(['app/vpp/vpp.module'], function(vpp) { /* FIXME: remove after testing */ - /*$scope.deploy = function() { + $scope.deploy = function() { var successfulRequestsRequired = dataService.changedInterfaces.length; var successfulRequests = 0; @@ -253,7 +253,7 @@ define(['app/vpp/vpp.module'], function(vpp) { successfulRequests++; } }); - };*/ + }; $scope.removeBd = function() { if(dataService.selectedBd.name) { diff --git a/vbd/gui/module/src/main/resources/vpp/controllers/inventory.controller.js b/vbd/gui/module/src/main/resources/vpp/controllers/inventory.controller.js index 7f2a4ec0c..b1797534a 100644 --- a/vbd/gui/module/src/main/resources/vpp/controllers/inventory.controller.js +++ b/vbd/gui/module/src/main/resources/vpp/controllers/inventory.controller.js @@ -20,7 +20,7 @@ define(['app/vpp/vpp.module'], function(vpp) { $scope.vppList = data; $scope.displayVppList = [].concat($scope.vppList); dataService.vpps = $scope.vppList; - +console.log($scope.vppList); $scope.$broadcast('RELOAD_VPP_TABLE'); //for vppList access in BDM @@ -222,28 +222,31 @@ define(['app/vpp/vpp.module'], function(vpp) { $scope.app.container(document.getElementById('next-vpp-topo')); $scope.topo.attach($scope.app); - $scope.$watch('selectedVpp', function() { - vm.vpp = vpp; - vm.vpp.type = 'vpp'; - vm.vpp.label = vm.vpp.name; - - var nodes = [].concat(vm.vpp); - var links = []; - - _.forEach(vm.vpp.interfaces, function(interf, index){ - interf.label = interf.name; - interf.scale = 0.5; - nodes.push(interf); - links.push({source: 0, target: index + 1}); - }); - - $scope.topo.data({ - nodes: nodes, - links: links - }); + }; + + $scope.fillTopologyData = function(vpp) { + var nodes = [].concat(vpp); + var links = []; + vpp.type = 'vpp'; + vpp.label = vpp.name; + + _.forEach(vpp.interfaces, function(interf, index){ + interf.label = interf.name; + interf.scale = 0.5; + nodes.push(interf); + links.push({source: 0, target: index + 1}); + }); + + $scope.topo.data({ + nodes: nodes, + links: links }); }; + $scope.$watch('selectedVpp', function() { + $scope.fillTopologyData($scope.selectedVpp); + }); + $scope.viewTopology($scope.selectedVpp); }]); diff --git a/vbd/gui/module/src/main/resources/vpp/controllers/vpp.controller.js b/vbd/gui/module/src/main/resources/vpp/controllers/vpp.controller.js index 2d968f757..16ce20402 100644 --- a/vbd/gui/module/src/main/resources/vpp/controllers/vpp.controller.js +++ b/vbd/gui/module/src/main/resources/vpp/controllers/vpp.controller.js @@ -45,6 +45,16 @@ define(modules, function(vpp) { $scope.$broadcast('RELOAD_SELECTED_VPP'); }; + // filter used in inventory to filter interfaceList of vxlan_tunnel interfaces + $scope.filterRemoveVxlanIf = function (item) { + return item.name.indexOf('vxlan') !== 0; + }; + + // filter used in inventory to return vxlan_tunnel interfaces + $scope.filterGetVxlanIf = function (item) { + return item.name.indexOf('vxlan') === 0; + }; + }]); diff --git a/vbd/gui/module/src/main/resources/vpp/services/inventory.service.js b/vbd/gui/module/src/main/resources/vpp/services/inventory.service.js index d6d27544f..6181ce678 100644 --- a/vbd/gui/module/src/main/resources/vpp/services/inventory.service.js +++ b/vbd/gui/module/src/main/resources/vpp/services/inventory.service.js @@ -49,7 +49,7 @@ define(['app/vpp/vpp.module', 'next'], function(vpp) { vppList.push(vppObj); }, function() { - console.warn('blabla'); + console.warn('error'); } ) } diff --git a/vbd/gui/module/src/main/resources/vpp/services/vpp.services.js b/vbd/gui/module/src/main/resources/vpp/services/vpp.services.js index 4c20f844e..1e9d20b23 100644 --- a/vbd/gui/module/src/main/resources/vpp/services/vpp.services.js +++ b/vbd/gui/module/src/main/resources/vpp/services/vpp.services.js @@ -62,7 +62,7 @@ define(['app/vpp/vpp.module', 'next'], function(vpp) { if (link.getData().type === 'tunnel') { return '#00FF00'; } else { - return '#414040'; + return '#ffffff'; } }, width: function(link) { diff --git a/vbd/gui/module/src/main/resources/vpp/views/bridge-domains.tpl.html b/vbd/gui/module/src/main/resources/vpp/views/bridge-domains.tpl.html index 806097346..ab4d83dfb 100644 --- a/vbd/gui/module/src/main/resources/vpp/views/bridge-domains.tpl.html +++ b/vbd/gui/module/src/main/resources/vpp/views/bridge-domains.tpl.html @@ -1,7 +1,7 @@
-
+
@@ -23,7 +23,7 @@ - +
diff --git a/vbd/gui/module/src/main/resources/vpp/views/inventory-detail.tpl.html b/vbd/gui/module/src/main/resources/vpp/views/inventory-detail.tpl.html index 1fc3fa617..9d08cf67d 100644 --- a/vbd/gui/module/src/main/resources/vpp/views/inventory-detail.tpl.html +++ b/vbd/gui/module/src/main/resources/vpp/views/inventory-detail.tpl.html @@ -11,7 +11,12 @@
-

VPP Detail

+
+

VPP Detail

+
+
+ Back to VPP List +
@@ -37,6 +42,30 @@
+ +
+

VXLAN Tunnel

+
+ + + + + + + + + + + + + + + + + + + +
NameOper StatusAdmin StatusSource IPDestination IP
{{interface.name}}{{interface['admin-status']}}{{interface['phys-address']}}{{interface['v3po:vxlan'].src}}{{interface['v3po:vxlan'].dst}}
@@ -56,7 +85,7 @@ - + {{interface.name}} {{interface['oper-status']}} {{interface['admin-status']}} -- cgit 1.2.3-korg