From 405c90a5f1a40c540bb27553077b3d01203fe622 Mon Sep 17 00:00:00 2001
From: Jeremy Tan <jeremy@jx.tan.fake>
Date: Wed, 23 Oct 2013 20:56:47 +0800
Subject: [PATCH] Add in live values data page + minor gui fixes

---
 server/actuator.c                             |   6 +
 server/actuator.h                             |   1 +
 server/fastcgi.c                              |   2 +-
 testing/MCTXWeb/public_html/control.html      |  46 +----
 testing/MCTXWeb/public_html/data.html         |   1 +
 testing/MCTXWeb/public_html/graph.html        |   1 +
 testing/MCTXWeb/public_html/help.html         |   1 +
 testing/MCTXWeb/public_html/index.html        |   1 +
 testing/MCTXWeb/public_html/pintest.html      |   1 +
 .../MCTXWeb/public_html/static/mctx.graph.js  |   7 +-
 testing/MCTXWeb/public_html/values.html       | 173 ++++++++++++++++++
 11 files changed, 196 insertions(+), 44 deletions(-)
 create mode 100644 testing/MCTXWeb/public_html/values.html

diff --git a/server/actuator.c b/server/actuator.c
index 617136e..7473485 100644
--- a/server/actuator.c
+++ b/server/actuator.c
@@ -457,3 +457,9 @@ Actuator * Actuator_Identify(const char * name)
 	}
 	return NULL;
 }
+
+DataPoint Actuator_LastData(int id)
+{
+	Actuator * a = &(g_actuators[id]);
+	return a->last_setting;
+}
diff --git a/server/actuator.h b/server/actuator.h
index a5ac75b..46c2f44 100644
--- a/server/actuator.h
+++ b/server/actuator.h
@@ -86,6 +86,7 @@ extern Actuator * Actuator_Identify(const char * str); // Identify a Sensor from
 
 extern void Actuator_Handler(FCGIContext *context, char * params); // Handle a FCGI request for Actuator control
 extern const char * Actuator_GetName(int id);
+extern DataPoint Actuator_LastData(int id);
 
 #endif //_ACTUATOR_H
 
diff --git a/server/fastcgi.c b/server/fastcgi.c
index 75863c1..76ce61f 100644
--- a/server/fastcgi.c
+++ b/server/fastcgi.c
@@ -78,7 +78,7 @@ static void IdentifyHandler(FCGIContext *context, char *params)
 				FCGI_JSONValue(",\n\t\t");
 			}
 
-			DataPoint d = Sensor_LastData(i);
+			DataPoint d = Actuator_LastData(i);
 			FCGI_JSONValue("\"%d\" : {\"name\" : \"%s\", \"value\" : [%f, %f] }", i, Actuator_GetName(i), d.time_stamp, d.value); 
 		}
 		FCGI_JSONValue("\n\t}");
diff --git a/testing/MCTXWeb/public_html/control.html b/testing/MCTXWeb/public_html/control.html
index 5d22e90..18769d2 100644
--- a/testing/MCTXWeb/public_html/control.html
+++ b/testing/MCTXWeb/public_html/control.html
@@ -18,6 +18,8 @@
         $(document).ready(function () {
           $("form").submit(function () { //Prevent form submit globally
             return false;
+          }).each(function () {
+            this.reset();
           });
           
           //Set the status updated
@@ -50,7 +52,8 @@
           });
           
           $("#pressure-controls input[name='clear']").click(function () {
-            $("#pressure-set")[0].reset();
+            $("#pressure-controls")[0].reset();
+            $("#pressure-result").text("");
           });
           
           $("#pressure-controls input[name='zero']").click(function () {
@@ -133,6 +136,7 @@
                 <li><a href="index.html"><span>Home</span></a></li>
                 <li><a href="control.html"><span>Experiment control</span></a></li>
                 <li><a href="graph.html"><span>Experiment graphs</span></a></li>
+                <li><a href="values.html"><span>Experiment data (live)</span></a></li>
                 <li><a href="data.html"><span>Experiment data</span></a></li>
                 <li><a href="pintest.html"><span>Pin debugging</span></a></li>
                 <li class="last"><a href="help.html"><span>Help</span></a></li>
@@ -234,46 +238,6 @@
               </p>
             </form>
           </div>
-          
-          <div id="stats-widget" class="widget">
-            <form id="stats" action="#" class="nice clear">
-              <table>
-                <tr>
-                  <td><label for="stats-mainspressure">Mains pressure (kPa)</label></td>
-                  <td><label for="stats-canpressure">Can pressure (kPa)</label></td>
-                </tr>
-                <tr>
-                  <td><input id="stats-mainspressure" type="text" readonly></td>
-                  <td><input id="stats-canpressure" type="text" readonly></td>
-                </tr>
-                <tr class="stats-strain">
-                  <td><label for="stats-strain1">Central hoop strain</label></td>
-                  <td><label for="stats-strain2">Central longitudinal strain</label></td>
-                </tr>
-                <tr class="stats-strain">
-                  <td><input id="stats-strain1" type="text" readonly></td>
-                  <td><input id="stats-strain2" type="text" readonly></td>
-                </tr>
-                <tr class="stats-strain">
-                  <td><label for="stats-strain3">End hoop strain</label></td>
-                  <td><label for="stats-strain4">End longitudinal strain</label></td>
-                </tr>
-                <tr class="stats-strain">
-                  <td><input id="stats-strain3" type="text" readonly></td>
-                  <td><input id="stats-strain4" type="text" readonly></td>
-                </tr>
-                <tr class="stats-strain">
-                  <td><label for="stats-dilatometer">Dilatometer reading</label></td>
-                  <td><label for="stats-dilatometer">Camera feed</label></td>
-                </tr>
-                <tr class="stats-strain">
-                  <td><input id="stats-dilatometer" type="text" readonly></td>
-                  <td><a href="#">Link</a></td>
-                </tr>
-              </table>
-            </form>
-          </div>
-          
         </div>
         <!-- End main content -->
       </div>
diff --git a/testing/MCTXWeb/public_html/data.html b/testing/MCTXWeb/public_html/data.html
index c4c2807..881f0ae 100644
--- a/testing/MCTXWeb/public_html/data.html
+++ b/testing/MCTXWeb/public_html/data.html
@@ -102,6 +102,7 @@
                 <li><a href="index.html"><span>Home</span></a></li>
                 <li><a href="control.html"><span>Experiment control</span></a></li>
                 <li><a href="graph.html"><span>Experiment graphs</span></a></li>
+                <li><a href="values.html"><span>Experiment data (live)</span></a></li>
                 <li><a href="data.html"><span>Experiment data</span></a></li>
                 <li><a href="pintest.html"><span>Pin debugging</span></a></li>
                 <li class="last"><a href="help.html"><span>Help</span></a></li>
diff --git a/testing/MCTXWeb/public_html/graph.html b/testing/MCTXWeb/public_html/graph.html
index 1b8361f..09e792a 100644
--- a/testing/MCTXWeb/public_html/graph.html
+++ b/testing/MCTXWeb/public_html/graph.html
@@ -74,6 +74,7 @@
                 <li><a href="index.html"><span>Home</span></a></li>
                 <li><a href="control.html"><span>Experiment control</span></a></li>
                 <li><a href="graph.html"><span>Experiment graphs</span></a></li>
+                <li><a href="values.html"><span>Experiment data (live)</span></a></li>
                 <li><a href="data.html"><span>Experiment data</span></a></li>
                 <li><a href="pintest.html"><span>Pin debugging</span></a></li>
                 <li class="last"><a href="help.html"><span>Help</span></a></li>
diff --git a/testing/MCTXWeb/public_html/help.html b/testing/MCTXWeb/public_html/help.html
index 5760c4e..4daf5a8 100644
--- a/testing/MCTXWeb/public_html/help.html
+++ b/testing/MCTXWeb/public_html/help.html
@@ -59,6 +59,7 @@
                 <li><a href="index.html"><span>Home</span></a></li>
                 <li><a href="control.html"><span>Experiment control</span></a></li>
                 <li><a href="graph.html"><span>Experiment graphs</span></a></li>
+                <li><a href="values.html"><span>Experiment data (live)</span></a></li>
                 <li><a href="data.html"><span>Experiment data</span></a></li>
                 <li><a href="pintest.html"><span>Pin debugging</span></a></li>
                 <li class="last"><a href="help.html"><span>Help</span></a></li>
diff --git a/testing/MCTXWeb/public_html/index.html b/testing/MCTXWeb/public_html/index.html
index b91db20..f265780 100644
--- a/testing/MCTXWeb/public_html/index.html
+++ b/testing/MCTXWeb/public_html/index.html
@@ -70,6 +70,7 @@
                 <li><a href="index.html"><span>Home</span></a></li>
                 <li><a href="control.html"><span>Experiment control</span></a></li>
                 <li><a href="graph.html"><span>Experiment graphs</span></a></li>
+                <li><a href="values.html"><span>Experiment data (live)</span></a></li>
                 <li><a href="data.html"><span>Experiment data</span></a></li>
                 <li><a href="pintest.html"><span>Pin debugging</span></a></li>
                 <li class="last"><a href="help.html"><span>Help</span></a></li>
diff --git a/testing/MCTXWeb/public_html/pintest.html b/testing/MCTXWeb/public_html/pintest.html
index 9372ee8..92abf93 100644
--- a/testing/MCTXWeb/public_html/pintest.html
+++ b/testing/MCTXWeb/public_html/pintest.html
@@ -105,6 +105,7 @@
                 <li><a href="index.html"><span>Home</span></a></li>
                 <li><a href="control.html"><span>Experiment control</span></a></li>
                 <li><a href="graph.html"><span>Experiment graphs</span></a></li>
+                <li><a href="values.html"><span>Experiment data (live)</span></a></li>
                 <li><a href="data.html"><span>Experiment data</span></a></li>
                 <li><a href="pintest.html"><span>Pin debugging</span></a></li>
                 <li class="last"><a href="help.html"><span>Help</span></a></li>
diff --git a/testing/MCTXWeb/public_html/static/mctx.graph.js b/testing/MCTXWeb/public_html/static/mctx.graph.js
index fd475ad..851fff2 100644
--- a/testing/MCTXWeb/public_html/static/mctx.graph.js
+++ b/testing/MCTXWeb/public_html/static/mctx.graph.js
@@ -66,14 +66,17 @@ $.fn.deployDevices = function(input_type, check_first, group) {
   var container = this;
   var apply = function(dict, prefix) {
     $.each(dict, function(key, val) {
+      //Unique id (name mangling)
+      var id = container.attr('id') + "_" + prefix + "_" + val.name;
+      
       var attributes = {
           'type' : input_type, 'value' : key, 'alt' : val.name,
           'class' : prefix, 'name' : group, 
-          'id' : prefix + '_' + val.name //Unique id (name mangling)
+          'id' : id
       };
       
       var entry = $("<input/>", attributes);
-      var label = $("<label/>", {'for' : prefix + '_' + val.name, 'text' : val.name}); 
+      var label = $("<label/>", {'for' : id, 'text' : val.name}); 
       entry.prop("checked", check_first);
       check_first = false;
       container.append(entry).append(label);
diff --git a/testing/MCTXWeb/public_html/values.html b/testing/MCTXWeb/public_html/values.html
new file mode 100644
index 0000000..995aa06
--- /dev/null
+++ b/testing/MCTXWeb/public_html/values.html
@@ -0,0 +1,173 @@
+<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01//EN" "http://www.w3.org/TR/html4/strict.dtd">
+<html>
+  <head>
+    <title>MCTX3420 Web Interface</title>
+    <meta http-equiv="Content-Type" content="text/html; charset=UTF-8">
+    <!--[if lte IE 8]>
+      <script language="javascript" type="text/javascript" src="static/excanvas.min.js"></script>
+    <![endif]-->
+    <script type="text/javascript" src="static/jquery-1.10.1.min.js"></script>
+    <script type="text/javascript" src="static/jquery.flot.min.js"></script>
+    <script type="text/javascript" src="static/mctx.gui.js"></script>
+    <script type="text/javascript" src="static/mctx.control.js"></script>
+    
+    <link rel="stylesheet" type="text/css" href="static/style.css">
+    <link rel="stylesheet" type="text/css" href="static/nav-menu.css">
+    <script type="text/javascript">
+      function initialiseTable(container, prefix, data) {
+        var hrow = $("<tr/>");
+        var vrow = $("<tr/>");
+        var c = 0;
+        
+        for (var key in data) {
+          var value = data[key];
+          var id = prefix + value.name;
+          var h = $("<td/>").append($("<label/>", {for : id, text : value.name}));
+          var e = $("<td/>").append($("<input/>", {id : id, type : "text", readonly : true, value : value.value[1]}));
+          hrow.append(h);
+          vrow.append(e);
+          
+          if (++c >= 2) {
+            container.append(hrow).append(vrow);
+            c = 0;
+            hrow = $("<tr/>");
+            vrow = $("<tr/>");
+          }
+        }
+        if (c > 0) {
+          container.append(hrow).append(vrow);
+        }
+      }
+      
+      function updateTable(prefix, data) {
+        for (var key in data) {
+          var value = data[key];
+          var id = prefix + value.name;
+          $("#" + id).val(value.value[1]);
+        }
+      }
+    
+      $.fn.setValueUpdater = function (data) {
+        initialiseTable($("#sensor-values table"), "sensors_", data.sensors);
+        initialiseTable($("#actuator-values table"), "actuators_", data.actuators);
+        
+        var updater = function () {
+          $.ajax({
+            url : mctx.api + 'identify',
+            data : {'sensors' : 1, 'actuators' : 1}
+          }).done(function (data) {
+            updateTable("sensors_", data.sensors);
+            updateTable("actuators_", data.actuators);
+            setTimeout(updater, 5000);
+          }).fail(function () {
+            $("#error-message").text("Connection failure").addClass("fail");
+          });
+        };
+        
+        setTimeout(updater, 5000);
+      };
+      
+      runBeforeLoad().done(function () {
+        $(document).ready(function () {
+          $.ajax({
+            url : mctx.api + 'identify',
+            data : {'sensors' : 1, 'actuators' : 1}
+          }).done(function (data) {
+            if (data.control_state !== "Running") {
+              $("#error-message").text("Experiment not running").addClass("fail");
+            } else {
+              $("#values-widget").setValueUpdater(data);
+            }
+          }).fail(function () {
+            $("#error-message").text("Connection failure").addClass("fail");
+          });
+       });       
+      }).fail(function () {
+        $(document).ready(function () {
+         $("#error-message").text("Connection failure").addClass("fail");
+       });  
+      });
+    </script>
+  </head>
+  
+  <body>
+    <div id="header-wrap">
+      <div id="header">
+        <div id="leftnav">
+          <a href="http://www.uwa.edu.au/" target="_blank">
+            <img alt = "The University of Western Australia"
+            src="static/uwacrest-text.png">
+          </a>
+          <span id="title">Exploding Cans</span>
+        </div>
+        <div id="rightnav">
+          <span id="welcome-container">
+          </span>
+          <span id="date">
+            <script type="text/javascript">getDate();</script>
+          </span>
+          <div id="logout-container">
+            <form action="#">
+              <div>
+                <input type="button" id="logout" value="Logout">
+              </div>
+            </form>
+          </div>
+        </div>
+        <div class="clear"></div>
+      </div>
+    </div>
+    <!-- End header -->
+    
+    <div id="content-wrap">
+      <noscript>
+        <div class="widget centre">
+          <div class="title">JavaScript required</div>
+          This website requires JavaScript to function correctly.
+          Please enable JavaScript to use this site.
+        </div>
+      </noscript>
+
+      <div id="content">
+        <div class="widget" id="sidebar-show">&gt;</div>
+        <div id="sidebar">
+          <div class="widget">
+            <div id="sidebar-hide">&lt;</div>
+            <div class="title">Navigation menu</div>
+            <div id="sidebar-menu" class="nav-menu">
+              <ul>
+                <li><a href="index.html"><span>Home</span></a></li>
+                <li><a href="control.html"><span>Experiment control</span></a></li>
+                <li><a href="graph.html"><span>Experiment graphs</span></a></li>
+                <li><a href="values.html"><span>Experiment data (live)</span></a></li>
+                <li><a href="data.html"><span>Experiment data</span></a></li>
+                <li><a href="pintest.html"><span>Pin debugging</span></a></li>
+                <li class="last"><a href="help.html"><span>Help</span></a></li>
+              </ul>
+            </div>
+          </div>
+        </div>
+        <!-- End sidebar -->
+
+        <div id="main">
+          <div id="values-widget" class="widget">
+            <p class="right" id="error-message">
+              &nbsp;
+            </p>
+            <div class="sub-title">Sensors</div>
+            <form id="sensor-values" action="#" class="nice clear">
+              <table>
+              </table>
+            </form>
+            <div class="sub-title">Actuators</div>
+            <form id="actuator-values" action="#" class="nice clear">
+              <table>
+              </table>
+            </form>
+          </div>
+        </div>
+        <!-- End main content -->
+      </div>
+    </div>
+  </body>
+</html>
-- 
2.20.1