Simon Hunt | 84f4c2a | 2015-09-23 17:52:45 -0700 | [diff] [blame^] | 1 | // js for sample app table view |
Thomas Vachuska | a2ae422 | 2015-04-29 18:42:09 -0700 | [diff] [blame] | 2 | (function () { |
| 3 | 'use strict'; |
| 4 | |
Simon Hunt | e11ce5a | 2015-07-21 12:11:04 -0700 | [diff] [blame] | 5 | // injected refs |
Simon Hunt | 84f4c2a | 2015-09-23 17:52:45 -0700 | [diff] [blame^] | 6 | var $log, $scope, fs, wss; |
Simon Hunt | e11ce5a | 2015-07-21 12:11:04 -0700 | [diff] [blame] | 7 | |
| 8 | // constants |
Simon Hunt | 84f4c2a | 2015-09-23 17:52:45 -0700 | [diff] [blame^] | 9 | var detailsReq = 'sampleTableDetailsRequest', |
| 10 | detailsResp = 'sampleTableDetailsResponse', |
| 11 | pName = 'ov-sample-table-item-details-panel', |
Simon Hunt | e11ce5a | 2015-07-21 12:11:04 -0700 | [diff] [blame] | 12 | |
Bri Prebilic Cole | 68844ba | 2015-07-22 15:41:37 -0700 | [diff] [blame] | 13 | propOrder = ['id', 'label', 'code'], |
| 14 | friendlyProps = ['Item ID', 'Item Label', 'Special Code']; |
Simon Hunt | e11ce5a | 2015-07-21 12:11:04 -0700 | [diff] [blame] | 15 | |
| 16 | |
Bri Prebilic Cole | 68844ba | 2015-07-22 15:41:37 -0700 | [diff] [blame] | 17 | function addProp(tbody, index, value) { |
| 18 | var tr = tbody.append('tr'); |
| 19 | |
| 20 | function addCell(cls, txt) { |
| 21 | tr.append('td').attr('class', cls).html(txt); |
| 22 | } |
| 23 | addCell('label', friendlyProps[index] + ' :'); |
| 24 | addCell('value', value); |
| 25 | } |
| 26 | |
| 27 | function populatePanel(panel) { |
| 28 | var title = panel.append('h3'), |
| 29 | tbody = panel.append('table').append('tbody'); |
| 30 | |
| 31 | title.text('Item Details'); |
| 32 | |
| 33 | propOrder.forEach(function (prop, i) { |
| 34 | addProp(tbody, i, $scope.panelDetails[prop]); |
| 35 | }); |
| 36 | |
| 37 | panel.append('hr'); |
| 38 | panel.append('h4').text('Comments'); |
| 39 | panel.append('p').text($scope.panelDetails.comment); |
| 40 | } |
| 41 | |
Simon Hunt | e11ce5a | 2015-07-21 12:11:04 -0700 | [diff] [blame] | 42 | function respDetailsCb(data) { |
Bri Prebilic Cole | 68844ba | 2015-07-22 15:41:37 -0700 | [diff] [blame] | 43 | $scope.panelDetails = data.details; |
Simon Hunt | e11ce5a | 2015-07-21 12:11:04 -0700 | [diff] [blame] | 44 | $scope.$apply(); |
| 45 | } |
| 46 | |
Simon Hunt | 84f4c2a | 2015-09-23 17:52:45 -0700 | [diff] [blame^] | 47 | angular.module('ovSampleTable', []) |
| 48 | .controller('OvSampleTableCtrl', |
Simon Hunt | e11ce5a | 2015-07-21 12:11:04 -0700 | [diff] [blame] | 49 | ['$log', '$scope', 'TableBuilderService', |
| 50 | 'FnService', 'WebSocketService', |
Thomas Vachuska | a2ae422 | 2015-04-29 18:42:09 -0700 | [diff] [blame] | 51 | |
Simon Hunt | e11ce5a | 2015-07-21 12:11:04 -0700 | [diff] [blame] | 52 | function (_$log_, _$scope_, tbs, _fs_, _wss_) { |
| 53 | $log = _$log_; |
| 54 | $scope = _$scope_; |
| 55 | fs = _fs_; |
| 56 | wss = _wss_; |
Thomas Vachuska | a2ae422 | 2015-04-29 18:42:09 -0700 | [diff] [blame] | 57 | |
Simon Hunt | e11ce5a | 2015-07-21 12:11:04 -0700 | [diff] [blame] | 58 | var handlers = {}; |
Bri Prebilic Cole | 68844ba | 2015-07-22 15:41:37 -0700 | [diff] [blame] | 59 | $scope.panelDetails = {}; |
Simon Hunt | e11ce5a | 2015-07-21 12:11:04 -0700 | [diff] [blame] | 60 | |
Bri Prebilic Cole | 68844ba | 2015-07-22 15:41:37 -0700 | [diff] [blame] | 61 | // details response handler |
| 62 | handlers[detailsResp] = respDetailsCb; |
| 63 | wss.bindHandlers(handlers); |
Simon Hunt | e11ce5a | 2015-07-21 12:11:04 -0700 | [diff] [blame] | 64 | |
Bri Prebilic Cole | 68844ba | 2015-07-22 15:41:37 -0700 | [diff] [blame] | 65 | // custom selection callback |
Simon Hunt | e11ce5a | 2015-07-21 12:11:04 -0700 | [diff] [blame] | 66 | function selCb($event, row) { |
Simon Hunt | e11ce5a | 2015-07-21 12:11:04 -0700 | [diff] [blame] | 67 | if ($scope.selId) { |
| 68 | wss.sendEvent(detailsReq, { id: row.id }); |
| 69 | } else { |
Bri Prebilic Cole | 68844ba | 2015-07-22 15:41:37 -0700 | [diff] [blame] | 70 | $scope.hidePanel(); |
Simon Hunt | e11ce5a | 2015-07-21 12:11:04 -0700 | [diff] [blame] | 71 | } |
| 72 | $log.debug('Got a click on:', row); |
| 73 | } |
| 74 | |
Bri Prebilic Cole | 68844ba | 2015-07-22 15:41:37 -0700 | [diff] [blame] | 75 | // TableBuilderService creating a table for us |
Simon Hunt | e11ce5a | 2015-07-21 12:11:04 -0700 | [diff] [blame] | 76 | tbs.buildTable({ |
| 77 | scope: $scope, |
Simon Hunt | 84f4c2a | 2015-09-23 17:52:45 -0700 | [diff] [blame^] | 78 | tag: 'sampleTable', |
Simon Hunt | e11ce5a | 2015-07-21 12:11:04 -0700 | [diff] [blame] | 79 | selCb: selCb |
| 80 | }); |
| 81 | |
Bri Prebilic Cole | 68844ba | 2015-07-22 15:41:37 -0700 | [diff] [blame] | 82 | // cleanup |
Simon Hunt | e11ce5a | 2015-07-21 12:11:04 -0700 | [diff] [blame] | 83 | $scope.$on('$destroy', function () { |
Bri Prebilic Cole | 68844ba | 2015-07-22 15:41:37 -0700 | [diff] [blame] | 84 | wss.unbindHandlers(handlers); |
Simon Hunt | 84f4c2a | 2015-09-23 17:52:45 -0700 | [diff] [blame^] | 85 | $log.log('OvSampleTableCtrl has been destroyed'); |
Simon Hunt | e11ce5a | 2015-07-21 12:11:04 -0700 | [diff] [blame] | 86 | }); |
Thomas Vachuska | a2ae422 | 2015-04-29 18:42:09 -0700 | [diff] [blame] | 87 | |
Simon Hunt | 84f4c2a | 2015-09-23 17:52:45 -0700 | [diff] [blame^] | 88 | $log.log('OvSampleTableCtrl has been created'); |
Bri Prebilic Cole | 68844ba | 2015-07-22 15:41:37 -0700 | [diff] [blame] | 89 | }]) |
| 90 | |
Simon Hunt | 84f4c2a | 2015-09-23 17:52:45 -0700 | [diff] [blame^] | 91 | .directive('ovSampleTableItemDetailsPanel', ['PanelService', 'KeyService', |
| 92 | function (ps, ks) { |
Bri Prebilic Cole | 68844ba | 2015-07-22 15:41:37 -0700 | [diff] [blame] | 93 | return { |
| 94 | restrict: 'E', |
| 95 | link: function (scope, element, attrs) { |
Bri Prebilic Cole | 68844ba | 2015-07-22 15:41:37 -0700 | [diff] [blame] | 96 | // insert details panel with PanelService |
| 97 | // create the panel |
| 98 | var panel = ps.createPanel(pName, { |
| 99 | width: 200, |
| 100 | margin: 20, |
| 101 | hideMargin: 0 |
| 102 | }); |
| 103 | panel.hide(); |
| 104 | scope.hidePanel = function () { panel.hide(); }; |
| 105 | |
| 106 | function closePanel() { |
| 107 | if (panel.isVisible()) { |
| 108 | $scope.selId = null; |
| 109 | panel.hide(); |
Simon Hunt | 84f4c2a | 2015-09-23 17:52:45 -0700 | [diff] [blame^] | 110 | return true; |
Bri Prebilic Cole | 68844ba | 2015-07-22 15:41:37 -0700 | [diff] [blame] | 111 | } |
Simon Hunt | 84f4c2a | 2015-09-23 17:52:45 -0700 | [diff] [blame^] | 112 | return false; |
Bri Prebilic Cole | 68844ba | 2015-07-22 15:41:37 -0700 | [diff] [blame] | 113 | } |
| 114 | |
| 115 | // create key bindings to handle panel |
| 116 | ks.keyBindings({ |
| 117 | esc: [closePanel, 'Close the details panel'], |
| 118 | _helpFormat: ['esc'] |
| 119 | }); |
| 120 | ks.gestureNotes([ |
| 121 | ['click', 'Select a row to show item details'] |
| 122 | ]); |
| 123 | |
| 124 | // update the panel's contents when the data is changed |
| 125 | scope.$watch('panelDetails', function () { |
| 126 | if (!fs.isEmptyObject(scope.panelDetails)) { |
| 127 | panel.empty(); |
| 128 | populatePanel(panel); |
| 129 | panel.show(); |
| 130 | } |
| 131 | }); |
| 132 | |
| 133 | // cleanup on destroyed scope |
| 134 | scope.$on('$destroy', function () { |
| 135 | ks.unbindKeys(); |
| 136 | ps.destroyPanel(pName); |
| 137 | }); |
| 138 | } |
| 139 | }; |
| 140 | }]); |
Thomas Vachuska | a2ae422 | 2015-04-29 18:42:09 -0700 | [diff] [blame] | 141 | }()); |