Update to 0f5dbae to change out gauge code

Eliminating extra jquery plugin since we already have one for drawing gauges
opendcim · Feb 1, 2016 · 9cb14c1 · 9cb14c1
1 parent 0f5dbae
commit 9cb14c1
Show file tree

Hide file tree

Showing 2 changed files with 28 additions and 16 deletions.
diff --git a/report_asset_Excel-new.php b/report_asset_Excel-new.php
@@ -46,21 +46,45 @@
   <script type="text/javascript" src="scripts/jquery.min.js"></script>
   <script type="text/javascript" src="scripts/jquery-ui.min.js"></script>
   <script type="text/javascript" src="scripts/common.js"></script>
-  <script type="text/javascript" src="scripts/jquery.knob.min.js"></script>
+  <script type="text/javascript" src="scripts/gauge.min.js"></script>
 
 <SCRIPT type="text/javascript" >
 var timer;
+var gauge;
 
 $(document).ready( function() {
+	gauge=new Gauge({
+		renderTo: 'power-gauge',
+		type: 'canv-gauge',
+		title: '% Complete',
+		minValue: '0',
+		maxValue: '100',
+		majorTicks: [ 0,10,20,30,40,50,60,70,80,90,100 ],
+		minorTicks: '2',
+		strokeTicks: false,
+		units: '%',
+		valueFormat: { int : 3, dec : 0 },
+		glow: false,
+		animation: {
+			delay: 10,
+			duration: 200,
+			fn: 'bounce'
+			},
+		colors: {
+			needle: {start: '#000', end: '#000' },
+			title: '#00f',
+			},
+		highlights: [ {from: 0, to: 50, color: '#eaa'}, {from: 50, to: 80, color: '#fffacd'}, {from: 80, to: 100, color: '#0a0'} ],
+		});
+	gauge.draw().setValue(0);
     timer = setInterval( function() {
         $.ajax({
             type: 'GET',
             url: 'scripts/ajax_progress.php',
             dataType: 'json',
             success: function(data) {
                 $("#status").text(data.Status);
-                $(".dial").val(data.Percentage);
-                $(".dial").trigger("change");
+				gauge.draw().setValue(data.Percentage);
                 if ( data.Percentage >= 100 ) {
                     clearInterval(timer);
                     // Reload with Stage 3 to send the file to the user
@@ -76,18 +100,8 @@
 <body>
 <div>
 <h3 id="status">Starting</h3>
-<input type="text" value="0" class="dial">
+<div><canvas id="power-gauge" width="200" height="200"></canvas></div>
 </div>
-<script>
-    $(".dial").knob({
-        'min': 0,
-        'max': 100,
-        'step': 1,
-        'fgColor': '#00AA00',
-        'readOnly': true
-    });
-</script>
-
 </body>
 </html>
 <?php

diff --git a/scripts/jquery.knob.min.js b/scripts/jquery.knob.min.js