Merge pull request aterrien#11 from eskimoblood/master

Fix bug with min/max threshold and keyboard input
bzabos · May 12, 2012 · 419f67d · 419f67d
2 parents 8379b74 + 35e53f5
commit 419f67d
Show file tree

Hide file tree

Showing 2 changed files with 25 additions and 8 deletions.
diff --git a/index.html b/index.html
@@ -70,7 +70,7 @@
 data-width="250"
 data-min="-100"
             </pre>
-            <input class="knob"data-width="250" data-min="-100" value="44">
+            <input class="knob"data-width="250" data-min="-100" data-max="100"value="44">
         </div>
         <div style="float:left;width:320px;height:300px;padding:20px">
             <pre>

diff --git a/js/jquery.knob-1.1.0.js b/js/jquery.knob-1.1.0.js
@@ -162,9 +162,10 @@ $(function() {
                                                 };
                         k.val( parseInt($this.val()) || 0 );
                         k.onChange = function(v) {
-                                                    $this.val(v);
-                                                    opt.change(v);
-                                                 };
+                            var limitedValue = limitValue(v);
+                            $this.val(limitedValue);
+                            opt.change(limitedValue);
+                        };
 
                         // bind change on input
                         $this.bind(
@@ -188,8 +189,18 @@ $(function() {
 
                         var keys={37: -1, 38:1, 39:1, 40: -1}
                         $this.keydown(function(event){
-                            setVal( keys[event.keyCode]);
-                            event.preventDefault();
+                            var direction  = keys[event.keyCode];
+                            if(direction){
+                                setVal(direction);
+                                event.preventDefault();
+                            } 
+                        });
+
+                        $this.keyup(function(event){
+                            var direction  = keys[event.keyCode];
+                            if(!direction) {
+                                setVal();
+                            }
                         });
 
                         $this.bind('mousewheel DOMMouseScroll', function(event){
@@ -201,10 +212,16 @@ $(function() {
                         });
 
                         function setVal(dir){
-                            if(dir){
-                                k.val( parseInt($this.val()) + dir );
+                            if(!opt.readOnly) {
+                                var value = limitValue(parseInt($this.val(), 10) + (dir ? dir: 0));
+                                $this.val(value)
+                                k.val( parseInt(value, 10) || 0);
                             }
                         }
+
+                        function limitValue(v){
+                            return limitedValue = Math.max(Math.min(v, opt.max), opt.min);                                                 
+                        }
                     }
                 ).parent();
     }