Committed by
Gerrit Code Review
GUI -- Device details panel work - Panel resizes on window resize, DOM manipulat…
…ion moved out of controller into directive. Change-Id: I680984343ee550a3cf7c76183c257b69785750c4
Showing
2 changed files
with
44 additions
and
8 deletions
... | @@ -203,8 +203,7 @@ | ... | @@ -203,8 +203,7 @@ |
203 | 203 | ||
204 | function respDetailsCb(data) { | 204 | function respDetailsCb(data) { |
205 | $scope.panelData = data.details; | 205 | $scope.panelData = data.details; |
206 | - populateDetails($scope.panelData); | 206 | + $scope.$apply(); |
207 | - detailsPanel.show(); | ||
208 | } | 207 | } |
209 | 208 | ||
210 | function createDetailsPane() { | 209 | function createDetailsPane() { |
... | @@ -240,10 +239,6 @@ | ... | @@ -240,10 +239,6 @@ |
240 | ttip = _ttip_; | 239 | ttip = _ttip_; |
241 | var handlers = {}; | 240 | var handlers = {}; |
242 | $scope.panelData = []; | 241 | $scope.panelData = []; |
243 | - pStartY = fs.noPxStyle(d3.select('.tabular-header'), 'height') | ||
244 | - + mast.mastHeight() + topPdg; | ||
245 | - wSize = fs.windowSize(pStartY); | ||
246 | - pHeight = wSize.height; | ||
247 | 242 | ||
248 | function selCb($event, row) { | 243 | function selCb($event, row) { |
249 | selRow = angular.element($event.currentTarget); | 244 | selRow = angular.element($event.currentTarget); |
... | @@ -260,17 +255,56 @@ | ... | @@ -260,17 +255,56 @@ |
260 | tag: 'device', | 255 | tag: 'device', |
261 | selCb: selCb | 256 | selCb: selCb |
262 | }); | 257 | }); |
263 | - createDetailsPane(); | ||
264 | 258 | ||
265 | // details panel handlers | 259 | // details panel handlers |
266 | handlers[detailsResp] = respDetailsCb; | 260 | handlers[detailsResp] = respDetailsCb; |
267 | wss.bindHandlers(handlers); | 261 | wss.bindHandlers(handlers); |
268 | 262 | ||
269 | $scope.$on('$destroy', function () { | 263 | $scope.$on('$destroy', function () { |
270 | - ps.destroyPanel(pName); | ||
271 | wss.unbindHandlers(handlers); | 264 | wss.unbindHandlers(handlers); |
272 | }); | 265 | }); |
273 | 266 | ||
274 | $log.log('OvDeviceCtrl has been created'); | 267 | $log.log('OvDeviceCtrl has been created'); |
268 | + }]) | ||
269 | + | ||
270 | + .directive('deviceDetailsPanel', ['$rootScope', '$window', | ||
271 | + function ($rootScope, $window) { | ||
272 | + return function (scope) { | ||
273 | + | ||
274 | + function heightCalc() { | ||
275 | + pStartY = fs.noPxStyle(d3.select('.tabular-header'), 'height') | ||
276 | + + mast.mastHeight() + topPdg; | ||
277 | + wSize = fs.windowSize(pStartY); | ||
278 | + pHeight = wSize.height; | ||
279 | + } | ||
280 | + heightCalc(); | ||
281 | + | ||
282 | + createDetailsPane(); | ||
283 | + | ||
284 | + scope.$watch('panelData', function () { | ||
285 | + if (!fs.isEmptyObject(scope.panelData)) { | ||
286 | + populateDetails(scope.panelData); | ||
287 | + detailsPanel.show(); | ||
288 | + } | ||
289 | + }); | ||
290 | + | ||
291 | + $rootScope.$watchCollection( | ||
292 | + function () { | ||
293 | + return { | ||
294 | + h: $window.innerHeight, | ||
295 | + w: $window.innerWidth | ||
296 | + } | ||
297 | + }, function () { | ||
298 | + if (!fs.isEmptyObject(scope.panelData)) { | ||
299 | + heightCalc(); | ||
300 | + populateDetails(scope.panelData); | ||
301 | + } | ||
302 | + } | ||
303 | + ); | ||
304 | + | ||
305 | + scope.$on('$destroy', function () { | ||
306 | + ps.destroyPanel(pName); | ||
307 | + }); | ||
308 | + }; | ||
275 | }]); | 309 | }]); |
276 | }()); | 310 | }()); | ... | ... |
-
Please register or login to post a comment