fix(adjust-height): do not extend height greater than window

w11k · May 29, 2014 · fa1536b · fa1536b
1 parent 7686fec
commit fa1536b
Showing 1 changed file with 60 additions and 60 deletions.
diff --git a/src/w11k-select.js b/src/w11k-select.js
@@ -85,58 +85,6 @@ angular.module('w11k.select').directive('w11kSelect', [
          * dropdown
          * * * * * * * * * * * * * * * * * * * * * * * * * * * * * * * * * * * * * * * * * * * * * * * * * * * * * * * */
 
-        var onEscPressed = function (event) {
-          if (event.keyCode === 27) {
-            scope.dropdown.close();
-          }
-        };
-
-        scope.dropdown = {
-          onOpen: function ($event) {
-            if (scope.isDisabled) {
-              $event.prevent();
-              return;
-            }
-
-            if (hasBeenOpened === false) {
-              hasBeenOpened = true;
-              filterOptions();
-            }
-
-            if (scope.filter.active) {
-              // use timeout to open dropdown first and then set the focus,
-              // otherwise focus won't be set because element is not visible
-              $timeout(function () {
-                element[0].querySelector('.dropdown-menu input').focus();
-              });
-
-            }
-
-            $document.on('keyup', onEscPressed);
-
-            $timeout(function () {
-              adjustHeight();
-            });
-            jqWindow.on('resize', adjustHeight);
-          },
-          onClose: function () {
-            // important: set properties of filter.values to empty strings not to null,
-            // otherwise angular's filter won't work
-            scope.filter.values.label = '';
-
-            $timeout(function () {
-              resetHeight();
-            });
-            $document.off('keyup', onEscPressed);
-            jqWindow.off('resize', adjustHeight);
-          }
-        };
-
-        scope.$on('$destroy', function () {
-          $document.off('keyup', onEscPressed);
-          jqWindow.off('resize', adjustHeight);
-        });
-
         function getParent(element, selector) {
           // with jQuery
           if (angular.isFunction(element.parents)) {
@@ -176,27 +124,30 @@ angular.module('w11k.select').directive('w11kSelect', [
           return undefined;
         }
 
-        var dropDownContent = element[0].querySelector('.dropdown-menu .content');
-        var heightAdjustContainer = getParent(element, '.w11k-select-adjust-height-to');
+        function onEscPressed(event) {
+          if (event.keyCode === 27) {
+            scope.dropdown.close();
+          }
+        }
 
         function adjustHeight() {
 
           var maxHeight;
 
           if (angular.isObject(scope.style) && scope.style.hasOwnProperty('maxHeight')) {
-            dropDownContent.style.maxHeight = scope.style.maxHeight;
+            domDropDownContent.style.maxHeight = scope.style.maxHeight;
           }
           else {
-            var contentOffset = dropDownContent.getBoundingClientRect().top;
+            var contentOffset = domDropDownContent.getBoundingClientRect().top;
 
             var windowHeight = $window.innerHeight || $window.document.documentElement.clientHeight;
 
             var containerHeight;
             var containerOffset;
 
-            if (angular.isDefined(heightAdjustContainer)) {
-              containerHeight = heightAdjustContainer.innerHeight || heightAdjustContainer.clientHeight;
-              containerOffset = heightAdjustContainer.getBoundingClientRect().top;
+            if (angular.isDefined(domHeightAdjustContainer)) {
+              containerHeight = domHeightAdjustContainer.innerHeight || domHeightAdjustContainer.clientHeight;
+              containerOffset = domHeightAdjustContainer.getBoundingClientRect().top;
             }
             else {
               containerHeight = $window.innerHeight || $window.document.documentElement.clientHeight;
@@ -233,7 +184,7 @@ angular.module('w11k.select').directive('w11kSelect', [
               maxHeight = minHeightFor3Elements;
             }
 
-            dropDownContent.style.maxHeight = maxHeight + 'px';
+            domDropDownContent.style.maxHeight = maxHeight + 'px';
 
           }
         }
@@ -243,6 +194,55 @@ angular.module('w11k.select').directive('w11kSelect', [
           content.style.maxHeight = '';
         }
 
+        var domDropDownContent = element[0].querySelector('.dropdown-menu .content');
+        var domHeightAdjustContainer = getParent(element, '.w11k-select-adjust-height-to');
+
+        scope.dropdown = {
+          onOpen: function ($event) {
+            if (scope.isDisabled) {
+              $event.prevent();
+              return;
+            }
+
+            if (hasBeenOpened === false) {
+              hasBeenOpened = true;
+              filterOptions();
+            }
+
+            if (scope.filter.active) {
+              // use timeout to open dropdown first and then set the focus,
+              // otherwise focus won't be set because element is not visible
+              $timeout(function () {
+                element[0].querySelector('.dropdown-menu input').focus();
+              });
+
+            }
+
+            $document.on('keyup', onEscPressed);
+
+            $timeout(function () {
+              adjustHeight();
+            });
+            jqWindow.on('resize', adjustHeight);
+          },
+          onClose: function () {
+            // important: set properties of filter.values to empty strings not to null,
+            // otherwise angular's filter won't work
+            scope.filter.values.label = '';
+
+            $timeout(function () {
+              resetHeight();
+            });
+            $document.off('keyup', onEscPressed);
+            jqWindow.off('resize', adjustHeight);
+          }
+        };
+
+        scope.$on('$destroy', function () {
+          $document.off('keyup', onEscPressed);
+          jqWindow.off('resize', adjustHeight);
+        });
+
         // read the placeholder attribute once
         var placeholderAttrObserver = attrs.$observe('w11kSelectPlaceholder', function (placeholder) {
           if (angular.isDefined(placeholder)) {