From f9c0b163146b7fa36ae69f1dc456e92fbe8b5d0b Mon Sep 17 00:00:00 2001
From: George Michael Brower <georgebrower@google.com>
Date: Wed, 26 Jan 2011 15:55:56 -0700
Subject: [PATCH] Fixed a bug in slider

---
 controllers/controller.js        |  3 +++
 controllers/controller.number.js | 11 +++++++++--
 controllers/slider.js            |  8 ++------
 gui.js                           | 23 +++++------------------
 index.html                       | 12 ++++++------
 5 files changed, 25 insertions(+), 32 deletions(-)

diff --git a/controllers/controller.js b/controllers/controller.js
index a5a1917..467ea51 100644
--- a/controllers/controller.js
+++ b/controllers/controller.js
@@ -4,6 +4,7 @@ var Controller = function() {
 
     this.setName = function(n) {
   	    this.propertyNameElement.innerHTML = n;
+  	    return this;
     }
     
     this.setValue = function(n) {
@@ -11,6 +12,7 @@ var Controller = function() {
       	if (onChange != null) {
       		onChange.call(this, n);
       	}
+      	return this;
     }
     
     this.getValue = function() {
@@ -19,6 +21,7 @@ var Controller = function() {
     
     this.onChange = function(fnc) {
     	onChange = fnc;
+    	return this;
     }
     
 	this.makeUnselectable = function(elem) {
diff --git a/controllers/controller.number.js b/controllers/controller.number.js
index 169546b..a98223a 100644
--- a/controllers/controller.number.js
+++ b/controllers/controller.number.js
@@ -20,13 +20,15 @@ var NumberController = function() {
     var step = arguments[4];
     
     if (!step) {
-    	if (min && max) {
+    	if (min != undefined && max != undefined) {
     		step = (max-min)*0.01;
     	} else {
     		step = 1;
     	}	
     }
     
+    console.log("step " + step);
+    
     var numberField = document.createElement('input');
     numberField.setAttribute('id', this.propertyName);
     
@@ -114,10 +116,15 @@ var NumberController = function() {
     	}
         _this.setValue(val);
         
-        numberField.value = _this.getValue();
+        numberField.value = roundToDecimal(_this.getValue(), 4);
         if (slider) slider.value = _this.getValue();
     }
     
+    var roundToDecimal = function(n, decimals) {
+	    var t = Math.pow(10, decimals);
+    	return Math.round(n*t)/t;
+    }
+    
 };
 
 NumberController.prototype = new Controller();
diff --git a/controllers/slider.js b/controllers/slider.js
index b495547..a45ea1a 100644
--- a/controllers/slider.js
+++ b/controllers/slider.js
@@ -13,8 +13,9 @@ var Slider = function(numberController, min, max, step, initValue) {
 	var x, px;
 	
 	this.domElement = document.createElement('div');
-	this.fg = document.createElement('div');
 	this.domElement.setAttribute('class', 'guidat-slider-bg');
+	
+	this.fg = document.createElement('div');
 	this.fg.setAttribute('class', 'guidat-slider-fg');
 	
 	this.domElement.appendChild(this.fg);
@@ -38,10 +39,8 @@ var Slider = function(numberController, min, max, step, initValue) {
 	}
 	
 	this.__defineSetter__('value', function(e) {
-		
 		var pct = map(e, min, max, 0, 100);
 		this.fg.style.width = pct+"%";
-		
 	});
 
 	var onDrag = function(e) {
@@ -68,9 +67,6 @@ var Slider = function(numberController, min, max, step, initValue) {
 	}, false);
 	
 	document.addEventListener('mousemove', onDrag, false);
-
-
-	
 	
 	this.value = initValue;	
 		
diff --git a/gui.js b/gui.js
index 492d4ed..03d3c8c 100644
--- a/gui.js
+++ b/gui.js
@@ -38,7 +38,7 @@ var GUI = new function() {
 			return;
 		}
 	
-		var controllerObject = handler.apply(this, arguments);
+		var controllerObject = construct(handler, arguments);
 		
 		// Were we able to make the controller?
 		if (!controllerObject) {		
@@ -55,23 +55,10 @@ var GUI = new function() {
 	}
 	
 	var addHandlers = {
-		
-		"number": function() {
-            return construct(NumberController, arguments);
-		},
-		
-		"string": function() {
-            return construct(StringController, arguments);
-		},
-		
-		"boolean": function() {
-			return construct(BooleanController, arguments);
-		},
-		
-		"function": function() {
-			return construct(FunctionController, arguments);
-		},
-		
+		"number": NumberController,
+		"string": StringController,
+		"boolean": BooleanController,
+		"function": FunctionController
 	};
 	
 	var alreadyControlled = function(object, propertyName) {
diff --git a/index.html b/index.html
index bac1d82..d09d33b 100644
--- a/index.html
+++ b/index.html
@@ -6,15 +6,16 @@
         
         <link href="gui.css" media="screen" rel="stylesheet" type="text/css" />
         <link href="demo/demo.css" media="screen" rel="stylesheet" type="text/css" />
-  <!--   <script type="text/javascript" src="http://google-code-prettify.googlecode.com/svn/trunk/src/prettify.js"></script>-->
+		<script type="text/javascript" src="http://google-code-prettify.googlecode.com/svn/trunk/src/prettify.js"></script>
+
 
-        <script type="text/javascript" src="gui.js"></script>
         <script type="text/javascript" src="controllers/slider.js"></script>
         <script type="text/javascript" src="controllers/controller.js"></script>
         <script type="text/javascript" src="controllers/controller.string.js"></script>
         <script type="text/javascript" src="controllers/controller.number.js"></script>
         <script type="text/javascript" src="controllers/controller.boolean.js"></script>
         <script type="text/javascript" src="controllers/controller.function.js"></script>
+		<script type="text/javascript" src="gui.js"></script>
         <script type="text/javascript" src="demo/demo.js"></script>
         <script type="text/javascript">
             var controllableObject = 
@@ -35,7 +36,7 @@
 
                 var testDisplay = new DynamicText("gui-dat", 600, 300, 160);
 
-        //       prettyPrint();
+            prettyPrint();
 
                GUI.start();
                
@@ -43,7 +44,7 @@
                GUI.add(testDisplay, "minSize", 0, 1);
                
                // Creates a number box
-               GUI.add(testDisplay, "maxSize", 1, 5);
+               GUI.add(testDisplay, "maxSize", 1, 20);
 
                // Creates a slider (min, max)
                GUI.add(testDisplay, "growthSpeed", 0.01, 0.5);
@@ -122,8 +123,7 @@ window.onload = function() {
    GUI.add(controllableObject, &quot;booleanProperty&quot;);
 
    // Creates a button
-   GUI.add(controllableObject, &quot;functionProperty&quot;)
-      .setName(&quot;Fire a Function&quot;);
+   GUI.add(controllableObject, &quot;functionProperty&quot;).setName(&quot;Fire a Function&quot;);
 
 };