Topo2 - Key Command 'H' to toggel hosts visibility
JIRA Tasks; ONOS-6283
Change-Id: Id1b8c00342af799e1d92c84346bb3fe6f6023af6
diff --git a/web/gui/src/main/webapp/app/view/topo2/topo2Host.js b/web/gui/src/main/webapp/app/view/topo2/topo2Host.js
index e54f5a0..ed3a981 100644
--- a/web/gui/src/main/webapp/app/view/topo2/topo2Host.js
+++ b/web/gui/src/main/webapp/app/view/topo2/topo2Host.js
@@ -48,8 +48,8 @@
angular.module('ovTopo2')
.factory('Topo2HostService', [
'Topo2Collection', 'Topo2NodeModel', 'Topo2ViewService',
- 'IconService', 'Topo2ZoomService', 'Topo2HostsPanelService',
- function (_c_, NodeModel, _t2vs_, is, zs, t2hds) {
+ 'IconService', 'Topo2ZoomService', 'Topo2HostsPanelService', 'PrefsService',
+ function (_c_, NodeModel, _t2vs_, is, zs, t2hds, ps) {
Collection = _c_;
@@ -95,6 +95,10 @@
this.el.select('g').selectAll('*')
.style('transform', 'scale(' + multipler + ')');
},
+ setVisibility: function () {
+ var visible = ps.getPrefs('topo2_prefs')['hosts'];
+ this.el.style('visibility', visible ? 'visible' : 'hidden');
+ },
onEnter: function (el) {
var node = d3.select(el),
icon = this.icon(),
@@ -127,6 +131,7 @@
this.setScale();
this.setUpEvents();
+ this.setVisibility();
}
});
diff --git a/web/gui/src/main/webapp/app/view/topo2/topo2KeyCommands.js b/web/gui/src/main/webapp/app/view/topo2/topo2KeyCommands.js
index d1fa72d..8dab3ce 100644
--- a/web/gui/src/main/webapp/app/view/topo2/topo2KeyCommands.js
+++ b/web/gui/src/main/webapp/app/view/topo2/topo2KeyCommands.js
@@ -32,6 +32,7 @@
E: [equalizeMasters, 'Equalize mastership roles'],
X: [resetNodeLocation, 'Reset Node Location'],
U: [unpinNode, 'Unpin node (mouse over)'],
+ H: [toggleHosts, 'Toggle host visibility'],
dot: [toggleToolbar, 'Toggle Toolbar'],
esc: handleEscape,
@@ -145,6 +146,10 @@
t2tbs.toggle();
}
+ function toggleHosts() {
+ t2rs.toggleHosts();
+ }
+
function notValid(what) {
$log.warn('topo.js getActionEntry(): Not a valid ' + what);
}
diff --git a/web/gui/src/main/webapp/app/view/topo2/topo2Link.js b/web/gui/src/main/webapp/app/view/topo2/topo2Link.js
index d3f449c..b4b7d95 100644
--- a/web/gui/src/main/webapp/app/view/topo2/topo2Link.js
+++ b/web/gui/src/main/webapp/app/view/topo2/topo2Link.js
@@ -22,7 +22,7 @@
(function () {
'use strict';
- var $log, Collection, Model, ts, sus, t2zs, t2vs, t2lps, fn;
+ var $log, Collection, Model, ts, sus, t2zs, t2vs, t2lps, fn, ps;
var linkLabelOffset = '0.35em';
@@ -315,10 +315,7 @@
this.el = link;
this.restyleLinkElement();
-
- if (this.get('type') === 'hostLink') {
- // sus.visible(link, api.showHosts());
- }
+ this.setVisibility();
},
setScale: function () {
@@ -340,6 +337,15 @@
this.enhance();
}
},
+ setVisibility: function () {
+
+ if (this.get('type') !== 'UiEdgeLink') {
+ return;
+ }
+
+ var visible = ps.getPrefs('topo2_prefs')['hosts'];
+ this.el.style('visibility', visible ? 'visible' : 'hidden');
+ },
remove: function () {
var width = linkScale(widthRatio) / t2zs.scale();
@@ -369,9 +375,9 @@
.factory('Topo2LinkService', [
'$log', 'Topo2Collection', 'Topo2Model',
'ThemeService', 'SvgUtilService', 'Topo2ZoomService',
- 'Topo2ViewService', 'Topo2LinkPanelService', 'FnService',
+ 'Topo2ViewService', 'Topo2LinkPanelService', 'FnService', 'PrefsService',
function (_$log_, _c_, _Model_, _ts_, _sus_,
- _t2zs_, _t2vs_, _t2lps_, _fn_) {
+ _t2zs_, _t2vs_, _t2lps_, _fn_, _ps_) {
$log = _$log_;
ts = _ts_;
@@ -382,6 +388,7 @@
Model = _Model_;
t2lps = _t2lps_;
fn = _fn_;
+ ps = _ps_;
return {
createLinkCollection: createLinkCollection
diff --git a/web/gui/src/main/webapp/app/view/topo2/topo2Region.js b/web/gui/src/main/webapp/app/view/topo2/topo2Region.js
index 7ab0b10..7e5c37c 100644
--- a/web/gui/src/main/webapp/app/view/topo2/topo2Region.js
+++ b/web/gui/src/main/webapp/app/view/topo2/topo2Region.js
@@ -173,7 +173,18 @@
return false;
},
+ toggleHosts: function () {
+ var state = this.lookupPrefState('hosts');
+ this.updatePrefState('hosts', !state);
+ _.each(this.model.get('hosts').models, function (host) {
+ host.setVisibility();
+ });
+
+ _.each(this.model.get('links').models, function (link) {
+ link.setVisibility();
+ });
+ },
update: function (event) {
if (!this.isLoadComplete()){
diff --git a/web/gui/src/main/webapp/app/view/topo2/topo2ViewController.js b/web/gui/src/main/webapp/app/view/topo2/topo2ViewController.js
index 6c19fe9..190f751 100644
--- a/web/gui/src/main/webapp/app/view/topo2/topo2ViewController.js
+++ b/web/gui/src/main/webapp/app/view/topo2/topo2ViewController.js
@@ -87,6 +87,10 @@
flash.flash(verb + ' ' + this.displayName);
this.updatePrefState(this.prefs.visible, on);
},
+ lookupPrefState: function (key) {
+ // Return 0 if not defined
+ return ps.getPrefs('topo2_prefs')[key] || 0;
+ },
updatePrefState: function (key, value) {
var state = ps.getPrefs('topo2_prefs');
state[key] = value ? 1 : 0;