GUI panels open by default, no animation

src/DAT/ControllerNumber.js

@@ -20,13 +20,9 @@ DAT.GUI.ControllerNumber = function() {
   var max = arguments[4];
   var step = arguments[5];
 
-  if (!step) {
-    if (min != undefined && max != undefined) {
+  var defaultStep = function() {
       step = (max - min) * 0.01;
-    } else {
-      step = 1;
-    }
-  }
+  };
 
   this.min = function() {
     var needsSlider = false;
@@ -40,6 +36,9 @@ DAT.GUI.ControllerNumber = function() {
     }
     if (needsSlider) {
       addSlider();
+      if (step == undefined) {
+        defaultStep();
+      }
     }
     return _this;
   };
@@ -56,6 +55,9 @@ DAT.GUI.ControllerNumber = function() {
     }
     if (needsSlider) {
       addSlider();
+      if (step == undefined) { 
+        defaultStep();
+      }
     }
     return _this;
   };
@@ -69,6 +71,18 @@ DAT.GUI.ControllerNumber = function() {
     return _this;
   };
 
+  this.getMin = function() {
+    return min;
+  };
+
+  this.getMax = function() {
+    return max;
+  };
+  
+  this.getStep = function() {
+    return step || 1;
+  }
+
   var numberField = document.createElement('input');
   numberField.setAttribute('id', this.propertyName);
   numberField.setAttribute('type', 'text');

src/DAT/Slider.js

@@ -17,8 +17,9 @@ DAT.GUI.Slider = function(numberController, min, max, step, initValue) {
     if (!clicked) return;
     var pos = findPos(_this.domElement);
     var val = DAT.GUI.map(e.pageX, pos[0], pos[0] + _this.domElement
-        .offsetWidth, min, max);
-    val = Math.round(val / step) * step;
+        .offsetWidth, numberController.getMin(), numberController.getMax());
+    val = Math.round(val / numberController.getStep()) * numberController
+        .getStep();
     numberController.setValue(val);
   };
 
@@ -34,7 +35,8 @@ DAT.GUI.Slider = function(numberController, min, max, step, initValue) {
     DAT.GUI.removeClass(numberController.domElement, 'active');
     clicked = false;
     if (numberController.finishChangeFunction != null) {
-      numberController.finishChangeFunction.call(this, numberController.getValue());
+      numberController.finishChangeFunction.call(this,
+          numberController.getValue());
     }
     document.removeEventListener('mouseup', mouseup, false);
   };
@@ -51,8 +53,8 @@ DAT.GUI.Slider = function(numberController, min, max, step, initValue) {
   };
 
   this.__defineSetter__('value', function(e) {
-    var pct = DAT.GUI.map(e, min, max, 0, 100);
-    this.fg.style.width = pct + "%";
+    this.fg.style.width = DAT.GUI.map(e, numberController.getMin(),
+        numberController.getMax(), 0, 100) + "%";
   });
 
   document.addEventListener('mousemove', onDrag, false);

src/dat/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) {
@@ -524,8 +523,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);