kmcpeake | b172d5f | 2015-12-10 11:30:43 +0000 | [diff] [blame] | 1 | // js for alarm app table view |
| 2 | (function () { |
| 3 | 'use strict'; |
| 4 | |
| 5 | // injected refs |
| 6 | var $log, $scope, $loc, devId, fs, wss; |
| 7 | |
| 8 | // constants |
| 9 | var detailsReq = 'alarmTableDetailsRequest', |
| 10 | detailsResp = 'alarmTableDetailsResponse', |
| 11 | pName = 'ov-alarm-table-item-details-panel', |
Simon Hunt | 239f09e | 2017-05-18 13:10:09 -0700 | [diff] [blame] | 12 | propOrder = [ |
| 13 | 'id', 'alarmDeviceId', 'alarmDesc', 'alarmSource', |
| 14 | 'alarmTimeRaised', 'alarmTimeUpdated', 'alarmTimeCleared', |
| 15 | 'alarmSeverity' |
| 16 | ], |
| 17 | friendlyProps = [ |
| 18 | 'Alarm Id', 'Device Id', 'Description', 'Source', |
| 19 | 'Time Raised', 'Time Updated', 'Time Cleared', 'Severity' |
| 20 | ]; |
kmcpeake | b172d5f | 2015-12-10 11:30:43 +0000 | [diff] [blame] | 21 | |
| 22 | |
| 23 | function addProp(tbody, index, value) { |
| 24 | var tr = tbody.append('tr'); |
| 25 | |
| 26 | function addCell(cls, txt) { |
Simon Hunt | 239f09e | 2017-05-18 13:10:09 -0700 | [diff] [blame] | 27 | tr.append('td').attr('class', cls).text(txt); |
kmcpeake | b172d5f | 2015-12-10 11:30:43 +0000 | [diff] [blame] | 28 | } |
| 29 | addCell('label', friendlyProps[index] + ' :'); |
| 30 | addCell('value', value); |
| 31 | } |
| 32 | |
| 33 | function populatePanel(panel) { |
| 34 | var title = panel.append('h3'), |
| 35 | tbody = panel.append('table').append('tbody'); |
| 36 | |
| 37 | title.text('Alarm Details'); |
| 38 | |
| 39 | propOrder.forEach(function (prop, i) { |
| 40 | addProp(tbody, i, $scope.panelDetails[prop]); |
| 41 | }); |
| 42 | |
| 43 | panel.append('hr'); |
| 44 | panel.append('h4').text('Comments'); |
| 45 | panel.append('p').text($scope.panelDetails.comment); |
| 46 | } |
| 47 | |
| 48 | function respDetailsCb(data) { |
| 49 | $scope.panelDetails = data.details; |
| 50 | $scope.$apply(); |
| 51 | } |
| 52 | |
| 53 | angular.module('ovAlarmTable', []) |
Simon Hunt | 0b41d29 | 2016-02-02 15:07:57 -0800 | [diff] [blame] | 54 | .run(['IconService', function (is) { |
| 55 | // we want to be able to re-use the clock glyph in our nav icon... |
| 56 | is.registerIconMapping('nav_alarms', 'alarmsTopo-overlay-clock'); |
| 57 | }]) |
kmcpeake | b172d5f | 2015-12-10 11:30:43 +0000 | [diff] [blame] | 58 | |
Simon Hunt | 0b41d29 | 2016-02-02 15:07:57 -0800 | [diff] [blame] | 59 | .controller('OvAlarmTableCtrl', |
| 60 | ['$log', '$scope', '$location', 'TableBuilderService', |
| 61 | 'FnService', 'WebSocketService', |
kmcpeake | b172d5f | 2015-12-10 11:30:43 +0000 | [diff] [blame] | 62 | |
Simon Hunt | 0b41d29 | 2016-02-02 15:07:57 -0800 | [diff] [blame] | 63 | function (_$log_, _$scope_, _$location_, tbs, _fs_, _wss_) { |
| 64 | var params; |
kmcpeake | b172d5f | 2015-12-10 11:30:43 +0000 | [diff] [blame] | 65 | |
Simon Hunt | 0b41d29 | 2016-02-02 15:07:57 -0800 | [diff] [blame] | 66 | $log = _$log_; |
| 67 | $scope = _$scope_; |
| 68 | $loc = _$location_; |
kmcpeake | b172d5f | 2015-12-10 11:30:43 +0000 | [diff] [blame] | 69 | |
Simon Hunt | 0b41d29 | 2016-02-02 15:07:57 -0800 | [diff] [blame] | 70 | fs = _fs_; |
| 71 | wss = _wss_; |
kmcpeake | b172d5f | 2015-12-10 11:30:43 +0000 | [diff] [blame] | 72 | |
Simon Hunt | 0b41d29 | 2016-02-02 15:07:57 -0800 | [diff] [blame] | 73 | params = $loc.search(); |
| 74 | if (params.hasOwnProperty('devId')) { |
| 75 | $scope.devId = params['devId']; |
| 76 | } |
kmcpeake | b172d5f | 2015-12-10 11:30:43 +0000 | [diff] [blame] | 77 | |
Simon Hunt | 0b41d29 | 2016-02-02 15:07:57 -0800 | [diff] [blame] | 78 | var handlers = {}; |
| 79 | $scope.panelDetails = {}; |
kmcpeake | b172d5f | 2015-12-10 11:30:43 +0000 | [diff] [blame] | 80 | |
Simon Hunt | 0b41d29 | 2016-02-02 15:07:57 -0800 | [diff] [blame] | 81 | // details response handler |
| 82 | handlers[detailsResp] = respDetailsCb; |
| 83 | wss.bindHandlers(handlers); |
kmcpeake | b172d5f | 2015-12-10 11:30:43 +0000 | [diff] [blame] | 84 | |
Simon Hunt | 0b41d29 | 2016-02-02 15:07:57 -0800 | [diff] [blame] | 85 | // custom selection callback |
| 86 | function selCb($event, row) { |
| 87 | $log.debug("selCb row=" + JSON.stringify(row, null, 4) + |
| 88 | ", $event=" + JSON.stringify($event, null, 4)); |
| 89 | $log.debug('$scope.selId=', $scope.selId); |
| 90 | if ($scope.selId) { |
| 91 | $log.debug('send'); |
| 92 | wss.sendEvent(detailsReq, {id: row.id}); |
| 93 | } else { |
| 94 | $log.debug('hidePanel'); |
| 95 | $scope.hidePanel(); |
| 96 | } |
| 97 | $log.debug('Got a click on:', row); |
| 98 | } |
kmcpeake | b172d5f | 2015-12-10 11:30:43 +0000 | [diff] [blame] | 99 | |
Simon Hunt | 0b41d29 | 2016-02-02 15:07:57 -0800 | [diff] [blame] | 100 | // TableBuilderService creating a table for us |
| 101 | tbs.buildTable({ |
| 102 | scope: $scope, |
| 103 | tag: 'alarmTable', |
| 104 | selCb: selCb, |
| 105 | query: params |
| 106 | }); |
kmcpeake | b172d5f | 2015-12-10 11:30:43 +0000 | [diff] [blame] | 107 | |
Simon Hunt | 0b41d29 | 2016-02-02 15:07:57 -0800 | [diff] [blame] | 108 | // cleanup |
| 109 | $scope.$on('$destroy', function () { |
| 110 | wss.unbindHandlers(handlers); |
| 111 | $log.log('OvAlarmTableCtrl has been destroyed'); |
| 112 | }); |
kmcpeake | b172d5f | 2015-12-10 11:30:43 +0000 | [diff] [blame] | 113 | |
Simon Hunt | 0b41d29 | 2016-02-02 15:07:57 -0800 | [diff] [blame] | 114 | $log.log('OvAlarmTableCtrl has been created'); |
| 115 | }]) |
| 116 | |
| 117 | .directive('ovAlarmTableItemDetailsPanel', |
| 118 | ['PanelService', 'KeyService', |
| 119 | |
| 120 | function (ps, ks) { |
| 121 | return { |
| 122 | restrict: 'E', |
| 123 | link: function (scope, element, attrs) { |
| 124 | // insert details panel with PanelService |
| 125 | // create the panel |
| 126 | var panel = ps.createPanel(pName, { |
| 127 | width: 400, |
| 128 | margin: 20, |
| 129 | hideMargin: 0 |
| 130 | }); |
| 131 | panel.hide(); |
| 132 | scope.hidePanel = function () { |
kmcpeake | b172d5f | 2015-12-10 11:30:43 +0000 | [diff] [blame] | 133 | panel.hide(); |
Simon Hunt | 0b41d29 | 2016-02-02 15:07:57 -0800 | [diff] [blame] | 134 | }; |
| 135 | |
| 136 | function closePanel() { |
| 137 | if (panel.isVisible()) { |
| 138 | $scope.selId = null; |
kmcpeake | b172d5f | 2015-12-10 11:30:43 +0000 | [diff] [blame] | 139 | panel.hide(); |
Simon Hunt | 0b41d29 | 2016-02-02 15:07:57 -0800 | [diff] [blame] | 140 | return true; |
kmcpeake | b172d5f | 2015-12-10 11:30:43 +0000 | [diff] [blame] | 141 | } |
Simon Hunt | 0b41d29 | 2016-02-02 15:07:57 -0800 | [diff] [blame] | 142 | return false; |
kmcpeake | b172d5f | 2015-12-10 11:30:43 +0000 | [diff] [blame] | 143 | } |
Simon Hunt | 0b41d29 | 2016-02-02 15:07:57 -0800 | [diff] [blame] | 144 | |
| 145 | // create key bindings to handle panel |
| 146 | ks.keyBindings({ |
| 147 | esc: [closePanel, 'Close the details panel'], |
| 148 | _helpFormat: ['esc'] |
| 149 | }); |
| 150 | ks.gestureNotes([ |
| 151 | ['click', 'Select a row to show item details'] |
| 152 | ]); |
| 153 | |
| 154 | // update the panel's contents when the data is changed |
| 155 | scope.$watch('panelDetails', function () { |
| 156 | if (!fs.isEmptyObject(scope.panelDetails)) { |
| 157 | panel.empty(); |
| 158 | populatePanel(panel); |
| 159 | panel.show(); |
| 160 | } |
| 161 | }); |
| 162 | |
| 163 | // cleanup on destroyed scope |
| 164 | scope.$on('$destroy', function () { |
| 165 | ks.unbindKeys(); |
| 166 | ps.destroyPanel(pName); |
| 167 | }); |
| 168 | } |
| 169 | }; |
| 170 | }]); |
kmcpeake | b172d5f | 2015-12-10 11:30:43 +0000 | [diff] [blame] | 171 | }()); |