Browse Source

Editor: Revised the FancySelect scroll behavior

jlewin 12 years ago
parent
commit
a7eb89f82d
1 changed files with 24 additions and 7 deletions
  1. 24 7
      editor/js/libs/ui.js

+ 24 - 7
editor/js/libs/ui.js

@@ -338,6 +338,19 @@ UI.FancySelect = function () {
 	var changeEvent = document.createEvent('HTMLEvents');
 	var changeEvent = document.createEvent('HTMLEvents');
 	changeEvent.initEvent( 'change', true, true );
 	changeEvent.initEvent( 'change', true, true );
 
 
+	// Prevent native scroll behavior
+	dom.addEventListener( 'keydown', function (event) {
+
+		switch ( event.keyCode ) {
+			case 38: // up
+			case 40: // down
+				event.preventDefault();
+				event.stopPropagation();
+				break;
+		}
+
+	}, false);
+
 	// Keybindings to support arrow navigation
 	// Keybindings to support arrow navigation
 	dom.addEventListener( 'keyup', function (event) {
 	dom.addEventListener( 'keyup', function (event) {
 
 
@@ -349,10 +362,10 @@ UI.FancySelect = function () {
 
 
 				if ( index >= 0 && index < scope.options.length ) {
 				if ( index >= 0 && index < scope.options.length ) {
 
 
-					// Select dom element
+					// Highlight selected dom elem and scroll parent if needed
 					scope.setValue( scope.options[index].value );
 					scope.setValue( scope.options[index].value );
 
 
-					// Invoke object selection logic
+					// Invoke object/helper/mesh selection logic
 					scope.dom.dispatchEvent( changeEvent );
 					scope.dom.dispatchEvent( changeEvent );
 
 
 				}
 				}
@@ -431,13 +444,17 @@ UI.FancySelect.prototype.setValue = function ( value ) {
 
 
 			// scroll into view
 			// scroll into view
 
 
-			var y = i * element.clientHeight;
-			var scrollTop = this.dom.scrollTop;
-			var domHeight = this.dom.clientHeight;
+			var y = element.offsetTop - this.dom.offsetTop,
+				bottomY = y + element.offsetHeight,
+				minScroll = bottomY - this.dom.offsetHeight;
+
+			if ( this.dom.scrollTop > y ) {
+
+				this.dom.scrollTop = y
 
 
-			if ( y < scrollTop || y > scrollTop + domHeight ) {
+			} else if ( this.dom.scrollTop < minScroll ) {
 
 
-				this.dom.scrollTop = y;
+				this.dom.scrollTop = minScroll;
 
 
 			}
 			}