홍길동 / onos

Go to a project
Toggle navigation Toggle navigation pinning
Simon Hunt
Committed by Gerrit Code Review
0b41d297 1 parent c4ee7372

FaultManagement: Adding multi-clock glyph to topo overlay. 

- topo overlay buttons updated to use clock/clocks glyphs.
- Alarms nav icon also uses clock glyph.

Change-Id: I4d590c919781e4d11b37f4b8c520fe009653bfbd
Inline Side-by-side
Showing 3 changed files with 173 additions and 133 deletions
...@@ -38,6 +38,8 @@ public class AlarmTableComponent { ...@@ -38,6 +38,8 @@ public class AlarmTableComponent {
38 38
39 private static final String VIEW_ID = "alarmTable"; 39 private static final String VIEW_ID = "alarmTable";
40 private static final String VIEW_TEXT = "Alarms"; 40 private static final String VIEW_TEXT = "Alarms";
41 + // note: we register the alarm icon->glyph mapping in alarmTable.js
42 + private static final String ICON_ID = "nav_alarms";
41 43
42 private final Logger log = LoggerFactory.getLogger(getClass()); 44 private final Logger log = LoggerFactory.getLogger(getClass());
43 45
...@@ -46,7 +48,7 @@ public class AlarmTableComponent { ...@@ -46,7 +48,7 @@ public class AlarmTableComponent {
46 48
47 // List of application views 49 // List of application views
48 private final List<UiView> uiViews = ImmutableList.of( 50 private final List<UiView> uiViews = ImmutableList.of(
49 - new UiView(UiView.Category.OTHER, VIEW_ID, VIEW_TEXT) 51 + new UiView(UiView.Category.OTHER, VIEW_ID, VIEW_TEXT, ICON_ID)
50 ); 52 );
51 53
52 // Factory for UI message handlers 54 // Factory for UI message handlers
......
...@@ -44,114 +44,121 @@ ...@@ -44,114 +44,121 @@
44 } 44 }
45 45
46 angular.module('ovAlarmTable', []) 46 angular.module('ovAlarmTable', [])
47 - .controller('OvAlarmTableCtrl', 47 + .run(['IconService', function (is) {
48 - ['$log', '$scope', '$location', 'TableBuilderService', 48 + // we want to be able to re-use the clock glyph in our nav icon...
49 - 'FnService', 'WebSocketService', 49 + is.registerIconMapping('nav_alarms', 'alarmsTopo-overlay-clock');
50 - function (_$log_, _$scope_, _$location_, tbs, _fs_, _wss_) { 50 + }])
51 - var params; 51 +
52 - 52 + .controller('OvAlarmTableCtrl',
53 - $log = _$log_; 53 + ['$log', '$scope', '$location', 'TableBuilderService',
54 - $scope = _$scope_; 54 + 'FnService', 'WebSocketService',
55 - $loc = _$location_; 55 +
56 - 56 + function (_$log_, _$scope_, _$location_, tbs, _fs_, _wss_) {
57 - fs = _fs_; 57 + var params;
58 - wss = _wss_; 58 +
59 - 59 + $log = _$log_;
60 - 60 + $scope = _$scope_;
61 - params = $loc.search(); 61 + $loc = _$location_;
62 - if (params.hasOwnProperty('devId')) { 62 +
63 - $scope.devId = params['devId']; 63 + fs = _fs_;
64 - } 64 + wss = _wss_;
65 - 65 +
66 - var handlers = {}; 66 + params = $loc.search();
67 - $scope.panelDetails = {}; 67 + if (params.hasOwnProperty('devId')) {
68 - 68 + $scope.devId = params['devId'];
69 - // details response handler 69 + }
70 - handlers[detailsResp] = respDetailsCb; 70 +
71 - wss.bindHandlers(handlers); 71 + var handlers = {};
72 - 72 + $scope.panelDetails = {};
73 - // custom selection callback 73 +
74 - function selCb($event, row) { 74 + // details response handler
75 - $log.debug("selCb row=" + JSON.stringify(row, null, 4) + 75 + handlers[detailsResp] = respDetailsCb;
76 - ", $event=" + JSON.stringify($event, null, 4)); 76 + wss.bindHandlers(handlers);
77 - $log.debug('$scope.selId=', $scope.selId); 77 +
78 - if ($scope.selId) { 78 + // custom selection callback
79 - $log.debug('send'); 79 + function selCb($event, row) {
80 - wss.sendEvent(detailsReq, {id: row.id}); 80 + $log.debug("selCb row=" + JSON.stringify(row, null, 4) +
81 - } else { 81 + ", $event=" + JSON.stringify($event, null, 4));
82 - $log.debug('hidePanel'); 82 + $log.debug('$scope.selId=', $scope.selId);
83 - $scope.hidePanel(); 83 + if ($scope.selId) {
84 - } 84 + $log.debug('send');
85 - $log.debug('Got a click on:', row); 85 + wss.sendEvent(detailsReq, {id: row.id});
86 - } 86 + } else {
87 - 87 + $log.debug('hidePanel');
88 - // TableBuilderService creating a table for us 88 + $scope.hidePanel();
89 - tbs.buildTable({ 89 + }
90 - scope: $scope, 90 + $log.debug('Got a click on:', row);
91 - tag: 'alarmTable', 91 + }
92 - selCb: selCb, 92 +
93 - query: params 93 + // TableBuilderService creating a table for us
94 - }); 94 + tbs.buildTable({
95 - 95 + scope: $scope,
96 - // cleanup 96 + tag: 'alarmTable',
97 - $scope.$on('$destroy', function () { 97 + selCb: selCb,
98 - wss.unbindHandlers(handlers); 98 + query: params
99 - $log.log('OvAlarmTableCtrl has been destroyed'); 99 + });
100 - }); 100 +
101 - 101 + // cleanup
102 - $log.log('OvAlarmTableCtrl has been created'); 102 + $scope.$on('$destroy', function () {
103 - }]) 103 + wss.unbindHandlers(handlers);
104 - 104 + $log.log('OvAlarmTableCtrl has been destroyed');
105 - .directive('ovAlarmTableItemDetailsPanel', ['PanelService', 'KeyService', 105 + });
106 - function (ps, ks) { 106 +
107 - return { 107 + $log.log('OvAlarmTableCtrl has been created');
108 - restrict: 'E', 108 + }])
109 - link: function (scope, element, attrs) { 109 +
110 - // insert details panel with PanelService 110 + .directive('ovAlarmTableItemDetailsPanel',
111 - // create the panel 111 + ['PanelService', 'KeyService',
112 - var panel = ps.createPanel(pName, { 112 +
113 - width: 400, 113 + function (ps, ks) {
114 - margin: 20, 114 + return {
115 - hideMargin: 0 115 + restrict: 'E',
116 - }); 116 + link: function (scope, element, attrs) {
117 + // insert details panel with PanelService
118 + // create the panel
119 + var panel = ps.createPanel(pName, {
120 + width: 400,
121 + margin: 20,
122 + hideMargin: 0
123 + });
124 + panel.hide();
125 + scope.hidePanel = function () {
117 panel.hide(); 126 panel.hide();
118 - scope.hidePanel = function () { 127 + };
128 +
129 + function closePanel() {
130 + if (panel.isVisible()) {
131 + $scope.selId = null;
119 panel.hide(); 132 panel.hide();
120 - }; 133 + return true;
121 -
122 - function closePanel() {
123 - if (panel.isVisible()) {
124 - $scope.selId = null;
125 - panel.hide();
126 - return true;
127 - }
128 - return false;
129 } 134 }
130 - 135 + return false;
131 - // create key bindings to handle panel
132 - ks.keyBindings({
133 - esc: [closePanel, 'Close the details panel'],
134 - _helpFormat: ['esc']
135 - });
136 - ks.gestureNotes([
137 - ['click', 'Select a row to show item details']
138 - ]);
139 -
140 - // update the panel's contents when the data is changed
141 - scope.$watch('panelDetails', function () {
142 - if (!fs.isEmptyObject(scope.panelDetails)) {
143 - panel.empty();
144 - populatePanel(panel);
145 - panel.show();
146 - }
147 - });
148 -
149 - // cleanup on destroyed scope
150 - scope.$on('$destroy', function () {
151 - ks.unbindKeys();
152 - ps.destroyPanel(pName);
153 - });
154 } 136 }
155 - }; 137 +
156 - }]); 138 + // create key bindings to handle panel
139 + ks.keyBindings({
140 + esc: [closePanel, 'Close the details panel'],
141 + _helpFormat: ['esc']
142 + });
143 + ks.gestureNotes([
144 + ['click', 'Select a row to show item details']
145 + ]);
146 +
147 + // update the panel's contents when the data is changed
148 + scope.$watch('panelDetails', function () {
149 + if (!fs.isEmptyObject(scope.panelDetails)) {
150 + panel.empty();
151 + populatePanel(panel);
152 + panel.show();
153 + }
154 + });
155 +
156 + // cleanup on destroyed scope
157 + scope.$on('$destroy', function () {
158 + ks.unbindKeys();
159 + ps.destroyPanel(pName);
160 + });
161 + }
162 + };
163 + }]);
157 }()); 164 }());
......
...@@ -11,7 +11,9 @@ ...@@ -11,7 +11,9 @@
11 11
12 // internal state should be kept in the service module (not here) 12 // internal state should be kept in the service module (not here)
13 13
14 - // alarm clock glyph (vbox 110x110) 14 + var viewbox = '0 0 110 110';
15 +
16 + // alarm clock glyph (view box 110x110)
15 var clock = 'M92.9,61.3a39,39,0,1,1-39-39,39,39,0,0,1,39,39h0Z' + 17 var clock = 'M92.9,61.3a39,39,0,1,1-39-39,39,39,0,0,1,39,39h0Z' +
16 'M44,19.3c-4.4-7.4-14.8-9.3-23.2-4.2S9.1,30.2,13.5,37.6m80.8,0' + 18 'M44,19.3c-4.4-7.4-14.8-9.3-23.2-4.2S9.1,30.2,13.5,37.6m80.8,0' +
17 'c4.4-7.4,1.2-17.5-7.3-22.5s-18.8-3.2-23.3,4.2m-8.4,1.8V16.5h4.4' + 19 'c4.4-7.4,1.2-17.5-7.3-22.5s-18.8-3.2-23.3,4.2m-8.4,1.8V16.5h4.4' +
...@@ -24,6 +26,43 @@ ...@@ -24,6 +26,43 @@
24 'h0.2c2.6,0.4,10.7.9,10.3-1.2m-60.8,0c-0.4,2.1,7.7,1.6,10.3,1.2' + 26 'h0.2c2.6,0.4,10.7.9,10.3-1.2m-60.8,0c-0.4,2.1,7.7,1.6,10.3,1.2' +
25 'h0.2a0.6,0.6,0,0,0,.2-0.8l-1.2-2.1-0.2-.2-7.1-5.3'; 27 'h0.2a0.6,0.6,0,0,0,.2-0.8l-1.2-2.1-0.2-.2-7.1-5.3';
26 28
29 + // overlapping alarm clocks glyph (view box 110x110)
30 + var clocks = "M65.7,26.6A34.7,34.7,0,0,0,31,61.5c0,19,16,35.2,35.5,34.8" +
31 + "a35.1,35.1,0,0,0,34-35.1A34.7,34.7,0,0,0,65.7,26.6Z" +
32 + "m8.6-2.7,27.4,16.4a31.3,31.3,0,0,0,1.2-3.1c1.3-5,0-9.4-3.2-13.2" +
33 + "a16.9,16.9,0,0,0-16-6.2A12.8,12.8,0,0,0,74.3,23.9Z" +
34 + "M57,23.9L56.4,23a12.9,12.9,0,0,0-10.7-5.5,16.9,16.9,0,0,0-15.1,8," +
35 + "14.1,14.1,0,0,0-2.3,11.2,10.4,10.4,0,0,0,1.4,3.5Z" +
36 + "M26.9,31.6A33.7,33.7,0,0,0,9.7,59.3C9.2,72.8,14.9,83.1,26,90.7l1-1.9" +
37 + "a0.6,0.6,0,0,0-.2-1A34.2,34.2,0,0,1,15.5,50.4" +
38 + "a33.8,33.8,0,0,1,10.8-16,1.2,1.2,0,0,0,.5-0.6" +
39 + "C26.9,33.1,26.9,32.4,26.9,31.6Z" +
40 + "m1,8.1C14.6,55.9,19.2,81,37.6,91.1l1-2.3-2.8-2.4" +
41 + "C26.4,77.6,22.9,66.7,25.1,54" +
42 + "a31.6,31.6,0,0,1,4.2-10.8,0.8,0.8,0,0,0,.1-0.6Z" +
43 + "M12,38.4a11.2,11.2,0,0,1-1.4-5.8A13.7,13.7,0,0,1,14.3,24" +
44 + "a17.3,17.3,0,0,1,10.5-5.7h0.4C19,18,13.7,20,9.9,25.2" +
45 + "a14.5,14.5,0,0,0-3,11,11.2,11.2,0,0,0,1.6,4.3Z" +
46 + "m5.5-2.7L21,33" +
47 + "a1,1,0,0,0,.3-0.7,14,14,0,0,1,3.9-8.6,17.3,17.3,0,0,1,10.2-5.4" +
48 + "l0.6-.2C24.4,17.3,16.4,27,17.4,35.7Z" +
49 + "M70.9,17.2H60.7v4.1h4v4.2H67V21.3h3.9V17.2Z" +
50 + "M90.9,87.9l-0.5.3L86,91.5a7.9,7.9,0,0,0-2.6,3.1" +
51 + "c-0.3.6-.2,0.8,0.5,0.9a27.9,27.9,0,0,0,6.8.2l1.6-.4" +
52 + "a0.8,0.8,0,0,0,.6-1.2l-0.4-1.4Z" +
53 + "m-50.2,0-1.8,6c-0.3,1.1-.1,1.4.9,1.7h0.7a26.3,26.3,0,0,0,7.2-.1" +
54 + "c0.8-.1.9-0.4,0.5-1.1a8.2,8.2,0,0,0-2.7-3.1Z" +
55 + "m-10.8-.4-0.2.6L28,93.5a0.9,0.9,0,0,0,.7,1.3,7.7,7.7,0,0,0,2.2.4" +
56 + "l5.9-.2c0.5,0,.7-0.3.5-0.8a7.6,7.6,0,0,0-2.2-2.9Z" +
57 + "m-11.3,0-0.2.7-1.6,5.4c-0.2.8-.1,1.2,0.7,1.4a8,8,0,0,0,2.2.4l6-.2" +
58 + "c0.4,0,.7-0.3.5-0.6a7.1,7.1,0,0,0-1.9-2.7l-2.8-2.1Z" +
59 + "M65.7,26.6m-2,30.3a4.4,4.4,0,0,0-2.2,2,4.8,4.8,0,0,0,4,7.2," +
60 + "4.1,4.1,0,0,0,4.3-2.3,0.8,0.8,0,0,1,.8-0.5H84.1" +
61 + "a1.9,1.9,0,0,0,2-1.7,2.1,2.1,0,0,0-1.7-2.2H70.8" +
62 + "a1,1,0,0,1-1-.5,6.4,6.4,0,0,0-1.5-1.6,1.1,1.1,0,0,1-.5-1" +
63 + "q0-10.1,0-20.3a1.9,1.9,0,0,0-2.2-2.1,2.1,2.1,0,0,0-1.8,2.2" +
64 + "q0,6.1,0,12.2C63.7,51.2,63.7,54,63.7,56.9Z";
65 +
27 // our overlay definition 66 // our overlay definition
28 var overlay = { 67 var overlay = {
29 // NOTE: this must match the ID defined in AppUiTopovOverlay 68 // NOTE: this must match the ID defined in AppUiTopovOverlay
...@@ -31,23 +70,17 @@ ...@@ -31,23 +70,17 @@
31 glyphId: '*clock', 70 glyphId: '*clock',
32 tooltip: 'Alarms Overlay', 71 tooltip: 'Alarms Overlay',
33 // These glyphs get installed using the overlayId as a prefix. 72 // These glyphs get installed using the overlayId as a prefix.
34 - // e.g. 'star4' is installed as 'alarmsTopo-overlay-star4' 73 + // e.g. 'clock' is installed as 'alarmsTopo-overlay-clock'
35 - // They can be referenced (from this overlay) as '*star4' 74 + // They can be referenced (from this overlay) as '*clock'
36 // That is, the '*' prefix stands in for 'alarmsTopo-overlay-' 75 // That is, the '*' prefix stands in for 'alarmsTopo-overlay-'
37 glyphs: { 76 glyphs: {
38 clock: { 77 clock: {
39 - vb: '0 0 110 110', 78 + vb: viewbox,
40 d: clock 79 d: clock
41 }, 80 },
42 - star4: { 81 + clocks: {
43 - vb: '0 0 8 8', 82 + vb: viewbox,
44 - // TODO new icon needed 83 + d: clocks
45 - d: 'M1,4l2,-1l1,-2l1,2l2,1l-2,1l-1,2l-1,-2z'
46 - },
47 - banner: {
48 - vb: '0 0 6 6',
49 - // TODO new icon needed
50 - d: 'M1,1v4l2,-2l2,2v-4z'
51 } 84 }
52 }, 85 },
53 activate: function () { 86 activate: function () {
...@@ -60,21 +93,19 @@ ...@@ -60,21 +93,19 @@
60 // detail panel button definitions 93 // detail panel button definitions
61 buttons: { 94 buttons: {
62 alarm1button: { 95 alarm1button: {
63 - gid: 'chain', 96 + gid: '*clock',
64 tt: 'Show alarms for this device', 97 tt: 'Show alarms for this device',
65 cb: function (data) { 98 cb: function (data) {
66 $log.debug('Show alarms for selected device. data:', data); 99 $log.debug('Show alarms for selected device. data:', data);
67 ns.navTo("alarmTable", {devId: data.id}); 100 ns.navTo("alarmTable", {devId: data.id});
68 -
69 } 101 }
70 }, 102 },
71 alarm2button: { 103 alarm2button: {
72 - gid: '*banner', 104 + gid: '*clocks',
73 tt: 'Show alarms for all devices', 105 tt: 'Show alarms for all devices',
74 cb: function (data) { 106 cb: function (data) {
75 $log.debug('Show alarms for all devices. data:', data); 107 $log.debug('Show alarms for all devices. data:', data);
76 ns.navTo("alarmTable"); 108 ns.navTo("alarmTable");
77 -
78 } 109 }
79 } 110 }
80 }, 111 },
...@@ -93,7 +124,7 @@ ...@@ -93,7 +124,7 @@
93 stds.startDisplay('mouse'); 124 stds.startDisplay('mouse');
94 }, 125 },
95 tt: 'Start Alarm Count on Device', 126 tt: 'Start Alarm Count on Device',
96 - gid: '*banner' 127 + gid: '*clock'
97 }, 128 },
98 _keyOrder: [ 129 _keyOrder: [
99 '0', 'V' 130 '0', 'V'
...@@ -141,13 +172,13 @@ ...@@ -141,13 +172,13 @@
141 172
142 // invoke code to register with the overlay service 173 // invoke code to register with the overlay service
143 angular.module('ovAlarmTopov') 174 angular.module('ovAlarmTopov')
144 - .run(['$log', 'TopoOverlayService', 'AlarmTopovDemoService', 'NavService', 175 + .run(['$log', 'TopoOverlayService', 'AlarmTopovDemoService', 'NavService',
145 - function (_$log_, _tov_, _stds_, _ns_) { 176 + function (_$log_, _tov_, _stds_, _ns_) {
146 - $log = _$log_; 177 + $log = _$log_;
147 - tov = _tov_; 178 + tov = _tov_;
148 - stds = _stds_; 179 + stds = _stds_;
149 - ns = _ns_; 180 + ns = _ns_;
150 - tov.register(overlay); 181 + tov.register(overlay);
151 - }]); 182 + }]);
152 183
153 }()); 184 }());
......