From 32a3c5d34c042bde5f58f018c525260e17e6aa68 Mon Sep 17 00:00:00 2001
From: jarek <jarek@jarek-desktop.(none)>
Date: Fri, 13 Dec 2013 17:39:43 +0000
Subject: [PATCH 1/2] gauge initial commit

---
 js/jquery.knob.js | 19 ++++++++++++++++---
 1 file changed, 16 insertions(+), 3 deletions(-)

diff --git a/js/jquery.knob.js b/js/jquery.knob.js
index ddb5273..fb502ab 100755
--- a/js/jquery.knob.js
+++ b/js/jquery.knob.js
@@ -706,7 +706,7 @@
         this.draw = function () {
 
             var c = this.g,                 // context
-                a = this.angle(this.cv)    // Angle
+                a = this.angle(this.cv)     // Angle
                 , sat = this.startAngle     // Start angle
                 , eat = sat + a             // End angle
                 , sa, ea                    // Previous angles
@@ -719,7 +719,7 @@
             this.o.cursor
                 && (sat = eat - this.cursorExt)
                 && (eat = eat + this.cursorExt);
-
+            
             c.beginPath();
                 c.strokeStyle = this.o.bgColor;
                 c.arc(this.xy, this.xy, this.radius, this.endAngle - 0.00001, this.startAngle + 0.00001, true);
@@ -738,11 +738,24 @@
                 c.stroke();
                 r = (this.cv == this.v);
             }
-
+            /*
             c.beginPath();
                 c.strokeStyle = r ? this.o.fgColor : this.fgColor ;
                 c.arc(this.xy, this.xy, this.radius, sat - 0.00001, eat + 0.00001, false);
             c.stroke();
+             */
+            c.beginPath();
+                c.fillStyle = r ? this.o.fgColor : this.fgColor ;
+                c.arc(this.xy, this.xy, this.radius/5, this.endAngle - 0.00001, this.startAngle + 0.00001, true);
+            c.fill();
+            
+            c.beginPath();
+                c.lineWidth = this.lineWidth / 4;
+                var length = 50;
+                c.strokeStyle = r ? this.o.fgColor : this.fgColor ;
+                c.moveTo(this.xy, this.xy);
+                c.lineTo(this.xy + (this.radius*(Math.sin(a))), this.xy - (this.radius*(Math.cos(a))));
+            c.stroke();
         };
 
         this.cancel = function () {

From 62269709f6335afb6cb8fb1dc0b6556e808266ba Mon Sep 17 00:00:00 2001
From: jarek <jarek@jarek-desktop.(none)>
Date: Fri, 20 Dec 2013 17:23:31 +0000
Subject: [PATCH 2/2] gauge initial version

---
 index.html        |  6 +++---
 js/jquery.knob.js | 32 ++++++++++++++++++++++++++++----
 2 files changed, 31 insertions(+), 7 deletions(-)

diff --git a/index.html b/index.html
index 472b50a..3edee20 100755
--- a/index.html
+++ b/index.html
@@ -120,7 +120,7 @@ <h1>jQuery Knob</h1>
 data-width="100"
 data-displayInput=false
             </pre>
-            <input class="knob" data-width="100" data-displayInput=false value="35">
+            <input class="knob" data-width="100" data-min="0" data-angleOffset=-125 data-angleArc=250 data-max="160" data-displayInput=false value="35">
         </div>
         <div class="demo">
             <p>&#215; 'cursor' mode</p>
@@ -130,7 +130,7 @@ <h1>jQuery Knob</h1>
 data-thickness=.3
 data-fgColor="#222222"
             </pre>
-            <input class="knob" data-width="150" data-cursor=true data-fgColor="#222222" data-thickness=.3 value="29">
+            <input class="knob" data-width="150" data-cursor=true data-angleOffset=-125 data-angleArc=250 data-min="0" data-max="160" data-fgColor="#222222" data-thickness=.3 value="29">
         </div>
         <div class="demo" >
             <p>&#215; Display previous value</p>
@@ -138,7 +138,7 @@ <h1>jQuery Knob</h1>
 data-displayPrevious=true
 data-min="-100"
             </pre>
-            <input class="knob" data-width="200" data-min="-100" data-displayPrevious=true value="44">
+            <input class="knob" data-angleOffset=-125 data-width="200"  data-angleOffset=-125 data-angleArc=250  data-min="0" data-max="160" data-displayPrevious=true value="44">
         </div>
         <div style="clear:both"></div>
         <div class="demo">
diff --git a/js/jquery.knob.js b/js/jquery.knob.js
index fb502ab..72a99ea 100755
--- a/js/jquery.knob.js
+++ b/js/jquery.knob.js
@@ -724,7 +724,7 @@
                 c.strokeStyle = this.o.bgColor;
                 c.arc(this.xy, this.xy, this.radius, this.endAngle - 0.00001, this.startAngle + 0.00001, true);
             c.stroke();
-
+            /*
             if (this.o.displayPrevious) {
                 ea = this.startAngle + this.angle(this.v);
                 sa = this.startAngle;
@@ -738,24 +738,48 @@
                 c.stroke();
                 r = (this.cv == this.v);
             }
-            /*
+            
             c.beginPath();
                 c.strokeStyle = r ? this.o.fgColor : this.fgColor ;
                 c.arc(this.xy, this.xy, this.radius, sat - 0.00001, eat + 0.00001, false);
             c.stroke();
-             */
+            */
             c.beginPath();
                 c.fillStyle = r ? this.o.fgColor : this.fgColor ;
                 c.arc(this.xy, this.xy, this.radius/5, this.endAngle - 0.00001, this.startAngle + 0.00001, true);
             c.fill();
             
+            
+            
             c.beginPath();
                 c.lineWidth = this.lineWidth / 4;
                 var length = 50;
                 c.strokeStyle = r ? this.o.fgColor : this.fgColor ;
                 c.moveTo(this.xy, this.xy);
-                c.lineTo(this.xy + (this.radius*(Math.sin(a))), this.xy - (this.radius*(Math.cos(a))));
+                c.lineTo(this.xy + (this.radius*(Math.cos(eat))), this.xy + (this.radius*(Math.sin(eat))));
             c.stroke();
+            
+            c.save();
+  
+            var ticks = [0,20,40,60,80,100,120,140];
+            var label;
+            var angle;
+            var fontSize = this.lineWidth / 2;
+            var labelWidth;
+            for(var i = 0; i < ticks.length; i++){
+                if(ticks[i] < this.o.min || ticks[i] > this.o.max ) continue;
+                angle = this.angle(ticks[i]);
+                console.log(angle);
+                label = ticks[i].toFixed();
+                c.save();
+                c.translate(this.xy + (this.radius*(Math.cos(sat + angle))), this.xy + (this.radius*(Math.sin(sat + angle))));
+                c.font = fontSize + "px Arial";
+                labelWidth = c.measureText(label).width;
+                c.fillText(label, 0 - (labelWidth/2), 0 + (fontSize/2));
+                c.restore();
+            }
+            c.restore();
+                     
         };
 
         this.cancel = function () {