fix(weekView): update event sizes when the window is resized

Closes #328
mattlewis92 · May 11, 2016 · 75c7a76 · 75c7a76
1 parent c56a406
commit 75c7a76
Show file tree

Hide file tree

Showing 2 changed files with 24 additions and 4 deletions.
diff --git a/src/directives/mwlElementDimensions.js b/src/directives/mwlElementDimensions.js
@@ -4,11 +4,24 @@ var angular = require('angular');
 
 angular
   .module('mwl.calendar')
-  .controller('MwlElementDimensionsCtrl', function($element, $scope, $parse, $attrs) {
+  .controller('MwlElementDimensionsCtrl', function($element, $scope, $parse, $attrs, $window) {
 
-    $parse($attrs.mwlElementDimensions).assign($scope, {
-      width: $element[0].offsetWidth,
-      height: $element[0].offsetHeight
+    function setDimensions() {
+      $parse($attrs.mwlElementDimensions).assign($scope, {
+        width: $element[0].offsetWidth,
+        height: $element[0].offsetHeight
+      });
+      $scope.$applyAsync();
+    }
+
+    var win = angular.element($window);
+
+    win.bind('resize', setDimensions);
+
+    setDimensions();
+
+    $scope.$on('$destroy', function() {
+      win.unbind('resize', setDimensions);
     });
 
   })

diff --git a/test/unit/directives/mwlElementDimensions.spec.js b/test/unit/directives/mwlElementDimensions.spec.js
@@ -35,4 +35,11 @@ describe('mwlElementDimensions directive', function() {
     expect(scope.elementDimensions).to.eql({width: 100, height: 50});
   });
 
+  it('should update the element dimensions when the window is resized', function() {
+    element[0].style.width = '150px';
+    element[0].style.height = '20px';
+    $window.dispatchEvent(new $window.Event('resize'));
+    expect(scope.elementDimensions).to.eql({width: 150, height: 20});
+  });
+
 });