GUI -- Persisted state of hosts/offline-devices/port-hilite; and a little refactoring to boot.
- Added asNumbers() to prefs.js. Change-Id: I58b98bb660a525bc1af2498d81e86be6a4b06e66
Showing
6 changed files
with
101 additions
and
46 deletions
... | @@ -37,7 +37,7 @@ | ... | @@ -37,7 +37,7 @@ |
37 | // We may want to upgrade the version of Angular sometime soon | 37 | // We may want to upgrade the version of Angular sometime soon |
38 | // since later version support objects as cookie values. | 38 | // since later version support objects as cookie values. |
39 | 39 | ||
40 | - // NOTE: prefs represented as simple name/value(number) pairs | 40 | + // NOTE: prefs represented as simple name/value pairs |
41 | // => a temporary restriction while we are encoding into cookies | 41 | // => a temporary restriction while we are encoding into cookies |
42 | /* | 42 | /* |
43 | { | 43 | { |
... | @@ -60,7 +60,7 @@ | ... | @@ -60,7 +60,7 @@ |
60 | bits = cook.split(','); | 60 | bits = cook.split(','); |
61 | bits.forEach(function (value) { | 61 | bits.forEach(function (value) { |
62 | var x = value.split(':'); | 62 | var x = value.split(':'); |
63 | - obj[x[0]] = Number(x[1]); | 63 | + obj[x[0]] = x[1]; |
64 | }); | 64 | }); |
65 | 65 | ||
66 | // update the cache | 66 | // update the cache |
... | @@ -71,6 +71,23 @@ | ... | @@ -71,6 +71,23 @@ |
71 | return cache[name]; | 71 | return cache[name]; |
72 | } | 72 | } |
73 | 73 | ||
74 | + // converts string values to numbers for selected (or all) keys | ||
75 | + function asNumbers(obj, keys) { | ||
76 | + if (!obj) return null; | ||
77 | + | ||
78 | + if (!keys) { | ||
79 | + // do them all | ||
80 | + angular.forEach(obj, function (v, k) { | ||
81 | + obj[k] = Number(obj[k]); | ||
82 | + }); | ||
83 | + } else { | ||
84 | + keys.forEach(function (k) { | ||
85 | + obj[k] = Number(obj[k]); | ||
86 | + }); | ||
87 | + } | ||
88 | + return obj; | ||
89 | + } | ||
90 | + | ||
74 | function setPrefs(name, obj) { | 91 | function setPrefs(name, obj) { |
75 | var bits = [], | 92 | var bits = [], |
76 | str; | 93 | str; |
... | @@ -100,6 +117,7 @@ | ... | @@ -100,6 +117,7 @@ |
100 | 117 | ||
101 | return { | 118 | return { |
102 | getPrefs: getPrefs, | 119 | getPrefs: getPrefs, |
120 | + asNumbers: asNumbers, | ||
103 | setPrefs: setPrefs | 121 | setPrefs: setPrefs |
104 | }; | 122 | }; |
105 | }]); | 123 | }]); | ... | ... |
... | @@ -48,9 +48,9 @@ | ... | @@ -48,9 +48,9 @@ |
48 | O: [toggleSummary, 'Toggle ONOS summary panel'], | 48 | O: [toggleSummary, 'Toggle ONOS summary panel'], |
49 | D: [toggleDetails, 'Disable / enable details panel'], | 49 | D: [toggleDetails, 'Disable / enable details panel'], |
50 | 50 | ||
51 | - H: [tfs.toggleHosts, 'Toggle host visibility'], | 51 | + H: [toggleHosts, 'Toggle host visibility'], |
52 | - M: [tfs.toggleOffline, 'Toggle offline visibility'], | 52 | + M: [toggleOffline, 'Toggle offline visibility'], |
53 | - P: [tfs.togglePorts, 'Toggle Port Highlighting'], | 53 | + P: [togglePorts, 'Toggle Port Highlighting'], |
54 | dash: [tfs.showBadLinks, 'Show bad links'], | 54 | dash: [tfs.showBadLinks, 'Show bad links'], |
55 | B: [toggleMap, 'Toggle background map'], | 55 | B: [toggleMap, 'Toggle background map'], |
56 | S: [toggleSprites, 'Toggle sprite layer'], | 56 | S: [toggleSprites, 'Toggle sprite layer'], |
... | @@ -109,20 +109,32 @@ | ... | @@ -109,20 +109,32 @@ |
109 | updatePrefsState('detail', tps.toggleDetails(x)); | 109 | updatePrefsState('detail', tps.toggleDetails(x)); |
110 | } | 110 | } |
111 | 111 | ||
112 | - function toggleMap(x) { | 112 | + function toggleHosts(x) { |
113 | - var on = (x === 'keyev') ? !sus.visible(mapG) : !!x, | 113 | + updatePrefsState('hosts', tfs.toggleHosts(x)); |
114 | + } | ||
115 | + | ||
116 | + function toggleOffline(x) { | ||
117 | + updatePrefsState('offdev', tfs.toggleOffline(x)); | ||
118 | + } | ||
119 | + | ||
120 | + function togglePorts(x) { | ||
121 | + updatePrefsState('porthl', tfs.togglePorts(x)); | ||
122 | + } | ||
123 | + | ||
124 | + function _togSvgLayer(x, G, tag, what) { | ||
125 | + var on = (x === 'keyev') ? !sus.visible(G) : !!x, | ||
114 | verb = on ? 'Show' : 'Hide'; | 126 | verb = on ? 'Show' : 'Hide'; |
115 | - sus.visible(mapG, on); | 127 | + sus.visible(G, on); |
116 | - updatePrefsState('bg', on); | 128 | + updatePrefsState(tag, on); |
117 | - flash.flash(verb + ' background map'); | 129 | + flash.flash(verb + ' ' + what); |
130 | + } | ||
131 | + | ||
132 | + function toggleMap(x) { | ||
133 | + _togSvgLayer(x, mapG, 'bg', 'background map'); | ||
118 | } | 134 | } |
119 | 135 | ||
120 | function toggleSprites(x) { | 136 | function toggleSprites(x) { |
121 | - var on = (x === 'keyev') ? !sus.visible(spriteG) : !!x, | 137 | + _togSvgLayer(x, spriteG, 'spr', 'sprite layer'); |
122 | - verb = on ? 'Show' : 'Hide'; | ||
123 | - sus.visible(spriteG, on); | ||
124 | - updatePrefsState('sprites', on); | ||
125 | - flash.flash(verb + ' sprite layer'); | ||
126 | } | 138 | } |
127 | 139 | ||
128 | function resetZoom() { | 140 | function resetZoom() { |
... | @@ -269,7 +281,7 @@ | ... | @@ -269,7 +281,7 @@ |
269 | 281 | ||
270 | function restoreConfigFromPrefs() { | 282 | function restoreConfigFromPrefs() { |
271 | // NOTE: toolbar will have set this for us.. | 283 | // NOTE: toolbar will have set this for us.. |
272 | - prefsState = ps.getPrefs('topo_prefs'); | 284 | + prefsState = ps.asNumbers(ps.getPrefs('topo_prefs')); |
273 | 285 | ||
274 | $log.debug('TOPO---- Prefs State:', prefsState); | 286 | $log.debug('TOPO---- Prefs State:', prefsState); |
275 | 287 | ... | ... |
... | @@ -392,16 +392,24 @@ | ... | @@ -392,16 +392,24 @@ |
392 | return b ? 'visible' : 'hidden'; | 392 | return b ? 'visible' : 'hidden'; |
393 | } | 393 | } |
394 | 394 | ||
395 | - function toggleHosts() { | 395 | + function toggleHosts(x) { |
396 | - showHosts = !showHosts; | 396 | + var kev = (x === 'keyev'), |
397 | + on = kev ? !showHosts : !!x; | ||
398 | + | ||
399 | + showHosts = on; | ||
397 | updateHostVisibility(); | 400 | updateHostVisibility(); |
398 | - flash.flash('Hosts ' + vis(showHosts)); | 401 | + flash.flash('Hosts ' + vis(on)); |
402 | + return on; | ||
399 | } | 403 | } |
400 | 404 | ||
401 | - function toggleOffline() { | 405 | + function toggleOffline(x) { |
402 | - showOffline = !showOffline; | 406 | + var kev = (x === 'keyev'), |
407 | + on = kev ? !showOffline : !!x; | ||
408 | + | ||
409 | + showOffline = on; | ||
403 | updateOfflineVisibility(); | 410 | updateOfflineVisibility(); |
404 | - flash.flash('Offline devices ' + vis(showOffline)); | 411 | + flash.flash('Offline devices ' + vis(on)); |
412 | + return on; | ||
405 | } | 413 | } |
406 | 414 | ||
407 | function cycleDeviceLabels() { | 415 | function cycleDeviceLabels() { | ... | ... |
... | @@ -241,17 +241,20 @@ | ... | @@ -241,17 +241,20 @@ |
241 | 241 | ||
242 | // ====================== | 242 | // ====================== |
243 | 243 | ||
244 | - function togglePorts() { | 244 | + function togglePorts(x) { |
245 | - showPorts = !showPorts; | 245 | + var kev = (x === 'keyev'), |
246 | + on = kev ? !showPorts : !!x, | ||
247 | + what = on ? 'Enable' : 'Disable', | ||
248 | + handler = on ? mouseMoveHandler : null; | ||
246 | 249 | ||
247 | - var what = showPorts ? 'Enable' : 'Disable', | 250 | + showPorts = on; |
248 | - handler = showPorts ? mouseMoveHandler : null; | ||
249 | 251 | ||
250 | - if (!showPorts) { | 252 | + if (!on) { |
251 | enhanceLink(null); | 253 | enhanceLink(null); |
252 | } | 254 | } |
253 | svg.on('mousemove', handler); | 255 | svg.on('mousemove', handler); |
254 | flash.flash(what + ' port highlighting'); | 256 | flash.flash(what + ' port highlighting'); |
257 | + return on; | ||
255 | } | 258 | } |
256 | 259 | ||
257 | function deselectLink() { | 260 | function deselectLink() { | ... | ... |
... | @@ -26,7 +26,7 @@ | ... | @@ -26,7 +26,7 @@ |
26 | var $log, tbs, ps, api; | 26 | var $log, tbs, ps, api; |
27 | 27 | ||
28 | // internal state | 28 | // internal state |
29 | - var toolbar, keyData; | 29 | + var toolbar, keyData, cachedState; |
30 | 30 | ||
31 | // constants | 31 | // constants |
32 | var name = 'topo-tbar', | 32 | var name = 'topo-tbar', |
... | @@ -62,20 +62,26 @@ | ... | @@ -62,20 +62,26 @@ |
62 | 62 | ||
63 | // initial toggle state: default settings and tag to key mapping | 63 | // initial toggle state: default settings and tag to key mapping |
64 | var defaultPrefsState = { | 64 | var defaultPrefsState = { |
65 | - bg: 1, | ||
66 | - sprites: 0, | ||
67 | - insts: 1, | ||
68 | summary: 1, | 65 | summary: 1, |
66 | + insts: 1, | ||
69 | detail: 1, | 67 | detail: 1, |
70 | - hosts: 0 | 68 | + hosts: 0, |
69 | + offdev: 1, | ||
70 | + porthl: 1, | ||
71 | + bg: 1, | ||
72 | + spr: 0, | ||
73 | + toolbar: 1 | ||
71 | }, | 74 | }, |
72 | prefsMap = { | 75 | prefsMap = { |
73 | - bg: 'B', | ||
74 | - sprites: 'S', | ||
75 | - insts: 'I', | ||
76 | summary: 'O', | 76 | summary: 'O', |
77 | - details: 'D', | 77 | + insts: 'I', |
78 | - hosts: 'H' | 78 | + detail: 'D', |
79 | + hosts: 'H', | ||
80 | + offdev: 'M', | ||
81 | + porthl: 'P', | ||
82 | + bg: 'B', | ||
83 | + spr: 'S' | ||
84 | + // NOTE: toolbar state is handled separately | ||
79 | }; | 85 | }; |
80 | 86 | ||
81 | function init(_api_) { | 87 | function init(_api_) { |
... | @@ -90,17 +96,18 @@ | ... | @@ -90,17 +96,18 @@ |
90 | } | 96 | } |
91 | 97 | ||
92 | function setInitToggleState() { | 98 | function setInitToggleState() { |
93 | - var state = ps.getPrefs(cooktag); | 99 | + cachedState = ps.asNumbers(ps.getPrefs(cooktag)); |
94 | - $log.debug('TOOLBAR---- read prefs state:', state); | 100 | + $log.debug('TOOLBAR---- read prefs state:', cachedState); |
95 | 101 | ||
96 | - if (!state) { | 102 | + if (!cachedState) { |
97 | - state = topoDefPrefs(); | 103 | + cachedState = topoDefPrefs(); |
98 | - ps.setPrefs(cooktag, state); | 104 | + ps.setPrefs(cooktag, cachedState); |
99 | - $log.debug('TOOLBAR---- Set default prefs state:', state); | 105 | + $log.debug('TOOLBAR---- Set default prefs state:', cachedState); |
100 | } | 106 | } |
101 | 107 | ||
102 | angular.forEach(prefsMap, function (v, k) { | 108 | angular.forEach(prefsMap, function (v, k) { |
103 | - k2b[v].isel = !!state[k]; | 109 | + var cfg = k2b[v]; |
110 | + cfg && (cfg.isel = !!cachedState[k]); | ||
104 | }); | 111 | }); |
105 | } | 112 | } |
106 | 113 | ||
... | @@ -160,7 +167,11 @@ | ... | @@ -160,7 +167,11 @@ |
160 | addSecondRow(); | 167 | addSecondRow(); |
161 | toolbar.addRow(); | 168 | toolbar.addRow(); |
162 | addThirdRow(); | 169 | addThirdRow(); |
163 | - toolbar.show(); | 170 | + if (cachedState.toolbar) { |
171 | + toolbar.show(); | ||
172 | + } else { | ||
173 | + toolbar.hide(); | ||
174 | + } | ||
164 | } | 175 | } |
165 | 176 | ||
166 | function destroyToolbar() { | 177 | function destroyToolbar() { | ... | ... |
... | @@ -44,13 +44,16 @@ describe('factory: fw/util/prefs.js', function() { | ... | @@ -44,13 +44,16 @@ describe('factory: fw/util/prefs.js', function() { |
44 | 44 | ||
45 | it('should define api functions', function () { | 45 | it('should define api functions', function () { |
46 | expect(fs.areFunctions(ps, [ | 46 | expect(fs.areFunctions(ps, [ |
47 | - 'getPrefs', 'setPrefs' | 47 | + 'getPrefs', 'asNumbers', 'setPrefs' |
48 | ])).toBe(true); | 48 | ])).toBe(true); |
49 | }); | 49 | }); |
50 | 50 | ||
51 | // === Tests for getPrefs() | 51 | // === Tests for getPrefs() |
52 | // TODO unit tests for getPrefs() | 52 | // TODO unit tests for getPrefs() |
53 | 53 | ||
54 | + // === Tests for asNumbers() | ||
55 | + // TODO unit tests for asNumbers() | ||
56 | + | ||
54 | // === Tests for setPrefs() | 57 | // === Tests for setPrefs() |
55 | // TODO unit tests for setPrefs() | 58 | // TODO unit tests for setPrefs() |
56 | 59 | ... | ... |
-
Please register or login to post a comment