Merge remote-tracking branch 'upstream/master' into dilatometer
[matches/MCTX3420.git] / testing / MCTXWeb / public_html / index.html
index 5b0ddff..9513ce8 100644 (file)
   <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/base64.js"></script>
     <script type="text/javascript" src="static/mctx.gui.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">
-      $(document).ready(function () {
-        //$("#menu-container").populateNavbar();
-        $("#login").submit(function () {
-          $("#login").login();
-          return false;
+      runBeforeLoad().done(function () {
+        $(document).ready(function () {
+       });       
+      }).always(function () {
+        $(document).ready(function () {
+          //$("#sidebar-menu").populateNavMenu();
         });
-        
-        $("#logout").click(function () {
-          $("#logout").logout();
-        });
-        
-        $("#main_controls").submit(function () {
-          //Validate!
-          return false;
-        });
-        
-        $("#errorlog").setErrorLog();
       });
+
     </script>
   </head>
   
   <body>
-    <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">
-        <div id="menu-container" class="nav-menu">
+    <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>
-        <span id="welcome-container">
-          Welcome, Joe Bloggs!
-        </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 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="change-password" value="Change password">
+                <input type="button" id="logout" value="Logout">
+              </div>
+            </form>
+          </div>
         </div>
+        <div class="clear"></div>
       </div>
-      <div class="clear"></div>
     </div>
     <!-- End header -->
     
-    <div id="content">
-      <div id="sidebar">
-        <div class="widget">
-          <div class="title">Status</div>
-          <div class="item">
-            <table class="status centre">
-              <tr><th>Module</th> <th>State</th></tr>
-              <tr><td>Server API</td> <td>PASS</td></tr>
-              <tr><td>Enclosure interlock</td> <td>FAIL</td></tr>
-              <tr><td>Pressure level</td> <td>PASS</td></tr>
-            </table>
-            <hr>
-            Software mode: <span id="server_mode">off</span>
-          </div>         
+    <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>
-        
-        <div class="widget">
-          <div class="title">Pressure controls</div>
-          <form action="#">
-            Pressure level <input type="text" name="pressurelevel"><br>
-            <input type="submit" value="Submit">
-          </form>
-        </div>
-      </div>
-      <!-- End sidebar -->
+      </noscript>
 
-      <div id="main">
-        <div class="widget">
-          <div class="title">Dashboard</div>
-          <!--<img class="centre" src="overview.png" alt="Overview">-->
-          <b>Main controls</b>
-          <form id="main_controls" action="">
-            <table>
-              <tr>
-                <td>Experiment name</td>
-                <td><input name="experiment_name" type="text"></td>
-              </tr>
-              <tr>
-                <td>Experiment mode</td>
-                <td>
-                  <input name="experiment_type" value="strain" type="radio"> Strain it
-                  <input name="experiment_type" value="explode" type="radio"> Explode it
-                </td>
-              </tr>
-              <tr>
-                <td>
-                </td>
-                <td align="right">
-                  <input type="submit" value="Start">
-                  <input type="submit" value="Pause">
-                  <input type="submit" value="Stop">
-                </td>
-              </tr>
-            </table>
-          </form>
-          <b>Error and warning messages</b><br>
-          <textarea id="errorlog" wrap="off" rows="4" cols="30" readonly></textarea>
-        </div>
-        
-        <div class="widget">
-          <div class="title">Strain gauges</div>
-          <div id="strain-graphs" class="graph">
-            <!-- Strain graph placeholder -->
+      <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>
-        
-        <div class="widget">
-          <div class="title">Camera Feed</div>
-          <img src="" alt="Camera 1" id="cam1" class="centre">
+        <!-- End sidebar -->
+
+        <div id="main">
+          <div class="widget">
+            <div class="title centre">Welcome</div>
+              <p>
+                Welcome to the MCTX3420 remote pressure vessel experiment site!
+              </p>
+              <p>
+                To explore how this system works, hover over the elements of the
+                system diagram below. Clicking each element will lead to a new
+                page that briefly describes that component of the system.
+              </p>
+              <p>
+                For the full documentation, see the project wiki at:
+                <a href="https://github.com/szmoore/MCTX3420/wiki">
+                  https://github.com/szmoore/MCTX3420/wiki
+                </a>
+              </p>
+              <p>
+                To begin a new experiment, use the left navigation pane.
+              </p>
+          </div>
+          <div class="widget">
+            <div class="title">System diagram</div>
+            <img id="sbd" src="static/sbd4.png" class="centre" alt="System diagram" usemap="#sbd-map">
+            <map name="sbd-map">
+              <area shape="rect" coords="8,72,105,118" href="https://github.com/szmoore/MCTX3420/wiki/System-Overview#control" target="_blank" alt="Client PC" title="You">
+              <area shape="rect" coords="176,72,275,118" href="https://github.com/szmoore/MCTX3420/wiki/Hardware:-BeagleBone" target="_blank" alt="BBB">
+              <area shape="rect" coords="298,53,395,145" href="https://github.com/szmoore/MCTX3420/wiki/System-Overview#electronics" target="_blank" alt="Electronics">
+              <area shape="rect" coords="446,53,543,145" href="https://github.com/szmoore/MCTX3420/wiki/System-Overview#pneumatics" target="_blank" alt="Pneumatics">
+              <area shape="rect" coords="218,191,315,237" href="https://github.com/szmoore/MCTX3420/wiki/System-Overview#sensors" target="_blank" alt="Sensors">
+              <area shape="rect" coords="418,191,515,237" href="https://github.com/szmoore/MCTX3420/wiki/Hardware:-Sensors#camera" target="_blank" alt="Camera">
+              <area shape="rect" coords="218,237,315,285" href="#" alt="Strain Can">
+              <area shape="rect" coords="418,237,515,285" href="#" alt="Explode Can" title="Won't happen">
+              <area shape="rect" coords="87,191,183,237" href="https://github.com/szmoore/MCTX3420/wiki/System-Overview#case" target="_blank" alt="Case" id="case-btn">
+              <area shape="rect" coords="87,257,183,303" href="https://github.com/szmoore/MCTX3420/wiki/Hardware:-Mounting" target="_blank" alt="Mounting" id="mounting-btn">
+              <area shape="rect" coords="210,182,540,317" alt="Mounting Area" id="mounting-area">
+              <area shape="poly" coords="172,27,548,27,548,317,212,317,212,156,172,156" alt="case Area" id="case-area">
+            </map>
+            <script type="text/javascript" src="static/jquery.maphilight.min.js">
+
+            </script>
+            <script type="text/javascript">
+              $("#sbd").maphilight({
+                fillOpacity: 0.4,
+                strokeColor: '000000',
+                strokeOpacity: 0.7
+              });
+
+              $.fn.hilightToggle = function (on) {
+                var data = $(this).data("maphilight") || {};
+                data.neverOn = !on;
+                $(this).data("maphilight", data);
+                return this;
+              };
+
+              $("#mounting-area").hilightToggle(false);
+              $("#case-area").hilightToggle(false);
+
+              $("#mounting-btn").mouseover(function () {
+                $("#mounting-area").hilightToggle(true).mouseover();
+              }).mouseout(function () {
+                $("#mounting-area").hilightToggle(false);
+              });
+
+              $("#case-btn").mouseover(function () {
+                $("#case-area").hilightToggle(true).mouseover();
+              }).mouseout(function () {
+                $("#case-area").hilightToggle(false);
+              });
+
+            </script>
+            
+            <div class="clear"></div>
+          </div>
         </div>
-      </div>
+    </div>
       <!-- End main content -->
-      
     </div>
   </body>
 </html>

UCC git Repository :: git.ucc.asn.au