comparison: image/w/webui.html
image/w/webui.html
- branch
- novnc
- changeset 40
- 71e06f6d80fd
- parent 11
- f816cf5b6bcb
- child 41
- 7639cfa6aec0
equal
deleted
inserted
replaced
| 39:e5900c9b9a7b | 40:71e06f6d80fd |
|---|---|
| 2 <html lang="en"> | 2 <html lang="en"> |
| 3 <head> | 3 <head> |
| 4 <title>Web User Interface</title> | 4 <title>Web User Interface</title> |
| 5 <meta charset="utf-8" /> | 5 <meta charset="utf-8" /> |
| 6 <meta http-equiv="X-UA-Compatible" content="IE=edge" /> | 6 <meta http-equiv="X-UA-Compatible" content="IE=edge" /> |
| 7 <meta name="viewport" content="width=device-width, initial-scale=1.0, maximum-scale=1.0, user-scalable=no" /> | 7 <meta name="viewport" content="width=device-width, initial-scale=1.0" /> |
| 8 <script src="js/jquery-1.12.4.min.js"></script> | 8 <script src="js/jquery-1.12.4.min.js"></script> |
| 9 <link rel="stylesheet" href="css/style.css"> | 9 <link rel="stylesheet" href="css/style.css"> |
| 10 </head> | 10 </head> |
| 11 <body> | 11 <body> |
| 12 | 12 |
| 13 <div id="webui_table"> | 13 <div id="webui_win"> |
| 14 <div id="topline"><span id="top_msg">top_msg</span></th> | |
| 15 </div> | |
| 16 | |
| 17 <div id="mltline"> | |
| 18 <table style='width: 100%; padding: 0px;'> | |
| 19 <col width="20%"><col width="60%"><col width="20%"> | |
| 20 <tr> | |
| 21 <td> | |
| 22 <button style="float: left; margin-left: 5px;" type="button" class="appbutton" id="mlt00">Hand</button> | |
| 23 </td> | |
| 24 <td rowspan="2"> | |
| 25 <table id="mlt_table"> | |
| 26 <tr> | |
| 27 <td style="width: 10%; text-align: center;"><div id="pump_led" class="LEDred"></div></td> | |
| 28 <td colspan="2" style='font-size: 10px; text-align: center;'>MLT</td> | |
| 29 <td style="width: 10%; text-align: center;"><div id="mlt_led" class="LEDgreen"></div></td> | |
| 30 </tr> | |
| 31 <tr> | |
| 32 <td colspan="4" style='border: 1px solid; font-size: 40px; text-align: right;'><span id="mlt_pv">---</span></td> | |
| 33 </tr> | |
| 34 <tr> | |
| 35 <td colspan="2" style='width: 50%; font-size: 10px;'><span id="mlt_sp">44.00</span></td> | |
| 36 <td colspan="2" style='width: 50%; font-size: 10px;'><span id="mlt_power">100%</span></td> | |
| 37 </tr> | |
| 38 </table> | |
| 39 </td> | |
| 40 <td> | |
| 41 <button style="float: left; margin-left: 5px;" type="button" class="appbutton" id="mlt20">Auto</button> | |
| 42 </td> | |
| 43 </tr> | |
| 44 <tr> | |
| 45 <td> | |
| 46 <button style="float: left; margin-left: 5px;" type="button" class="appbutton" id="mlt01">+sp</button> | |
| 47 </td> | |
| 48 <td> | |
| 49 <button style="float: left; margin-left: 5px;" type="button" class="appbutton" id="mlt21">-sp</button> | |
| 50 </td> | |
| 51 </tr> | |
| 52 </table> | |
| 53 </div> | |
| 54 | |
| 55 <div id="midline"> | |
| 56 <table style='width: 100%; padding: 0px;'> | |
| 57 <col width="20%"><col width="60%"><col width="20%"> | |
| 58 <tr> | |
| 59 <td> | |
| 60 <button style="float: left; margin-left: 5px;" type="button" class="appbutton" id="mid00">+1m</button> | |
| 61 </td> | |
| 62 <td> | |
| 63 <td><div id="timer">01:23:45</div></td> | |
| 64 </td> | |
| 65 <td> | |
| 66 <button style="float: left; margin-left: 5px;" type="button" class="appbutton" id="mid20">-1m</button> | |
| 67 </td> | |
| 68 </tr> | |
| 69 </table> | |
| 70 </div> | |
| 71 | |
| 72 <div id="hltline"> | |
| 73 <table style='width: 100%; padding: 0px;'> | |
| 74 <col width="20%"><col width="60%"><col width="20%"> | |
| 75 <tr> | |
| 76 <td> | |
| 77 <button style="float: left; margin-left: 5px;" type="button" class="appbutton" id="hlt00">+sp</button> | |
| 78 </td> | |
| 79 <td rowspan="2"> | |
| 80 <table id="hlt_table"> | |
| 81 <tr> | |
| 82 <td style="width: 10%; text-align: center;"> </td> | |
| 83 <td colspan="2" style='font-size: 10px; text-align: center;'>HLT</td> | |
| 84 <td style="width: 10%; text-align: center;"><div id="hlt_led" class="LEDgreen"></div></td> | |
| 85 </tr> | |
| 86 <tr> | |
| 87 <td colspan="4" style='border: 1px solid; font-size: 40px; text-align: right;'><span id="hlt_pv">---</span></td> | |
| 88 </tr> | |
| 89 <tr> | |
| 90 <td colspan="2" style='font-size: 10px;'><span id="hlt_sp">44.00</span></td> | |
| 91 <td colspan="2" style='font-size: 10px;'><span id="hlt_power">100%</span></td> | |
| 92 </tr> | |
| 93 </table> | |
| 94 </td> | |
| 95 <td> | |
| 96 <button style="float: left; margin-left: 5px;" type="button" class="appbutton" id="hlt20">-sp</button> | |
| 97 </td> | |
| 98 </tr> | |
| 99 <tr> | |
| 100 <td> | |
| 101 <button style="float: left; margin-left: 5px;" type="button" class="appbutton" id="hlt01">Info</button> | |
| 102 </td> | |
| 103 <td> | |
| 104 <button style="float: left; margin-left: 5px;" type="button" class="appbutton" id="hlt21">Tools</button> | |
| 105 </td> | |
| 106 </tr> | |
| 107 </table> | |
| 108 </div> | |
| 109 | |
| 14 <table style='width: 100%; padding: 0px;'> | 110 <table style='width: 100%; padding: 0px;'> |
| 15 <tr style="color: yellow; background-color: blue; height: 26px;"> | 111 <col width="20%"><col width="20%"><col width="20%"><col width="20%"><col width="20%"> |
| 16 <th colspan="3"><span id="top_msg">top_msg</span></th> | 112 |
| 17 </tr> | 113 <tr id="row_info"> |
| 18 <tr> | 114 <td colspan="5"> |
| 19 <td style="width: 20%;"> | 115 <div style="color: yellow; text-align: center;"> |
| 20 <button style="float: left; margin-left: 5px;" type="button" class="appbutton">Hand</button> | 116 <p /> |
| 21 <button style="float: left; margin-left: 5px; margin-top: 12px;" type="button" class="appbutton">+sp</button> | 117 Written by Michiel Broek © 2018 |
| 22 </td> | 118 </div> |
| 23 <td style="width: 60%;"> | 119 <div style="color: orange; text-align: center;"> |
| 24 <table id="mlt_table"> | 120 <p /> |
| 25 <tr> | 121 Parts are written by Chris Morgan, Brett Beauregard, Blake Felt, LoBo and David Antliff. |
| 26 <td style="width: 10%; text-align: center;"> | 122 </div> |
| 27 <div id="pump_led" class="LEDred"></div> | 123 <div> |
| 28 </td> | 124 <button style="margin-left: 150px; margin-top: 50px;" type="button" class="okbutton" id="ok_info">Ok</button> |
| 29 <td colspan="2" style='font-size: 10px; text-align: center;'>MLT</td> | 125 </div> |
| 30 <td style="width: 10%; text-align: center;"> | |
| 31 <div id="mlt_led" class="LEDgreen"></div> | |
| 32 </td> | |
| 33 </tr> | |
| 34 <tr><td colspan="4" style='border: 1px solid; font-size: 40px; text-align: right;'><span id="mlt_pv">---</span></td></tr> | |
| 35 <tr><td colspan="2" style='width: 50%; font-size: 10px;'><span id="mlt_sp">44.00</span></td> | |
| 36 <td colspan="2" style='width: 50%; font-size: 10px;'><span id="mlt_power">100%</span></td></tr> | |
| 37 </table> | |
| 38 </td> | |
| 39 <td style="width: 20%;"> | |
| 40 <button style="float: left; margin-left: 5px;" type="button" class="appbutton">Auto</button> | |
| 41 <button style="float: left; margin-left: 5px; margin-top: 12px;" type="button" class="appbutton">-sp</button> | |
| 42 </td> | 126 </td> |
| 43 </tr> | 127 </tr> |
| 44 <tr> | 128 |
| 45 <td><button style="float: left; margin-left: 5px;" type="button" class="appbutton">+1m</button></td> | |
| 46 <td><div id="timer">01:23:45</div></td> | |
| 47 <td><button style="float: left; margin-left: 5px;" type="button" class="appbutton">-1m</button></td> | |
| 48 </tr> | |
| 49 <tr> | |
| 50 <td><button style="float: left; margin-left: 5px;" type="button" class="appbutton">+sp</button> | |
| 51 <button style="float: left; margin-left: 5px; margin-top: 12px;" type="button" class="appbutton">Info</button></td> | |
| 52 <td> | |
| 53 <table id="hlt_table"> | |
| 54 <tr> | |
| 55 <td style="width: 10%; text-align: center;"> | |
| 56 </td> | |
| 57 <td colspan="2" style='font-size: 10px; text-align: center;'>HLT</td> | |
| 58 <td style="width: 10%; text-align: center;"> | |
| 59 <div id="hlt_led" class="LEDgreen"></div> | |
| 60 </td> | |
| 61 </tr> | |
| 62 <tr><td colspan="4" style='border: 1px solid; font-size: 40px; text-align: right;'><span id="hlt_pv">---</span></td></tr> | |
| 63 <tr><td colspan="2" style='font-size: 10px;'><span id="hlt_sp">44.00</span></td> | |
| 64 <td colspan="2" style='font-size: 10px;'><span id="hlt_power">100%</span></td></tr> | |
| 65 </table> | |
| 66 </td> | |
| 67 <td><button style="float: left; margin-left: 5px;" type="button" class="appbutton">-sp</button> | |
| 68 <button style="float: left; margin-left: 5px; margin-top: 12px;" type="button" class="appbutton">Tools</button></td> | |
| 69 </tr> | |
| 70 </table> | 129 </table> |
| 71 </div> | 130 </div> <!-- webui_win --> |
| 72 | 131 |
| 73 <br> | 132 <br> |
| 74 <form action="index.html"><input type="submit" class="button" value="Hoofdmenu"></form> | 133 <form action="index.html"><input type="submit" class="button" value="Hoofdmenu"></form> |
| 75 | 134 |
| 76 <p id="test"></p> | 135 <p id="test"></p> |
