Merge pull request #1755 from PaulL1/1753_column_width_animations

Fix #1753 (colMenu): size correctly with animations, hide on scroll or d...
angular-ui · Oct 7, 2014 · 97868e0 · 97868e0
2 parents cb117af + a78b9fd
commit 97868e0
Show file tree

Hide file tree

Showing 2 changed files with 23 additions and 15 deletions.
diff --git a/src/js/core/directives/ui-grid-column-menu.js b/src/js/core/directives/ui-grid-column-menu.js
@@ -365,7 +365,6 @@ function ($log, $timeout, gridUtil, uiGridConstants, uiGridColumnMenuService) {
         if ($scope.menuShown) {
           // we want to hide, then reposition, then show, but we want to wait for animations
           // we set a variable, and then rely on the menu-hidden event to call the reposition and show
-          $scope.col = column;
           $scope.colElement = $columnElement;
           $scope.colElementPosition = colElementPosition;
           $scope.hideThenShow = true;
@@ -374,22 +373,15 @@ function ($log, $timeout, gridUtil, uiGridConstants, uiGridColumnMenuService) {
         } else {
           self.shown = $scope.menuShown = true;
           uiGridColumnMenuService.repositionMenu( $scope, column, colElementPosition, $elm, $columnElement );
+
+          $scope.colElement = $columnElement;
+          $scope.colElementPosition = colElementPosition;
           $scope.$broadcast('show-menu');
-          $timeout( $scope.repositionMenuClosure( $scope, column, colElementPosition, $elm, $columnElement ));
         } 
 
       };
 
 
-      $scope.repositionMenuClosure = function( $scope, column, colElementPosition, $elm, $columnElement ) {
-        return function() {
-          uiGridColumnMenuService.repositionMenu( $scope, column, colElementPosition, $elm, $columnElement );
-          delete $scope.colElementPosition;
-          delete $scope.columnElement;
-        };
-      };
-
-
       /**
        * @ngdoc method
        * @methodOf ui.grid.directive:uiGridColumnMenu
@@ -415,13 +407,18 @@ function ($log, $timeout, gridUtil, uiGridConstants, uiGridColumnMenuService) {
 
           uiGridColumnMenuService.repositionMenu( $scope, $scope.col, $scope.colElementPosition, $elm, $scope.colElement );
           $scope.$broadcast('show-menu');
-          $timeout( $scope.repositionMenuClosure( $scope, $scope.col, $scope.colElementPosition, $elm, $scope.colElement ));
 
           $scope.menuShown = true;
         } else {
           $scope.hideMenu( true );
         }
       });
+
+      $scope.$on('menu-shown', function() {
+        uiGridColumnMenuService.repositionMenu( $scope, $scope.col, $scope.colElementPosition, $elm, $scope.colElement );
+        delete $scope.colElementPosition;
+        delete $scope.columnElement;
+      });
 
 
       /* Column methods */

diff --git a/src/js/core/directives/ui-grid-menu.js b/src/js/core/directives/ui-grid-menu.js
@@ -30,7 +30,8 @@
  */
 angular.module('ui.grid')
 
-.directive('uiGridMenu', ['$log', '$compile', '$timeout', '$window', '$document', 'gridUtil', function ($log, $compile, $timeout, $window, $document, gridUtil) {
+.directive('uiGridMenu', ['$log', '$compile', '$timeout', '$window', '$document', 'gridUtil', 'uiGridConstants', 
+function ($log, $compile, $timeout, $window, $document, gridUtil, uiGridConstants) {
   var uiGridMenu = {
     priority: 0,
     scope: {
@@ -69,9 +70,12 @@ angular.module('ui.grid')
             $animate = gridUtil.enableAnimations(menuMid);
             if ( $animate ){
               $scope.shownMid = true;
-              $animate.removeClass(menuMid, 'ng-hide');
+              $animate.removeClass(menuMid, 'ng-hide', function() {
+                $scope.$emit('menu-shown');
+              });
             } else {
               $scope.shownMid = true;
+              $scope.$emit('menu-shown');
             }
           });
         } else if ( !$scope.shownMid ){
@@ -80,9 +84,12 @@ angular.module('ui.grid')
           $animate = gridUtil.enableAnimations(menuMid);
           if ( $animate ){
             $scope.shownMid = true;
-            $animate.removeClass(menuMid, 'ng-hide');
+            $animate.removeClass(menuMid, 'ng-hide', function() {
+              $scope.$emit('menu-shown');
+            });
           } else {
             $scope.shownMid = true;
+            $scope.$emit('menu-shown');
           }
         }
 
@@ -157,6 +164,10 @@ angular.module('ui.grid')
       $scope.$on('$destroy', function() {
         angular.element($window).off('resize', applyHideMenu);
       });
+
+      $scope.$on('$destroy', $scope.$on(uiGridConstants.events.GRID_SCROLL, applyHideMenu ));
+
+      $scope.$on('$destroy', $scope.$on(uiGridConstants.events.ITEM_DRAGGING, applyHideMenu ));
     },