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', |
| 12 | propOrder = ['id', 'alarmDeviceId', 'alarmDesc', 'alarmSource', 'alarmTimeRaised', 'alarmTimeUpdated', 'alarmTimeCleared', 'alarmSeverity'], |
| 13 | friendlyProps = ['Alarm Id', 'Device Id', 'Description', 'Source', 'Time Raised', 'Time Updated', 'Time Cleared', 'Severity']; |
| 14 | |
| 15 | |
| 16 | function addProp(tbody, index, value) { |
| 17 | var tr = tbody.append('tr'); |
| 18 | |
| 19 | function addCell(cls, txt) { |
| 20 | tr.append('td').attr('class', cls).html(txt); |
| 21 | } |
| 22 | addCell('label', friendlyProps[index] + ' :'); |
| 23 | addCell('value', value); |
| 24 | } |
| 25 | |
| 26 | function populatePanel(panel) { |
| 27 | var title = panel.append('h3'), |
| 28 | tbody = panel.append('table').append('tbody'); |
| 29 | |
| 30 | title.text('Alarm Details'); |
| 31 | |
| 32 | propOrder.forEach(function (prop, i) { |
| 33 | addProp(tbody, i, $scope.panelDetails[prop]); |
| 34 | }); |
| 35 | |
| 36 | panel.append('hr'); |
| 37 | panel.append('h4').text('Comments'); |
| 38 | panel.append('p').text($scope.panelDetails.comment); |
| 39 | } |
| 40 | |
| 41 | function respDetailsCb(data) { |
| 42 | $scope.panelDetails = data.details; |
| 43 | $scope.$apply(); |
| 44 | } |
| 45 | |
| 46 | angular.module('ovAlarmTable', []) |
| 47 | .controller('OvAlarmTableCtrl', |
| 48 | ['$log', '$scope', '$location', 'TableBuilderService', |
| 49 | 'FnService', 'WebSocketService', |
| 50 | function (_$log_, _$scope_, _$location_, tbs, _fs_, _wss_) { |
| 51 | var params; |
| 52 | |
| 53 | $log = _$log_; |
| 54 | $scope = _$scope_; |
| 55 | $loc = _$location_; |
| 56 | |
| 57 | fs = _fs_; |
| 58 | wss = _wss_; |
| 59 | |
| 60 | |
| 61 | params = $loc.search(); |
| 62 | if (params.hasOwnProperty('devId')) { |
| 63 | $scope.devId = params['devId']; |
| 64 | } |
| 65 | |
| 66 | var handlers = {}; |
| 67 | $scope.panelDetails = {}; |
| 68 | |
| 69 | // details response handler |
| 70 | handlers[detailsResp] = respDetailsCb; |
| 71 | wss.bindHandlers(handlers); |
| 72 | |
| 73 | // custom selection callback |
| 74 | function selCb($event, row) { |
| 75 | $log.debug("selCb row=" + JSON.stringify(row, null, 4) + |
| 76 | ", $event=" + JSON.stringify($event, null, 4)); |
| 77 | $log.debug('$scope.selId=', $scope.selId); |
| 78 | if ($scope.selId) { |
| 79 | $log.debug('send'); |
| 80 | wss.sendEvent(detailsReq, {id: row.id}); |
| 81 | } else { |
| 82 | $log.debug('hidePanel'); |
| 83 | $scope.hidePanel(); |
| 84 | } |
| 85 | $log.debug('Got a click on:', row); |
| 86 | } |
| 87 | |
| 88 | // TableBuilderService creating a table for us |
| 89 | tbs.buildTable({ |
| 90 | scope: $scope, |
| 91 | tag: 'alarmTable', |
| 92 | selCb: selCb, |
| 93 | query: params |
| 94 | }); |
| 95 | |
| 96 | // cleanup |
| 97 | $scope.$on('$destroy', function () { |
| 98 | wss.unbindHandlers(handlers); |
| 99 | $log.log('OvAlarmTableCtrl has been destroyed'); |
| 100 | }); |
| 101 | |
| 102 | $log.log('OvAlarmTableCtrl has been created'); |
| 103 | }]) |
| 104 | |
| 105 | .directive('ovAlarmTableItemDetailsPanel', ['PanelService', 'KeyService', |
| 106 | function (ps, ks) { |
| 107 | return { |
| 108 | restrict: 'E', |
| 109 | link: function (scope, element, attrs) { |
| 110 | // insert details panel with PanelService |
| 111 | // create the panel |
| 112 | var panel = ps.createPanel(pName, { |
| 113 | width: 400, |
| 114 | margin: 20, |
| 115 | hideMargin: 0 |
| 116 | }); |
| 117 | panel.hide(); |
| 118 | scope.hidePanel = function () { |
| 119 | panel.hide(); |
| 120 | }; |
| 121 | |
| 122 | function closePanel() { |
| 123 | if (panel.isVisible()) { |
| 124 | $scope.selId = null; |
| 125 | panel.hide(); |
| 126 | return true; |
| 127 | } |
| 128 | return false; |
| 129 | } |
| 130 | |
| 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 | } |
| 155 | }; |
| 156 | }]); |
| 157 | }()); |