testing/MCTXWeb/public_html/index.html

   1 <!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01//EN" "http://www.w3.org/TR/html4/strict.dtd">
   2 <html>
   3   <head>
   4     <title>MCTX3420 Web Interface</title>
   5     <meta http-equiv="Content-Type" content="text/html; charset=UTF-8">
   6     <!--[if lte IE 8]>
   7       <script language="javascript" type="text/javascript" src="static/excanvas.min.js"></script>
   8     <![endif]-->
   9     <script type="text/javascript" src="static/jquery-1.10.1.min.js"></script>
  10     <script type="text/javascript" src="static/jquery.flot.min.js"></script>
  11     <script type="text/javascript" src="static/mctx.gui.js"></script>
  12     <link rel="stylesheet" type="text/css" href="static/style.css">
  13     <link rel="stylesheet" type="text/css" href="static/nav-menu.css">
  14     <script type="text/javascript">
  15       $(document).ready(function () {
  16         $("#menu-container").populateNavbar();
  17       });
  18     </script>
  19   </head>
  20
  21   <body>
  22     <div id="header">
  23       <span id="title">Exploding Cans</span>
  24       <div id="rightnav">
  25         <div id="menu-container" class="nav-menu">
  26         </div>
  27         <span id="date">
  28           <script type="text/javascript">getDate();</script>
  29         </span>
  30       </div>
  31       <div class="clear"></div>
  32     </div>
  33
  34     <div id="content">
  35       <div id="sidebar">
  36         <div class="widget">
  37           <div class="title">
  38            Status
  39           </div>
  40           <div class="item">
  41             <table class="status centre">
  42               <tr><th>Module</th> <th>State</th></tr>
  43               <tr><td>Case interlock</td> <td>FAIL</td></tr>
  44               <tr><td>Pressure level</td> <td>PASS</td></tr>
  45             </table>
  46           </div>
  47         </div>
  48
  49         <div class="widget">
  50           <div class="title">
  51             Login
  52           </div>
  53           <div class="item">
  54             <form action="#">
  55               <table class="centre">
  56                 <tr><td>Username</td><td><input name="username" type="text"></td></tr>
  57                 <tr><td>Password</td><td><input name="pass" type="password"></td></tr>
  58                 <tr><td></td><td><input type="button" value="Submit"></td></tr>
  59               </table>
  60             </form>
  61           </div>
  62         </div>
  63
  64       </div>
  65
  66       <div id="main">
  67         <div class="widget">
  68           <div class="title">Dashboard</div>
  69
  70         </div>
  71
  72         <div class="widget">
  73           <div class="title">Sensors</div>
  74
  75         </div>
  76
  77         <div class="widget">
  78           <div class="title">Actuators</div>
  79           <form action="#">
  80             <table class="status">
  81               <tr><th>Module</th><th>Control</th><th>State</th></tr>
  82               <tr> <td>Solenoid 1</td>
  83                    <td><input type="button" value="Turn on"></td>
  84                    <td><div class="circle"></div></td>
  85               </tr>
  86             </table>
  87           </form>
  88         </div>
  89
  90         <div class="widget">
  91           <div class="title">Camera Dilatometer</div>
  92           <img src="#" alt="Camera 1" id="cam1" class="centre">
  93           <script type="text/javascript">
  94             //$("#cam1").setCamera();
  95           </script>
  96         </div>
  97       </div>
  98     </div>
  99   </body>
 100 </html>