-<!DOCTYPE html>
+<!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 src="static/jquery-1.10.1.min.js"></script>
- <script src="static/jquery.flot.min.js"></script>
- <script src="static/mctx.gui.js"></script>
+ <script type="text/javascript" src="static/jquery-1.10.1.min.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">
+ runBeforeLoad().done(function () {
+ $(document).ready(function () {
+ //Show the content!
+ $("#content").css("display", "block");
+ //Set the welcome bar
+ var name = " " + (mctx.friendlyName ? mctx.friendlyName : "");
+ $("#welcome-container").text("Welcome"+ name + "!");
+ $("#logout-container").css("display", "block");
+ $("#logout").click(function () {
+ $("#logout").logout();
+ });
+ });
+ })
+
+ </script>
</head>
+
<body>
<div id="header">
- <span id="title">Exploding Cans</span>
+ <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">
- <a href="#">Link 1</a>
- <a href="#">Link 2</a>
- <a href="#">Link 3</a>
- </div>
+ <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>
-
+ <!-- End header -->
+
+ <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 id="sidebar">
<div class="widget">
- <div class="announce">
- Status
+ <div class="title">Navigation menu</div>
+ <div 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="pintest.html"><span>Pin debugging</span></a></li>
+ <li class="last"><a href="#"><span>Help</span></a></li>
+ </ul>
</div>
- <div class="item">
- <table>
- <tr><th>Module</th> <th>State</th></tr>
- <tr><td>Case interlock</td> <td>FAIL</td></tr>
- <tr><td>Pressure level</td> <td>PASS</td></tr>
- </table>
- </div>
</div>
-
<div class="widget">
- <div class="announce">
- Meta2
- </div>
- <div class="item">
- Some more text
- </div>
+ <div class="title">Help</div>
+
</div>
-
</div>
+ <!-- End sidebar -->
<div id="main">
<div class="widget">
- <div class="announce">Dashboard</div>
-
+ <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="announce">Sensors</div>
+ <div class="title">System diagram</div>
+ <img id="sbd" src="static/sbd.png" class="centre" alt="System diagram" usemap="#sbd-map">
+ <map name="sbd-map">
+ <area shape="rect" coords="78,44,178,94" href="#" alt="Client PC" title="You">
+ <area shape="rect" coords="238,44,338,94" href="#" alt="BBB">
+ <area shape="rect" coords="398,44,498,94" href="#" alt="Electronics">
+ <area shape="rect" coords="238,104,338,154" href="#" alt="Pneumatics">
+ <area shape="rect" coords="128,184,228,234" href="#" alt="Sensors">
+ <area shape="rect" coords="348,184,448,234" href="#" alt="Camera">
+ <area shape="rect" coords="128,238,228,288" href="#" alt="Strain Can">
+ <area shape="rect" coords="348,238,448,288" href="#" alt="Explode Can" title="Won't happen">
+ <area shape="rect" coords="13,206,113,231" href="#" alt="Enclosure" id="enclosure-btn">
+ <area shape="rect" coords="13,240,113,265" href="#" alt="Mounting" id="mounting-btn">
+ <area shape="rect" coords="116,175,457,294" alt="Mounting Area" id="mounting-area">
+ <area shape="poly" coords="230,30,524,30,524,294,115,294,115,100,230,100,230,30" alt="Enclosure Area" id="enclosure-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);
+ $("#enclosure-area").hilightToggle(false);
+
+ $("#mounting-btn").mouseover(function () {
+ $("#mounting-area").hilightToggle(true).mouseover();
+ }).mouseout(function () {
+ $("#mounting-area").hilightToggle(false);
+ });
+
+ $("#enclosure-btn").mouseover(function () {
+ $("#enclosure-area").hilightToggle(true).mouseover();
+ }).mouseout(function () {
+ $("#enclosure-area").hilightToggle(false);
+ });
- </div>
-
- <div class="widget">
- <div class="announce">Actuators</div>
- Lorem ipsum dolor sit amet, consectetur adipisicing elit, sed do eiusmod tempor incididunt ut labore et dolore magna aliqua. Ut enim ad minim veniam, quis nostrud exercitation ullamco laboris nisi ut aliquip ex ea commodo consequat. Duis aute irure dolor in reprehenderit in voluptate velit esse cillum dolore eu fugiat nulla pariatur. Excepteur sint occaecat cupidatat non proident, sunt in culpa qui officia deserunt mollit anim id est laborum.
+ </script>
</div>
</div>
+ <!-- End main content -->
</div>
</body>
</html>
git.ucc.asn.au / matches / MCTX3420.git / blobdiff
UCC git Repository :: git.ucc.asn.au