image/w/webui.html@96e30a3a3980
image/w/webui.html
Mon, 21 Jun 2021 19:04:10 +0200
- author
- Michiel Broek <mbroek@mbse.eu>
- date
- Mon, 21 Jun 2021 19:04:10 +0200
- changeset 102
- 96e30a3a3980
- parent 91
- 255a75322212
- permissions
- -rw-r--r--
Finished experimental code to drive the German HendiControl board. Added BoilPower and RampPower buttons during the while boil process. RampPower (going to boil power) is now adjustable. Added PWM driver code to the driver task.
<!DOCTYPE html> <html lang="en"> <head> <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=2.5" /> <script src="js/jquery-1.12.4.min.js"></script> <script src="js/reconnecting-ws.min.js"></script> <link rel="stylesheet" href="css/webui.css"> </head> <body> <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 style="height: 50%;"> <td style="margin-top: 5px;"> <button style="float: left; margin-left: 5px;" type="button" class="appbutton" id="mlt00"><span id="but00">00</span></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"><span id="but20">20</span></button> </td> </tr> <tr> <td> <button style="float: left; margin-left: 5px;" type="button" class="appbutton" id="mlt01"><span id="but01">01</span></button> </td> <td> <button style="float: left; margin-left: 5px;" type="button" class="appbutton" id="mlt21"><span id="but21">21</span></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"><span id="but02">02</span></button> </td> <td> <div id="timer">01:23:45</div> </td> <td> <button style="float: left; margin-left: 5px;" type="button" class="appbutton" id="mid20"><span id="but22">22</span></button> </td> </tr> </table> </div> <div id="hltline" style="margin-bottom: 0;"> <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"><span id="but03">03</span></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='width: 50%; font-size: 10px;'><span id="hlt_sp">44.00</span></td> <td colspan="2" style='width: 50%; 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"><span id="but23">23</span></button> </td> </tr> <tr style="height: 50%;"> <td> <button style="float: left; margin-left: 5px;" type="button" class="appbutton" id="hlt01"><span id="but04">04</span></button> </td> <td> <button style="float: left; margin-left: 5px;" type="button" class="appbutton" id="hlt21"><span id="but24">24</span></button> </td> </tr> </table> </div> <div id="row_info"> <div style="color: yellow; text-align: center;"> <p />Written by Michiel Broek © 2018-2021 </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 type="button" class="okbutton" id="ok_info">Ok</button> </div> </div> <div id="prompt"> <button style="margin-top: 100px;" type="button" class="promptbutton" id="button_ja">Ja</button> <button style="margin-left: 80px; margin-top: 100px;" type="button" class="promptbutton" id="button_nee">Nee</button> </div> <div id="note"> <div style="color: yellow; text-align: center; margin-top: 105px;"><span id="note_msg">nm</span></div> <div> <button type="button" class="okbutton" id="ok_note">Ok</button> </div> </div> <div id="brew"> <div style="color: yellow; margin-top: 20px;">Installatie: <span id="brew_msg1"></span></div> <div style="color: yellow;">Recept: <span id="brew_msg2"></span></div> <div style="color: white; margin-top: 20px;">Zie het display voor de details.</span></div> <div> <button style="position: absolute; left: 5px; top: 230px;" type="button" class="appbutton" id="button_stop">Stop</button> <button style="position: absolute; left: 295px; top: 230px;" type="button" class="appbutton" id="button_start">Start</button> </div> </div> </div> <!-- webui_win --> <br> <div class="menu" style="margin-left: 45px;"> <form action="index.html"><input type="submit" class="button" value="Hoofdmenu"></form> </div> <p id="wsstatus"></p><p id="output"></p> <script type="text/javascript" src="js/webui.js"></script> </body> </html>
