Merge branch 'master' of https://github.com/jonobr1/gui-dat

index.html

@@ -31,9 +31,9 @@
       prettyPrint();
 
       var fizzyText = new FizzyText("dat.gui");
-
       var gui = new DAT.GUI();
 
+
       // Text field
       gui.add(fizzyText, "message");
 

src/DAT/GUI/ControllerNumber.js

@@ -116,7 +116,7 @@ DAT.GUI.ControllerNumber = function() {
 
   numberField.addEventListener('mousewheel', function(e) {
     e.preventDefault();
-    _this.setValue(_this.getValue() + Math.abs(e.wheelDeltaY) / e.wheelDeltaY * step);
+    _this.setValue(_this.getValue() + Math.abs(e.wheelDeltaY) / e.wheelDeltaY * _this.getStep());
     return false;
   }, false);
 
@@ -140,11 +140,11 @@ DAT.GUI.ControllerNumber = function() {
         _this.setValue(newVal);
         break;
       case 38:    // up
-        newVal = _this.getValue() + step;
+        newVal = _this.getValue() + _this.getStep();
         _this.setValue(newVal);
         break;
       case 40:    // down
-        newVal = _this.getValue() - step;
+        newVal = _this.getValue() - _this.getStep();
         _this.setValue(newVal);
         break;
     }
@@ -192,7 +192,7 @@ DAT.GUI.ControllerNumber = function() {
     draggedNumberField = true;
     e.preventDefault();
 
-    var newVal = _this.getValue() + dy * step;
+    var newVal = _this.getValue() + dy * _this.getStep();
     _this.setValue(newVal);
     return false;
 

src/DAT/GUI/GUI.js

@@ -6,6 +6,10 @@ DAT.GUI = function(parameters) {
     parameters = {};
   }
 
+  if (parameters.height == undefined) {
+    parameters.height = 300;
+  }
+
   var MIN_WIDTH = 240;
   var MAX_WIDTH = 500;
 
@@ -19,11 +23,9 @@ DAT.GUI = function(parameters) {
   // Sum total of heights of controllers in this gui
   var controllerHeight;
 
-  var curControllerContainerHeight = 0;
-
   var _this = this;
 
-  var open = false;
+  var open = true;
   var width = 280;
 
   // Prevents checkForOverflow bug in which loaded gui appearance
@@ -45,9 +47,10 @@ DAT.GUI = function(parameters) {
   this.domElement.setAttribute('class', 'guidat');
   this.domElement.style.width = width + 'px';
 
+  var curControllerContainerHeight = parameters.height;
   var controllerContainer = document.createElement('div');
   controllerContainer.setAttribute('class', 'guidat-controllers');
-  controllerContainer.style.height = '0px';
+  controllerContainer.style.height = curControllerContainerHeight + 'px';
 
   // Firefox hack to prevent horizontal scrolling
   controllerContainer.addEventListener('DOMMouseScroll', function(e) {
@@ -71,11 +74,10 @@ DAT.GUI = function(parameters) {
   }, false);
 
 
-
   var toggleButton = document.createElement('a');
   toggleButton.setAttribute('class', 'guidat-toggle');
   toggleButton.setAttribute('href', '#');
-  toggleButton.innerHTML = openString;
+  toggleButton.innerHTML = open ? closeString : openString;
 
   var toggleDragged = false;
   var dragDisplacementY = 0;
@@ -357,13 +359,10 @@ DAT.GUI = function(parameters) {
     'function': DAT.GUI.ControllerFunction
   };
 
-
   this.reset = function() {
     // TODO ... Set all values back to their initials.
   }
 
-  // DAT.GUI ... DAT.GUI
-
   this.toggle = function() {
     open ? this.close() : this.open();
   };
@@ -373,6 +372,7 @@ DAT.GUI = function(parameters) {
     resizeTo = openHeight;
     clearTimeout(resizeTimeout);
     beginResize();
+    adaptToScrollbar();
     open = true;
   }
 
@@ -381,6 +381,7 @@ DAT.GUI = function(parameters) {
     resizeTo = 0;
     clearTimeout(resizeTimeout);
     beginResize();
+    adaptToScrollbar();
     open = false;
   }
 
@@ -396,13 +397,12 @@ DAT.GUI = function(parameters) {
 
   var beginResize = function() {
 
+    curControllerContainerHeight = controllerContainer.offsetHeight;
     curControllerContainerHeight += (resizeTo - curControllerContainerHeight)
         * 0.6;
 
     if (Math.abs(curControllerContainerHeight - resizeTo) < 1) {
       curControllerContainerHeight = resizeTo;
-      adaptToScrollbar();
-
     } else {
       resizeTimeout = setTimeout(beginResize, 1000 / 30);
     }
@@ -413,15 +413,14 @@ DAT.GUI = function(parameters) {
   }
 
   var adaptToScrollbar = function() {
-    // Clears lingering slider column
-    _this.domElement.style.width = (width + 1) + 'px';
+    // Clears lingering scrollbar column
+    _this.domElement.style.width = (width - 1) + 'px';
     setTimeout(function() {
       _this.domElement.style.width = width + 'px';
     }, 1);
   };
 
 
-
   // Load saved appearance:
 
   if (DAT.GUI.guiIndex < DAT.GUI.savedAppearanceVars.length) {
@@ -453,10 +452,12 @@ DAT.GUI = function(parameters) {
   DAT.GUI.allGuis.push(this);
 
   // Add hide listener if this is the first DAT.GUI.
+
   if (DAT.GUI.allGuis.length == 1) {
+
     window.addEventListener('keyup', function(e) {
       // Hide on 'H'
-      if (e.keyCode == 72) {
+      if (!DAT.GUI.supressHotKeys && e.keyCode == 72) {
         DAT.GUI.toggleHide();
       }
     }, false);
@@ -482,6 +483,7 @@ DAT.GUI.autoPlaceContainer = null;
 DAT.GUI.allControllers = [];
 DAT.GUI.allGuis = [];
 
+DAT.GUI.supressHotKeys = false;
 
 DAT.GUI.toggleHide = function() {
   if (DAT.GUI.hidden) {
@@ -532,8 +534,7 @@ DAT.GUI.savedAppearanceVars = [];
 
 DAT.GUI.getSaveString = function() {
 
-  var vals = [],
-      i;
+  var vals = [], i;
 
   vals.push(DAT.GUI.allGuis.length);
   vals.push(document.body.scrollTop);
@@ -678,19 +679,19 @@ DAT.GUI.extendController = function(clazz) {
 DAT.GUI.addClass = function(domElement, className) {
   if (DAT.GUI.hasClass(domElement, className)) return;
   domElement.className += ' ' + className;
-};
+}
 
 DAT.GUI.hasClass = function(domElement, className) {
   return domElement.className.indexOf(className) != -1;
-};
+}
 
 DAT.GUI.removeClass = function(domElement, className) {
   var reg = new RegExp(' ' + className, 'g');
   domElement.className = domElement.className.replace(reg, '');
-};
+}
 
 if (DAT.GUI.getVarFromURL('saveString') != null) {
   DAT.GUI.load(DAT.GUI.getVarFromURL('saveString'));
 }
 
-window["DAT.GUI"] = DAT.GUI;
+window['DAT'] = DAT;