Start again

vendors/gauge.js/.bower.json

@@ -0,0 +1,24 @@
+{
+  "name": "bernii/gauge.js",
+  "version": "1.2.1",
+  "main": [
+    "dist/gauge.js",
+    "dist/gauge.min.js",
+    "dist/gauge.coffee"
+  ],
+  "description": "100% native and cool looking animated JavaScript/CoffeScript gauge",
+  "license": "MIT",
+  "ignore": [],
+  "dependencies": {},
+  "devDependencies": {},
+  "homepage": "https://github.com/bernii/gauge.js",
+  "_release": "1.2.1",
+  "_resolution": {
+    "type": "version",
+    "tag": "v1.2.1",
+    "commit": "7ae09f41e1293f21ffbb9d233e9daed52629885b"
+  },
+  "_source": "https://github.com/bernii/gauge.js.git",
+  "_target": "^1.2.1",
+  "_originalSource": "gauge.js"
+}

vendors/gauge.js/README.md

@@ -0,0 +1,35 @@
+gauge.js
+========
+
+100% native and cool looking animated JavaScript/CoffeScript gauge
+
+ * No images, no external CSS - pure canvas
+ * No dependencies
+ * Highly configurable
+ * Resolution independent
+ * Animated guage value changes
+ * Works in all major browsers
+ * MIT License
+
+## Usage
+
+```javascript
+var opts = {
+  lines: 12, // The number of lines to draw
+  angle: 0.15, // The length of each line
+  lineWidth: 0.44, // The line thickness
+  pointer: {
+    length: 0.9, // The radius of the inner circle
+    strokeWidth: 0.035 // The rotation offset
+  },
+  colorStart: '#6FADCF',   // Colors
+  colorStop: '#8FC0DA',    // just experiment with them
+  strokeColor: '#E0E0E0'   // to see which ones work best for you
+};
+var target = document.getElementById('foo'); // your canvas element
+var gauge = new Gauge(target).setOptions(opts); // create sexy gauge!
+gauge.value = 1250; // set actual value
+gauge.maxValue = 3000; // set max gauge value
+```
+
+For an interactive demo and a list of all supported options please refer to the [project's homepage](http://bernii.github.com/gauge.js).

vendors/gauge.js/assets/excanvas.compiled.js

@@ -0,0 +1,35 @@
+// Copyright 2006 Google Inc.
+//
+// Licensed under the Apache License, Version 2.0 (the "License");
+// you may not use this file except in compliance with the License.
+// You may obtain a copy of the License at
+//
+//   http://www.apache.org/licenses/LICENSE-2.0
+//
+// Unless required by applicable law or agreed to in writing, software
+// distributed under the License is distributed on an "AS IS" BASIS,
+// WITHOUT WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied.
+// See the License for the specific language governing permissions and
+// limitations under the License.
+document.createElement("canvas").getContext||(function(){var s=Math,j=s.round,F=s.sin,G=s.cos,V=s.abs,W=s.sqrt,k=10,v=k/2;function X(){return this.context_||(this.context_=new H(this))}var L=Array.prototype.slice;function Y(b,a){var c=L.call(arguments,2);return function(){return b.apply(a,c.concat(L.call(arguments)))}}var M={init:function(b){if(/MSIE/.test(navigator.userAgent)&&!window.opera){var a=b||document;a.createElement("canvas");a.attachEvent("onreadystatechange",Y(this.init_,this,a))}},init_:function(b){b.namespaces.g_vml_||
+b.namespaces.add("g_vml_","urn:schemas-microsoft-com:vml","#default#VML");b.namespaces.g_o_||b.namespaces.add("g_o_","urn:schemas-microsoft-com:office:office","#default#VML");if(!b.styleSheets.ex_canvas_){var a=b.createStyleSheet();a.owningElement.id="ex_canvas_";a.cssText="canvas{display:inline-block;overflow:hidden;text-align:left;width:300px;height:150px}g_vml_\\:*{behavior:url(#default#VML)}g_o_\\:*{behavior:url(#default#VML)}"}var c=b.getElementsByTagName("canvas"),d=0;for(;d<c.length;d++)this.initElement(c[d])},
+initElement:function(b){if(!b.getContext){b.getContext=X;b.innerHTML="";b.attachEvent("onpropertychange",Z);b.attachEvent("onresize",$);var a=b.attributes;if(a.width&&a.width.specified)b.style.width=a.width.nodeValue+"px";else b.width=b.clientWidth;if(a.height&&a.height.specified)b.style.height=a.height.nodeValue+"px";else b.height=b.clientHeight}return b}};function Z(b){var a=b.srcElement;switch(b.propertyName){case "width":a.style.width=a.attributes.width.nodeValue+"px";a.getContext().clearRect();
+break;case "height":a.style.height=a.attributes.height.nodeValue+"px";a.getContext().clearRect();break}}function $(b){var a=b.srcElement;if(a.firstChild){a.firstChild.style.width=a.clientWidth+"px";a.firstChild.style.height=a.clientHeight+"px"}}M.init();var N=[],B=0;for(;B<16;B++){var C=0;for(;C<16;C++)N[B*16+C]=B.toString(16)+C.toString(16)}function I(){return[[1,0,0],[0,1,0],[0,0,1]]}function y(b,a){var c=I(),d=0;for(;d<3;d++){var f=0;for(;f<3;f++){var h=0,g=0;for(;g<3;g++)h+=b[d][g]*a[g][f];c[d][f]=
+h}}return c}function O(b,a){a.fillStyle=b.fillStyle;a.lineCap=b.lineCap;a.lineJoin=b.lineJoin;a.lineWidth=b.lineWidth;a.miterLimit=b.miterLimit;a.shadowBlur=b.shadowBlur;a.shadowColor=b.shadowColor;a.shadowOffsetX=b.shadowOffsetX;a.shadowOffsetY=b.shadowOffsetY;a.strokeStyle=b.strokeStyle;a.globalAlpha=b.globalAlpha;a.arcScaleX_=b.arcScaleX_;a.arcScaleY_=b.arcScaleY_;a.lineScale_=b.lineScale_}function P(b){var a,c=1;b=String(b);if(b.substring(0,3)=="rgb"){var d=b.indexOf("(",3),f=b.indexOf(")",d+
+1),h=b.substring(d+1,f).split(",");a="#";var g=0;for(;g<3;g++)a+=N[Number(h[g])];if(h.length==4&&b.substr(3,1)=="a")c=h[3]}else a=b;return{color:a,alpha:c}}function aa(b){switch(b){case "butt":return"flat";case "round":return"round";case "square":default:return"square"}}function H(b){this.m_=I();this.mStack_=[];this.aStack_=[];this.currentPath_=[];this.fillStyle=this.strokeStyle="#000";this.lineWidth=1;this.lineJoin="miter";this.lineCap="butt";this.miterLimit=k*1;this.globalAlpha=1;this.canvas=b;
+var a=b.ownerDocument.createElement("div");a.style.width=b.clientWidth+"px";a.style.height=b.clientHeight+"px";a.style.overflow="hidden";a.style.position="absolute";b.appendChild(a);this.element_=a;this.lineScale_=this.arcScaleY_=this.arcScaleX_=1}var i=H.prototype;i.clearRect=function(){this.element_.innerHTML=""};i.beginPath=function(){this.currentPath_=[]};i.moveTo=function(b,a){var c=this.getCoords_(b,a);this.currentPath_.push({type:"moveTo",x:c.x,y:c.y});this.currentX_=c.x;this.currentY_=c.y};
+i.lineTo=function(b,a){var c=this.getCoords_(b,a);this.currentPath_.push({type:"lineTo",x:c.x,y:c.y});this.currentX_=c.x;this.currentY_=c.y};i.bezierCurveTo=function(b,a,c,d,f,h){var g=this.getCoords_(f,h),l=this.getCoords_(b,a),e=this.getCoords_(c,d);Q(this,l,e,g)};function Q(b,a,c,d){b.currentPath_.push({type:"bezierCurveTo",cp1x:a.x,cp1y:a.y,cp2x:c.x,cp2y:c.y,x:d.x,y:d.y});b.currentX_=d.x;b.currentY_=d.y}i.quadraticCurveTo=function(b,a,c,d){var f=this.getCoords_(b,a),h=this.getCoords_(c,d),g={x:this.currentX_+
+0.6666666666666666*(f.x-this.currentX_),y:this.currentY_+0.6666666666666666*(f.y-this.currentY_)};Q(this,g,{x:g.x+(h.x-this.currentX_)/3,y:g.y+(h.y-this.currentY_)/3},h)};i.arc=function(b,a,c,d,f,h){c*=k;var g=h?"at":"wa",l=b+G(d)*c-v,e=a+F(d)*c-v,m=b+G(f)*c-v,r=a+F(f)*c-v;if(l==m&&!h)l+=0.125;var n=this.getCoords_(b,a),o=this.getCoords_(l,e),q=this.getCoords_(m,r);this.currentPath_.push({type:g,x:n.x,y:n.y,radius:c,xStart:o.x,yStart:o.y,xEnd:q.x,yEnd:q.y})};i.rect=function(b,a,c,d){this.moveTo(b,
+a);this.lineTo(b+c,a);this.lineTo(b+c,a+d);this.lineTo(b,a+d);this.closePath()};i.strokeRect=function(b,a,c,d){var f=this.currentPath_;this.beginPath();this.moveTo(b,a);this.lineTo(b+c,a);this.lineTo(b+c,a+d);this.lineTo(b,a+d);this.closePath();this.stroke();this.currentPath_=f};i.fillRect=function(b,a,c,d){var f=this.currentPath_;this.beginPath();this.moveTo(b,a);this.lineTo(b+c,a);this.lineTo(b+c,a+d);this.lineTo(b,a+d);this.closePath();this.fill();this.currentPath_=f};i.createLinearGradient=function(b,
+a,c,d){var f=new D("gradient");f.x0_=b;f.y0_=a;f.x1_=c;f.y1_=d;return f};i.createRadialGradient=function(b,a,c,d,f,h){var g=new D("gradientradial");g.x0_=b;g.y0_=a;g.r0_=c;g.x1_=d;g.y1_=f;g.r1_=h;return g};i.drawImage=function(b){var a,c,d,f,h,g,l,e,m=b.runtimeStyle.width,r=b.runtimeStyle.height;b.runtimeStyle.width="auto";b.runtimeStyle.height="auto";var n=b.width,o=b.height;b.runtimeStyle.width=m;b.runtimeStyle.height=r;if(arguments.length==3){a=arguments[1];c=arguments[2];h=g=0;l=d=n;e=f=o}else if(arguments.length==
+5){a=arguments[1];c=arguments[2];d=arguments[3];f=arguments[4];h=g=0;l=n;e=o}else if(arguments.length==9){h=arguments[1];g=arguments[2];l=arguments[3];e=arguments[4];a=arguments[5];c=arguments[6];d=arguments[7];f=arguments[8]}else throw Error("Invalid number of arguments");var q=this.getCoords_(a,c),t=[];t.push(" <g_vml_:group",' coordsize="',k*10,",",k*10,'"',' coordorigin="0,0"',' style="width:',10,"px;height:",10,"px;position:absolute;");if(this.m_[0][0]!=1||this.m_[0][1]){var E=[];E.push("M11=",
+this.m_[0][0],",","M12=",this.m_[1][0],",","M21=",this.m_[0][1],",","M22=",this.m_[1][1],",","Dx=",j(q.x/k),",","Dy=",j(q.y/k),"");var p=q,z=this.getCoords_(a+d,c),w=this.getCoords_(a,c+f),x=this.getCoords_(a+d,c+f);p.x=s.max(p.x,z.x,w.x,x.x);p.y=s.max(p.y,z.y,w.y,x.y);t.push("padding:0 ",j(p.x/k),"px ",j(p.y/k),"px 0;filter:progid:DXImageTransform.Microsoft.Matrix(",E.join(""),", sizingmethod='clip');")}else t.push("top:",j(q.y/k),"px;left:",j(q.x/k),"px;");t.push(' ">','<g_vml_:image src="',b.src,
+'"',' style="width:',k*d,"px;"," height:",k*f,'px;"',' cropleft="',h/n,'"',' croptop="',g/o,'"',' cropright="',(n-h-l)/n,'"',' cropbottom="',(o-g-e)/o,'"'," />","</g_vml_:group>");this.element_.insertAdjacentHTML("BeforeEnd",t.join(""))};i.stroke=function(b){var a=[],c=P(b?this.fillStyle:this.strokeStyle),d=c.color,f=c.alpha*this.globalAlpha;a.push("<g_vml_:shape",' filled="',!!b,'"',' style="position:absolute;width:',10,"px;height:",10,'px;"',' coordorigin="0 0" coordsize="',k*10," ",k*10,'"',' stroked="',
+!b,'"',' path="');var h={x:null,y:null},g={x:null,y:null},l=0;for(;l<this.currentPath_.length;l++){var e=this.currentPath_[l];switch(e.type){case "moveTo":a.push(" m ",j(e.x),",",j(e.y));break;case "lineTo":a.push(" l ",j(e.x),",",j(e.y));break;case "close":a.push(" x ");e=null;break;case "bezierCurveTo":a.push(" c ",j(e.cp1x),",",j(e.cp1y),",",j(e.cp2x),",",j(e.cp2y),",",j(e.x),",",j(e.y));break;case "at":case "wa":a.push(" ",e.type," ",j(e.x-this.arcScaleX_*e.radius),",",j(e.y-this.arcScaleY_*e.radius),
+" ",j(e.x+this.arcScaleX_*e.radius),",",j(e.y+this.arcScaleY_*e.radius)," ",j(e.xStart),",",j(e.yStart)," ",j(e.xEnd),",",j(e.yEnd));break}if(e){if(h.x==null||e.x<h.x)h.x=e.x;if(g.x==null||e.x>g.x)g.x=e.x;if(h.y==null||e.y<h.y)h.y=e.y;if(g.y==null||e.y>g.y)g.y=e.y}}a.push(' ">');if(b)if(typeof this.fillStyle=="object"){var m=this.fillStyle,r=0,n={x:0,y:0},o=0,q=1;if(m.type_=="gradient"){var t=m.x1_/this.arcScaleX_,E=m.y1_/this.arcScaleY_,p=this.getCoords_(m.x0_/this.arcScaleX_,m.y0_/this.arcScaleY_),
+z=this.getCoords_(t,E);r=Math.atan2(z.x-p.x,z.y-p.y)*180/Math.PI;if(r<0)r+=360;if(r<1.0E-6)r=0}else{var p=this.getCoords_(m.x0_,m.y0_),w=g.x-h.x,x=g.y-h.y;n={x:(p.x-h.x)/w,y:(p.y-h.y)/x};w/=this.arcScaleX_*k;x/=this.arcScaleY_*k;var R=s.max(w,x);o=2*m.r0_/R;q=2*m.r1_/R-o}var u=m.colors_;u.sort(function(ba,ca){return ba.offset-ca.offset});var J=u.length,da=u[0].color,ea=u[J-1].color,fa=u[0].alpha*this.globalAlpha,ga=u[J-1].alpha*this.globalAlpha,S=[],l=0;for(;l<J;l++){var T=u[l];S.push(T.offset*q+
+o+" "+T.color)}a.push('<g_vml_:fill type="',m.type_,'"',' method="none" focus="100%"',' color="',da,'"',' color2="',ea,'"',' colors="',S.join(","),'"',' opacity="',ga,'"',' g_o_:opacity2="',fa,'"',' angle="',r,'"',' focusposition="',n.x,",",n.y,'" />')}else a.push('<g_vml_:fill color="',d,'" opacity="',f,'" />');else{var K=this.lineScale_*this.lineWidth;if(K<1)f*=K;a.push("<g_vml_:stroke",' opacity="',f,'"',' joinstyle="',this.lineJoin,'"',' miterlimit="',this.miterLimit,'"',' endcap="',aa(this.lineCap),
+'"',' weight="',K,'px"',' color="',d,'" />')}a.push("</g_vml_:shape>");this.element_.insertAdjacentHTML("beforeEnd",a.join(""))};i.fill=function(){this.stroke(true)};i.closePath=function(){this.currentPath_.push({type:"close"})};i.getCoords_=function(b,a){var c=this.m_;return{x:k*(b*c[0][0]+a*c[1][0]+c[2][0])-v,y:k*(b*c[0][1]+a*c[1][1]+c[2][1])-v}};i.save=function(){var b={};O(this,b);this.aStack_.push(b);this.mStack_.push(this.m_);this.m_=y(I(),this.m_)};i.restore=function(){O(this.aStack_.pop(),
+this);this.m_=this.mStack_.pop()};function ha(b){var a=0;for(;a<3;a++){var c=0;for(;c<2;c++)if(!isFinite(b[a][c])||isNaN(b[a][c]))return false}return true}function A(b,a,c){if(!!ha(a)){b.m_=a;if(c)b.lineScale_=W(V(a[0][0]*a[1][1]-a[0][1]*a[1][0]))}}i.translate=function(b,a){A(this,y([[1,0,0],[0,1,0],[b,a,1]],this.m_),false)};i.rotate=function(b){var a=G(b),c=F(b);A(this,y([[a,c,0],[-c,a,0],[0,0,1]],this.m_),false)};i.scale=function(b,a){this.arcScaleX_*=b;this.arcScaleY_*=a;A(this,y([[b,0,0],[0,a,
+0],[0,0,1]],this.m_),true)};i.transform=function(b,a,c,d,f,h){A(this,y([[b,a,0],[c,d,0],[f,h,1]],this.m_),true)};i.setTransform=function(b,a,c,d,f,h){A(this,[[b,a,0],[c,d,0],[f,h,1]],true)};i.clip=function(){};i.arcTo=function(){};i.createPattern=function(){return new U};function D(b){this.type_=b;this.r1_=this.y1_=this.x1_=this.r0_=this.y0_=this.x0_=0;this.colors_=[]}D.prototype.addColorStop=function(b,a){a=P(a);this.colors_.push({offset:b,color:a.color,alpha:a.alpha})};function U(){}G_vmlCanvasManager=
+M;CanvasRenderingContext2D=H;CanvasGradient=D;CanvasPattern=U})();

vendors/gauge.js/assets/fd-slider/fd-slider-tooltip.css

@@ -0,0 +1,117 @@
+/*
+  Sample tooltip code. Only works on grade A browsers (so no IE6,7 or 8).
+  
+  See: http://nicolasgallagher.com/multiple-backgrounds-and-borders-with-css2/ for full info on
+  how to style generated content & the associated pitfalls
+  
+  This code to be taken as experimental & untested - use at your discretion
+  
+  If showing the tooltip above the sider handle you are relegated to showing
+  single line tooltips due to styling constraints! 
+*/
+
+.fd-slider-handle:before,
+.fd-slider-handle:after
+        {
+        /* Remove from screen */
+        opacity:0;
+        /* The following rules are not really needed as no browser yet supports CSS transitions
+           on generated content but I'll leave it in for the day when they do! */
+           
+        /* Firefox */
+        -moz-transition-property: opacity;
+        -moz-transition-duration: 1s;
+        -moz-transition-delay: 1s;
+        /* WebKit */
+        -webkit-transition-property: opacity;
+        -webkit-transition-duration: 1s;
+        -webkit-transition-delay: 1s;
+        /* Opera */
+        -o-transition-property: opacity;
+        -o-transition-duration: 1s;
+        -o-transition-delay: 1s;
+        /* Standard */
+        transition-property: opacity;
+        transition-duration: 1s;
+        transition-delay: 1s;
+        }
+/* 
+   The tooltip body - as we position it above the slider and position the tooltip arrow
+   below it, we need to know the height of the body. This means that multi-line tooltips
+   are not supported.
+   
+   To support multi-line tooltips, you will need to position the tooltip below the slider 
+   and the tooltip pointer above the tooltip body. Additionally, you will have to set the
+   tooltip bodies "height" to auto
+*/
+.fd-slider-focused .fd-slider-handle:before,
+.fd-slider-hover   .fd-slider-handle:before,
+.fd-slider-active  .fd-slider-handle:before
+        {
+        display:block;
+        position:absolute;
+        top:-21px;
+        left:-8px;
+        margin:0;
+        width:20px;
+        padding:3px;
+        height:14px;
+        line-height:12px;
+        text-align: center;
+        font-size:10px;
+        font-weight: bold;
+        color:#fff;
+        text-shadow: 1px 1px 1px #1a3a95;
+        background:#2f6ee0;
+        z-index:1;
+        /* Use the ARIA valuetext property, set by the script, to generate the tooltip content */    
+        content:attr(aria-valuetext);  
+        /* Border radius and box shadow */          
+        -moz-border-radius:3px;
+        -webkit-border-radius:3px;
+        border-radius:3px;
+        -moz-background-clip: padding; 
+        -webkit-background-clip: padding-box; 
+        background-clip: padding-box;  
+        -moz-box-shadow: 0 0 4px #aaa;
+        -webkit-box-shadow: 0 0 4px #aaa;
+        box-shadow: 0px 0px 4px #999; 
+        /* Change opacity for transition */
+        opacity: 1;
+        }
+/* The tooltip pointer */ 
+.fd-slider-focused .fd-slider-handle:after,
+.fd-slider-hover   .fd-slider-handle:after,
+.fd-slider-active  .fd-slider-handle:after
+        {
+        outline:none;
+        content:"";  
+        display:block;        
+        position:absolute;
+        top:-9px;
+        left:50%;
+        margin:0 0 0 -5px;
+        background:#2f6ee0;
+        z-index:2;
+        width:10px;
+        height:10px;
+        overflow:hidden;
+        /* Rotate element by 45 degress to get the "\/" pointer effect */
+        -webkit-transform: rotate(45deg); 
+        -moz-transform: rotate(45deg);
+        -o-transform: rotate(45deg);
+        /* Add a box shadow */	
+        -moz-box-shadow: 0 0 4px #aaa;
+        -webkit-box-shadow: 0 0 4px #aaa;
+        box-shadow: 0 0 4px #aaa;
+        /* Clip */
+        clip:rect(4px, 14px, 14px, 4px); 
+        /* Change opacity for transition */        
+        opacity: 1;             
+        }
+/* Remove completely for IE */
+.oldie .fd-slider-handle:before,
+.oldie .fd-slider-handle:after
+        {
+        display:none;
+        }      

vendors/gauge.js/assets/fd-slider/fd-slider.css

@@ -0,0 +1,143 @@
+
+/* The styles given to the associated form element in order to hide it */
+.fd-form-element-hidden, input.fd-form-element-hidden
+        {
+        display:none;
+        }
+/* Horizontal Outer wrapper - all other DOM elements added as children to this top level wrapper */
+.fd-slider
+        {
+        width:100%;
+        /* The height of the slider handle */
+        height:20px;
+        margin:0;
+        }
+/* Vertical Outer wrapper - all other DOM elements added as children to this top level wrapper */
+.fd-slider-vertical
+        {
+        /* The width of the slider handle */
+        width:20px;
+        /* Fill the available space */
+        height:100%;
+        /* Set a 10 pixel right and bottom margin */
+        margin:0 10px 10px 0;
+        /* You may wish to float the vertical sliders left or display:inline-block */
+        /* float:left; */
+        }
+/* Shared rules - both horizontal & vertical sliders */
+.fd-slider,
+.fd-slider-vertical
+        {
+        /* display:block required as the wrapper element is a span */
+        display:block;
+        /* This lets us absolutely position the drag handle */
+        position:relative;
+        text-decoration:none;
+        border:0 none;
+        -moz-user-select:none;
+        -khtml-user-select:none;
+        -webkit-touch-callout:none;
+        user-select:none;
+        }
+.fd-slider-inner
+        {
+        /* Used by IE for the onfocus blur effect */
+        display:none;
+        }
+
+/* The inner track bar */
+.fd-slider-bar
+        {
+        position:absolute;
+        display:block;
+        z-index:2;
+        height:6px;
+        width:100%;
+        border:1px solid #bbb;
+        border-bottom:1px solid #fff;
+        border-right:1px solid #fff;
+        margin:0;
+        padding:0;
+        overflow:hidden;
+        line-height:4px;
+        top:8px;
+        -moz-border-radius:4px;
+        -webkit-border-radius:4px;
+        border-radius:4px;
+        -moz-background-clip: padding;
+        -webkit-background-clip: padding-box;
+        background-clip: padding-box;
+        background-color: #333;
+        }
+/* The animated range bar */
+.fd-slider-range
+        {
+        position:absolute;
+        display:block;
+        z-index:3;
+        height:6px;
+        margin:0;
+        padding:0 2px 0 0;
+        overflow:hidden;
+        top:9px;
+        -moz-border-radius:2px;
+        -webkit-border-radius:2px;
+        border-radius:2px;
+        -moz-background-clip: padding;
+        -webkit-background-clip: padding-box;
+        background-clip: padding-box;
+        background-color: #eee;
+        }
+/* The drag handle */
+.fd-slider-handle
+        {
+        position:absolute;
+        display:block;
+        padding:0;
+        border:0 none;
+        margin:0 0 0 1px;
+        z-index:3;
+        top:5px;
+        left:0;
+        width:12px;
+        height:12px;
+        line-height: 1px !important;
+        outline:0 none;
+        background: #eee;
+        border: 1px solid #aaa;
+        border-radius: 12px;
+        -webkit-user-select: none;
+        -webkit-touch-callout:none;
+        -moz-user-select:none;
+        -moz-user-focus:none;
+        -moz-outline:0 none;
+        user-select:none;
+        }
+/* Focus styles */
+.fd-slider-handle:focus
+        {
+        outline:0 none;
+        border:0 none;
+        -moz-user-focus:normal;
+        }
+button.fd-slider-handle:focus::-moz-focus-inner
+        {
+        border-color: transparent;
+        }
+
+body.fd-slider-drag-vertical,
+body.fd-slider-drag-vertical *
+        {
+        /* Stop text selection */
+        -moz-user-select:none;
+        -webkit-user-select:none;
+        user-select:none;
+        }
+body.fd-slider-drag-horizontal,
+body.fd-slider-drag-horizontal *
+        {
+        /* Stop text selection */
+        -moz-user-select:none;
+        -webkit-user-select:none;
+        user-select:none;
+        }

vendors/gauge.js/assets/jscolor.js

@@ -0,0 +1,935 @@
+/**
+ * jscolor, JavaScript Color Picker
+ *
+ * @version 1.3.13
+ * @license GNU Lesser General Public License, http://www.gnu.org/copyleft/lesser.html
+ * @author  Jan Odvarko, http://odvarko.cz
+ * @created 2008-06-15
+ * @updated 2012-01-19
+ * @link    http://jscolor.com
+ */
+
+
+var jscolor = {
+
+
+	dir : '', // location of jscolor directory (leave empty to autodetect)
+	bindClass : 'color', // class name
+	binding : true, // automatic binding via <input class="...">
+	preloading : true, // use image preloading?
+
+
+	install : function() {
+		jscolor.addEvent(window, 'load', jscolor.init);
+	},
+
+
+	init : function() {
+		if(jscolor.binding) {
+			jscolor.bind();
+		}
+		if(jscolor.preloading) {
+			jscolor.preload();
+		}
+	},
+
+
+	getDir : function() {
+		if(!jscolor.dir) {
+			var detected = jscolor.detectDir();
+			jscolor.dir = detected!==false ? detected : 'jscolor/';
+		}
+		return jscolor.dir;
+	},
+
+
+	detectDir : function() {
+		var base = location.href;
+
+		var e = document.getElementsByTagName('base');
+		for(var i=0; i<e.length; i+=1) {
+			if(e[i].href) { base = e[i].href; }
+		}
+
+		var e = document.getElementsByTagName('script');
+		for(var i=0; i<e.length; i+=1) {
+			if(e[i].src && /(^|\/)jscolor\.js([?#].*)?$/i.test(e[i].src)) {
+				var src = new jscolor.URI(e[i].src);
+				var srcAbs = src.toAbsolute(base);
+				srcAbs.path = srcAbs.path.replace(/[^\/]+$/, ''); // remove filename
+				srcAbs.query = null;
+				srcAbs.fragment = null;
+				return srcAbs.toString();
+			}
+		}
+		return false;
+	},
+
+
+	bind : function() {
+		var matchClass = new RegExp('(^|\\s)('+jscolor.bindClass+')\\s*(\\{[^}]*\\})?', 'i');
+		var e = document.getElementsByTagName('input');
+		for(var i=0; i<e.length; i+=1) {
+			var m;
+			if(!e[i].color && e[i].className && (m = e[i].className.match(matchClass))) {
+				var prop = {};
+				if(m[3]) {
+					try {
+						eval('prop='+m[3]);
+					} catch(eInvalidProp) {}
+				}
+				e[i].color = new jscolor.color(e[i], prop);
+			}
+		}
+	},
+
+
+	preload : function() {
+		for(var fn in jscolor.imgRequire) {
+			if(jscolor.imgRequire.hasOwnProperty(fn)) {
+				jscolor.loadImage(fn);
+			}
+		}
+	},
+
+
+	images : {
+		pad : [ 181, 101 ],
+		sld : [ 16, 101 ],
+		cross : [ 15, 15 ],
+		arrow : [ 7, 11 ]
+	},
+
+
+	imgRequire : {},
+	imgLoaded : {},
+
+
+	requireImage : function(filename) {
+		jscolor.imgRequire[filename] = true;
+	},
+
+
+	loadImage : function(filename) {
+		if(!jscolor.imgLoaded[filename]) {
+			jscolor.imgLoaded[filename] = new Image();
+			jscolor.imgLoaded[filename].src = jscolor.getDir()+filename;
+		}
+	},
+
+
+	fetchElement : function(mixed) {
+		return typeof mixed === 'string' ? document.getElementById(mixed) : mixed;
+	},
+
+
+	addEvent : function(el, evnt, func) {
+		if(el.addEventListener) {
+			el.addEventListener(evnt, func, false);
+		} else if(el.attachEvent) {
+			el.attachEvent('on'+evnt, func);
+		}
+	},
+
+
+	fireEvent : function(el, evnt) {
+		if(!el) {
+			return;
+		}
+		if(document.createEvent) {
+			var ev = document.createEvent('HTMLEvents');
+			ev.initEvent(evnt, true, true);
+			el.dispatchEvent(ev);
+		} else if(document.createEventObject) {
+			var ev = document.createEventObject();
+			el.fireEvent('on'+evnt, ev);
+		} else if(el['on'+evnt]) { // alternatively use the traditional event model (IE5)
+			el['on'+evnt]();
+		}
+	},
+
+
+	getElementPos : function(e) {
+		var e1=e, e2=e;
+		var x=0, y=0;
+		if(e1.offsetParent) {
+			do {
+				x += e1.offsetLeft;
+				y += e1.offsetTop;
+			} while(e1 = e1.offsetParent);
+		}
+		while((e2 = e2.parentNode) && e2.nodeName.toUpperCase() !== 'BODY') {
+			x -= e2.scrollLeft;
+			y -= e2.scrollTop;
+		}
+		return [x, y];
+	},
+
+
+	getElementSize : function(e) {
+		return [e.offsetWidth, e.offsetHeight];
+	},
+
+
+	getRelMousePos : function(e) {
+		var x = 0, y = 0;
+		if (!e) { e = window.event; }
+		if (typeof e.offsetX === 'number') {
+			x = e.offsetX;
+			y = e.offsetY;
+		} else if (typeof e.layerX === 'number') {
+			x = e.layerX;
+			y = e.layerY;
+		}
+		return { x: x, y: y };
+	},
+
+
+	getViewPos : function() {
+		if(typeof window.pageYOffset === 'number') {
+			return [window.pageXOffset, window.pageYOffset];
+		} else if(document.body && (document.body.scrollLeft || document.body.scrollTop)) {
+			return [document.body.scrollLeft, document.body.scrollTop];
+		} else if(document.documentElement && (document.documentElement.scrollLeft || document.documentElement.scrollTop)) {
+			return [document.documentElement.scrollLeft, document.documentElement.scrollTop];
+		} else {
+			return [0, 0];
+		}
+	},
+
+
+	getViewSize : function() {
+		if(typeof window.innerWidth === 'number') {
+			return [window.innerWidth, window.innerHeight];
+		} else if(document.body && (document.body.clientWidth || document.body.clientHeight)) {
+			return [document.body.clientWidth, document.body.clientHeight];
+		} else if(document.documentElement && (document.documentElement.clientWidth || document.documentElement.clientHeight)) {
+			return [document.documentElement.clientWidth, document.documentElement.clientHeight];
+		} else {
+			return [0, 0];
+		}
+	},
+
+
+	URI : function(uri) { // See RFC3986
+
+		this.scheme = null;
+		this.authority = null;
+		this.path = '';
+		this.query = null;
+		this.fragment = null;
+
+		this.parse = function(uri) {
+			var m = uri.match(/^(([A-Za-z][0-9A-Za-z+.-]*)(:))?((\/\/)([^\/?#]*))?([^?#]*)((\?)([^#]*))?((#)(.*))?/);
+			this.scheme = m[3] ? m[2] : null;
+			this.authority = m[5] ? m[6] : null;
+			this.path = m[7];
+			this.query = m[9] ? m[10] : null;
+			this.fragment = m[12] ? m[13] : null;
+			return this;
+		};
+
+		this.toString = function() {
+			var result = '';
+			if(this.scheme !== null) { result = result + this.scheme + ':'; }
+			if(this.authority !== null) { result = result + '//' + this.authority; }
+			if(this.path !== null) { result = result + this.path; }
+			if(this.query !== null) { result = result + '?' + this.query; }
+			if(this.fragment !== null) { result = result + '#' + this.fragment; }
+			return result;
+		};
+
+		this.toAbsolute = function(base) {
+			var base = new jscolor.URI(base);
+			var r = this;
+			var t = new jscolor.URI;
+
+			if(base.scheme === null) { return false; }
+
+			if(r.scheme !== null && r.scheme.toLowerCase() === base.scheme.toLowerCase()) {
+				r.scheme = null;
+			}
+
+			if(r.scheme !== null) {
+				t.scheme = r.scheme;
+				t.authority = r.authority;
+				t.path = removeDotSegments(r.path);
+				t.query = r.query;
+			} else {
+				if(r.authority !== null) {
+					t.authority = r.authority;
+					t.path = removeDotSegments(r.path);
+					t.query = r.query;
+				} else {
+					if(r.path === '') { // TODO: == or === ?
+						t.path = base.path;
+						if(r.query !== null) {
+							t.query = r.query;
+						} else {
+							t.query = base.query;
+						}
+					} else {
+						if(r.path.substr(0,1) === '/') {
+							t.path = removeDotSegments(r.path);
+						} else {
+							if(base.authority !== null && base.path === '') { // TODO: == or === ?
+								t.path = '/'+r.path;
+							} else {
+								t.path = base.path.replace(/[^\/]+$/,'')+r.path;
+							}
+							t.path = removeDotSegments(t.path);
+						}
+						t.query = r.query;
+					}
+					t.authority = base.authority;
+				}
+				t.scheme = base.scheme;
+			}
+			t.fragment = r.fragment;
+
+			return t;
+		};
+
+		function removeDotSegments(path) {
+			var out = '';
+			while(path) {
+				if(path.substr(0,3)==='../' || path.substr(0,2)==='./') {
+					path = path.replace(/^\.+/,'').substr(1);
+				} else if(path.substr(0,3)==='/./' || path==='/.') {
+					path = '/'+path.substr(3);
+				} else if(path.substr(0,4)==='/../' || path==='/..') {
+					path = '/'+path.substr(4);
+					out = out.replace(/\/?[^\/]*$/, '');
+				} else if(path==='.' || path==='..') {
+					path = '';
+				} else {
+					var rm = path.match(/^\/?[^\/]*/)[0];
+					path = path.substr(rm.length);
+					out = out + rm;
+				}
+			}
+			return out;
+		}
+
+		if(uri) {
+			this.parse(uri);
+		}
+
+	},
+
+
+	/*
+	 * Usage example:
+	 * var myColor = new jscolor.color(myInputElement)
+	 */
+
+	color : function(target, prop) {
+
+
+		this.required = true; // refuse empty values?
+		this.adjust = true; // adjust value to uniform notation?
+		this.hash = false; // prefix color with # symbol?
+		this.caps = true; // uppercase?
+		this.slider = true; // show the value/saturation slider?
+		this.valueElement = target; // value holder
+		this.styleElement = target; // where to reflect current color
+		this.onImmediateChange = null; // onchange callback (can be either string or function)
+		this.hsv = [0, 0, 1]; // read-only  0-6, 0-1, 0-1
+		this.rgb = [1, 1, 1]; // read-only  0-1, 0-1, 0-1
+
+		this.pickerOnfocus = true; // display picker on focus?
+		this.pickerMode = 'HSV'; // HSV | HVS
+		this.pickerPosition = 'bottom'; // left | right | top | bottom
+		this.pickerSmartPosition = true; // automatically adjust picker position when necessary
+		this.pickerButtonHeight = 20; // px
+		this.pickerClosable = false;
+		this.pickerCloseText = 'Close';
+		this.pickerButtonColor = 'ButtonText'; // px
+		this.pickerFace = 10; // px
+		this.pickerFaceColor = 'ThreeDFace'; // CSS color
+		this.pickerBorder = 1; // px
+		this.pickerBorderColor = 'ThreeDHighlight ThreeDShadow ThreeDShadow ThreeDHighlight'; // CSS color
+		this.pickerInset = 1; // px
+		this.pickerInsetColor = 'ThreeDShadow ThreeDHighlight ThreeDHighlight ThreeDShadow'; // CSS color
+		this.pickerZIndex = 10000;
+
+
+		for(var p in prop) {
+			if(prop.hasOwnProperty(p)) {
+				this[p] = prop[p];
+			}
+		}
+
+
+		this.hidePicker = function() {
+			if(isPickerOwner()) {
+				removePicker();
+			}
+		};
+
+
+		this.showPicker = function() {
+			if(!isPickerOwner()) {
+				var tp = jscolor.getElementPos(target); // target pos
+				var ts = jscolor.getElementSize(target); // target size
+				var vp = jscolor.getViewPos(); // view pos
+				var vs = jscolor.getViewSize(); // view size
+				var ps = getPickerDims(this); // picker size
+				var a, b, c;
+				switch(this.pickerPosition.toLowerCase()) {
+					case 'left': a=1; b=0; c=-1; break;
+					case 'right':a=1; b=0; c=1; break;
+					case 'top':  a=0; b=1; c=-1; break;
+					default:     a=0; b=1; c=1; break;
+				}
+				var l = (ts[b]+ps[b])/2;
+
+				// picker pos
+				if (!this.pickerSmartPosition) {
+					var pp = [
+						tp[a],
+						tp[b]+ts[b]-l+l*c
+					];
+				} else {
+					var pp = [
+						-vp[a]+tp[a]+ps[a] > vs[a] ?
+							(-vp[a]+tp[a]+ts[a]/2 > vs[a]/2 && tp[a]+ts[a]-ps[a] >= 0 ? tp[a]+ts[a]-ps[a] : tp[a]) :
+							tp[a],
+						-vp[b]+tp[b]+ts[b]+ps[b]-l+l*c > vs[b] ?
+							(-vp[b]+tp[b]+ts[b]/2 > vs[b]/2 && tp[b]+ts[b]-l-l*c >= 0 ? tp[b]+ts[b]-l-l*c : tp[b]+ts[b]-l+l*c) :
+							(tp[b]+ts[b]-l+l*c >= 0 ? tp[b]+ts[b]-l+l*c : tp[b]+ts[b]-l-l*c)
+					];
+				}
+				drawPicker(pp[a], pp[b]);
+			}
+		};
+
+
+		this.importColor = function() {
+			if(!valueElement) {
+				this.exportColor();
+			} else {
+				if(!this.adjust) {
+					if(!this.fromString(valueElement.value, leaveValue)) {
+						styleElement.style.backgroundImage = styleElement.jscStyle.backgroundImage;
+						styleElement.style.backgroundColor = styleElement.jscStyle.backgroundColor;
+						styleElement.style.color = styleElement.jscStyle.color;
+						this.exportColor(leaveValue | leaveStyle);
+					}
+				} else if(!this.required && /^\s*$/.test(valueElement.value)) {
+					valueElement.value = '';
+					styleElement.style.backgroundImage = styleElement.jscStyle.backgroundImage;
+					styleElement.style.backgroundColor = styleElement.jscStyle.backgroundColor;
+					styleElement.style.color = styleElement.jscStyle.color;
+					this.exportColor(leaveValue | leaveStyle);
+
+				} else if(this.fromString(valueElement.value)) {
+					// OK
+				} else {
+					this.exportColor();
+				}
+			}
+		};
+
+
+		this.exportColor = function(flags) {
+			if(!(flags & leaveValue) && valueElement) {
+				var value = this.toString();
+				if(this.caps) { value = value.toUpperCase(); }
+				if(this.hash) { value = '#'+value; }
+				valueElement.value = value;
+			}
+			if(!(flags & leaveStyle) && styleElement) {
+				styleElement.style.backgroundImage = "none";
+				styleElement.style.backgroundColor =
+					'#'+this.toString();
+				styleElement.style.color =
+					0.213 * this.rgb[0] +
+					0.715 * this.rgb[1] +
+					0.072 * this.rgb[2]
+					< 0.5 ? '#FFF' : '#000';
+			}
+			if(!(flags & leavePad) && isPickerOwner()) {
+				redrawPad();
+			}
+			if(!(flags & leaveSld) && isPickerOwner()) {
+				redrawSld();
+			}
+		};
+
+
+		this.fromHSV = function(h, s, v, flags) { // null = don't change
+			h<0 && (h=0) || h>6 && (h=6);
+			s<0 && (s=0) || s>1 && (s=1);
+			v<0 && (v=0) || v>1 && (v=1);
+			this.rgb = HSV_RGB(
+				h===null ? this.hsv[0] : (this.hsv[0]=h),
+				s===null ? this.hsv[1] : (this.hsv[1]=s),
+				v===null ? this.hsv[2] : (this.hsv[2]=v)
+			);
+			this.exportColor(flags);
+		};
+
+
+		this.fromRGB = function(r, g, b, flags) { // null = don't change
+			r<0 && (r=0) || r>1 && (r=1);
+			g<0 && (g=0) || g>1 && (g=1);
+			b<0 && (b=0) || b>1 && (b=1);
+			var hsv = RGB_HSV(
+				r===null ? this.rgb[0] : (this.rgb[0]=r),
+				g===null ? this.rgb[1] : (this.rgb[1]=g),
+				b===null ? this.rgb[2] : (this.rgb[2]=b)
+			);
+			if(hsv[0] !== null) {
+				this.hsv[0] = hsv[0];
+			}
+			if(hsv[2] !== 0) {
+				this.hsv[1] = hsv[1];
+			}
+			this.hsv[2] = hsv[2];
+			this.exportColor(flags);
+		};
+
+
+		this.fromString = function(hex, flags) {
+			var m = hex.match(/^\W*([0-9A-F]{3}([0-9A-F]{3})?)\W*$/i);
+			if(!m) {
+				return false;
+			} else {
+				if(m[1].length === 6) { // 6-char notation
+					this.fromRGB(
+						parseInt(m[1].substr(0,2),16) / 255,
+						parseInt(m[1].substr(2,2),16) / 255,
+						parseInt(m[1].substr(4,2),16) / 255,
+						flags
+					);
+				} else { // 3-char notation
+					this.fromRGB(
+						parseInt(m[1].charAt(0)+m[1].charAt(0),16) / 255,
+						parseInt(m[1].charAt(1)+m[1].charAt(1),16) / 255,
+						parseInt(m[1].charAt(2)+m[1].charAt(2),16) / 255,
+						flags
+					);
+				}
+				return true;
+			}
+		};
+
+
+		this.toString = function() {
+			return (
+				(0x100 | Math.round(255*this.rgb[0])).toString(16).substr(1) +
+				(0x100 | Math.round(255*this.rgb[1])).toString(16).substr(1) +
+				(0x100 | Math.round(255*this.rgb[2])).toString(16).substr(1)
+			);
+		};
+
+
+		function RGB_HSV(r, g, b) {
+			var n = Math.min(Math.min(r,g),b);
+			var v = Math.max(Math.max(r,g),b);
+			var m = v - n;
+			if(m === 0) { return [ null, 0, v ]; }
+			var h = r===n ? 3+(b-g)/m : (g===n ? 5+(r-b)/m : 1+(g-r)/m);
+			return [ h===6?0:h, m/v, v ];
+		}
+
+
+		function HSV_RGB(h, s, v) {
+			if(h === null) { return [ v, v, v ]; }
+			var i = Math.floor(h);
+			var f = i%2 ? h-i : 1-(h-i);
+			var m = v * (1 - s);
+			var n = v * (1 - s*f);
+			switch(i) {
+				case 6:
+				case 0: return [v,n,m];
+				case 1: return [n,v,m];
+				case 2: return [m,v,n];
+				case 3: return [m,n,v];
+				case 4: return [n,m,v];
+				case 5: return [v,m,n];
+			}
+		}
+
+
+		function removePicker() {
+			delete jscolor.picker.owner;
+			document.getElementsByTagName('body')[0].removeChild(jscolor.picker.boxB);
+		}
+
+
+		function drawPicker(x, y) {
+			if(!jscolor.picker) {
+				jscolor.picker = {
+					box : document.createElement('div'),
+					boxB : document.createElement('div'),
+					pad : document.createElement('div'),
+					padB : document.createElement('div'),
+					padM : document.createElement('div'),
+					sld : document.createElement('div'),
+					sldB : document.createElement('div'),
+					sldM : document.createElement('div'),
+					btn : document.createElement('div'),
+					btnS : document.createElement('span'),
+					btnT : document.createTextNode(THIS.pickerCloseText)
+				};
+				for(var i=0,segSize=4; i<jscolor.images.sld[1]; i+=segSize) {
+					var seg = document.createElement('div');
+					seg.style.height = segSize+'px';
+					seg.style.fontSize = '1px';
+					seg.style.lineHeight = '0';
+					jscolor.picker.sld.appendChild(seg);
+				}
+				jscolor.picker.sldB.appendChild(jscolor.picker.sld);
+				jscolor.picker.box.appendChild(jscolor.picker.sldB);
+				jscolor.picker.box.appendChild(jscolor.picker.sldM);
+				jscolor.picker.padB.appendChild(jscolor.picker.pad);
+				jscolor.picker.box.appendChild(jscolor.picker.padB);
+				jscolor.picker.box.appendChild(jscolor.picker.padM);
+				jscolor.picker.btnS.appendChild(jscolor.picker.btnT);
+				jscolor.picker.btn.appendChild(jscolor.picker.btnS);
+				jscolor.picker.box.appendChild(jscolor.picker.btn);
+				jscolor.picker.boxB.appendChild(jscolor.picker.box);
+			}
+
+			var p = jscolor.picker;
+
+			// controls interaction
+			p.box.onmouseup =
+			p.box.onmouseout = function() { target.focus(); };
+			p.box.onmousedown = function() { abortBlur=true; };
+			p.box.onmousemove = function(e) {
+				if (holdPad || holdSld) {
+					holdPad && setPad(e);
+					holdSld && setSld(e);
+					if (document.selection) {
+						document.selection.empty();
+					} else if (window.getSelection) {
+						window.getSelection().removeAllRanges();
+					}
+					dispatchImmediateChange();
+				}
+			};
+			p.padM.onmouseup =
+			p.padM.onmouseout = function() { if(holdPad) { holdPad=false; jscolor.fireEvent(valueElement,'change'); } };
+			p.padM.onmousedown = function(e) {
+				// if the slider is at the bottom, move it up
+				switch(modeID) {
+					case 0: if (THIS.hsv[2] === 0) { THIS.fromHSV(null, null, 1.0); }; break;
+					case 1: if (THIS.hsv[1] === 0) { THIS.fromHSV(null, 1.0, null); }; break;
+				}
+				holdPad=true;
+				setPad(e);
+				dispatchImmediateChange();
+			};
+			p.sldM.onmouseup =
+			p.sldM.onmouseout = function() { if(holdSld) { holdSld=false; jscolor.fireEvent(valueElement,'change'); } };
+			p.sldM.onmousedown = function(e) {
+				holdSld=true;
+				setSld(e);
+				dispatchImmediateChange();
+			};
+
+			// picker
+			var dims = getPickerDims(THIS);
+			p.box.style.width = dims[0] + 'px';
+			p.box.style.height = dims[1] + 'px';
+
+			// picker border
+			p.boxB.style.position = 'absolute';
+			p.boxB.style.clear = 'both';
+			p.boxB.style.left = x+'px';
+			p.boxB.style.top = y+'px';
+			p.boxB.style.zIndex = THIS.pickerZIndex;
+			p.boxB.style.border = THIS.pickerBorder+'px solid';
+			p.boxB.style.borderColor = THIS.pickerBorderColor;
+			p.boxB.style.background = THIS.pickerFaceColor;
+
+			// pad image
+			p.pad.style.width = jscolor.images.pad[0]+'px';
+			p.pad.style.height = jscolor.images.pad[1]+'px';
+
+			// pad border
+			p.padB.style.position = 'absolute';
+			p.padB.style.left = THIS.pickerFace+'px';
+			p.padB.style.top = THIS.pickerFace+'px';
+			p.padB.style.border = THIS.pickerInset+'px solid';
+			p.padB.style.borderColor = THIS.pickerInsetColor;
+
+			// pad mouse area
+			p.padM.style.position = 'absolute';
+			p.padM.style.left = '0';
+			p.padM.style.top = '0';
+			p.padM.style.width = THIS.pickerFace + 2*THIS.pickerInset + jscolor.images.pad[0] + jscolor.images.arrow[0] + 'px';
+			p.padM.style.height = p.box.style.height;
+			p.padM.style.cursor = 'crosshair';
+
+			// slider image
+			p.sld.style.overflow = 'hidden';
+			p.sld.style.width = jscolor.images.sld[0]+'px';
+			p.sld.style.height = jscolor.images.sld[1]+'px';
+
+			// slider border
+			p.sldB.style.display = THIS.slider ? 'block' : 'none';
+			p.sldB.style.position = 'absolute';
+			p.sldB.style.right = THIS.pickerFace+'px';
+			p.sldB.style.top = THIS.pickerFace+'px';
+			p.sldB.style.border = THIS.pickerInset+'px solid';
+			p.sldB.style.borderColor = THIS.pickerInsetColor;
+
+			// slider mouse area
+			p.sldM.style.display = THIS.slider ? 'block' : 'none';
+			p.sldM.style.position = 'absolute';
+			p.sldM.style.right = '0';
+			p.sldM.style.top = '0';
+			p.sldM.style.width = jscolor.images.sld[0] + jscolor.images.arrow[0] + THIS.pickerFace + 2*THIS.pickerInset + 'px';
+			p.sldM.style.height = p.box.style.height;
+			try {
+				p.sldM.style.cursor = 'pointer';
+			} catch(eOldIE) {
+				p.sldM.style.cursor = 'hand';
+			}
+
+			// "close" button
+			function setBtnBorder() {
+				var insetColors = THIS.pickerInsetColor.split(/\s+/);
+				var pickerOutsetColor = insetColors.length < 2 ? insetColors[0] : insetColors[1] + ' ' + insetColors[0] + ' ' + insetColors[0] + ' ' + insetColors[1];
+				p.btn.style.borderColor = pickerOutsetColor;
+			}
+			p.btn.style.display = THIS.pickerClosable ? 'block' : 'none';
+			p.btn.style.position = 'absolute';
+			p.btn.style.left = THIS.pickerFace + 'px';
+			p.btn.style.bottom = THIS.pickerFace + 'px';
+			p.btn.style.padding = '0 15px';
+			p.btn.style.height = '18px';
+			p.btn.style.border = THIS.pickerInset + 'px solid';
+			setBtnBorder();
+			p.btn.style.color = THIS.pickerButtonColor;
+			p.btn.style.font = '12px sans-serif';
+			p.btn.style.textAlign = 'center';
+			try {
+				p.btn.style.cursor = 'pointer';
+			} catch(eOldIE) {
+				p.btn.style.cursor = 'hand';
+			}
+			p.btn.onmousedown = function () {
+				THIS.hidePicker();
+			};
+			p.btnS.style.lineHeight = p.btn.style.height;
+
+			// load images in optimal order
+			switch(modeID) {
+				case 0: var padImg = 'hs.png'; break;
+				case 1: var padImg = 'hv.png'; break;
+			}
+			p.padM.style.backgroundImage = "url('"+jscolor.getDir()+"cross.gif')";
+			p.padM.style.backgroundRepeat = "no-repeat";
+			p.sldM.style.backgroundImage = "url('"+jscolor.getDir()+"arrow.gif')";
+			p.sldM.style.backgroundRepeat = "no-repeat";
+			p.pad.style.backgroundImage = "url('"+jscolor.getDir()+padImg+"')";
+			p.pad.style.backgroundRepeat = "no-repeat";
+			p.pad.style.backgroundPosition = "0 0";
+
+			// place pointers
+			redrawPad();
+			redrawSld();
+
+			jscolor.picker.owner = THIS;
+			document.getElementsByTagName('body')[0].appendChild(p.boxB);
+		}
+
+
+		function getPickerDims(o) {
+			var dims = [
+				2*o.pickerInset + 2*o.pickerFace + jscolor.images.pad[0] +
+					(o.slider ? 2*o.pickerInset + 2*jscolor.images.arrow[0] + jscolor.images.sld[0] : 0),
+				o.pickerClosable ?
+					4*o.pickerInset + 3*o.pickerFace + jscolor.images.pad[1] + o.pickerButtonHeight :
+					2*o.pickerInset + 2*o.pickerFace + jscolor.images.pad[1]
+			];
+			return dims;
+		}
+
+
+		function redrawPad() {
+			// redraw the pad pointer
+			switch(modeID) {
+				case 0: var yComponent = 1; break;
+				case 1: var yComponent = 2; break;
+			}
+			var x = Math.round((THIS.hsv[0]/6) * (jscolor.images.pad[0]-1));
+			var y = Math.round((1-THIS.hsv[yComponent]) * (jscolor.images.pad[1]-1));
+			jscolor.picker.padM.style.backgroundPosition =
+				(THIS.pickerFace+THIS.pickerInset+x - Math.floor(jscolor.images.cross[0]/2)) + 'px ' +
+				(THIS.pickerFace+THIS.pickerInset+y - Math.floor(jscolor.images.cross[1]/2)) + 'px';
+
+			// redraw the slider image
+			var seg = jscolor.picker.sld.childNodes;
+
+			switch(modeID) {
+				case 0:
+					var rgb = HSV_RGB(THIS.hsv[0], THIS.hsv[1], 1);
+					for(var i=0; i<seg.length; i+=1) {
+						seg[i].style.backgroundColor = 'rgb('+
+							(rgb[0]*(1-i/seg.length)*100)+'%,'+
+							(rgb[1]*(1-i/seg.length)*100)+'%,'+
+							(rgb[2]*(1-i/seg.length)*100)+'%)';
+					}
+					break;
+				case 1:
+					var rgb, s, c = [ THIS.hsv[2], 0, 0 ];
+					var i = Math.floor(THIS.hsv[0]);
+					var f = i%2 ? THIS.hsv[0]-i : 1-(THIS.hsv[0]-i);
+					switch(i) {
+						case 6:
+						case 0: rgb=[0,1,2]; break;
+						case 1: rgb=[1,0,2]; break;
+						case 2: rgb=[2,0,1]; break;
+						case 3: rgb=[2,1,0]; break;
+						case 4: rgb=[1,2,0]; break;
+						case 5: rgb=[0,2,1]; break;
+					}
+					for(var i=0; i<seg.length; i+=1) {
+						s = 1 - 1/(seg.length-1)*i;
+						c[1] = c[0] * (1 - s*f);
+						c[2] = c[0] * (1 - s);
+						seg[i].style.backgroundColor = 'rgb('+
+							(c[rgb[0]]*100)+'%,'+
+							(c[rgb[1]]*100)+'%,'+
+							(c[rgb[2]]*100)+'%)';
+					}
+					break;
+			}
+		}
+
+
+		function redrawSld() {
+			// redraw the slider pointer
+			switch(modeID) {
+				case 0: var yComponent = 2; break;
+				case 1: var yComponent = 1; break;
+			}
+			var y = Math.round((1-THIS.hsv[yComponent]) * (jscolor.images.sld[1]-1));
+			jscolor.picker.sldM.style.backgroundPosition =
+				'0 ' + (THIS.pickerFace+THIS.pickerInset+y - Math.floor(jscolor.images.arrow[1]/2)) + 'px';
+		}
+
+
+		function isPickerOwner() {
+			return jscolor.picker && jscolor.picker.owner === THIS;
+		}
+
+
+		function blurTarget() {
+			if(valueElement === target) {
+				THIS.importColor();
+			}
+			if(THIS.pickerOnfocus) {
+				THIS.hidePicker();
+			}
+		}
+
+
+		function blurValue() {
+			if(valueElement !== target) {
+				THIS.importColor();
+			}
+		}
+
+
+		function setPad(e) {
+			var mpos = jscolor.getRelMousePos(e);
+			var x = mpos.x - THIS.pickerFace - THIS.pickerInset;
+			var y = mpos.y - THIS.pickerFace - THIS.pickerInset;
+			switch(modeID) {
+				case 0: THIS.fromHSV(x*(6/(jscolor.images.pad[0]-1)), 1 - y/(jscolor.images.pad[1]-1), null, leaveSld); break;
+				case 1: THIS.fromHSV(x*(6/(jscolor.images.pad[0]-1)), null, 1 - y/(jscolor.images.pad[1]-1), leaveSld); break;
+			}
+		}
+
+
+		function setSld(e) {
+			var mpos = jscolor.getRelMousePos(e);
+			var y = mpos.y - THIS.pickerFace - THIS.pickerInset;
+			switch(modeID) {
+				case 0: THIS.fromHSV(null, null, 1 - y/(jscolor.images.sld[1]-1), leavePad); break;
+				case 1: THIS.fromHSV(null, 1 - y/(jscolor.images.sld[1]-1), null, leavePad); break;
+			}
+		}
+
+
+		function dispatchImmediateChange() {
+			if (THIS.onImmediateChange) {
+				if (typeof THIS.onImmediateChange === 'string') {
+					eval(THIS.onImmediateChange);
+				} else {
+					THIS.onImmediateChange(THIS);
+				}
+			}
+		}
+
+
+		var THIS = this;
+		var modeID = this.pickerMode.toLowerCase()==='hvs' ? 1 : 0;
+		var abortBlur = false;
+		var
+			valueElement = jscolor.fetchElement(this.valueElement),
+			styleElement = jscolor.fetchElement(this.styleElement);
+		var
+			holdPad = false,
+			holdSld = false;
+		var
+			leaveValue = 1<<0,
+			leaveStyle = 1<<1,
+			leavePad = 1<<2,
+			leaveSld = 1<<3;
+
+		// target
+		jscolor.addEvent(target, 'focus', function() {
+			if(THIS.pickerOnfocus) { THIS.showPicker(); }
+		});
+		jscolor.addEvent(target, 'blur', function() {
+			if(!abortBlur) {
+				window.setTimeout(function(){ abortBlur || blurTarget(); abortBlur=false; }, 0);
+			} else {
+				abortBlur = false;
+			}
+		});
+
+		// valueElement
+		if(valueElement) {
+			var updateField = function() {
+				THIS.fromString(valueElement.value, leaveValue);
+				dispatchImmediateChange();
+			};
+			jscolor.addEvent(valueElement, 'keyup', updateField);
+			jscolor.addEvent(valueElement, 'input', updateField);
+			jscolor.addEvent(valueElement, 'blur', blurValue);
+			valueElement.setAttribute('autocomplete', 'off');
+		}
+
+		// styleElement
+		if(styleElement) {
+			styleElement.jscStyle = {
+				backgroundImage : styleElement.style.backgroundImage,
+				backgroundColor : styleElement.style.backgroundColor,
+				color : styleElement.style.color
+			};
+		}
+
+		// require images
+		switch(modeID) {
+			case 0: jscolor.requireImage('hs.png'); break;
+			case 1: jscolor.requireImage('hv.png'); break;
+		}
+		jscolor.requireImage('cross.gif');
+		jscolor.requireImage('arrow.gif');
+
+		this.importColor();
+	}
+
+};
+
+
+jscolor.install();

vendors/gauge.js/assets/main.css

@@ -0,0 +1,258 @@
+html, body {
+  margin: 0;
+}
+html {
+  background: url(bg.png);
+}
+body {
+  color: #333;
+  font-family: Helvetica, Arial, sans-serif;
+  font-size: 16px;
+}
+ul {
+  padding: 0 0 0 20px;
+}
+#content {
+  width: 75%;
+  max-width: 800px;
+  line-height: 1.4em;
+  margin: 0 50px 50px 100px;
+  text-shadow: 0px 1px 0px #fff;
+}
+#footer {
+  background: #202020;
+  overflow: hidden;
+  color: #888;
+  font-size: 12px;
+  padding: 20px 0 100px 50px;
+  position: relative;
+}
+#footer:before {
+  content: '';
+  display: block;
+  box-shadow: 0 0 10px #000;
+  height: 10px;
+  position: absolute;
+  left: 0;
+  top: -10px;
+  width: 100%;
+}
+#footer a.github {
+   background: url(github.gif) no-repeat;
+   width: 68px;
+   height: 30px;
+   text-indent: -999em;
+   position: absolute;
+   bottom: 30px;
+   right: 30px;
+}
+a {
+  color: #333;
+}
+a:hover {
+  color: #000;
+}
+pre {
+  text-shadow: none;
+  font-size: 14px;
+  line-height: 18px;
+  margin: 0 0 30px 0;
+}
+label {
+  display: inline-block;
+  width: 440px;
+  font-size: 14px;
+  vertical-align: top;
+}
+.opts label {
+  line-height: 25px;
+  width: 80px;
+}
+span.fd-slider {
+  vertical-align: top;
+  display: inline-block;
+  width: 150px;
+}
+#logo {
+  position: relative;
+  height: 300px;
+  margin-left: 100px;
+}
+#logo h2{
+  font-size: 19px; position: absolute;
+  top: -25px; 
+}
+h1, h2, h3, #download a {
+  font-family: 'Amaranth', sans-serif;
+  font-size: 20px;
+  font-weight: normal;
+  padding: 14px 24px;
+  margin-right: 10px;
+  -webkit-border-radius: 6px;
+  -moz-border-radius: 6px;
+  border-radius: 6px;
+}
+h1 {
+  font-size: 200px;
+  position: absolute;
+  text-shadow: 0px 1px 0px #fff;
+  margin: 0; font-weight: 700;
+  padding: 0; top: 90px;
+}
+h2 {
+  font-size: 28px; line-height: auto;
+  margin: 45px 0 2px 0; padding-left: 0;
+}
+h3 {
+  margin: 35px 0 10px 0; padding-left: 0;
+}
+#mask {
+  position: absolute;
+  top: 0;
+  left: 0;
+  background: url(bg.png) -100px 0;
+  width: 240px;
+  height: 85px;
+}
+#dot {
+  position: absolute;
+  left: 198px;
+  top: 42px;
+  width: 46px;
+  height: 46px;
+}
+#ribbon {
+  position: absolute;
+  top: 0;
+  right: 0;
+  width: 149px;
+  height: 149px;
+  background:url(ribbon.png);
+  _background: none;
+  _filter:progid:DXImageTransform.Microsoft.AlphaImageLoader(src=ribbon.png);
+}
+#preview {
+  background: #f9f9f9; position: relative;
+  color: #fff;
+  float: left;
+  width: 220px;
+  height: 220px;
+  margin: 0 20px 20px 0;
+  -webkit-border-radius: 10px;
+  -moz-border-radius: 10px;
+  border-radius: 10px;
+  clear: both;
+}
+#canvas-preview{
+  width: 220px; top: 70px;
+  position: relative;
+}
+#preview-textfield{
+  position: absolute; top: 35px; left: 0; right: 0;
+  text-align: center; font-size: 2em; font-weight: bold;
+  color: black; font-family: 'Amaranth', sans-serif;
+}
+.donut #preview-textfield{
+  top: 110px; font-size: 1.3em;
+}
+.donut #opts-donut{
+  display: block;
+}
+.gauge #opts-gauge{
+  display: block;
+}
+#opts-gauge, #opts-donut{
+  display: none;
+}
+#demo {
+  clear: both;
+}
+#demo form {
+  width: 250px;
+  float: left;
+}
+
+a.button {
+  display: inline-block;
+  background: #56ba4a;
+  border: 3px solid #59a24f;
+  color: #fff;
+  border-radius: 5px;
+  font-family: 'Amaranth', sans-serif;
+  font-size: 24px;
+  padding: 10px 30px;
+  text-decoration: none;
+  text-shadow: 1px 1px 1px #59a24f;
+  box-shadow: 2px 2px 4px rgba(0,0,0,0.2);
+  margin: 10px 20px 0 0;
+  -webkit-transition: all 0.25s ease;
+}
+a.button:hover {
+  background: #2f8325;
+  box-shadow: none;
+}
+#contact img {
+  float: left;
+  border: 3px solid #eee;
+  box-shadow: 0px 2px 3px rgba(0,0,0,0.2);
+  margin: 0 16px 50px 0;
+}
+#type-select{
+  margin: 0; padding: 0;
+}
+#type-select li{
+  list-style: none; float: left; display: block;
+  bottom: -20px; position: relative; padding-bottom: 20px; border-radius: 5px;
+  /*background-image: linear-gradient(bottom, #FFFFFF 10px, #EEEEEE 82%);*/
+  background-image: -webkit-linear-gradient(top, #EEEEEE, #FFFFFF);
+  background-position: 0 55px; cursor: pointer;
+  background-color: white;
+}
+#type-select li+li{
+  margin-left: 40px;
+}
+#type-select li.active{
+  cursor: default;
+}
+#type-select li.active, #type-select li:hover{
+  /*background-image: -webkit-linear-gradient(top, #FFFFFF 12%, #F9F9F9 72%);*/
+  background-position: 0 0; 
+  -webkit-transition: all .1s linear;
+}
+#select-2{
+  position: relative; top: 8px;
+}
+.opts{
+  float: left; margin-top: -60px;
+}
+.opts h4{
+  margin-top: -30px; margin-bottom: 10px;
+}
+input.color{
+  width: 142px;
+}
+.fd-slider-disabled{
+  opacity: 0.5;
+}
+#strike-it{
+  position: absolute; left: 500px;
+  -moz-user-select: -moz-none;
+  -khtml-user-select: none;
+  -webkit-user-select: none;
+  -o-user-select: none;
+  user-select: none;
+  background: url(strike.png);
+  width: 347px; height: 248px;
+}
+#its-coffee{
+  font-family: 'Just Another Hand', cursive; color: red;
+  font-size: 220px; position: absolute; left: 600px; top: 220px;
+  -webkit-transform: rotate(-20deg);
+  -moz-transform: rotate(-20deg);
+  -ms-transform: rotate(-20deg);
+  -o-transform: rotate(-20deg);
+  text-shadow: rgba(0, 0, 0, 0.2) 1px 1px 0;
+}
+input[disabled] {
+  opacity: 0.5;
+}

vendors/gauge.js/assets/prettify.css

@@ -0,0 +1,49 @@
+/* Pretty printing styles. Used with prettify.js. */
+/* Vim sunburst theme by David Leibovic */
+
+pre .str, code .str { color: #65B042; } /* string  - green */
+pre .kwd, code .kwd { color: #E28964; } /* keyword - dark pink */
+pre .com, code .com { color: #AEAEAE; font-style: italic; } /* comment - gray */
+pre .typ, code .typ { color: #89bdff; } /* type - light blue */
+pre .lit, code .lit { color: #3387CC; } /* literal - blue */
+pre .pun, code .pun { color: #fff; } /* punctuation - white */
+pre .pln, code .pln { color: #fff; } /* plaintext - white */
+pre .tag, code .tag { color: #89bdff; } /* html/xml tag    - light blue */
+pre .atn, code .atn { color: #bdb76b; } /* html/xml attribute name  - khaki */
+pre .atv, code .atv { color: #65B042; } /* html/xml attribute value - green */
+pre .dec, code .dec { color: #3387CC; } /* decimal - blue */
+
+pre.prettyprint, code.prettyprint {
+	background-color: #333;
+	-moz-border-radius: 8px;
+	-webkit-border-radius: 8px;
+	-o-border-radius: 8px;
+	-ms-border-radius: 8px;
+	-khtml-border-radius: 8px;
+	border-radius: 8px;
+}
+
+pre.prettyprint {
+	padding: 1em;
+	white-space: pre-wrap;
+}
+
+
+/* Specify class=linenums on a pre to get line numbering */
+ol.linenums { margin-top: 0; margin-bottom: 0; color: #AEAEAE; } /* IE indents via margin-left */
+li.L0,li.L1,li.L2,li.L3,li.L5,li.L6,li.L7,li.L8 { list-style-type: none }
+/* Alternate shading for lines */
+li.L1,li.L3,li.L5,li.L7,li.L9 { }
+
+@media print {
+  pre .str, code .str { color: #060; }
+  pre .kwd, code .kwd { color: #006; font-weight: bold; }
+  pre .com, code .com { color: #600; font-style: italic; }
+  pre .typ, code .typ { color: #404; font-weight: bold; }
+  pre .lit, code .lit { color: #044; }
+  pre .pun, code .pun { color: #440; }
+  pre .pln, code .pln { color: #000; }
+  pre .tag, code .tag { color: #006; font-weight: bold; }
+  pre .atn, code .atn { color: #404; }
+  pre .atv, code .atv { color: #060; }
+}

vendors/gauge.js/assets/prettify.js

@@ -0,0 +1,28 @@
+var q=null;window.PR_SHOULD_USE_CONTINUATION=!0;
+(function(){function L(a){function m(a){var f=a.charCodeAt(0);if(f!==92)return f;var b=a.charAt(1);return(f=r[b])?f:"0"<=b&&b<="7"?parseInt(a.substring(1),8):b==="u"||b==="x"?parseInt(a.substring(2),16):a.charCodeAt(1)}function e(a){if(a<32)return(a<16?"\\x0":"\\x")+a.toString(16);a=String.fromCharCode(a);if(a==="\\"||a==="-"||a==="["||a==="]")a="\\"+a;return a}function h(a){for(var f=a.substring(1,a.length-1).match(/\\u[\dA-Fa-f]{4}|\\x[\dA-Fa-f]{2}|\\[0-3][0-7]{0,2}|\\[0-7]{1,2}|\\[\S\s]|[^\\]/g),a=
+[],b=[],o=f[0]==="^",c=o?1:0,i=f.length;c<i;++c){var j=f[c];if(/\\[bdsw]/i.test(j))a.push(j);else{var j=m(j),d;c+2<i&&"-"===f[c+1]?(d=m(f[c+2]),c+=2):d=j;b.push([j,d]);d<65||j>122||(d<65||j>90||b.push([Math.max(65,j)|32,Math.min(d,90)|32]),d<97||j>122||b.push([Math.max(97,j)&-33,Math.min(d,122)&-33]))}}b.sort(function(a,f){return a[0]-f[0]||f[1]-a[1]});f=[];j=[NaN,NaN];for(c=0;c<b.length;++c)i=b[c],i[0]<=j[1]+1?j[1]=Math.max(j[1],i[1]):f.push(j=i);b=["["];o&&b.push("^");b.push.apply(b,a);for(c=0;c<
+f.length;++c)i=f[c],b.push(e(i[0])),i[1]>i[0]&&(i[1]+1>i[0]&&b.push("-"),b.push(e(i[1])));b.push("]");return b.join("")}function y(a){for(var f=a.source.match(/\[(?:[^\\\]]|\\[\S\s])*]|\\u[\dA-Fa-f]{4}|\\x[\dA-Fa-f]{2}|\\\d+|\\[^\dux]|\(\?[!:=]|[()^]|[^()[\\^]+/g),b=f.length,d=[],c=0,i=0;c<b;++c){var j=f[c];j==="("?++i:"\\"===j.charAt(0)&&(j=+j.substring(1))&&j<=i&&(d[j]=-1)}for(c=1;c<d.length;++c)-1===d[c]&&(d[c]=++t);for(i=c=0;c<b;++c)j=f[c],j==="("?(++i,d[i]===void 0&&(f[c]="(?:")):"\\"===j.charAt(0)&&
+(j=+j.substring(1))&&j<=i&&(f[c]="\\"+d[i]);for(i=c=0;c<b;++c)"^"===f[c]&&"^"!==f[c+1]&&(f[c]="");if(a.ignoreCase&&s)for(c=0;c<b;++c)j=f[c],a=j.charAt(0),j.length>=2&&a==="["?f[c]=h(j):a!=="\\"&&(f[c]=j.replace(/[A-Za-z]/g,function(a){a=a.charCodeAt(0);return"["+String.fromCharCode(a&-33,a|32)+"]"}));return f.join("")}for(var t=0,s=!1,l=!1,p=0,d=a.length;p<d;++p){var g=a[p];if(g.ignoreCase)l=!0;else if(/[a-z]/i.test(g.source.replace(/\\u[\da-f]{4}|\\x[\da-f]{2}|\\[^UXux]/gi,""))){s=!0;l=!1;break}}for(var r=
+{b:8,t:9,n:10,v:11,f:12,r:13},n=[],p=0,d=a.length;p<d;++p){g=a[p];if(g.global||g.multiline)throw Error(""+g);n.push("(?:"+y(g)+")")}return RegExp(n.join("|"),l?"gi":"g")}function M(a){function m(a){switch(a.nodeType){case 1:if(e.test(a.className))break;for(var g=a.firstChild;g;g=g.nextSibling)m(g);g=a.nodeName;if("BR"===g||"LI"===g)h[s]="\n",t[s<<1]=y++,t[s++<<1|1]=a;break;case 3:case 4:g=a.nodeValue,g.length&&(g=p?g.replace(/\r\n?/g,"\n"):g.replace(/[\t\n\r ]+/g," "),h[s]=g,t[s<<1]=y,y+=g.length,
+t[s++<<1|1]=a)}}var e=/(?:^|\s)nocode(?:\s|$)/,h=[],y=0,t=[],s=0,l;a.currentStyle?l=a.currentStyle.whiteSpace:window.getComputedStyle&&(l=document.defaultView.getComputedStyle(a,q).getPropertyValue("white-space"));var p=l&&"pre"===l.substring(0,3);m(a);return{a:h.join("").replace(/\n$/,""),c:t}}function B(a,m,e,h){m&&(a={a:m,d:a},e(a),h.push.apply(h,a.e))}function x(a,m){function e(a){for(var l=a.d,p=[l,"pln"],d=0,g=a.a.match(y)||[],r={},n=0,z=g.length;n<z;++n){var f=g[n],b=r[f],o=void 0,c;if(typeof b===
+"string")c=!1;else{var i=h[f.charAt(0)];if(i)o=f.match(i[1]),b=i[0];else{for(c=0;c<t;++c)if(i=m[c],o=f.match(i[1])){b=i[0];break}o||(b="pln")}if((c=b.length>=5&&"lang-"===b.substring(0,5))&&!(o&&typeof o[1]==="string"))c=!1,b="src";c||(r[f]=b)}i=d;d+=f.length;if(c){c=o[1];var j=f.indexOf(c),k=j+c.length;o[2]&&(k=f.length-o[2].length,j=k-c.length);b=b.substring(5);B(l+i,f.substring(0,j),e,p);B(l+i+j,c,C(b,c),p);B(l+i+k,f.substring(k),e,p)}else p.push(l+i,b)}a.e=p}var h={},y;(function(){for(var e=a.concat(m),
+l=[],p={},d=0,g=e.length;d<g;++d){var r=e[d],n=r[3];if(n)for(var k=n.length;--k>=0;)h[n.charAt(k)]=r;r=r[1];n=""+r;p.hasOwnProperty(n)||(l.push(r),p[n]=q)}l.push(/[\S\s]/);y=L(l)})();var t=m.length;return e}function u(a){var m=[],e=[];a.tripleQuotedStrings?m.push(["str",/^(?:'''(?:[^'\\]|\\[\S\s]|''?(?=[^']))*(?:'''|$)|"""(?:[^"\\]|\\[\S\s]|""?(?=[^"]))*(?:"""|$)|'(?:[^'\\]|\\[\S\s])*(?:'|$)|"(?:[^"\\]|\\[\S\s])*(?:"|$))/,q,"'\""]):a.multiLineStrings?m.push(["str",/^(?:'(?:[^'\\]|\\[\S\s])*(?:'|$)|"(?:[^"\\]|\\[\S\s])*(?:"|$)|`(?:[^\\`]|\\[\S\s])*(?:`|$))/,
+q,"'\"`"]):m.push(["str",/^(?:'(?:[^\n\r'\\]|\\.)*(?:'|$)|"(?:[^\n\r"\\]|\\.)*(?:"|$))/,q,"\"'"]);a.verbatimStrings&&e.push(["str",/^@"(?:[^"]|"")*(?:"|$)/,q]);var h=a.hashComments;h&&(a.cStyleComments?(h>1?m.push(["com",/^#(?:##(?:[^#]|#(?!##))*(?:###|$)|.*)/,q,"#"]):m.push(["com",/^#(?:(?:define|elif|else|endif|error|ifdef|include|ifndef|line|pragma|undef|warning)\b|[^\n\r]*)/,q,"#"]),e.push(["str",/^<(?:(?:(?:\.\.\/)*|\/?)(?:[\w-]+(?:\/[\w-]+)+)?[\w-]+\.h|[a-z]\w*)>/,q])):m.push(["com",/^#[^\n\r]*/,
+q,"#"]));a.cStyleComments&&(e.push(["com",/^\/\/[^\n\r]*/,q]),e.push(["com",/^\/\*[\S\s]*?(?:\*\/|$)/,q]));a.regexLiterals&&e.push(["lang-regex",/^(?:^^\.?|[!+-]|!=|!==|#|%|%=|&|&&|&&=|&=|\(|\*|\*=|\+=|,|-=|->|\/|\/=|:|::|;|<|<<|<<=|<=|=|==|===|>|>=|>>|>>=|>>>|>>>=|[?@[^]|\^=|\^\^|\^\^=|{|\||\|=|\|\||\|\|=|~|break|case|continue|delete|do|else|finally|instanceof|return|throw|try|typeof)\s*(\/(?=[^*/])(?:[^/[\\]|\\[\S\s]|\[(?:[^\\\]]|\\[\S\s])*(?:]|$))+\/)/]);(h=a.types)&&e.push(["typ",h]);a=(""+a.keywords).replace(/^ | $/g,
+"");a.length&&e.push(["kwd",RegExp("^(?:"+a.replace(/[\s,]+/g,"|")+")\\b"),q]);m.push(["pln",/^\s+/,q," \r\n\t\xa0"]);e.push(["lit",/^@[$_a-z][\w$@]*/i,q],["typ",/^(?:[@_]?[A-Z]+[a-z][\w$@]*|\w+_t\b)/,q],["pln",/^[$_a-z][\w$@]*/i,q],["lit",/^(?:0x[\da-f]+|(?:\d(?:_\d+)*\d*(?:\.\d*)?|\.\d\+)(?:e[+-]?\d+)?)[a-z]*/i,q,"0123456789"],["pln",/^\\[\S\s]?/,q],["pun",/^.[^\s\w"-$'./@\\`]*/,q]);return x(m,e)}function D(a,m){function e(a){switch(a.nodeType){case 1:if(k.test(a.className))break;if("BR"===a.nodeName)h(a),
+a.parentNode&&a.parentNode.removeChild(a);else for(a=a.firstChild;a;a=a.nextSibling)e(a);break;case 3:case 4:if(p){var b=a.nodeValue,d=b.match(t);if(d){var c=b.substring(0,d.index);a.nodeValue=c;(b=b.substring(d.index+d[0].length))&&a.parentNode.insertBefore(s.createTextNode(b),a.nextSibling);h(a);c||a.parentNode.removeChild(a)}}}}function h(a){function b(a,d){var e=d?a.cloneNode(!1):a,f=a.parentNode;if(f){var f=b(f,1),g=a.nextSibling;f.appendChild(e);for(var h=g;h;h=g)g=h.nextSibling,f.appendChild(h)}return e}
+for(;!a.nextSibling;)if(a=a.parentNode,!a)return;for(var a=b(a.nextSibling,0),e;(e=a.parentNode)&&e.nodeType===1;)a=e;d.push(a)}var k=/(?:^|\s)nocode(?:\s|$)/,t=/\r\n?|\n/,s=a.ownerDocument,l;a.currentStyle?l=a.currentStyle.whiteSpace:window.getComputedStyle&&(l=s.defaultView.getComputedStyle(a,q).getPropertyValue("white-space"));var p=l&&"pre"===l.substring(0,3);for(l=s.createElement("LI");a.firstChild;)l.appendChild(a.firstChild);for(var d=[l],g=0;g<d.length;++g)e(d[g]);m===(m|0)&&d[0].setAttribute("value",
+m);var r=s.createElement("OL");r.className="linenums";for(var n=Math.max(0,m-1|0)||0,g=0,z=d.length;g<z;++g)l=d[g],l.className="L"+(g+n)%10,l.firstChild||l.appendChild(s.createTextNode("\xa0")),r.appendChild(l);a.appendChild(r)}function k(a,m){for(var e=m.length;--e>=0;){var h=m[e];A.hasOwnProperty(h)?window.console&&console.warn("cannot override language handler %s",h):A[h]=a}}function C(a,m){if(!a||!A.hasOwnProperty(a))a=/^\s*</.test(m)?"default-markup":"default-code";return A[a]}function E(a){var m=
+a.g;try{var e=M(a.h),h=e.a;a.a=h;a.c=e.c;a.d=0;C(m,h)(a);var k=/\bMSIE\b/.test(navigator.userAgent),m=/\n/g,t=a.a,s=t.length,e=0,l=a.c,p=l.length,h=0,d=a.e,g=d.length,a=0;d[g]=s;var r,n;for(n=r=0;n<g;)d[n]!==d[n+2]?(d[r++]=d[n++],d[r++]=d[n++]):n+=2;g=r;for(n=r=0;n<g;){for(var z=d[n],f=d[n+1],b=n+2;b+2<=g&&d[b+1]===f;)b+=2;d[r++]=z;d[r++]=f;n=b}for(d.length=r;h<p;){var o=l[h+2]||s,c=d[a+2]||s,b=Math.min(o,c),i=l[h+1],j;if(i.nodeType!==1&&(j=t.substring(e,b))){k&&(j=j.replace(m,"\r"));i.nodeValue=
+j;var u=i.ownerDocument,v=u.createElement("SPAN");v.className=d[a+1];var x=i.parentNode;x.replaceChild(v,i);v.appendChild(i);e<o&&(l[h+1]=i=u.createTextNode(t.substring(b,o)),x.insertBefore(i,v.nextSibling))}e=b;e>=o&&(h+=2);e>=c&&(a+=2)}}catch(w){"console"in window&&console.log(w&&w.stack?w.stack:w)}}var v=["break,continue,do,else,for,if,return,while"],w=[[v,"auto,case,char,const,default,double,enum,extern,float,goto,int,long,register,short,signed,sizeof,static,struct,switch,typedef,union,unsigned,void,volatile"],
+"catch,class,delete,false,import,new,operator,private,protected,public,this,throw,true,try,typeof"],F=[w,"alignof,align_union,asm,axiom,bool,concept,concept_map,const_cast,constexpr,decltype,dynamic_cast,explicit,export,friend,inline,late_check,mutable,namespace,nullptr,reinterpret_cast,static_assert,static_cast,template,typeid,typename,using,virtual,where"],G=[w,"abstract,boolean,byte,extends,final,finally,implements,import,instanceof,null,native,package,strictfp,super,synchronized,throws,transient"],
+H=[G,"as,base,by,checked,decimal,delegate,descending,dynamic,event,fixed,foreach,from,group,implicit,in,interface,internal,into,is,lock,object,out,override,orderby,params,partial,readonly,ref,sbyte,sealed,stackalloc,string,select,uint,ulong,unchecked,unsafe,ushort,var"],w=[w,"debugger,eval,export,function,get,null,set,undefined,var,with,Infinity,NaN"],I=[v,"and,as,assert,class,def,del,elif,except,exec,finally,from,global,import,in,is,lambda,nonlocal,not,or,pass,print,raise,try,with,yield,False,True,None"],
+J=[v,"alias,and,begin,case,class,def,defined,elsif,end,ensure,false,in,module,next,nil,not,or,redo,rescue,retry,self,super,then,true,undef,unless,until,when,yield,BEGIN,END"],v=[v,"case,done,elif,esac,eval,fi,function,in,local,set,then,until"],K=/^(DIR|FILE|vector|(de|priority_)?queue|list|stack|(const_)?iterator|(multi)?(set|map)|bitset|u?(int|float)\d*)/,N=/\S/,O=u({keywords:[F,H,w,"caller,delete,die,do,dump,elsif,eval,exit,foreach,for,goto,if,import,last,local,my,next,no,our,print,package,redo,require,sub,undef,unless,until,use,wantarray,while,BEGIN,END"+
+I,J,v],hashComments:!0,cStyleComments:!0,multiLineStrings:!0,regexLiterals:!0}),A={};k(O,["default-code"]);k(x([],[["pln",/^[^<?]+/],["dec",/^<!\w[^>]*(?:>|$)/],["com",/^<\!--[\S\s]*?(?:--\>|$)/],["lang-",/^<\?([\S\s]+?)(?:\?>|$)/],["lang-",/^<%([\S\s]+?)(?:%>|$)/],["pun",/^(?:<[%?]|[%?]>)/],["lang-",/^<xmp\b[^>]*>([\S\s]+?)<\/xmp\b[^>]*>/i],["lang-js",/^<script\b[^>]*>([\S\s]*?)(<\/script\b[^>]*>)/i],["lang-css",/^<style\b[^>]*>([\S\s]*?)(<\/style\b[^>]*>)/i],["lang-in.tag",/^(<\/?[a-z][^<>]*>)/i]]),
+["default-markup","htm","html","mxml","xhtml","xml","xsl"]);k(x([["pln",/^\s+/,q," \t\r\n"],["atv",/^(?:"[^"]*"?|'[^']*'?)/,q,"\"'"]],[["tag",/^^<\/?[a-z](?:[\w-.:]*\w)?|\/?>$/i],["atn",/^(?!style[\s=]|on)[a-z](?:[\w:-]*\w)?/i],["lang-uq.val",/^=\s*([^\s"'>]*(?:[^\s"'/>]|\/(?=\s)))/],["pun",/^[/<->]+/],["lang-js",/^on\w+\s*=\s*"([^"]+)"/i],["lang-js",/^on\w+\s*=\s*'([^']+)'/i],["lang-js",/^on\w+\s*=\s*([^\s"'>]+)/i],["lang-css",/^style\s*=\s*"([^"]+)"/i],["lang-css",/^style\s*=\s*'([^']+)'/i],["lang-css",
+/^style\s*=\s*([^\s"'>]+)/i]]),["in.tag"]);k(x([],[["atv",/^[\S\s]+/]]),["uq.val"]);k(u({keywords:F,hashComments:!0,cStyleComments:!0,types:K}),["c","cc","cpp","cxx","cyc","m"]);k(u({keywords:"null,true,false"}),["json"]);k(u({keywords:H,hashComments:!0,cStyleComments:!0,verbatimStrings:!0,types:K}),["cs"]);k(u({keywords:G,cStyleComments:!0}),["java"]);k(u({keywords:v,hashComments:!0,multiLineStrings:!0}),["bsh","csh","sh"]);k(u({keywords:I,hashComments:!0,multiLineStrings:!0,tripleQuotedStrings:!0}),
+["cv","py"]);k(u({keywords:"caller,delete,die,do,dump,elsif,eval,exit,foreach,for,goto,if,import,last,local,my,next,no,our,print,package,redo,require,sub,undef,unless,until,use,wantarray,while,BEGIN,END",hashComments:!0,multiLineStrings:!0,regexLiterals:!0}),["perl","pl","pm"]);k(u({keywords:J,hashComments:!0,multiLineStrings:!0,regexLiterals:!0}),["rb"]);k(u({keywords:w,cStyleComments:!0,regexLiterals:!0}),["js"]);k(u({keywords:"all,and,by,catch,class,else,extends,false,finally,for,if,in,is,isnt,loop,new,no,not,null,of,off,on,or,return,super,then,true,try,unless,until,when,while,yes",
+hashComments:3,cStyleComments:!0,multilineStrings:!0,tripleQuotedStrings:!0,regexLiterals:!0}),["coffee"]);k(x([],[["str",/^[\S\s]+/]]),["regex"]);window.prettyPrintOne=function(a,m,e){var h=document.createElement("PRE");h.innerHTML=a;e&&D(h,e);E({g:m,i:e,h:h});return h.innerHTML};window.prettyPrint=function(a){function m(){for(var e=window.PR_SHOULD_USE_CONTINUATION?l.now()+250:Infinity;p<h.length&&l.now()<e;p++){var n=h[p],k=n.className;if(k.indexOf("prettyprint")>=0){var k=k.match(g),f,b;if(b=
+!k){b=n;for(var o=void 0,c=b.firstChild;c;c=c.nextSibling)var i=c.nodeType,o=i===1?o?b:c:i===3?N.test(c.nodeValue)?b:o:o;b=(f=o===b?void 0:o)&&"CODE"===f.tagName}b&&(k=f.className.match(g));k&&(k=k[1]);b=!1;for(o=n.parentNode;o;o=o.parentNode)if((o.tagName==="pre"||o.tagName==="code"||o.tagName==="xmp")&&o.className&&o.className.indexOf("prettyprint")>=0){b=!0;break}b||((b=(b=n.className.match(/\blinenums\b(?::(\d+))?/))?b[1]&&b[1].length?+b[1]:!0:!1)&&D(n,b),d={g:k,h:n,i:b},E(d))}}p<h.length?setTimeout(m,
+250):a&&a()}for(var e=[document.getElementsByTagName("pre"),document.getElementsByTagName("code"),document.getElementsByTagName("xmp")],h=[],k=0;k<e.length;++k)for(var t=0,s=e[k].length;t<s;++t)h.push(e[k][t]);var e=q,l=Date;l.now||(l={now:function(){return+new Date}});var p=0,d,g=/\blang(?:uage)?-([\w.]+)(?!\S)/;m()};window.PR={createSimpleLexer:x,registerLangHandler:k,sourceDecorator:u,PR_ATTRIB_NAME:"atn",PR_ATTRIB_VALUE:"atv",PR_COMMENT:"com",PR_DECLARATION:"dec",PR_KEYWORD:"kwd",PR_LITERAL:"lit",
+PR_NOCODE:"nocode",PR_PLAIN:"pln",PR_PUNCTUATION:"pun",PR_SOURCE:"src",PR_STRING:"str",PR_TAG:"tag",PR_TYPE:"typ"}})();

vendors/gauge.js/bower.json

@@ -0,0 +1,17 @@
+{
+  "name": "bernii/gauge.js",
+  "version": "1.2.1",
+  "main": [
+    "dist/gauge.js",
+    "dist/gauge.min.js",
+    "dist/gauge.coffee"
+  ],
+  "description": "100% native and cool looking animated JavaScript/CoffeScript gauge",
+  "license": "MIT",
+  "ignore": [
+  ],
+  "dependencies": {
+  },
+  "devDependencies": {
+  }
+}

vendors/gauge.js/dist/gauge.coffee

@@ -0,0 +1,524 @@
+# Request Animation Frame Polyfill
+# CoffeeScript version of http://paulirish.com/2011/requestanimationframe-for-smart-animating/
+do () ->
+	vendors = ['ms', 'moz', 'webkit', 'o']
+	for vendor in vendors
+		if window.requestAnimationFrame
+			break
+		window.requestAnimationFrame = window[vendor + 'RequestAnimationFrame']
+		window.cancelAnimationFrame = window[vendor + 'CancelAnimationFrame'] or window[vendor + 'CancelRequestAnimationFrame']
+
+	browserRequestAnimationFrame = null
+	lastId = 0
+	isCancelled = {}
+
+	if not requestAnimationFrame
+		window.requestAnimationFrame = (callback, element) ->
+			currTime = new Date().getTime()
+			timeToCall = Math.max(0, 16 - (currTime - lastTime))
+			id = window.setTimeout(() ->
+				callback(currTime + timeToCall)
+			, timeToCall)
+			lastTime = currTime + timeToCall
+			return id
+		# This implementation should only be used with the setTimeout()
+		# version of window.requestAnimationFrame().
+		window.cancelAnimationFrame = (id) ->
+			clearTimeout(id)
+	else if not window.cancelAnimationFrame
+		browserRequestAnimationFrame = window.requestAnimationFrame
+		window.requestAnimationFrame = (callback, element) ->
+			myId = ++lastId
+			browserRequestAnimationFrame(() ->
+				if not isCancelled[myId]
+					callback()
+			, element)
+			return myId
+		window.cancelAnimationFrame = (id) ->
+			isCancelled[id] = true
+
+String.prototype.hashCode = () ->
+	hash = 0
+	if this.length == 0
+		return hash
+	for i in [0...this.length]
+		char = this.charCodeAt(i)
+		hash = ((hash << 5) - hash) + char
+		hash = hash & hash # Convert to 32bit integer
+	return hash
+
+secondsToString = (sec) ->
+	hr = Math.floor(sec / 3600)
+	min = Math.floor((sec - (hr * 3600))/60)
+	sec -= ((hr * 3600) + (min * 60))
+	sec += '' 
+	min += ''
+	while min.length < 2
+		min = '0' + min
+	while sec.length < 2
+		sec = '0' + sec
+	hr = if hr then hr + ':' else ''
+	return hr + min + ':' + sec
+
+formatNumber = (num) ->
+		return addCommas(num.toFixed(0))
+
+updateObjectValues = (obj1, obj2) ->
+	for own key, val of obj2
+		obj1[key] = val
+	return obj1
+
+mergeObjects = (obj1, obj2) ->
+	out = {}
+	for own key, val of obj1
+		out[key] = val
+	for own key, val of obj2
+		out[key] = val
+	return out
+
+addCommas = (nStr) ->
+	nStr += ''
+	x = nStr.split('.')
+	x1 = x[0]
+	x2 = ''
+	if x.length > 1
+		x2 = '.' + x[1]
+	rgx = /(\d+)(\d{3})/
+	while rgx.test(x1)
+		x1 = x1.replace(rgx, '$1' + ',' + '$2')
+	return x1 + x2
+
+cutHex = (nStr) ->
+	if nStr.charAt(0) == "#"
+		return nStr.substring(1,7)
+	return nStr
+
+class ValueUpdater
+	animationSpeed: 32
+	constructor: (addToAnimationQueue=true, @clear=true) ->
+		if addToAnimationQueue
+			AnimationUpdater.add(@)
+
+	update: (force=false) ->
+		if force or @displayedValue != @value
+			if @ctx and @clear
+				@ctx.clearRect(0, 0, @canvas.width, @canvas.height)
+			diff = @value - @displayedValue
+			if Math.abs(diff / @animationSpeed) <= 0.001
+				@displayedValue = @value
+			else
+				@displayedValue = @displayedValue + diff / @animationSpeed
+			@render()
+			return true
+		return false
+
+class BaseGauge extends ValueUpdater
+	displayScale: 1
+
+	setTextField: (textField) ->
+		@textField = if textField instanceof TextRenderer then textField else new TextRenderer(textField)
+
+	setMinValue: (@minValue, updateStartValue=true) ->
+		if updateStartValue
+			@displayedValue = @minValue
+			for gauge in @gp or []
+				gauge.displayedValue = @minValue
+
+	setOptions: (options=null) ->
+		@options = mergeObjects(@options, options)
+		if @textField
+			@textField.el.style.fontSize = options.fontSize + 'px'
+
+		if @options.angle > .5
+			@gauge.options.angle = .5
+		@configDisplayScale()
+		return @
+
+	configDisplayScale: () ->
+		prevDisplayScale = @displayScale
+
+		if @options.highDpiSupport == false
+			delete @displayScale
+		else
+			devicePixelRatio = window.devicePixelRatio or 1
+			backingStorePixelRatio =
+				@ctx.webkitBackingStorePixelRatio or
+				@ctx.mozBackingStorePixelRatio or
+				@ctx.msBackingStorePixelRatio or
+				@ctx.oBackingStorePixelRatio or
+				@ctx.backingStorePixelRatio or 1
+			@displayScale = devicePixelRatio / backingStorePixelRatio
+
+		if @displayScale != prevDisplayScale
+			width = @canvas.G__width or @canvas.width
+			height = @canvas.G__height or @canvas.height
+			@canvas.width = width * @displayScale
+			@canvas.height = height * @displayScale
+			@canvas.style.width = "#{width}px"
+			@canvas.style.height = "#{height}px"
+			@canvas.G__width = width
+			@canvas.G__height = height
+
+		return @
+
+class TextRenderer
+	constructor: (@el) ->
+
+	# Default behaviour, override to customize rendering
+	render: (gauge) ->
+		@el.innerHTML = formatNumber(gauge.displayedValue)
+
+class AnimatedText extends ValueUpdater
+	displayedValue: 0
+	value: 0
+
+	setVal: (value) ->
+		@value = 1 * value
+
+	constructor: (@elem, @text=false) ->
+		@value = 1 * @elem.innerHTML
+		if @text
+			@value = 0
+	render: () ->
+		if @text
+			textVal = secondsToString(@displayedValue.toFixed(0))
+		else
+			textVal = addCommas(formatNumber(@displayedValue))
+		@elem.innerHTML = textVal
+
+AnimatedTextFactory =
+	create: (objList) ->
+		out = []
+		for elem in objList
+			out.push(new AnimatedText(elem))
+		return out
+
+class GaugePointer extends ValueUpdater
+	displayedValue: 0
+	value: 0
+	options:
+		strokeWidth: 0.035
+		length: 0.1
+		color: "#000000"
+
+	constructor: (@gauge) ->
+		@ctx = @gauge.ctx
+		@canvas = @gauge.canvas
+		super(false, false)
+		@setOptions()
+
+	setOptions: (options=null) ->
+		updateObjectValues(@options, options)
+		@length = @canvas.height * @options.length
+		@strokeWidth = @canvas.height * @options.strokeWidth
+		@maxValue = @gauge.maxValue
+		@minValue = @gauge.minValue
+		@animationSpeed =  @gauge.animationSpeed
+		@options.angle = @gauge.options.angle
+
+	render: () ->
+		angle = @gauge.getAngle.call(@, @displayedValue)
+		centerX = @canvas.width / 2
+		centerY = @canvas.height * 0.9
+
+		x = Math.round(centerX + @length * Math.cos(angle))
+		y = Math.round(centerY + @length * Math.sin(angle))
+
+		startX = Math.round(centerX + @strokeWidth * Math.cos(angle - Math.PI/2))
+		startY = Math.round(centerY + @strokeWidth * Math.sin(angle - Math.PI/2))
+
+		endX = Math.round(centerX + @strokeWidth * Math.cos(angle + Math.PI/2))
+		endY = Math.round(centerY + @strokeWidth * Math.sin(angle + Math.PI/2))
+
+		@ctx.fillStyle = @options.color
+		@ctx.beginPath()
+
+		@ctx.arc(centerX, centerY, @strokeWidth, 0, Math.PI*2, true)
+		@ctx.fill()
+
+		@ctx.beginPath()
+		@ctx.moveTo(startX, startY)
+		@ctx.lineTo(x, y)
+		@ctx.lineTo(endX, endY)
+		@ctx.fill()
+
+class Bar
+	constructor: (@elem) ->
+	updateValues: (arrValues) ->
+		@value = arrValues[0]
+		@maxValue = arrValues[1]
+		@avgValue = arrValues[2]
+		@render()
+
+	render: () ->
+		if @textField
+			@textField.text(formatNumber(@value))
+
+		if @maxValue == 0
+			@maxValue = @avgValue * 2
+
+		valPercent = (@value / @maxValue) * 100
+		avgPercent = (@avgValue / @maxValue) * 100
+
+		$(".bar-value", @elem).css({"width": valPercent + "%"})
+		$(".typical-value", @elem).css({"width": avgPercent + "%"})
+
+class Gauge extends BaseGauge
+	elem: null
+	value: [20] # we support multiple pointers
+	maxValue: 80
+	minValue: 0
+	displayedAngle: 0
+	displayedValue: 0
+	lineWidth: 40
+	paddingBottom: 0.1
+	percentColors: null,
+	options:
+		colorStart: "#6fadcf"
+		colorStop: undefined
+		gradientType: 0       	# 0 : radial, 1 : linear
+		strokeColor: "#e0e0e0"
+		pointer:
+			length: 0.8
+			strokeWidth: 0.035
+		angle: 0.15
+		lineWidth: 0.44
+		fontSize: 40
+		limitMax: false
+
+	constructor: (@canvas) ->
+		super()
+		@percentColors = null
+		if typeof G_vmlCanvasManager != 'undefined'
+			@canvas = window.G_vmlCanvasManager.initElement(@canvas)
+		@ctx = @canvas.getContext('2d')
+		@gp = [new GaugePointer(@)]
+		@setOptions()
+		@render()
+
+	setOptions: (options=null) ->
+		super(options)
+		@configPercentColors()
+		@lineWidth = @canvas.height * (1 - @paddingBottom) * @options.lineWidth # .2 - .7
+		@radius = @canvas.height * (1 - @paddingBottom) - @lineWidth
+		@ctx.clearRect(0, 0, @canvas.width, @canvas.height)
+		@render()
+		for gauge in @gp
+			gauge.setOptions(@options.pointer)
+			gauge.render()
+		return @
+
+	configPercentColors: () ->
+		@percentColors = null;
+		if (@options.percentColors != undefined)
+			@percentColors = new Array()
+			for i in [0..(@options.percentColors.length-1)]
+				rval = parseInt((cutHex(@options.percentColors[i][1])).substring(0,2),16)
+				gval = parseInt((cutHex(@options.percentColors[i][1])).substring(2,4),16)
+				bval = parseInt((cutHex(@options.percentColors[i][1])).substring(4,6),16)
+				@percentColors[i] = { pct: @options.percentColors[i][0], color: { r: rval, g: gval, b: bval  } }
+
+	set: (value) ->
+
+		if not (value instanceof Array)
+			value = [value]
+		# check if we have enough GaugePointers initialized
+		# lazy initialization
+		if value.length > @gp.length
+			for i in [0...(value.length - @gp.length)]
+				@gp.push(new GaugePointer(@))
+
+		# get max value and update pointer(s)
+		i = 0
+		max_hit = false
+
+		for val in value
+			if val > @maxValue
+					@maxValue = @value * 1.1
+					max_hit = true
+			@gp[i].value = val
+			@gp[i++].setOptions({maxValue: @maxValue, angle: @options.angle})
+		@value = value[value.length - 1] # TODO: Span maybe?? 
+
+		if max_hit
+			unless @options.limitMax
+				AnimationUpdater.run()
+		else
+			AnimationUpdater.run()
+
+	getAngle: (value) ->
+		return (1 + @options.angle) * Math.PI + ((value - @minValue) / (@maxValue - @minValue)) * (1 - @options.angle * 2) * Math.PI
+
+	getColorForPercentage: (pct, grad) ->
+		if pct == 0
+			color = @percentColors[0].color;
+		else
+			color = @percentColors[@percentColors.length - 1].color;
+			for i in [0..(@percentColors.length - 1)]
+				if (pct <= @percentColors[i].pct)
+					if grad == true
+						# Gradually change between colors
+						startColor = @percentColors[i - 1]
+						endColor = @percentColors[i]
+						rangePct = (pct - startColor.pct) / (endColor.pct - startColor.pct)  # How far between both colors
+						color = {
+							r: Math.floor(startColor.color.r * (1 - rangePct) + endColor.color.r * rangePct),
+							g: Math.floor(startColor.color.g * (1 - rangePct) + endColor.color.g * rangePct),
+							b: Math.floor(startColor.color.b * (1 - rangePct) + endColor.color.b * rangePct)
+						}
+					else
+						color = @percentColors[i].color
+					break
+		return 'rgb(' + [color.r, color.g, color.b].join(',') + ')'
+    
+	getColorForValue: (val, grad) ->
+		pct = (val - @minValue) / (@maxValue - @minValue)
+		return @getColorForPercentage(pct, grad);
+
+	render: () ->
+		# Draw using canvas
+		w = @canvas.width / 2
+		h = @canvas.height * (1 - @paddingBottom)
+		displayedAngle = @getAngle(@displayedValue)
+		if @textField
+			@textField.render(@)
+
+		@ctx.lineCap = "butt"
+		if @options.customFillStyle != undefined
+			fillStyle = @options.customFillStyle(@)
+		else if @percentColors != null
+			fillStyle = @getColorForValue(@displayedValue, true)
+		else if @options.colorStop != undefined
+			if @options.gradientType == 0
+				fillStyle = this.ctx.createRadialGradient(w, h, 9, w, h, 70);
+			else
+				fillStyle = this.ctx.createLinearGradient(0, 0, w, 0);
+			fillStyle.addColorStop(0, @options.colorStart)
+			fillStyle.addColorStop(1, @options.colorStop)
+		else
+			fillStyle = @options.colorStart
+		@ctx.strokeStyle = fillStyle
+
+		@ctx.beginPath()
+		@ctx.arc(w, h, @radius, (1 + @options.angle) * Math.PI, displayedAngle, false)
+		@ctx.lineWidth = @lineWidth
+		@ctx.stroke()
+
+		@ctx.strokeStyle = @options.strokeColor
+		@ctx.beginPath()
+		@ctx.arc(w, h, @radius, displayedAngle, (2 - @options.angle) * Math.PI, false)
+		@ctx.stroke()
+		for gauge in @gp
+			gauge.update(true)
+
+
+class BaseDonut extends BaseGauge
+	lineWidth: 15
+	displayedValue: 0
+	value: 33
+	maxValue: 80
+	minValue: 0
+
+	options:
+		lineWidth: 0.10
+		colorStart: "#6f6ea0"
+		colorStop: "#c0c0db"
+		strokeColor: "#eeeeee"
+		shadowColor: "#d5d5d5"
+		angle: 0.35
+
+	constructor: (@canvas) ->
+		super()
+		if typeof G_vmlCanvasManager != 'undefined'
+			@canvas = window.G_vmlCanvasManager.initElement(@canvas)
+		@ctx = @canvas.getContext('2d')
+		@setOptions()
+		@render()
+
+	getAngle: (value) ->
+		return (1 - @options.angle) * Math.PI + ((value - @minValue) / (@maxValue - @minValue)) * ((2 + @options.angle) - (1 - @options.angle)) * Math.PI
+
+	setOptions: (options=null) ->
+		super(options)
+		@lineWidth = @canvas.height * @options.lineWidth
+		@radius = @canvas.height / 2 - @lineWidth/2
+		return @
+
+	set: (value) ->
+		@value = value
+		if @value > @maxValue
+			@maxValue = @value * 1.1
+		AnimationUpdater.run()
+
+	render: () ->
+		displayedAngle = @getAngle(@displayedValue)
+		w = @canvas.width / 2
+		h = @canvas.height / 2
+
+		if @textField
+			@textField.render(@)
+
+		grdFill = @ctx.createRadialGradient(w, h, 39, w, h, 70)
+		grdFill.addColorStop(0, @options.colorStart)
+		grdFill.addColorStop(1, @options.colorStop)
+
+		start = @radius - @lineWidth / 2
+		stop = @radius + @lineWidth / 2
+
+		@ctx.strokeStyle = @options.strokeColor
+		@ctx.beginPath()
+		@ctx.arc(w, h, @radius, (1 - @options.angle) * Math.PI, (2 + @options.angle) * Math.PI, false)
+		@ctx.lineWidth = @lineWidth
+		@ctx.lineCap = "round"
+		@ctx.stroke()
+
+		@ctx.strokeStyle = grdFill
+		@ctx.beginPath()
+		@ctx.arc(w, h, @radius, (1 - @options.angle) * Math.PI, displayedAngle, false)
+		@ctx.stroke()
+
+
+class Donut extends BaseDonut
+	strokeGradient: (w, h, start, stop) ->
+		grd = @ctx.createRadialGradient(w, h, start, w, h, stop)
+		grd.addColorStop(0, @options.shadowColor)
+		grd.addColorStop(0.12, @options._orgStrokeColor)
+		grd.addColorStop(0.88, @options._orgStrokeColor)
+		grd.addColorStop(1, @options.shadowColor)
+		return grd
+
+	setOptions: (options=null) ->
+		super(options)
+		w = @canvas.width / 2
+		h = @canvas.height / 2
+		start = @radius - @lineWidth / 2
+		stop = @radius + @lineWidth / 2
+		@options._orgStrokeColor = @options.strokeColor
+		@options.strokeColor = @strokeGradient(w, h, start, stop)
+		return @
+
+window.AnimationUpdater =
+	elements: []
+	animId: null
+
+	addAll: (list) ->
+		for elem in list
+			AnimationUpdater.elements.push(elem)
+
+	add: (object) ->
+		AnimationUpdater.elements.push(object)
+
+	run: () ->
+		animationFinished = true
+		for elem in AnimationUpdater.elements
+			if elem.update()
+				animationFinished = false
+		if not animationFinished
+			AnimationUpdater.animId = requestAnimationFrame(AnimationUpdater.run)
+		else
+			cancelAnimationFrame(AnimationUpdater.animId)
+
+window.Gauge = Gauge
+window.Donut = Donut
+window.BaseDonut = BaseDonut
+window.TextRenderer = TextRenderer

vendors/gauge.js/dist/gauge.js

@@ -0,0 +1,773 @@
+// Generated by CoffeeScript 1.6.3
+(function() {
+  var AnimatedText, AnimatedTextFactory, Bar, BaseDonut, BaseGauge, Donut, Gauge, GaugePointer, TextRenderer, ValueUpdater, addCommas, cutHex, formatNumber, mergeObjects, secondsToString, updateObjectValues, _ref, _ref1,
+    __hasProp = {}.hasOwnProperty,
+    __extends = function(child, parent) { for (var key in parent) { if (__hasProp.call(parent, key)) child[key] = parent[key]; } function ctor() { this.constructor = child; } ctor.prototype = parent.prototype; child.prototype = new ctor(); child.__super__ = parent.prototype; return child; };
+
+  (function() {
+    var browserRequestAnimationFrame, isCancelled, lastId, vendor, vendors, _i, _len;
+    vendors = ['ms', 'moz', 'webkit', 'o'];
+    for (_i = 0, _len = vendors.length; _i < _len; _i++) {
+      vendor = vendors[_i];
+      if (window.requestAnimationFrame) {
+        break;
+      }
+      window.requestAnimationFrame = window[vendor + 'RequestAnimationFrame'];
+      window.cancelAnimationFrame = window[vendor + 'CancelAnimationFrame'] || window[vendor + 'CancelRequestAnimationFrame'];
+    }
+    browserRequestAnimationFrame = null;
+    lastId = 0;
+    isCancelled = {};
+    if (!requestAnimationFrame) {
+      window.requestAnimationFrame = function(callback, element) {
+        var currTime, id, lastTime, timeToCall;
+        currTime = new Date().getTime();
+        timeToCall = Math.max(0, 16 - (currTime - lastTime));
+        id = window.setTimeout(function() {
+          return callback(currTime + timeToCall);
+        }, timeToCall);
+        lastTime = currTime + timeToCall;
+        return id;
+      };
+      return window.cancelAnimationFrame = function(id) {
+        return clearTimeout(id);
+      };
+    } else if (!window.cancelAnimationFrame) {
+      browserRequestAnimationFrame = window.requestAnimationFrame;
+      window.requestAnimationFrame = function(callback, element) {
+        var myId;
+        myId = ++lastId;
+        browserRequestAnimationFrame(function() {
+          if (!isCancelled[myId]) {
+            return callback();
+          }
+        }, element);
+        return myId;
+      };
+      return window.cancelAnimationFrame = function(id) {
+        return isCancelled[id] = true;
+      };
+    }
+  })();
+
+  String.prototype.hashCode = function() {
+    var char, hash, i, _i, _ref;
+    hash = 0;
+    if (this.length === 0) {
+      return hash;
+    }
+    for (i = _i = 0, _ref = this.length; 0 <= _ref ? _i < _ref : _i > _ref; i = 0 <= _ref ? ++_i : --_i) {
+      char = this.charCodeAt(i);
+      hash = ((hash << 5) - hash) + char;
+      hash = hash & hash;
+    }
+    return hash;
+  };
+
+  secondsToString = function(sec) {
+    var hr, min;
+    hr = Math.floor(sec / 3600);
+    min = Math.floor((sec - (hr * 3600)) / 60);
+    sec -= (hr * 3600) + (min * 60);
+    sec += '';
+    min += '';
+    while (min.length < 2) {
+      min = '0' + min;
+    }
+    while (sec.length < 2) {
+      sec = '0' + sec;
+    }
+    hr = hr ? hr + ':' : '';
+    return hr + min + ':' + sec;
+  };
+
+  formatNumber = function(num) {
+    return addCommas(num.toFixed(0));
+  };
+
+  updateObjectValues = function(obj1, obj2) {
+    var key, val;
+    for (key in obj2) {
+      if (!__hasProp.call(obj2, key)) continue;
+      val = obj2[key];
+      obj1[key] = val;
+    }
+    return obj1;
+  };
+
+  mergeObjects = function(obj1, obj2) {
+    var key, out, val;
+    out = {};
+    for (key in obj1) {
+      if (!__hasProp.call(obj1, key)) continue;
+      val = obj1[key];
+      out[key] = val;
+    }
+    for (key in obj2) {
+      if (!__hasProp.call(obj2, key)) continue;
+      val = obj2[key];
+      out[key] = val;
+    }
+    return out;
+  };
+
+  addCommas = function(nStr) {
+    var rgx, x, x1, x2;
+    nStr += '';
+    x = nStr.split('.');
+    x1 = x[0];
+    x2 = '';
+    if (x.length > 1) {
+      x2 = '.' + x[1];
+    }
+    rgx = /(\d+)(\d{3})/;
+    while (rgx.test(x1)) {
+      x1 = x1.replace(rgx, '$1' + ',' + '$2');
+    }
+    return x1 + x2;
+  };
+
+  cutHex = function(nStr) {
+    if (nStr.charAt(0) === "#") {
+      return nStr.substring(1, 7);
+    }
+    return nStr;
+  };
+
+  ValueUpdater = (function() {
+    ValueUpdater.prototype.animationSpeed = 32;
+
+    function ValueUpdater(addToAnimationQueue, clear) {
+      if (addToAnimationQueue == null) {
+        addToAnimationQueue = true;
+      }
+      this.clear = clear != null ? clear : true;
+      if (addToAnimationQueue) {
+        AnimationUpdater.add(this);
+      }
+    }
+
+    ValueUpdater.prototype.update = function(force) {
+      var diff;
+      if (force == null) {
+        force = false;
+      }
+      if (force || this.displayedValue !== this.value) {
+        if (this.ctx && this.clear) {
+          this.ctx.clearRect(0, 0, this.canvas.width, this.canvas.height);
+        }
+        diff = this.value - this.displayedValue;
+        if (Math.abs(diff / this.animationSpeed) <= 0.001) {
+          this.displayedValue = this.value;
+        } else {
+          this.displayedValue = this.displayedValue + diff / this.animationSpeed;
+        }
+        this.render();
+        return true;
+      }
+      return false;
+    };
+
+    return ValueUpdater;
+
+  })();
+
+  BaseGauge = (function(_super) {
+    __extends(BaseGauge, _super);
+
+    function BaseGauge() {
+      _ref = BaseGauge.__super__.constructor.apply(this, arguments);
+      return _ref;
+    }
+
+    BaseGauge.prototype.displayScale = 1;
+
+    BaseGauge.prototype.setTextField = function(textField) {
+      return this.textField = textField instanceof TextRenderer ? textField : new TextRenderer(textField);
+    };
+
+    BaseGauge.prototype.setMinValue = function(minValue, updateStartValue) {
+      var gauge, _i, _len, _ref1, _results;
+      this.minValue = minValue;
+      if (updateStartValue == null) {
+        updateStartValue = true;
+      }
+      if (updateStartValue) {
+        this.displayedValue = this.minValue;
+        _ref1 = this.gp || [];
+        _results = [];
+        for (_i = 0, _len = _ref1.length; _i < _len; _i++) {
+          gauge = _ref1[_i];
+          _results.push(gauge.displayedValue = this.minValue);
+        }
+        return _results;
+      }
+    };
+
+    BaseGauge.prototype.setOptions = function(options) {
+      if (options == null) {
+        options = null;
+      }
+      this.options = mergeObjects(this.options, options);
+      if (this.textField) {
+        this.textField.el.style.fontSize = options.fontSize + 'px';
+      }
+      if (this.options.angle > .5) {
+        this.gauge.options.angle = .5;
+      }
+      this.configDisplayScale();
+      return this;
+    };
+
+    BaseGauge.prototype.configDisplayScale = function() {
+      var backingStorePixelRatio, devicePixelRatio, height, prevDisplayScale, width;
+      prevDisplayScale = this.displayScale;
+      if (this.options.highDpiSupport === false) {
+        delete this.displayScale;
+      } else {
+        devicePixelRatio = window.devicePixelRatio || 1;
+        backingStorePixelRatio = this.ctx.webkitBackingStorePixelRatio || this.ctx.mozBackingStorePixelRatio || this.ctx.msBackingStorePixelRatio || this.ctx.oBackingStorePixelRatio || this.ctx.backingStorePixelRatio || 1;
+        this.displayScale = devicePixelRatio / backingStorePixelRatio;
+      }
+      if (this.displayScale !== prevDisplayScale) {
+        width = this.canvas.G__width || this.canvas.width;
+        height = this.canvas.G__height || this.canvas.height;
+        this.canvas.width = width * this.displayScale;
+        this.canvas.height = height * this.displayScale;
+        this.canvas.style.width = "" + width + "px";
+        this.canvas.style.height = "" + height + "px";
+        this.canvas.G__width = width;
+        this.canvas.G__height = height;
+      }
+      return this;
+    };
+
+    return BaseGauge;
+
+  })(ValueUpdater);
+
+  TextRenderer = (function() {
+    function TextRenderer(el) {
+      this.el = el;
+    }
+
+    TextRenderer.prototype.render = function(gauge) {
+      return this.el.innerHTML = formatNumber(gauge.displayedValue);
+    };
+
+    return TextRenderer;
+
+  })();
+
+  AnimatedText = (function(_super) {
+    __extends(AnimatedText, _super);
+
+    AnimatedText.prototype.displayedValue = 0;
+
+    AnimatedText.prototype.value = 0;
+
+    AnimatedText.prototype.setVal = function(value) {
+      return this.value = 1 * value;
+    };
+
+    function AnimatedText(elem, text) {
+      this.elem = elem;
+      this.text = text != null ? text : false;
+      this.value = 1 * this.elem.innerHTML;
+      if (this.text) {
+        this.value = 0;
+      }
+    }
+
+    AnimatedText.prototype.render = function() {
+      var textVal;
+      if (this.text) {
+        textVal = secondsToString(this.displayedValue.toFixed(0));
+      } else {
+        textVal = addCommas(formatNumber(this.displayedValue));
+      }
+      return this.elem.innerHTML = textVal;
+    };
+
+    return AnimatedText;
+
+  })(ValueUpdater);
+
+  AnimatedTextFactory = {
+    create: function(objList) {
+      var elem, out, _i, _len;
+      out = [];
+      for (_i = 0, _len = objList.length; _i < _len; _i++) {
+        elem = objList[_i];
+        out.push(new AnimatedText(elem));
+      }
+      return out;
+    }
+  };
+
+  GaugePointer = (function(_super) {
+    __extends(GaugePointer, _super);
+
+    GaugePointer.prototype.displayedValue = 0;
+
+    GaugePointer.prototype.value = 0;
+
+    GaugePointer.prototype.options = {
+      strokeWidth: 0.035,
+      length: 0.1,
+      color: "#000000"
+    };
+
+    function GaugePointer(gauge) {
+      this.gauge = gauge;
+      this.ctx = this.gauge.ctx;
+      this.canvas = this.gauge.canvas;
+      GaugePointer.__super__.constructor.call(this, false, false);
+      this.setOptions();
+    }
+
+    GaugePointer.prototype.setOptions = function(options) {
+      if (options == null) {
+        options = null;
+      }
+      updateObjectValues(this.options, options);
+      this.length = this.canvas.height * this.options.length;
+      this.strokeWidth = this.canvas.height * this.options.strokeWidth;
+      this.maxValue = this.gauge.maxValue;
+      this.minValue = this.gauge.minValue;
+      this.animationSpeed = this.gauge.animationSpeed;
+      return this.options.angle = this.gauge.options.angle;
+    };
+
+    GaugePointer.prototype.render = function() {
+      var angle, centerX, centerY, endX, endY, startX, startY, x, y;
+      angle = this.gauge.getAngle.call(this, this.displayedValue);
+      centerX = this.canvas.width / 2;
+      centerY = this.canvas.height * 0.9;
+      x = Math.round(centerX + this.length * Math.cos(angle));
+      y = Math.round(centerY + this.length * Math.sin(angle));
+      startX = Math.round(centerX + this.strokeWidth * Math.cos(angle - Math.PI / 2));
+      startY = Math.round(centerY + this.strokeWidth * Math.sin(angle - Math.PI / 2));
+      endX = Math.round(centerX + this.strokeWidth * Math.cos(angle + Math.PI / 2));
+      endY = Math.round(centerY + this.strokeWidth * Math.sin(angle + Math.PI / 2));
+      this.ctx.fillStyle = this.options.color;
+      this.ctx.beginPath();
+      this.ctx.arc(centerX, centerY, this.strokeWidth, 0, Math.PI * 2, true);
+      this.ctx.fill();
+      this.ctx.beginPath();
+      this.ctx.moveTo(startX, startY);
+      this.ctx.lineTo(x, y);
+      this.ctx.lineTo(endX, endY);
+      return this.ctx.fill();
+    };
+
+    return GaugePointer;
+
+  })(ValueUpdater);
+
+  Bar = (function() {
+    function Bar(elem) {
+      this.elem = elem;
+    }
+
+    Bar.prototype.updateValues = function(arrValues) {
+      this.value = arrValues[0];
+      this.maxValue = arrValues[1];
+      this.avgValue = arrValues[2];
+      return this.render();
+    };
+
+    Bar.prototype.render = function() {
+      var avgPercent, valPercent;
+      if (this.textField) {
+        this.textField.text(formatNumber(this.value));
+      }
+      if (this.maxValue === 0) {
+        this.maxValue = this.avgValue * 2;
+      }
+      valPercent = (this.value / this.maxValue) * 100;
+      avgPercent = (this.avgValue / this.maxValue) * 100;
+      $(".bar-value", this.elem).css({
+        "width": valPercent + "%"
+      });
+      return $(".typical-value", this.elem).css({
+        "width": avgPercent + "%"
+      });
+    };
+
+    return Bar;
+
+  })();
+
+  Gauge = (function(_super) {
+    __extends(Gauge, _super);
+
+    Gauge.prototype.elem = null;
+
+    Gauge.prototype.value = [20];
+
+    Gauge.prototype.maxValue = 80;
+
+    Gauge.prototype.minValue = 0;
+
+    Gauge.prototype.displayedAngle = 0;
+
+    Gauge.prototype.displayedValue = 0;
+
+    Gauge.prototype.lineWidth = 40;
+
+    Gauge.prototype.paddingBottom = 0.1;
+
+    Gauge.prototype.percentColors = null;
+
+    Gauge.prototype.options = {
+      colorStart: "#6fadcf",
+      colorStop: void 0,
+      gradientType: 0,
+      strokeColor: "#e0e0e0",
+      pointer: {
+        length: 0.8,
+        strokeWidth: 0.035
+      },
+      angle: 0.15,
+      lineWidth: 0.44,
+      fontSize: 40,
+      limitMax: false
+    };
+
+    function Gauge(canvas) {
+      this.canvas = canvas;
+      Gauge.__super__.constructor.call(this);
+      this.percentColors = null;
+      if (typeof G_vmlCanvasManager !== 'undefined') {
+        this.canvas = window.G_vmlCanvasManager.initElement(this.canvas);
+      }
+      this.ctx = this.canvas.getContext('2d');
+      this.gp = [new GaugePointer(this)];
+      this.setOptions();
+      this.render();
+    }
+
+    Gauge.prototype.setOptions = function(options) {
+      var gauge, _i, _len, _ref1;
+      if (options == null) {
+        options = null;
+      }
+      Gauge.__super__.setOptions.call(this, options);
+      this.configPercentColors();
+      this.lineWidth = this.canvas.height * (1 - this.paddingBottom) * this.options.lineWidth;
+      this.radius = this.canvas.height * (1 - this.paddingBottom) - this.lineWidth;
+      this.ctx.clearRect(0, 0, this.canvas.width, this.canvas.height);
+      this.render();
+      _ref1 = this.gp;
+      for (_i = 0, _len = _ref1.length; _i < _len; _i++) {
+        gauge = _ref1[_i];
+        gauge.setOptions(this.options.pointer);
+        gauge.render();
+      }
+      return this;
+    };
+
+    Gauge.prototype.configPercentColors = function() {
+      var bval, gval, i, rval, _i, _ref1, _results;
+      this.percentColors = null;
+      if (this.options.percentColors !== void 0) {
+        this.percentColors = new Array();
+        _results = [];
+        for (i = _i = 0, _ref1 = this.options.percentColors.length - 1; 0 <= _ref1 ? _i <= _ref1 : _i >= _ref1; i = 0 <= _ref1 ? ++_i : --_i) {
+          rval = parseInt((cutHex(this.options.percentColors[i][1])).substring(0, 2), 16);
+          gval = parseInt((cutHex(this.options.percentColors[i][1])).substring(2, 4), 16);
+          bval = parseInt((cutHex(this.options.percentColors[i][1])).substring(4, 6), 16);
+          _results.push(this.percentColors[i] = {
+            pct: this.options.percentColors[i][0],
+            color: {
+              r: rval,
+              g: gval,
+              b: bval
+            }
+          });
+        }
+        return _results;
+      }
+    };
+
+    Gauge.prototype.set = function(value) {
+      var i, max_hit, val, _i, _j, _len, _ref1;
+      if (!(value instanceof Array)) {
+        value = [value];
+      }
+      if (value.length > this.gp.length) {
+        for (i = _i = 0, _ref1 = value.length - this.gp.length; 0 <= _ref1 ? _i < _ref1 : _i > _ref1; i = 0 <= _ref1 ? ++_i : --_i) {
+          this.gp.push(new GaugePointer(this));
+        }
+      }
+      i = 0;
+      max_hit = false;
+      for (_j = 0, _len = value.length; _j < _len; _j++) {
+        val = value[_j];
+        if (val > this.maxValue) {
+          this.maxValue = this.value * 1.1;
+          max_hit = true;
+        }
+        this.gp[i].value = val;
+        this.gp[i++].setOptions({
+          maxValue: this.maxValue,
+          angle: this.options.angle
+        });
+      }
+      this.value = value[value.length - 1];
+      if (max_hit) {
+        if (!this.options.limitMax) {
+          return AnimationUpdater.run();
+        }
+      } else {
+        return AnimationUpdater.run();
+      }
+    };
+
+    Gauge.prototype.getAngle = function(value) {
+      return (1 + this.options.angle) * Math.PI + ((value - this.minValue) / (this.maxValue - this.minValue)) * (1 - this.options.angle * 2) * Math.PI;
+    };
+
+    Gauge.prototype.getColorForPercentage = function(pct, grad) {
+      var color, endColor, i, rangePct, startColor, _i, _ref1;
+      if (pct === 0) {
+        color = this.percentColors[0].color;
+      } else {
+        color = this.percentColors[this.percentColors.length - 1].color;
+        for (i = _i = 0, _ref1 = this.percentColors.length - 1; 0 <= _ref1 ? _i <= _ref1 : _i >= _ref1; i = 0 <= _ref1 ? ++_i : --_i) {
+          if (pct <= this.percentColors[i].pct) {
+            if (grad === true) {
+              startColor = this.percentColors[i - 1];
+              endColor = this.percentColors[i];
+              rangePct = (pct - startColor.pct) / (endColor.pct - startColor.pct);
+              color = {
+                r: Math.floor(startColor.color.r * (1 - rangePct) + endColor.color.r * rangePct),
+                g: Math.floor(startColor.color.g * (1 - rangePct) + endColor.color.g * rangePct),
+                b: Math.floor(startColor.color.b * (1 - rangePct) + endColor.color.b * rangePct)
+              };
+            } else {
+              color = this.percentColors[i].color;
+            }
+            break;
+          }
+        }
+      }
+      return 'rgb(' + [color.r, color.g, color.b].join(',') + ')';
+    };
+
+    Gauge.prototype.getColorForValue = function(val, grad) {
+      var pct;
+      pct = (val - this.minValue) / (this.maxValue - this.minValue);
+      return this.getColorForPercentage(pct, grad);
+    };
+
+    Gauge.prototype.render = function() {
+      var displayedAngle, fillStyle, gauge, h, w, _i, _len, _ref1, _results;
+      w = this.canvas.width / 2;
+      h = this.canvas.height * (1 - this.paddingBottom);
+      displayedAngle = this.getAngle(this.displayedValue);
+      if (this.textField) {
+        this.textField.render(this);
+      }
+      this.ctx.lineCap = "butt";
+      if (this.options.customFillStyle !== void 0) {
+        fillStyle = this.options.customFillStyle(this);
+      } else if (this.percentColors !== null) {
+        fillStyle = this.getColorForValue(this.displayedValue, true);
+      } else if (this.options.colorStop !== void 0) {
+        if (this.options.gradientType === 0) {
+          fillStyle = this.ctx.createRadialGradient(w, h, 9, w, h, 70);
+        } else {
+          fillStyle = this.ctx.createLinearGradient(0, 0, w, 0);
+        }
+        fillStyle.addColorStop(0, this.options.colorStart);
+        fillStyle.addColorStop(1, this.options.colorStop);
+      } else {
+        fillStyle = this.options.colorStart;
+      }
+      this.ctx.strokeStyle = fillStyle;
+      this.ctx.beginPath();
+      this.ctx.arc(w, h, this.radius, (1 + this.options.angle) * Math.PI, displayedAngle, false);
+      this.ctx.lineWidth = this.lineWidth;
+      this.ctx.stroke();
+      this.ctx.strokeStyle = this.options.strokeColor;
+      this.ctx.beginPath();
+      this.ctx.arc(w, h, this.radius, displayedAngle, (2 - this.options.angle) * Math.PI, false);
+      this.ctx.stroke();
+      _ref1 = this.gp;
+      _results = [];
+      for (_i = 0, _len = _ref1.length; _i < _len; _i++) {
+        gauge = _ref1[_i];
+        _results.push(gauge.update(true));
+      }
+      return _results;
+    };
+
+    return Gauge;
+
+  })(BaseGauge);
+
+  BaseDonut = (function(_super) {
+    __extends(BaseDonut, _super);
+
+    BaseDonut.prototype.lineWidth = 15;
+
+    BaseDonut.prototype.displayedValue = 0;
+
+    BaseDonut.prototype.value = 33;
+
+    BaseDonut.prototype.maxValue = 80;
+
+    BaseDonut.prototype.minValue = 0;
+
+    BaseDonut.prototype.options = {
+      lineWidth: 0.10,
+      colorStart: "#6f6ea0",
+      colorStop: "#c0c0db",
+      strokeColor: "#eeeeee",
+      shadowColor: "#d5d5d5",
+      angle: 0.35
+    };
+
+    function BaseDonut(canvas) {
+      this.canvas = canvas;
+      BaseDonut.__super__.constructor.call(this);
+      if (typeof G_vmlCanvasManager !== 'undefined') {
+        this.canvas = window.G_vmlCanvasManager.initElement(this.canvas);
+      }
+      this.ctx = this.canvas.getContext('2d');
+      this.setOptions();
+      this.render();
+    }
+
+    BaseDonut.prototype.getAngle = function(value) {
+      return (1 - this.options.angle) * Math.PI + ((value - this.minValue) / (this.maxValue - this.minValue)) * ((2 + this.options.angle) - (1 - this.options.angle)) * Math.PI;
+    };
+
+    BaseDonut.prototype.setOptions = function(options) {
+      if (options == null) {
+        options = null;
+      }
+      BaseDonut.__super__.setOptions.call(this, options);
+      this.lineWidth = this.canvas.height * this.options.lineWidth;
+      this.radius = this.canvas.height / 2 - this.lineWidth / 2;
+      return this;
+    };
+
+    BaseDonut.prototype.set = function(value) {
+      this.value = value;
+      if (this.value > this.maxValue) {
+        this.maxValue = this.value * 1.1;
+      }
+      return AnimationUpdater.run();
+    };
+
+    BaseDonut.prototype.render = function() {
+      var displayedAngle, grdFill, h, start, stop, w;
+      displayedAngle = this.getAngle(this.displayedValue);
+      w = this.canvas.width / 2;
+      h = this.canvas.height / 2;
+      if (this.textField) {
+        this.textField.render(this);
+      }
+      grdFill = this.ctx.createRadialGradient(w, h, 39, w, h, 70);
+      grdFill.addColorStop(0, this.options.colorStart);
+      grdFill.addColorStop(1, this.options.colorStop);
+      start = this.radius - this.lineWidth / 2;
+      stop = this.radius + this.lineWidth / 2;
+      this.ctx.strokeStyle = this.options.strokeColor;
+      this.ctx.beginPath();
+      this.ctx.arc(w, h, this.radius, (1 - this.options.angle) * Math.PI, (2 + this.options.angle) * Math.PI, false);
+      this.ctx.lineWidth = this.lineWidth;
+      this.ctx.lineCap = "round";
+      this.ctx.stroke();
+      this.ctx.strokeStyle = grdFill;
+      this.ctx.beginPath();
+      this.ctx.arc(w, h, this.radius, (1 - this.options.angle) * Math.PI, displayedAngle, false);
+      return this.ctx.stroke();
+    };
+
+    return BaseDonut;
+
+  })(BaseGauge);
+
+  Donut = (function(_super) {
+    __extends(Donut, _super);
+
+    function Donut() {
+      _ref1 = Donut.__super__.constructor.apply(this, arguments);
+      return _ref1;
+    }
+
+    Donut.prototype.strokeGradient = function(w, h, start, stop) {
+      var grd;
+      grd = this.ctx.createRadialGradient(w, h, start, w, h, stop);
+      grd.addColorStop(0, this.options.shadowColor);
+      grd.addColorStop(0.12, this.options._orgStrokeColor);
+      grd.addColorStop(0.88, this.options._orgStrokeColor);
+      grd.addColorStop(1, this.options.shadowColor);
+      return grd;
+    };
+
+    Donut.prototype.setOptions = function(options) {
+      var h, start, stop, w;
+      if (options == null) {
+        options = null;
+      }
+      Donut.__super__.setOptions.call(this, options);
+      w = this.canvas.width / 2;
+      h = this.canvas.height / 2;
+      start = this.radius - this.lineWidth / 2;
+      stop = this.radius + this.lineWidth / 2;
+      this.options._orgStrokeColor = this.options.strokeColor;
+      this.options.strokeColor = this.strokeGradient(w, h, start, stop);
+      return this;
+    };
+
+    return Donut;
+
+  })(BaseDonut);
+
+  window.AnimationUpdater = {
+    elements: [],
+    animId: null,
+    addAll: function(list) {
+      var elem, _i, _len, _results;
+      _results = [];
+      for (_i = 0, _len = list.length; _i < _len; _i++) {
+        elem = list[_i];
+        _results.push(AnimationUpdater.elements.push(elem));
+      }
+      return _results;
+    },
+    add: function(object) {
+      return AnimationUpdater.elements.push(object);
+    },
+    run: function() {
+      var animationFinished, elem, _i, _len, _ref2;
+      animationFinished = true;
+      _ref2 = AnimationUpdater.elements;
+      for (_i = 0, _len = _ref2.length; _i < _len; _i++) {
+        elem = _ref2[_i];
+        if (elem.update()) {
+          animationFinished = false;
+        }
+      }
+      if (!animationFinished) {
+        return AnimationUpdater.animId = requestAnimationFrame(AnimationUpdater.run);
+      } else {
+        return cancelAnimationFrame(AnimationUpdater.animId);
+      }
+    }
+  };
+
+  window.Gauge = Gauge;
+
+  window.Donut = Donut;
+
+  window.BaseDonut = BaseDonut;
+
+  window.TextRenderer = TextRenderer;
+
+}).call(this);

vendors/gauge.js/dist/gauge.min.js

@@ -0,0 +1,61 @@
+
+(function(){var AnimatedText,AnimatedTextFactory,Bar,BaseDonut,BaseGauge,Donut,Gauge,GaugePointer,TextRenderer,ValueUpdater,addCommas,cutHex,formatNumber,mergeObjects,secondsToString,updateObjectValues,_ref,_ref1,__hasProp={}.hasOwnProperty,__extends=function(child,parent){for(var key in parent){if(__hasProp.call(parent,key))child[key]=parent[key];}function ctor(){this.constructor=child;}ctor.prototype=parent.prototype;child.prototype=new ctor();child.__super__=parent.prototype;return child;};(function(){var browserRequestAnimationFrame,isCancelled,lastId,vendor,vendors,_i,_len;vendors=['ms','moz','webkit','o'];for(_i=0,_len=vendors.length;_i<_len;_i++){vendor=vendors[_i];if(window.requestAnimationFrame){break;}
+window.requestAnimationFrame=window[vendor+'RequestAnimationFrame'];window.cancelAnimationFrame=window[vendor+'CancelAnimationFrame']||window[vendor+'CancelRequestAnimationFrame'];}
+browserRequestAnimationFrame=null;lastId=0;isCancelled={};if(!requestAnimationFrame){window.requestAnimationFrame=function(callback,element){var currTime,id,lastTime,timeToCall;currTime=new Date().getTime();timeToCall=Math.max(0,16-(currTime-lastTime));id=window.setTimeout(function(){return callback(currTime+timeToCall);},timeToCall);lastTime=currTime+timeToCall;return id;};return window.cancelAnimationFrame=function(id){return clearTimeout(id);};}else if(!window.cancelAnimationFrame){browserRequestAnimationFrame=window.requestAnimationFrame;window.requestAnimationFrame=function(callback,element){var myId;myId=++lastId;browserRequestAnimationFrame(function(){if(!isCancelled[myId]){return callback();}},element);return myId;};return window.cancelAnimationFrame=function(id){return isCancelled[id]=true;};}})();String.prototype.hashCode=function(){var char,hash,i,_i,_ref;hash=0;if(this.length===0){return hash;}
+for(i=_i=0,_ref=this.length;0<=_ref?_i<_ref:_i>_ref;i=0<=_ref?++_i:--_i){char=this.charCodeAt(i);hash=((hash<<5)-hash)+char;hash=hash&hash;}
+return hash;};secondsToString=function(sec){var hr,min;hr=Math.floor(sec/3600);min=Math.floor((sec-(hr*3600))/60);sec-=(hr*3600)+(min*60);sec+='';min+='';while(min.length<2){min='0'+min;}
+while(sec.length<2){sec='0'+sec;}
+hr=hr?hr+':':'';return hr+min+':'+sec;};formatNumber=function(num){return addCommas(num.toFixed(0));};updateObjectValues=function(obj1,obj2){var key,val;for(key in obj2){if(!__hasProp.call(obj2,key))continue;val=obj2[key];obj1[key]=val;}
+return obj1;};mergeObjects=function(obj1,obj2){var key,out,val;out={};for(key in obj1){if(!__hasProp.call(obj1,key))continue;val=obj1[key];out[key]=val;}
+for(key in obj2){if(!__hasProp.call(obj2,key))continue;val=obj2[key];out[key]=val;}
+return out;};addCommas=function(nStr){var rgx,x,x1,x2;nStr+='';x=nStr.split('.');x1=x[0];x2='';if(x.length>1){x2='.'+x[1];}
+rgx=/(\d+)(\d{3})/;while(rgx.test(x1)){x1=x1.replace(rgx,'$1'+','+'$2');}
+return x1+x2;};cutHex=function(nStr){if(nStr.charAt(0)==="#"){return nStr.substring(1,7);}
+return nStr;};ValueUpdater=(function(){ValueUpdater.prototype.animationSpeed=32;function ValueUpdater(addToAnimationQueue,clear){if(addToAnimationQueue==null){addToAnimationQueue=true;}
+this.clear=clear!=null?clear:true;if(addToAnimationQueue){AnimationUpdater.add(this);}}
+ValueUpdater.prototype.update=function(force){var diff;if(force==null){force=false;}
+if(force||this.displayedValue!==this.value){if(this.ctx&&this.clear){this.ctx.clearRect(0,0,this.canvas.width,this.canvas.height);}
+diff=this.value-this.displayedValue;if(Math.abs(diff/this.animationSpeed)<=0.001){this.displayedValue=this.value;}else{this.displayedValue=this.displayedValue+diff/this.animationSpeed;}
+this.render();return true;}
+return false;};return ValueUpdater;})();BaseGauge=(function(_super){__extends(BaseGauge,_super);function BaseGauge(){_ref=BaseGauge.__super__.constructor.apply(this,arguments);return _ref;}
+BaseGauge.prototype.displayScale=1;BaseGauge.prototype.setTextField=function(textField){return this.textField=textField instanceof TextRenderer?textField:new TextRenderer(textField);};BaseGauge.prototype.setMinValue=function(minValue,updateStartValue){var gauge,_i,_len,_ref1,_results;this.minValue=minValue;if(updateStartValue==null){updateStartValue=true;}
+if(updateStartValue){this.displayedValue=this.minValue;_ref1=this.gp||[];_results=[];for(_i=0,_len=_ref1.length;_i<_len;_i++){gauge=_ref1[_i];_results.push(gauge.displayedValue=this.minValue);}
+return _results;}};BaseGauge.prototype.setOptions=function(options){if(options==null){options=null;}
+this.options=mergeObjects(this.options,options);if(this.textField){this.textField.el.style.fontSize=options.fontSize+'px';}
+if(this.options.angle>.5){this.gauge.options.angle=.5;}
+this.configDisplayScale();return this;};BaseGauge.prototype.configDisplayScale=function(){var backingStorePixelRatio,devicePixelRatio,height,prevDisplayScale,width;prevDisplayScale=this.displayScale;if(this.options.highDpiSupport===false){delete this.displayScale;}else{devicePixelRatio=window.devicePixelRatio||1;backingStorePixelRatio=this.ctx.webkitBackingStorePixelRatio||this.ctx.mozBackingStorePixelRatio||this.ctx.msBackingStorePixelRatio||this.ctx.oBackingStorePixelRatio||this.ctx.backingStorePixelRatio||1;this.displayScale=devicePixelRatio/backingStorePixelRatio;}
+if(this.displayScale!==prevDisplayScale){width=this.canvas.G__width||this.canvas.width;height=this.canvas.G__height||this.canvas.height;this.canvas.width=width*this.displayScale;this.canvas.height=height*this.displayScale;this.canvas.style.width=""+width+"px";this.canvas.style.height=""+height+"px";this.canvas.G__width=width;this.canvas.G__height=height;}
+return this;};return BaseGauge;})(ValueUpdater);TextRenderer=(function(){function TextRenderer(el){this.el=el;}
+TextRenderer.prototype.render=function(gauge){return this.el.innerHTML=formatNumber(gauge.displayedValue);};return TextRenderer;})();AnimatedText=(function(_super){__extends(AnimatedText,_super);AnimatedText.prototype.displayedValue=0;AnimatedText.prototype.value=0;AnimatedText.prototype.setVal=function(value){return this.value=1*value;};function AnimatedText(elem,text){this.elem=elem;this.text=text!=null?text:false;this.value=1*this.elem.innerHTML;if(this.text){this.value=0;}}
+AnimatedText.prototype.render=function(){var textVal;if(this.text){textVal=secondsToString(this.displayedValue.toFixed(0));}else{textVal=addCommas(formatNumber(this.displayedValue));}
+return this.elem.innerHTML=textVal;};return AnimatedText;})(ValueUpdater);AnimatedTextFactory={create:function(objList){var elem,out,_i,_len;out=[];for(_i=0,_len=objList.length;_i<_len;_i++){elem=objList[_i];out.push(new AnimatedText(elem));}
+return out;}};GaugePointer=(function(_super){__extends(GaugePointer,_super);GaugePointer.prototype.displayedValue=0;GaugePointer.prototype.value=0;GaugePointer.prototype.options={strokeWidth:0.035,length:0.1,color:"#000000"};function GaugePointer(gauge){this.gauge=gauge;this.ctx=this.gauge.ctx;this.canvas=this.gauge.canvas;GaugePointer.__super__.constructor.call(this,false,false);this.setOptions();}
+GaugePointer.prototype.setOptions=function(options){if(options==null){options=null;}
+updateObjectValues(this.options,options);this.length=this.canvas.height*this.options.length;this.strokeWidth=this.canvas.height*this.options.strokeWidth;this.maxValue=this.gauge.maxValue;this.minValue=this.gauge.minValue;this.animationSpeed=this.gauge.animationSpeed;return this.options.angle=this.gauge.options.angle;};GaugePointer.prototype.render=function(){var angle,centerX,centerY,endX,endY,startX,startY,x,y;angle=this.gauge.getAngle.call(this,this.displayedValue);centerX=this.canvas.width/2;centerY=this.canvas.height*0.9;x=Math.round(centerX+this.length*Math.cos(angle));y=Math.round(centerY+this.length*Math.sin(angle));startX=Math.round(centerX+this.strokeWidth*Math.cos(angle-Math.PI/2));startY=Math.round(centerY+this.strokeWidth*Math.sin(angle-Math.PI/2));endX=Math.round(centerX+this.strokeWidth*Math.cos(angle+Math.PI/2));endY=Math.round(centerY+this.strokeWidth*Math.sin(angle+Math.PI/2));this.ctx.fillStyle=this.options.color;this.ctx.beginPath();this.ctx.arc(centerX,centerY,this.strokeWidth,0,Math.PI*2,true);this.ctx.fill();this.ctx.beginPath();this.ctx.moveTo(startX,startY);this.ctx.lineTo(x,y);this.ctx.lineTo(endX,endY);return this.ctx.fill();};return GaugePointer;})(ValueUpdater);Bar=(function(){function Bar(elem){this.elem=elem;}
+Bar.prototype.updateValues=function(arrValues){this.value=arrValues[0];this.maxValue=arrValues[1];this.avgValue=arrValues[2];return this.render();};Bar.prototype.render=function(){var avgPercent,valPercent;if(this.textField){this.textField.text(formatNumber(this.value));}
+if(this.maxValue===0){this.maxValue=this.avgValue*2;}
+valPercent=(this.value/this.maxValue)*100;avgPercent=(this.avgValue/this.maxValue)*100;$(".bar-value",this.elem).css({"width":valPercent+"%"});return $(".typical-value",this.elem).css({"width":avgPercent+"%"});};return Bar;})();Gauge=(function(_super){__extends(Gauge,_super);Gauge.prototype.elem=null;Gauge.prototype.value=[20];Gauge.prototype.maxValue=80;Gauge.prototype.minValue=0;Gauge.prototype.displayedAngle=0;Gauge.prototype.displayedValue=0;Gauge.prototype.lineWidth=40;Gauge.prototype.paddingBottom=0.1;Gauge.prototype.percentColors=null;Gauge.prototype.options={colorStart:"#6fadcf",colorStop:void 0,gradientType:0,strokeColor:"#e0e0e0",pointer:{length:0.8,strokeWidth:0.035},angle:0.15,lineWidth:0.44,fontSize:40,limitMax:false};function Gauge(canvas){this.canvas=canvas;Gauge.__super__.constructor.call(this);this.percentColors=null;if(typeof G_vmlCanvasManager!=='undefined'){this.canvas=window.G_vmlCanvasManager.initElement(this.canvas);}
+this.ctx=this.canvas.getContext('2d');this.gp=[new GaugePointer(this)];this.setOptions();this.render();}
+Gauge.prototype.setOptions=function(options){var gauge,_i,_len,_ref1;if(options==null){options=null;}
+Gauge.__super__.setOptions.call(this,options);this.configPercentColors();this.lineWidth=this.canvas.height*(1-this.paddingBottom)*this.options.lineWidth;this.radius=this.canvas.height*(1-this.paddingBottom)-this.lineWidth;this.ctx.clearRect(0,0,this.canvas.width,this.canvas.height);this.render();_ref1=this.gp;for(_i=0,_len=_ref1.length;_i<_len;_i++){gauge=_ref1[_i];gauge.setOptions(this.options.pointer);gauge.render();}
+return this;};Gauge.prototype.configPercentColors=function(){var bval,gval,i,rval,_i,_ref1,_results;this.percentColors=null;if(this.options.percentColors!==void 0){this.percentColors=new Array();_results=[];for(i=_i=0,_ref1=this.options.percentColors.length-1;0<=_ref1?_i<=_ref1:_i>=_ref1;i=0<=_ref1?++_i:--_i){rval=parseInt((cutHex(this.options.percentColors[i][1])).substring(0,2),16);gval=parseInt((cutHex(this.options.percentColors[i][1])).substring(2,4),16);bval=parseInt((cutHex(this.options.percentColors[i][1])).substring(4,6),16);_results.push(this.percentColors[i]={pct:this.options.percentColors[i][0],color:{r:rval,g:gval,b:bval}});}
+return _results;}};Gauge.prototype.set=function(value){var i,max_hit,val,_i,_j,_len,_ref1;if(!(value instanceof Array)){value=[value];}
+if(value.length>this.gp.length){for(i=_i=0,_ref1=value.length-this.gp.length;0<=_ref1?_i<_ref1:_i>_ref1;i=0<=_ref1?++_i:--_i){this.gp.push(new GaugePointer(this));}}
+i=0;max_hit=false;for(_j=0,_len=value.length;_j<_len;_j++){val=value[_j];if(val>this.maxValue){this.maxValue=this.value*1.1;max_hit=true;}
+this.gp[i].value=val;this.gp[i++].setOptions({maxValue:this.maxValue,angle:this.options.angle});}
+this.value=value[value.length-1];if(max_hit){if(!this.options.limitMax){return AnimationUpdater.run();}}else{return AnimationUpdater.run();}};Gauge.prototype.getAngle=function(value){return(1+this.options.angle)*Math.PI+((value-this.minValue)/(this.maxValue-this.minValue))*(1-this.options.angle*2)*Math.PI;};Gauge.prototype.getColorForPercentage=function(pct,grad){var color,endColor,i,rangePct,startColor,_i,_ref1;if(pct===0){color=this.percentColors[0].color;}else{color=this.percentColors[this.percentColors.length-1].color;for(i=_i=0,_ref1=this.percentColors.length-1;0<=_ref1?_i<=_ref1:_i>=_ref1;i=0<=_ref1?++_i:--_i){if(pct<=this.percentColors[i].pct){if(grad===true){startColor=this.percentColors[i-1];endColor=this.percentColors[i];rangePct=(pct-startColor.pct)/(endColor.pct-startColor.pct);color={r:Math.floor(startColor.color.r*(1-rangePct)+endColor.color.r*rangePct),g:Math.floor(startColor.color.g*(1-rangePct)+endColor.color.g*rangePct),b:Math.floor(startColor.color.b*(1-rangePct)+endColor.color.b*rangePct)};}else{color=this.percentColors[i].color;}
+break;}}}
+return'rgb('+[color.r,color.g,color.b].join(',')+')';};Gauge.prototype.getColorForValue=function(val,grad){var pct;pct=(val-this.minValue)/(this.maxValue-this.minValue);return this.getColorForPercentage(pct,grad);};Gauge.prototype.render=function(){var displayedAngle,fillStyle,gauge,h,w,_i,_len,_ref1,_results;w=this.canvas.width/2;h=this.canvas.height*(1-this.paddingBottom);displayedAngle=this.getAngle(this.displayedValue);if(this.textField){this.textField.render(this);}
+this.ctx.lineCap="butt";if(this.options.customFillStyle!==void 0){fillStyle=this.options.customFillStyle(this);}else if(this.percentColors!==null){fillStyle=this.getColorForValue(this.displayedValue,true);}else if(this.options.colorStop!==void 0){if(this.options.gradientType===0){fillStyle=this.ctx.createRadialGradient(w,h,9,w,h,70);}else{fillStyle=this.ctx.createLinearGradient(0,0,w,0);}
+fillStyle.addColorStop(0,this.options.colorStart);fillStyle.addColorStop(1,this.options.colorStop);}else{fillStyle=this.options.colorStart;}
+this.ctx.strokeStyle=fillStyle;this.ctx.beginPath();this.ctx.arc(w,h,this.radius,(1+this.options.angle)*Math.PI,displayedAngle,false);this.ctx.lineWidth=this.lineWidth;this.ctx.stroke();this.ctx.strokeStyle=this.options.strokeColor;this.ctx.beginPath();this.ctx.arc(w,h,this.radius,displayedAngle,(2-this.options.angle)*Math.PI,false);this.ctx.stroke();_ref1=this.gp;_results=[];for(_i=0,_len=_ref1.length;_i<_len;_i++){gauge=_ref1[_i];_results.push(gauge.update(true));}
+return _results;};return Gauge;})(BaseGauge);BaseDonut=(function(_super){__extends(BaseDonut,_super);BaseDonut.prototype.lineWidth=15;BaseDonut.prototype.displayedValue=0;BaseDonut.prototype.value=33;BaseDonut.prototype.maxValue=80;BaseDonut.prototype.minValue=0;BaseDonut.prototype.options={lineWidth:0.10,colorStart:"#6f6ea0",colorStop:"#c0c0db",strokeColor:"#eeeeee",shadowColor:"#d5d5d5",angle:0.35};function BaseDonut(canvas){this.canvas=canvas;BaseDonut.__super__.constructor.call(this);if(typeof G_vmlCanvasManager!=='undefined'){this.canvas=window.G_vmlCanvasManager.initElement(this.canvas);}
+this.ctx=this.canvas.getContext('2d');this.setOptions();this.render();}
+BaseDonut.prototype.getAngle=function(value){return(1-this.options.angle)*Math.PI+((value-this.minValue)/(this.maxValue-this.minValue))*((2+this.options.angle)-(1-this.options.angle))*Math.PI;};BaseDonut.prototype.setOptions=function(options){if(options==null){options=null;}
+BaseDonut.__super__.setOptions.call(this,options);this.lineWidth=this.canvas.height*this.options.lineWidth;this.radius=this.canvas.height/2-this.lineWidth/2;return this;};BaseDonut.prototype.set=function(value){this.value=value;if(this.value>this.maxValue){this.maxValue=this.value*1.1;}
+return AnimationUpdater.run();};BaseDonut.prototype.render=function(){var displayedAngle,grdFill,h,start,stop,w;displayedAngle=this.getAngle(this.displayedValue);w=this.canvas.width/2;h=this.canvas.height/2;if(this.textField){this.textField.render(this);}
+grdFill=this.ctx.createRadialGradient(w,h,39,w,h,70);grdFill.addColorStop(0,this.options.colorStart);grdFill.addColorStop(1,this.options.colorStop);start=this.radius-this.lineWidth/2;stop=this.radius+this.lineWidth/2;this.ctx.strokeStyle=this.options.strokeColor;this.ctx.beginPath();this.ctx.arc(w,h,this.radius,(1-this.options.angle)*Math.PI,(2+this.options.angle)*Math.PI,false);this.ctx.lineWidth=this.lineWidth;this.ctx.lineCap="round";this.ctx.stroke();this.ctx.strokeStyle=grdFill;this.ctx.beginPath();this.ctx.arc(w,h,this.radius,(1-this.options.angle)*Math.PI,displayedAngle,false);return this.ctx.stroke();};return BaseDonut;})(BaseGauge);Donut=(function(_super){__extends(Donut,_super);function Donut(){_ref1=Donut.__super__.constructor.apply(this,arguments);return _ref1;}
+Donut.prototype.strokeGradient=function(w,h,start,stop){var grd;grd=this.ctx.createRadialGradient(w,h,start,w,h,stop);grd.addColorStop(0,this.options.shadowColor);grd.addColorStop(0.12,this.options._orgStrokeColor);grd.addColorStop(0.88,this.options._orgStrokeColor);grd.addColorStop(1,this.options.shadowColor);return grd;};Donut.prototype.setOptions=function(options){var h,start,stop,w;if(options==null){options=null;}
+Donut.__super__.setOptions.call(this,options);w=this.canvas.width/2;h=this.canvas.height/2;start=this.radius-this.lineWidth/2;stop=this.radius+this.lineWidth/2;this.options._orgStrokeColor=this.options.strokeColor;this.options.strokeColor=this.strokeGradient(w,h,start,stop);return this;};return Donut;})(BaseDonut);window.AnimationUpdater={elements:[],animId:null,addAll:function(list){var elem,_i,_len,_results;_results=[];for(_i=0,_len=list.length;_i<_len;_i++){elem=list[_i];_results.push(AnimationUpdater.elements.push(elem));}
+return _results;},add:function(object){return AnimationUpdater.elements.push(object);},run:function(){var animationFinished,elem,_i,_len,_ref2;animationFinished=true;_ref2=AnimationUpdater.elements;for(_i=0,_len=_ref2.length;_i<_len;_i++){elem=_ref2[_i];if(elem.update()){animationFinished=false;}}
+if(!animationFinished){return AnimationUpdater.animId=requestAnimationFrame(AnimationUpdater.run);}else{return cancelAnimationFrame(AnimationUpdater.animId);}}};window.Gauge=Gauge;window.Donut=Donut;window.BaseDonut=BaseDonut;window.TextRenderer=TextRenderer;}).call(this);

vendors/gauge.js/index.html

@@ -0,0 +1,370 @@
+<!DOCTYPE html>
+<html>
+<head>
+  <title>gauge.js</title>
+  <meta name="description" content="100% native and cool looking animated JavaScript/CoffeeScript gauge">
+  <meta name="viewport" content="width=1024, maximum-scale=1">
+  <meta property="og:image" content="http://bernii.github.com/gauge.js/assets/preview.jpg?v=1" />
+  <link rel="shortcut icon" href="favicon.ico">
+  <meta http-equiv="X-UA-Compatible" content="IE=7" />
+  <link href="assets/bootstrap.min.css" type="text/css" rel="stylesheet">
+  <link href="assets/main.css?v=5" type="text/css" rel="stylesheet">
+  <link href='http://fonts.googleapis.com/css?family=Amaranth:400,700|Just+Another+Hand' rel='stylesheet' type='text/css'>
+  <link href="assets/prettify.css" type="text/css" rel="stylesheet">
+  <link rel="stylesheet" type="text/css" href="assets/fd-slider/fd-slider.css?v=2">
+  <link rel="stylesheet" type="text/css" href="assets/fd-slider/fd-slider-tooltip.css">
+  <script type="text/javascript" src="assets/prettify.js"></script>
+  <script type="text/javascript" src="assets/jscolor.js"></script>
+  <!--[if lt IE 9]><script type="text/javascript" src="assets/excanvas.compiled.js"></script><![endif]-->
+</head>
+<body>
+
+<div id="logo">
+  <h1>gauge.js</h1>
+  <h2>100% native and cool looking animated JavaScript/CoffeeScript gauge</h2>
+  <div id="its-coffee">coffee</div>
+  <div id="strike-it"></div>
+  <!--
+  <div id="mask">
+    <div id="dot"></div>
+  </div>
+  -->
+</div>
+
+<a id="ribbon" href="http://github.com/bernii/gauge.js"></a>
+
+<div id="content">
+
+<div id="download">
+  <a href="dist/gauge.coffee" class="btn btn-primary btn-large">gauge.coffee</a>
+  <a href="dist/gauge.min.js" class="btn btn-large">gauge.min.js</a>
+</div>
+
+<div id="example" class="gauge">
+  <h2>Example</h2>
+
+  <h4>Variant selection</h4>
+  <ul class="horiz-list" id="type-select">
+  	<li class="active" type="gauge"><canvas width=100 height=50 id="select-1"></canvas></li>
+  	<li type="donut"><canvas width=80 height=40 id="select-2"></canvas></li>
+  </ul>	
+  <div id="preview">
+  	<canvas width=220 height=70 id="canvas-preview"></canvas>
+  	<div id="preview-textfield"></div>
+  </div>
+  <form id="opts" class="opts">
+  	<h4>Options:</h4>
+  	<label>Current Val:</label><input type="text" name="currval" min="0" max="3000" step="25" value="1244"><br>
+    <label>Anim speed:</label><input type="text" name="animationSpeed" min="1" max="128" step="1" value="32"><br><br>
+    <label>Angle:</label><input id="input-angle" type="text" name="angle" min="0" max="50" step="1" value="15"><br>
+    <label>Line width:</label><input id="input-line-width" type="text" name="lineWidth" min="0" max="70" value="44"><br>
+    <label>Ptr length:</label><input id="input-ptr-len" type="text" name="pointer.length" min="0" max="100" value="90"><br>
+    <label>Ptr color:</label><input id="input-ptr-color" type="text" class="color" name="pointer.color" value="000000"><br>
+    <label>Ptr stroke:</label><input id="input-ptr-stroke" type="text" name="pointer.strokeWidth" min="0" max="300" value="35"><br>
+    <label>Font size:</label><input id="input-font-size" type="text" name="fontSize" min="0" max="100" value="41"><br>
+    <label>Color start:</label><input type="text" name="colorStart" class="color" value="6FADCF"><br>
+    <label>Color stop:</label><input type="text" name="colorStop" class="color" value="8FC0DA"><br>
+    <label>Background:</label><input type="text" name="strokeColor" class="color" value="E0E0E0"><br>
+  </form>
+
+  <br clear="left">
+  <input type="checkbox" id="share">
+  <label for="share">
+    <b>Share it!</b> If checked, the option values will be stored in the URL so that you can easily share your settings.
+  </label>
+</div>
+
+<h2>Features</h2>
+<ul>
+  <li>No images, no external CSS - pure canvas</li>
+  <li>No dependencies (jQuery is <a href="#jquery">supported</a>, but not required)</li>
+  <li>Highly configurable</li>
+  <li>Resolution independent</li>
+  <li>Animated guage value changes (!)</li>
+  <li>Works in all major browsers</li>
+  <li>MIT License</li>
+</ul>
+
+<h2 id="usage">Usage</h2>
+<pre class="prettyprint">
+var opts = {
+  lines: <span id="opt-lines" class="lit">12</span>, // The number of lines to draw
+  angle: <span id="opt-angle" class="lit">7</span>, // The length of each line
+  lineWidth: <span id="opt-lineWidth" class="lit">5</span>, // The line thickness
+  pointer: {
+    length: <span id="opt-pointer-length" class="lit">10</span>, // The radius of the inner circle
+    strokeWidth: <span id="opt-pointer-strokeWidth" class="lit">0</span>, // The rotation offset
+    color: '<span id="opt-pointer-color" class="lit">#000000</span>' // Fill color
+  },
+  limitMax: '<span id="opt-limitMax" class="lit">false</span>',   // If true, the pointer will not go past the end of the gauge
+  colorStart: '<span id="opt-colorStart" class="lit">0</span>',   // Colors
+  colorStop: '<span id="opt-colorStop" class="lit">0</span>',    // just experiment with them
+  strokeColor: '<span id="opt-strokeColor" class="lit">0</span>',   // to see which ones work best for you
+  generateGradient: true
+};
+var target = document.getElementById('foo'); // your canvas element
+var gauge = new <span id="class-code-name" class="typ">Gauge</span>(target).setOptions(opts); // create sexy gauge!
+gauge.maxValue = <span id="opt-maxval" class="lit">3000</span>; // set max gauge value
+gauge.animationSpeed = <span id="opt-animationSpeed" class="lit">3000</span>; // set animation speed (32 is default value)
+gauge.set(<span id="opt-currval" class="lit">1500</span>); // set actual value
+</pre>
+<p>
+  The <code>Gauge</code> class handles drawing on canvas and starts the animation. 
+</p>
+
+<h2 id="advanced-options">Advanced options</h2>
+<ul>
+  <li>
+    <b>Percentage color</b>
+    <p>If you want to control how Gauge behavaes in relation to the displayed value you can use the Guage option called <b>percentColors</b>. To use it add following entry to the options:
+<pre class="prettyprint">
+percentColors = [[0.0, "#a9d70b" ], [0.50, "#f9c802"], [1.0, "#ff0000"]];
+</pre>
+    see working example at <a href="http://jsfiddle.net/berni/Yb4d7/">JSFiddle</a></p>
+  </li>
+</ul>
+
+<h3 id="jquery">jQuery plugin</h3>
+<p>
+  Gauge.js does not require jQuery. Anyway, if you use jQuery you may use the following plugin:
+</p>
+<pre class="prettyprint">
+$.fn.gauge = function(opts) {
+  this.each(function() {
+    var $this = $(this),
+        data = $this.data();
+
+    if (data.gauge) {
+      data.gauge.stop();
+      delete data.gauge;
+    }
+    if (opts !== false) {
+      data.gauge = new Gauge(this).setOptions(opts);
+    }
+  });
+  return this;
+};
+</pre>
+<h2>Supported browsers</h2>
+<img src="assets/browsers.png">
+<p>
+  Gauge.js has been (not yet!) successfully tested in the following browsers:
+  <ul>
+    <li>Chrome</li>
+    <li>Safari 3.2+</li>
+    <li>Firefox 3.5+</li>
+    <li>IE 9</li>
+    <li>Opera 10.6+</li>
+    <li>Mobile Safari (iOS 3.2+)</li>
+    <li>Android 2.3+</li>
+  </ul>
+</p>
+
+<h2>Changes</h2>
+
+<h3 id="v1.2.1">Version 1.2.1 (9.03.2014)</h3>
+<ul>
+  <li>Proper handling of color params <a href="https://github.com/bernii/gauge.js/issues/47">issue #47</a>.</li>
+  <li>Moved percentage color to example/docs + <a href="http://jsfiddle.net/berni/Yb4d7/">JSFiddle</a></li>
+</ul>
+
+<h3 id="v1.2">Version 1.2 (16.08.2012)</h3>
+<ul>
+  <li>Prototype chain fix. See <a href="https://github.com/bernii/gauge.js/issues/7">issue #7</a>.</li>
+  <li>Refactored code a bit to make it more flexible. Default class that has some extra features like gradient shadows is called Donut while more flexible one (for devs) is called BaseDonut - use it if you would don't need extra automatic stuff.</li>
+  <li>Ability to scale gauges (requested via email) - example at <a href="http://jsfiddle.net/7Z2z2/">JSFiddle</a></li>
+</ul>
+
+<h3 id="v1.1">Version 1.1 (15.08.2012)</h3>
+<ul>
+  <li>Fixed color picker <a href="https://github.com/bernii/gauge.js/issues/2">bug</a> in FF & Opera</li>
+  <li>Added a shadow option. See <a href="https://github.com/bernii/gauge.js/pull/5">issue #5</a>.</li>
+  <li>Added multiple pointer option (requested via email). This needed some code refactoring. No demo for it yet. Use array of values to check it ex. gauge.set([44, 554]);</li>
+  <li>Added wrapper for formatting text output <a href="https://github.com/bernii/gauge.js/issues/4">issue #4</a>.</li>
+</ul>
+
+<h3 id="v1.0">Version 1.0 (27.6.2012)</h3>
+<ul>
+  <li>Initial release</li>
+</ul>
+
+<h2>Contact</h2>
+<p id="contact">
+  <img width="57" height="57" src="http://www.gravatar.com/avatar/429e77b5fd1904a032be360339e0bf74">
+  If you encounter any problems, please use the <a href="https://github.com/bernii/gauge.js/issues">GitHub issue tracker</a>.<br>
+  If you like gauge.js and use it in the wild, let me know.<br>
+  If you want to contact me, drop me a message <a href="mailto:bkobos+githubp@extensa.pl">via email</a><br>
+</p>
+</div>
+<div id="footer">
+  <a class="github" href="http://github.com">Hosted on GitHub</a>
+</div>
+<script src="https://ajax.googleapis.com/ajax/libs/jquery/1.7.2/jquery.min.js"></script>
+<script type="text/javascript" src="assets/fd-slider/fd-slider.js"></script>
+<script src="dist/gauge.js"></script>
+<script>
+  prettyPrint();
+  function update() {
+    var opts = {};
+    $('.opts input[min], .opts .color').each(function() {
+      var val = $(this).hasClass("color") ? this.value : parseFloat(this.value);
+      if($(this).hasClass("color")){
+        val = "#" + val;
+      }
+      if(this.name.indexOf("lineWidth") != -1 ||
+        this.name.indexOf("angle") != -1 ||
+        this.name.indexOf("pointer.length") != -1){
+        val /= 100;
+      }else if(this.name.indexOf("pointer.strokeWidth") != -1){
+        val /= 1000;
+      }
+      $('#opt-' + this.name.replace(".", "-")).text(val);
+      if(this.name.indexOf(".") != -1){
+      	var elems = this.name.split(".");
+      	var tmp_opts = opts;
+      	for(var i=0; i<elems.length - 1; i++){
+      		if(!(elems[i] in tmp_opts)){
+      			tmp_opts[elems[i]] = {};
+      		}
+      		tmp_opts = tmp_opts[elems[i]];
+      	}
+      	tmp_opts[elems[elems.length - 1]] = val;
+      }else if($(this).hasClass("color")){
+        // color picker is removing # from color values
+      	opts[this.name] = "#" + this.value
+        $('#opt-' + this.name.replace(".", "-")).text("#" + this.value);
+      }else{
+      	opts[this.name] = val;
+      }
+      if(this.name == "currval"){
+      	// update current demo gauge
+      	demoGauge.set(parseInt(this.value));
+      	AnimationUpdater.run();
+      }
+    });
+    $('#opts input:checkbox').each(function() {
+      opts[this.name] = this.checked;
+      $('#opt-' + this.name).text(this.checked);
+    });
+    demoGauge.animationSpeed = opts.animationSpeed;
+    opts.generateGradient = true;
+    demoGauge.setOptions(opts);
+    demoGauge.ctx.clearRect(0, 0, demoGauge.ctx.canvas.width, demoGauge.ctx.canvas.height);
+    demoGauge.render();
+    if ($('#share').is(':checked')) {
+      window.location.replace('#?' + $('form').serialize());
+    }
+  }
+  function initGauge(){
+    document.getElementById("class-code-name").innerHTML = "Gauge";
+    demoGauge = new Gauge(document.getElementById("canvas-preview"));
+    demoGauge.setTextField(document.getElementById("preview-textfield"));
+    demoGauge.maxValue = 3000;
+    demoGauge.set(1244);
+  };
+  function initDonut(){
+    document.getElementById("class-code-name").innerHTML = "Donut";
+    demoGauge = new Donut(document.getElementById("canvas-preview"));
+    demoGauge.setTextField(document.getElementById("preview-textfield"));
+    demoGauge.maxValue = 3000;
+    demoGauge.set(1244);
+  };
+  $(function() {
+    var params = {};
+    var hash = /^#\?(.*)/.exec(location.hash);
+    if (hash) {
+      $('#share').prop('checked', true);
+      $.each(hash[1].split(/&/), function(i, pair) {
+        var kv = pair.split(/=/);
+        params[kv[0]] = kv[kv.length-1];
+      });
+    }
+    $('.opts input[min], #opts .color').each(function() {
+      var val = params[this.name];
+      if (val !== undefined) this.value = val;
+      this.onchange = update;
+    });
+    $('.opts input[name=currval]').mouseup(function(){
+    	AnimationUpdater.run();
+    });
+
+    $('.opts input:checkbox').each(function() {
+      this.checked = !!params[this.name];
+      this.onclick = update;
+    });
+    $('#share').click(function() {
+      window.location.replace(this.checked ? '#?' + $('form').serialize() : '#!');
+    });
+    
+    $("#type-select li").click(function(){
+    	$("#type-select li").removeClass("active")
+    	$(this).addClass("active");
+    	var type = $(this).attr("type");
+    	if(type=="donut"){
+    		initDonut();
+    		$("input[name=lineWidth]").val(10);
+    		$("input[name=fontSize]").val(24);
+    		$("input[name=angle]").val(35);
+
+    		$("input[name=colorStart]").val("6F6EA0")[0].color.importColor();
+    		$("input[name=colorStop]").val("C0C0DB")[0].color.importColor();
+    		$("input[name=strokeColor]").val("EEEEEE")[0].color.importColor();
+
+    		fdSlider.disable('input-ptr-len');
+    		fdSlider.disable('input-ptr-stroke');
+        $("#input-ptr-color").prop('disabled', true);
+
+        selectGaguge1.set(1);
+        selectGaguge2.set(3000);
+
+    	}else{
+    		initGauge();
+    		$("input[name=lineWidth]").val(44);
+    		$("input[name=fontSize]").val(41);
+    		$("input[name=angle]").val(15);
+
+    		$("input[name=colorStart]").val("6FADCF")[0].color.importColor();
+    		$("input[name=colorStop]").val("8FC0DA")[0].color.importColor();
+    		$("input[name=strokeColor]").val("E0E0E0")[0].color.importColor();
+
+    		fdSlider.enable('input-ptr-len');
+    		fdSlider.enable('input-ptr-stroke');
+        $("#input-ptr-color").prop('disabled', false);
+        selectGaguge1.set(3000);
+        selectGaguge2.set(1) ;
+    	}
+    	fdSlider.updateSlider('input-line-width');
+    	fdSlider.updateSlider('input-font-size');
+    	fdSlider.updateSlider('input-angle');
+    	$("#example").removeClass("donut, gauge").addClass(type);
+    	update();
+    });
+
+    selectGaguge1 = new Gauge(document.getElementById("select-1"));
+    selectGaguge1.maxValue = 3000;
+    selectGaguge1.set(1552);
+    
+    selectGaguge2 = new Donut(document.getElementById("select-2"));
+    selectGaguge2.maxValue = 3000;
+    selectGaguge2.set(1844);
+    
+    initGauge();
+    update();
+    
+  });
+</script>
+<script type="text/javascript">
+
+  var _gaq = _gaq || [];
+  _gaq.push(['_setAccount', 'UA-11790841-11']);
+  _gaq.push(['_trackPageview']);
+
+  (function() {
+    var ga = document.createElement('script'); ga.type = 'text/javascript'; ga.async = true;
+    ga.src = ('https:' == document.location.protocol ? 'https://ssl' : 'http://www') + '.google-analytics.com/ga.js';
+    var s = document.getElementsByTagName('script')[0]; s.parentNode.insertBefore(ga, s);
+  })();
+
+</script>
+</body>
+</html>