testing/MCTXWeb/public_html/control.html

   1 <!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01//EN" "http://www.w3.org/TR/html4/strict.dtd">\r
   2 <html>\r
   3   <head>\r
   4     <title>MCTX3420 Web Interface</title>\r
   5     <meta http-equiv="Content-Type" content="text/html; charset=UTF-8">\r
   6     <!--[if lte IE 8]>\r
   7       <script language="javascript" type="text/javascript" src="static/excanvas.min.js"></script>\r
   8     <![endif]-->\r
   9     <script type="text/javascript" src="static/jquery-1.10.1.min.js"></script>\r
  10     <script type="text/javascript" src="static/jquery.flot.min.js"></script>\r
  11     <script type="text/javascript" src="static/mctx.gui.js"></script>\r
  12     <script type="text/javascript" src="static/mctx.control.js"></script>\r
  13     \r
  14     <link rel="stylesheet" type="text/css" href="static/style.css">\r
  15     <link rel="stylesheet" type="text/css" href="static/nav-menu.css">\r
  16     <script type="text/javascript">\r
  17       runBeforeLoad().done(function () {\r
  18         $(document).ready(function () {\r
  19           $("form").submit(function () { //Prevent form submit globally\r
  20             return false;\r
  21           });\r
  22           \r
  23           //Set the status updated\r
  24           $("#state-exp").setStatusUpdater();\r
  25           \r
  26           //Set the logic for the start controls\r
  27           $("#start-controls input[type='button']").click(function () {\r
  28             var start = $("#start-controls input[type='button']");\r
  29             var force = $("#start-controls input[name='start_force']");\r
  30             \r
  31             $(this).startExperiment(start, $("#experiment_name").val(), \r
  32                       force.is(":checked"), $("#start-result"));\r
  33             force.prop("checked", false);\r
  34           });\r
  35           \r
  36           //Set the logic for the stop button\r
  37           $("#experiment-stop").click(function () {\r
  38             $(this).stopExperiment($("#stop-status"));\r
  39           });\r
  40           \r
  41           //Set the logic for the pressure controls\r
  42           $("#pressure-controls").submit(function () {\r
  43             var pressure = {\r
  44               set : $("#pressure-set").val(),\r
  45               step : $("#pressure-stepsize").val(),\r
  46               wait : $("#pressure-stepwait").val(),\r
  47               count : $("#pressure-stepcount").val()\r
  48             };   \r
  49             $(this).setPressure(pressure, $("#pressure-result"));\r
  50           });\r
  51           \r
  52           $("#samplerate-controls").submit(function () {\r
  53             setSampleRate($("#sensor-select option:selected").val(), \r
  54                           $("#sensor-set").val(), $("#samplerate-result"));\r
  55           });\r
  56        });       \r
  57       }).fail(function () {\r
  58         $(document).ready(function () {\r
  59          $("#state-exp").text("Connection failure").parent().addClass("fail");\r
  60        });  \r
  61       });\r
  62     </script>\r
  63   </head>\r
  64   \r
  65   <body>\r
  66     <div id="header-wrap">\r
  67       <div id="header">\r
  68         <div id="leftnav">\r
  69           <a href="http://www.uwa.edu.au/" target="_blank">\r
  70             <img alt = "The University of Western Australia"\r
  71             src="static/uwacrest-text.png">\r
  72           </a>\r
  73           <span id="title">Exploding Cans</span>\r
  74         </div>\r
  75         <div id="rightnav">\r
  76           <span id="welcome-container">\r
  77           </span>\r
  78           <span id="date">\r
  79             <script type="text/javascript">getDate();</script>\r
  80           </span>\r
  81           <div id="logout-container">\r
  82             <form action="#">\r
  83               <div>\r
  84                 <input type="button" id="logout" value="Logout">\r
  85               </div>\r
  86             </form>\r
  87           </div>\r
  88         </div>\r
  89         <div class="clear"></div>\r
  90       </div>\r
  91     </div>\r
  92     <!-- End header -->\r
  93     \r
  94     <div id="content-wrap">\r
  95       <noscript>\r
  96         <div class="widget centre">\r
  97           <div class="title">JavaScript required</div>\r
  98           This website requires JavaScript to function correctly.\r
  99           Please enable JavaScript to use this site.\r
 100         </div>\r
 101       </noscript>\r
 102 \r
 103       <div id="content">\r
 104         <div class="widget" id="sidebar-show">&gt;</div>\r
 105         <div id="sidebar">\r
 106           <div class="widget">\r
 107             <div id="sidebar-hide">&lt;</div>\r
 108             <div class="title">Navigation menu</div>\r
 109             <div id="sidebar-menu" class="nav-menu">\r
 110               <ul>\r
 111                 <li><a href="index.html"><span>Home</span></a></li>\r
 112                 <li><a href="control.html"><span>Experiment control</span></a></li>\r
 113                 <li><a href="graph.html"><span>Experiment graphs</span></a></li>\r
 114                 <li><a href="data.html"><span>Experiment data</span></a></li>\r
 115                 <li><a href="pintest.html"><span>Pin debugging</span></a></li>\r
 116                 <li class="last"><a href="help.html"><span>Help</span></a></li>\r
 117               </ul>\r
 118             </div>\r
 119           </div>\r
 120         </div>\r
 121         <!-- End sidebar -->\r
 122 \r
 123         <div id="main">\r
 124           <div class="widget">\r
 125             <div class="title">Experiment Overview</div>\r
 126             <table class="horizontal medium">\r
 127               <tr id="state-exp-r">\r
 128                 <th>Experiment state</th>\r
 129                 <td id="state-exp"></td>\r
 130                 <td style="text-align: right;">\r
 131                   <input id="experiment-stop" type="button" value="Stop">\r
 132                 </td>\r
 133               </tr>\r
 134             </table>\r
 135             <div id="stop-status">\r
 136               &nbsp;\r
 137             </div>\r
 138             \r
 139             <div class="sub-title">Error and warning messages</div>\r
 140             <textarea id="errorlog" wrap="off" rows="4" cols="30" readonly>\r
 141             </textarea>\r
 142           </div>\r
 143           \r
 144           <div id="start-widget" class="widget">\r
 145             <div class="title centre">Start an experiment</div>\r
 146             <form id="start-controls" class="nice" action="#">\r
 147               <p>\r
 148                 <label for="experiment_name">Experiment name</label>\r
 149                 <input id="experiment_name" type="text">\r
 150                 \r
 151                 <label for="start_force">Overwrite existing</label>\r
 152                 <input type="checkbox" name="start_force" id="start_force">\r
 153               </p>\r
 154               <p id="start-result">\r
 155                 &nbsp;\r
 156               </p>\r
 157               <p class="centre">\r
 158                 <input type="button" name="start_strain" value="Strain test">\r
 159                 <input type="button" name="start_explode" value="Explode test">                \r
 160               </p>\r
 161             </form>\r
 162           </div>\r
 163           \r
 164           <div id="pressure-widget" class="widget">            \r
 165             <form id="pressure-controls" action="#" class="nice clear">\r
 166               <table>\r
 167                 <tr>\r
 168                   <td><label for="pressure-set">Starting pressure (kPa)</label></td>\r
 169                   <td><label for="pressure-stepsize">Pressure step size (kPa)</label></td>\r
 170                 </tr>\r
 171                 <tr>\r
 172                   <td><input id="pressure-set" type="text"></td>\r
 173                   <td><input id="pressure-stepsize" type="text"></td>\r
 174                 </tr>\r
 175                 <tr>\r
 176                   <td><label for="pressure-stepcount">Number of steps to make</label></td>\r
 177                   <td><label for="pressure-stepwait">Wait time between steps (s)</label></td>\r
 178                 </tr>\r
 179                 <tr>\r
 180                   <td><input id="pressure-stepcount" type="text"></td>\r
 181                   <td><input id="pressure-stepwait" type="text"></td>\r
 182                 </tr>\r
 183               </table>\r
 184               <p class="left" id="pressure-result">\r
 185                 &nbsp;\r
 186               </p>\r
 187               <p class="right">\r
 188                 <input type="submit" value="Set pressure">\r
 189               </p>\r
 190             </form>\r
 191             \r
 192             <form id="samplerate-controls" action="#" class="nice clear">\r
 193               <table>\r
 194                 <tr>\r
 195                   <td><label for="sensor-select">Select a sensor</label></td>\r
 196                   <td><label for="sensor-set">Set sampling rate (s)</label></td>\r
 197                 </tr>\r
 198                 <tr>\r
 199                   <td><select id="sensor-select" style="width:100%;"></select></td>\r
 200                   <td><input id="sensor-set" type="text"></td>\r
 201                 </tr>\r
 202               </table>\r
 203               <p class="left" id="samplerate-result">\r
 204                 &nbsp;\r
 205               </p>\r
 206               <p class="right">\r
 207                 <input type="submit" value="Set sampling rate">\r
 208               </p>\r
 209             </form>\r
 210           </div>\r
 211           \r
 212           <div id="stats-widget" class="widget">\r
 213             <form id="stats" action="#" class="nice clear">\r
 214               <table>\r
 215                 <tr>\r
 216                   <td><label for="stats-mainspressure">Mains pressure (kPa)</label></td>\r
 217                   <td><label for="stats-canpressure">Can pressure (kPa)</label></td>\r
 218                 </tr>\r
 219                 <tr>\r
 220                   <td><input id="stats-mainspressure" type="text" readonly></td>\r
 221                   <td><input id="stats-canpressure" type="text" readonly></td>\r
 222                 </tr>\r
 223                 <tr class="stats-strain">\r
 224                   <td><label for="stats-strain1">Central hoop strain</label></td>\r
 225                   <td><label for="stats-strain2">Central longitudinal strain</label></td>\r
 226                 </tr>\r
 227                 <tr class="stats-strain">\r
 228                   <td><input id="stats-strain1" type="text" readonly></td>\r
 229                   <td><input id="stats-strain2" type="text" readonly></td>\r
 230                 </tr>\r
 231                 <tr class="stats-strain">\r
 232                   <td><label for="stats-strain3">End hoop strain</label></td>\r
 233                   <td><label for="stats-strain4">End longitudinal strain</label></td>\r
 234                 </tr>\r
 235                 <tr class="stats-strain">\r
 236                   <td><input id="stats-strain3" type="text" readonly></td>\r
 237                   <td><input id="stats-strain4" type="text" readonly></td>\r
 238                 </tr>\r
 239                 <tr class="stats-strain">\r
 240                   <td><label for="stats-dilatometer">Dilatometer reading</label></td>\r
 241                   <td><label for="stats-dilatometer">Camera feed</label></td>\r
 242                 </tr>\r
 243                 <tr class="stats-strain">\r
 244                   <td><input id="stats-dilatometer" type="text" readonly></td>\r
 245                   <td><a href="#">Link</a></td>\r
 246                 </tr>\r
 247               </table>\r
 248             </form>\r
 249           </div>\r
 250           \r
 251         </div>\r
 252         <!-- End main content -->\r
 253       </div>\r
 254     </div>\r
 255   </body>\r
 256 </html>\r