Thomas Vachuska | bbf1050 | 2015-12-09 13:41:58 -0800 | [diff] [blame] | 1 | // js for sample app table view |
| 2 | (function () { |
| 3 | 'use strict'; |
| 4 | |
| 5 | // injected refs |
| 6 | var $log, $scope, fs, wss; |
| 7 | |
| 8 | // constants |
Thomas Vachuska | 7266738 | 2016-02-22 14:27:48 -0800 | [diff] [blame^] | 9 | var detailsReq = 'driverDataRequest', |
| 10 | detailsResp = 'driverDataResponse', |
Thomas Vachuska | bbf1050 | 2015-12-09 13:41:58 -0800 | [diff] [blame] | 11 | pName = 'ov-driver-matrix-item-details-panel', |
| 12 | |
| 13 | propOrder = ['id', 'label', 'code'], |
| 14 | friendlyProps = ['Item ID', 'Item Label', 'Special Code']; |
| 15 | |
| 16 | |
| 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 | |
| 42 | function respDetailsCb(data) { |
Thomas Vachuska | 7266738 | 2016-02-22 14:27:48 -0800 | [diff] [blame^] | 43 | $log.debug(data); |
| 44 | //$scope.panelDetails = data.details; |
| 45 | //$scope.$apply(); |
Thomas Vachuska | bbf1050 | 2015-12-09 13:41:58 -0800 | [diff] [blame] | 46 | } |
| 47 | |
| 48 | angular.module('ovDriverMatrix', []) |
| 49 | .controller('OvDriverMatrixCtrl', |
| 50 | ['$log', '$scope', 'TableBuilderService', |
| 51 | 'FnService', 'WebSocketService', |
| 52 | |
| 53 | function (_$log_, _$scope_, tbs, _fs_, _wss_) { |
| 54 | $log = _$log_; |
| 55 | $scope = _$scope_; |
| 56 | fs = _fs_; |
| 57 | wss = _wss_; |
| 58 | |
| 59 | var handlers = {}; |
| 60 | $scope.panelDetails = {}; |
| 61 | |
| 62 | // details response handler |
| 63 | handlers[detailsResp] = respDetailsCb; |
| 64 | wss.bindHandlers(handlers); |
| 65 | |
Thomas Vachuska | 7266738 | 2016-02-22 14:27:48 -0800 | [diff] [blame^] | 66 | wss.sendEvent(detailsReq); |
Thomas Vachuska | bbf1050 | 2015-12-09 13:41:58 -0800 | [diff] [blame] | 67 | |
Thomas Vachuska | 7266738 | 2016-02-22 14:27:48 -0800 | [diff] [blame^] | 68 | //// custom selection callback |
| 69 | //function selCb($event, row) { |
| 70 | // if ($scope.selId) { |
| 71 | // wss.sendEvent(detailsReq, { id: row.id }); |
| 72 | // } else { |
| 73 | // $scope.hidePanel(); |
| 74 | // } |
| 75 | // $log.debug('Got a click on:', row); |
| 76 | //} |
| 77 | |
| 78 | //// TableBuilderService creating a table for us |
| 79 | //tbs.buildTable({ |
| 80 | // scope: $scope, |
| 81 | // tag: 'driverMatrix', |
| 82 | // selCb: selCb |
| 83 | //}); |
Thomas Vachuska | bbf1050 | 2015-12-09 13:41:58 -0800 | [diff] [blame] | 84 | |
| 85 | // cleanup |
| 86 | $scope.$on('$destroy', function () { |
| 87 | wss.unbindHandlers(handlers); |
| 88 | $log.log('OvDriverMatrixCtrl has been destroyed'); |
| 89 | }); |
| 90 | |
| 91 | $log.log('OvDriverMatrixCtrl has been created'); |
| 92 | }]) |
| 93 | |
| 94 | .directive('ovDriverMatrixItemDetailsPanel', ['PanelService', 'KeyService', |
| 95 | function (ps, ks) { |
| 96 | return { |
| 97 | restrict: 'E', |
| 98 | link: function (scope, element, attrs) { |
| 99 | // insert details panel with PanelService |
| 100 | // create the panel |
| 101 | var panel = ps.createPanel(pName, { |
| 102 | width: 200, |
| 103 | margin: 20, |
| 104 | hideMargin: 0 |
| 105 | }); |
| 106 | panel.hide(); |
| 107 | scope.hidePanel = function () { panel.hide(); }; |
| 108 | |
| 109 | function closePanel() { |
| 110 | if (panel.isVisible()) { |
| 111 | $scope.selId = null; |
| 112 | panel.hide(); |
| 113 | return true; |
| 114 | } |
| 115 | return false; |
| 116 | } |
| 117 | |
| 118 | // create key bindings to handle panel |
| 119 | ks.keyBindings({ |
| 120 | esc: [closePanel, 'Close the details panel'], |
| 121 | _helpFormat: ['esc'] |
| 122 | }); |
| 123 | ks.gestureNotes([ |
| 124 | ['click', 'Select a row to show item details'] |
| 125 | ]); |
| 126 | |
| 127 | // update the panel's contents when the data is changed |
| 128 | scope.$watch('panelDetails', function () { |
| 129 | if (!fs.isEmptyObject(scope.panelDetails)) { |
| 130 | panel.empty(); |
| 131 | populatePanel(panel); |
| 132 | panel.show(); |
| 133 | } |
| 134 | }); |
| 135 | |
| 136 | // cleanup on destroyed scope |
| 137 | scope.$on('$destroy', function () { |
| 138 | ks.unbindKeys(); |
| 139 | ps.destroyPanel(pName); |
| 140 | }); |
| 141 | } |
| 142 | }; |
| 143 | }]); |
| 144 | }()); |