--- a/image/w/webui.html Thu May 02 21:19:50 2019 +0200
+++ b/image/w/webui.html Sat May 04 11:41:16 2019 +0200
@@ -4,71 +4,130 @@
<title>Web User Interface</title>
<meta charset="utf-8" />
<meta http-equiv="X-UA-Compatible" content="IE=edge" />
- <meta name="viewport" content="width=device-width, initial-scale=1.0, maximum-scale=1.0, user-scalable=no" />
+ <meta name="viewport" content="width=device-width, initial-scale=1.0" />
<script src="js/jquery-1.12.4.min.js"></script>
<link rel="stylesheet" href="css/style.css">
</head>
<body>
- <div id="webui_table">
+ <div id="webui_win">
+ <div id="topline"><span id="top_msg">top_msg</span></th>
+ </div>
+
+ <div id="mltline">
+ <table style='width: 100%; padding: 0px;'>
+ <col width="20%"><col width="60%"><col width="20%">
+ <tr>
+ <td>
+ <button style="float: left; margin-left: 5px;" type="button" class="appbutton" id="mlt00">Hand</button>
+ </td>
+ <td rowspan="2">
+ <table id="mlt_table">
+ <tr>
+ <td style="width: 10%; text-align: center;"><div id="pump_led" class="LEDred"></div></td>
+ <td colspan="2" style='font-size: 10px; text-align: center;'>MLT</td>
+ <td style="width: 10%; text-align: center;"><div id="mlt_led" class="LEDgreen"></div></td>
+ </tr>
+ <tr>
+ <td colspan="4" style='border: 1px solid; font-size: 40px; text-align: right;'><span id="mlt_pv">---</span></td>
+ </tr>
+ <tr>
+ <td colspan="2" style='width: 50%; font-size: 10px;'><span id="mlt_sp">44.00</span></td>
+ <td colspan="2" style='width: 50%; font-size: 10px;'><span id="mlt_power">100%</span></td>
+ </tr>
+ </table>
+ </td>
+ <td>
+ <button style="float: left; margin-left: 5px;" type="button" class="appbutton" id="mlt20">Auto</button>
+ </td>
+ </tr>
+ <tr>
+ <td>
+ <button style="float: left; margin-left: 5px;" type="button" class="appbutton" id="mlt01">+sp</button>
+ </td>
+ <td>
+ <button style="float: left; margin-left: 5px;" type="button" class="appbutton" id="mlt21">-sp</button>
+ </td>
+ </tr>
+ </table>
+ </div>
+
+ <div id="midline">
+ <table style='width: 100%; padding: 0px;'>
+ <col width="20%"><col width="60%"><col width="20%">
+ <tr>
+ <td>
+ <button style="float: left; margin-left: 5px;" type="button" class="appbutton" id="mid00">+1m</button>
+ </td>
+ <td>
+ <td><div id="timer">01:23:45</div></td>
+ </td>
+ <td>
+ <button style="float: left; margin-left: 5px;" type="button" class="appbutton" id="mid20">-1m</button>
+ </td>
+ </tr>
+ </table>
+ </div>
+
+ <div id="hltline">
+ <table style='width: 100%; padding: 0px;'>
+ <col width="20%"><col width="60%"><col width="20%">
+ <tr>
+ <td>
+ <button style="float: left; margin-left: 5px;" type="button" class="appbutton" id="hlt00">+sp</button>
+ </td>
+ <td rowspan="2">
+ <table id="hlt_table">
+ <tr>
+ <td style="width: 10%; text-align: center;"> </td>
+ <td colspan="2" style='font-size: 10px; text-align: center;'>HLT</td>
+ <td style="width: 10%; text-align: center;"><div id="hlt_led" class="LEDgreen"></div></td>
+ </tr>
+ <tr>
+ <td colspan="4" style='border: 1px solid; font-size: 40px; text-align: right;'><span id="hlt_pv">---</span></td>
+ </tr>
+ <tr>
+ <td colspan="2" style='font-size: 10px;'><span id="hlt_sp">44.00</span></td>
+ <td colspan="2" style='font-size: 10px;'><span id="hlt_power">100%</span></td>
+ </tr>
+ </table>
+ </td>
+ <td>
+ <button style="float: left; margin-left: 5px;" type="button" class="appbutton" id="hlt20">-sp</button>
+ </td>
+ </tr>
+ <tr>
+ <td>
+ <button style="float: left; margin-left: 5px;" type="button" class="appbutton" id="hlt01">Info</button>
+ </td>
+ <td>
+ <button style="float: left; margin-left: 5px;" type="button" class="appbutton" id="hlt21">Tools</button>
+ </td>
+ </tr>
+ </table>
+ </div>
+
<table style='width: 100%; padding: 0px;'>
- <tr style="color: yellow; background-color: blue; height: 26px;">
- <th colspan="3"><span id="top_msg">top_msg</span></th>
- </tr>
- <tr>
- <td style="width: 20%;">
- <button style="float: left; margin-left: 5px;" type="button" class="appbutton">Hand</button>
- <button style="float: left; margin-left: 5px; margin-top: 12px;" type="button" class="appbutton">+sp</button>
- </td>
- <td style="width: 60%;">
- <table id="mlt_table">
- <tr>
- <td style="width: 10%; text-align: center;">
- <div id="pump_led" class="LEDred"></div>
- </td>
- <td colspan="2" style='font-size: 10px; text-align: center;'>MLT</td>
- <td style="width: 10%; text-align: center;">
- <div id="mlt_led" class="LEDgreen"></div>
- </td>
- </tr>
- <tr><td colspan="4" style='border: 1px solid; font-size: 40px; text-align: right;'><span id="mlt_pv">---</span></td></tr>
- <tr><td colspan="2" style='width: 50%; font-size: 10px;'><span id="mlt_sp">44.00</span></td>
- <td colspan="2" style='width: 50%; font-size: 10px;'><span id="mlt_power">100%</span></td></tr>
- </table>
- </td>
- <td style="width: 20%;">
- <button style="float: left; margin-left: 5px;" type="button" class="appbutton">Auto</button>
- <button style="float: left; margin-left: 5px; margin-top: 12px;" type="button" class="appbutton">-sp</button>
+ <col width="20%"><col width="20%"><col width="20%"><col width="20%"><col width="20%">
+
+ <tr id="row_info">
+ <td colspan="5">
+ <div style="color: yellow; text-align: center;">
+ <p />
+ Written by Michiel Broek © 2018
+ </div>
+ <div style="color: orange; text-align: center;">
+ <p />
+ Parts are written by Chris Morgan, Brett Beauregard, Blake Felt, LoBo and David Antliff.
+ </div>
+ <div>
+ <button style="margin-left: 150px; margin-top: 50px;" type="button" class="okbutton" id="ok_info">Ok</button>
+ </div>
</td>
</tr>
- <tr>
- <td><button style="float: left; margin-left: 5px;" type="button" class="appbutton">+1m</button></td>
- <td><div id="timer">01:23:45</div></td>
- <td><button style="float: left; margin-left: 5px;" type="button" class="appbutton">-1m</button></td>
- </tr>
- <tr>
- <td><button style="float: left; margin-left: 5px;" type="button" class="appbutton">+sp</button>
- <button style="float: left; margin-left: 5px; margin-top: 12px;" type="button" class="appbutton">Info</button></td>
- <td>
- <table id="hlt_table">
- <tr>
- <td style="width: 10%; text-align: center;">
- </td>
- <td colspan="2" style='font-size: 10px; text-align: center;'>HLT</td>
- <td style="width: 10%; text-align: center;">
- <div id="hlt_led" class="LEDgreen"></div>
- </td>
- </tr>
- <tr><td colspan="4" style='border: 1px solid; font-size: 40px; text-align: right;'><span id="hlt_pv">---</span></td></tr>
- <tr><td colspan="2" style='font-size: 10px;'><span id="hlt_sp">44.00</span></td>
- <td colspan="2" style='font-size: 10px;'><span id="hlt_power">100%</span></td></tr>
- </table>
- </td>
- <td><button style="float: left; margin-left: 5px;" type="button" class="appbutton">-sp</button>
- <button style="float: left; margin-left: 5px; margin-top: 12px;" type="button" class="appbutton">Tools</button></td>
- </tr>
+
</table>
- </div>
+ </div> <!-- webui_win -->
<br>
<form action="index.html"><input type="submit" class="button" value="Hoofdmenu"></form>