Browse Source

improved UI (responsive)

pull/361/head^2
lumapu 2 years ago
parent
commit
bafe47e424
  1. 2
      tools/esp8266/defines.h
  2. 14
      tools/esp8266/html/api.js
  3. 103
      tools/esp8266/html/index.html
  4. 104
      tools/esp8266/html/serial.html
  5. 22
      tools/esp8266/html/setup.html
  6. 129
      tools/esp8266/html/style.css
  7. 54
      tools/esp8266/html/system.html
  8. 39
      tools/esp8266/html/update.html
  9. 29
      tools/esp8266/html/visualization.html
  10. 26
      tools/esp8266/web.cpp
  11. 1
      tools/esp8266/web.h
  12. 6
      tools/esp8266/webApi.cpp

2
tools/esp8266/defines.h

@ -13,7 +13,7 @@
//------------------------------------- //-------------------------------------
#define VERSION_MAJOR 0 #define VERSION_MAJOR 0
#define VERSION_MINOR 5 #define VERSION_MINOR 5
#define VERSION_PATCH 24 #define VERSION_PATCH 25
//------------------------------------- //-------------------------------------

14
tools/esp8266/html/api.js

@ -12,11 +12,21 @@ function parseMenu(obj) {
for(var i = 0; i < obj["name"].length; i ++) { for(var i = 0; i < obj["name"].length; i ++) {
if(obj["name"][i] == "-") if(obj["name"][i] == "-")
e.appendChild(span("", ["seperator"])); e.appendChild(span("", ["seperator"]));
else else {
e.appendChild(link(obj["link"][i], obj["name"][i], obj["trgt"][i])); var l = link(obj["link"][i], obj["name"][i], obj["trgt"][i]);
if(obj["link"][i] == window.location.pathname)
l.classList.add("active");
e.appendChild(l);
}
} }
} }
function parseVersion(obj) {
document.getElementById("version").appendChild(
link("https://github.com/lumapu/ahoy/commits/" + obj["build"], "Git SHA: " + obj["build"] + " :: " + obj["version"], "_blank")
);
}
function toggle(id, hide) { function toggle(id, hide) {
var elm = document.getElementById(id); var elm = document.getElementById(id);
if(hide) { if(hide) {

103
tools/esp8266/html/index.html

@ -8,7 +8,7 @@
</head> </head>
<body> <body>
<div class="topnav"> <div class="topnav">
<a href="/" class="active">AhoyDTU</a> <a href="/" class="title">AhoyDTU</a>
<a href="javascript:void(0);" class="icon" onclick="topnav()"> <a href="javascript:void(0);" class="icon" onclick="topnav()">
<span></span> <span></span>
<span></span> <span></span>
@ -16,53 +16,63 @@
</a> </a>
<div id="topnav" class="hide"></div> <div id="topnav" class="hide"></div>
</div> </div>
<div id="content" class="content"> <div id="wrapper">
<script> <div id="content">
function promptFunction() { <script>
var Text = prompt("This project was started from https://www.mikrocontroller.net/topic/525778 this discussion.\n\n" + function promptFunction() {
"The Hoymiles protocol was decrypted through the voluntary efforts of many participants. ahoy, among others, was developed based on this work.\n" + var Text = prompt("This project was started from https://www.mikrocontroller.net/topic/525778 this discussion.\n\n" +
"The software was developed to the best of our knowledge and belief. Nevertheless, no liability can be accepted for a malfunction or guarantee loss of the inverter.\n\n" + "The Hoymiles protocol was decrypted through the voluntary efforts of many participants. ahoy, among others, was developed based on this work.\n" +
"Ahoy is freely available. If you paid money for the software, you probably got ripped off.\n\nPlease type in 'YeS', you are accept our Disclaim. You should then save your config.", ""); "The software was developed to the best of our knowledge and belief. Nevertheless, no liability can be accepted for a malfunction or guarantee loss of the inverter.\n\n" +
if (Text != "YeS") "Ahoy is freely available. If you paid money for the software, you probably got ripped off.\n\nPlease type in 'YeS', you are accept our Disclaim. You should then save your config.", "");
promptFunction(); if (Text != "YeS")
else promptFunction();
return true; else
return true;
} }
</script> </script>
<p><span class="des">Uptime: </span><span id="uptime"></span></p> <p><span class="des">Uptime: </span><span id="uptime"></span></p>
<p><span class="des">ESP-Time: </span><span id="date"></span></p> <p><span class="des">ESP-Time: </span><span id="date"></span></p>
<div id="sun"> <div id="sun">
<span class="des">Sunrise: </span><span id="sunrise"></span><br> <span class="des">Sunrise: </span><span id="sunrise"></span><br>
<span class="des">Sunset: </span><span id="sunset"></span> <span class="des">Sunset: </span><span id="sunset"></span>
</div> </div>
<p><span class="des">WiFi RSSI: </span><span id="wifi_rssi"></span> dBm</p> <p><span class="des">WiFi RSSI: </span><span id="wifi_rssi"></span> dBm</p>
<p> <p>
<span class="des">Statistics: </span> <span class="des">Statistics: </span>
<pre id="stat"></pre> <pre id="stat"></pre>
<pre id="iv"></pre> <pre id="iv"></pre>
<pre id="warn_info"></pre> <pre id="warn_info"></pre>
</p> </p>
<p>Every <span id="refresh"></span> seconds the values are updated</p> <p>Every <span id="refresh"></span> seconds the values are updated</p>
<div id="note">
Discuss with us on <a href="https://discord.gg/WzhxEY62mB">Discord</a><br/>
<h2>Support this project:</h2>
<ul>
<li>Report <a href="https://github.com/lumapu/ahoy/issues" target="_blank">issues</a></li>
<li>Contribute to <a href="https://github.com/lumapu/ahoy/blob/main/tools/esp8266/User_Manual.md" target="_blank">documentation</a></li>
<li>Test <a href="https://github.com/lumapu/ahoy/actions/workflows/compile_development.yml" target="_blank">development firmware</a></li>
<li>make a <a href="https://paypal.me/lupusch" target="_blank">donation</a></li>
</ul>
<p class="lic"><a href="https://creativecommons.org/licenses/by-nc-sa/3.0/de">Creative Commons - https://creativecommons.org/licenses/by-nc-sa/3.0/de/</a><br/>
Check the licenses which are published on <a href="https://github.com/lumapu/ahoy" target="_blank">https://github.com/lumapu/ahoy</a> as well<br/>
This project was started from <a href="https://www.mikrocontroller.net/topic/525778" target="_blank">this discussion. (Mikrocontroller.net)</a></p> <div id="note">
Discuss with us on <a href="https://discord.gg/WzhxEY62mB">Discord</a><br/>
<h2>Support this project:</h2>
<ul>
<li>Report <a href="https://github.com/lumapu/ahoy/issues" target="_blank">issues</a></li>
<li>Contribute to <a href="https://github.com/lumapu/ahoy/blob/main/tools/esp8266/User_Manual.md" target="_blank">documentation</a></li>
<li>Test <a href="https://github.com/lumapu/ahoy/actions/workflows/compile_development.yml" target="_blank">development firmware</a></li>
<li>make a <a href="https://paypal.me/lupusch" target="_blank">donation</a></li>
</ul>
<p class="lic">
This project was started from <a href="https://www.mikrocontroller.net/topic/525778" target="_blank">this discussion. (Mikrocontroller.net)</a>
</p>
</div>
</div> </div>
</div> </div>
<div id="footer"> <div id="footer">
<p class="left">&copy 2022</p> <div class="left">
<p class="right" id="version"></p> AhoyDTU &copy 2022
<ul>
<li><a href="https://discord.gg/WzhxEY62mB" target="_blank">Discord</a></li>
<li><a href="https://github.com/lumapu/ahoy" target="_blank">Github</a></li>
</ul>
</div>
<div class="right">
<span id="version"></span><br/><br/>
<a href="https://creativecommons.org/licenses/by-nc-sa/3.0/de" target="_blank" >CC BY-NC-SA 3.0</a>
</div>
</div> </div>
<script type="text/javascript"> <script type="text/javascript">
var exeOnce = true; var exeOnce = true;
@ -88,11 +98,8 @@
function parseSys(obj) { function parseSys(obj) {
// Disclaimer // Disclaimer
//if(obj["disclaimer"] == false) sessionStorage.setItem("gDisclaimer", promptFunction()); //if(obj["disclaimer"] == false) sessionStorage.setItem("gDisclaimer", promptFunction());
if(true == exeOnce) { if(true == exeOnce)
document.getElementById("version").appendChild( parseVersion(obj);
link("https://github.com/lumapu/ahoy/commits/" + obj["build"], "Git SHA: " + obj["build"] + " :: " + obj["version"], "_blank")
);
}
document.getElementById("wifi_rssi").innerHTML = obj["wifi_rssi"]; document.getElementById("wifi_rssi").innerHTML = obj["wifi_rssi"];
var date = new Date(obj["ts_now"] * 1000); var date = new Date(obj["ts_now"] * 1000);

104
tools/esp8266/html/serial.html

@ -8,7 +8,7 @@
</head> </head>
<body> <body>
<div class="topnav"> <div class="topnav">
<a href="/" class="active">AhoyDTU</a> <a href="/" class="title">AhoyDTU</a>
<a href="javascript:void(0);" class="icon" onclick="topnav()"> <a href="javascript:void(0);" class="icon" onclick="topnav()">
<span></span> <span></span>
<span></span> <span></span>
@ -16,54 +16,64 @@
</a> </a>
<div id="topnav" class="hide"></div> <div id="topnav" class="hide"></div>
</div> </div>
<div id="content" class="content"> <div id="wrapper">
<h2>Serial Console</h2> <div id="content">
<div class="serial"> <div class="serial">
<textarea id="serial" cols="80" rows="20" readonly></textarea><br/> <textarea id="serial" cols="80" rows="20" readonly></textarea><br/>
connected: <span class="dot" id="connected"></span> connected: <span class="dot" id="connected"></span>
Uptime: <span id="uptime"></span> Uptime: <span id="uptime"></span>
<input type="button" value="clear" class="btn" id="clear"/> <input type="button" value="clear" class="btn" id="clear"/>
<input type="button" value="autoscroll" class="btn" id="scroll"/> <input type="button" value="autoscroll" class="btn" id="scroll"/>
<br/> <br/>
<br/> <br/>
<br/> <br/>
<br/> <br/>
<hr> <hr>
<h3>Commands</h3> <h3>Commands</h3>
<br/> <br/>
<label for="iv">Select Inverter:</label> <label for="iv">Select Inverter:</label>
<select name="iv" id="InvID"> <select name="iv" id="InvID">
</select> </select>
<br/> <br/>
<div id="power"> <div id="power">
<input type="button" value="Restart" class="btn" id="restart"/> <input type="button" value="Restart" class="btn" id="restart"/>
<input type="button" value="Turn Off" class="btn" id="power_off"/> <input type="button" value="Turn Off" class="btn" id="power_off"/>
<input type="button" value="Turn On" class="btn" id="power_on"/> <input type="button" value="Turn On" class="btn" id="power_on"/>
</div>
<br/>
<br/>
<br/>
<br/>
<br/>
<label>Send Power Limit: </label>
<input type="number" class="text" name="pwrlimval" maxlength="4"/>
<label> </label>
<select name="pwrlimcntrl" id="pwrlimcntrl">
<option value="" selected disabled hidden>select the unit and persistence</option>
<option value="0">absolute in Watt non persistent</option>
<option value="1">relative in percent non persistent</option>
<option value="256">absolute in Watt persistent</option>
<option value="257">relative in percent persistent</option>
</select>
<br/>
<input type="button" value="Send Power Limit" class="btn" id="sendpwrlim"/>
<br/>
<p>Ctrl result: <span id="result">n/a</span></p>
</div> </div>
<br/>
<br/>
<br/>
<br/>
<br/>
<label>Send Power Limit: </label>
<input type="number" class="text" name="pwrlimval" maxlength="4"/>
<label> </label>
<select name="pwrlimcntrl" id="pwrlimcntrl">
<option value="" selected disabled hidden>select the unit and persistence</option>
<option value="0">absolute in Watt non persistent</option>
<option value="1">relative in percent non persistent</option>
<option value="256">absolute in Watt persistent</option>
<option value="257">relative in percent persistent</option>
</select>
<br/>
<input type="button" value="Send Power Limit" class="btn" id="sendpwrlim"/>
<br/>
<p>Ctrl result: <span id="result">n/a</span></p>
</div> </div>
</div> </div>
<div id="footer"> <div id="footer">
<p class="left">&copy 2022</p> <div class="left">
<p class="right" id="version"></p> AhoyDTU &copy 2022
<ul>
<li><a href="https://discord.gg/WzhxEY62mB" target="_blank">Discord</a></li>
<li><a href="https://github.com/lumapu/ahoy" target="_blank">Github</a></li>
</ul>
</div>
<div class="right">
<span id="version"></span><br/><br/>
<a href="https://creativecommons.org/licenses/by-nc-sa/3.0/de" target="_blank" >CC BY-NC-SA 3.0</a>
</div>
</div> </div>
<script type="text/javascript"> <script type="text/javascript">
var mAutoScroll = true; var mAutoScroll = true;
@ -82,9 +92,7 @@
+ ("0"+sec).substr(-2); + ("0"+sec).substr(-2);
if(true == exeOnce) { if(true == exeOnce) {
document.getElementById("version").appendChild( parseVersion(obj);
link("https://github.com/lumapu/ahoy/commits/" + obj["build"], "Git SHA: " + obj["build"] + " :: " + obj["version"], "_blank")
);
window.setInterval("getAjax('/api/system', parseSys)", 10000); window.setInterval("getAjax('/api/system', parseSys)", 10000);
exeOnce = false; exeOnce = false;
} }

22
tools/esp8266/html/setup.html

@ -19,7 +19,7 @@
</head> </head>
<body onload="load()"> <body onload="load()">
<div class="topnav"> <div class="topnav">
<a href="/" class="active">AhoyDTU</a> <a href="/" class="title">AhoyDTU</a>
<a href="javascript:void(0);" class="icon" onclick="topnav()"> <a href="javascript:void(0);" class="icon" onclick="topnav()">
<span></span> <span></span>
<span></span> <span></span>
@ -27,7 +27,7 @@
</a> </a>
<div id="topnav" class="hide"></div> <div id="topnav" class="hide"></div>
</div> </div>
<div id="setup" class="content"> <div id="wrapper">
<div id="content"> <div id="content">
<a class="btn" href="/erase">ERASE SETTINGS (not WiFi)</a> <a class="btn" href="/erase">ERASE SETTINGS (not WiFi)</a>
@ -149,9 +149,17 @@
</div> </div>
</div> </div>
<div id="footer"> <div id="footer">
<p class="left">&copy 2022</p> <div class="left">
<p class="right" id="version"></p> AhoyDTU &copy 2022
<p class="right"><a href="/factory">Factory Reset</a></p> <ul>
<li><a href="https://discord.gg/WzhxEY62mB" target="_blank">Discord</a></li>
<li><a href="https://github.com/lumapu/ahoy" target="_blank">Github</a></li>
</ul>
</div>
<div class="right">
<span id="version"></span><br/><br/>
<a href="https://creativecommons.org/licenses/by-nc-sa/3.0/de" target="_blank" >CC BY-NC-SA 3.0</a>
</div>
</div> </div>
<script type="text/javascript"> <script type="text/javascript">
var highestId = 0; var highestId = 0;
@ -292,9 +300,7 @@
function parseSys(obj) { function parseSys(obj) {
for(var i of [["device", "device_name"], ["ssid", "ssid"]]) for(var i of [["device", "device_name"], ["ssid", "ssid"]])
document.getElementsByName(i[0])[0].value = obj[i[1]]; document.getElementsByName(i[0])[0].value = obj[i[1]];
document.getElementById("version").appendChild( parseVersion(obj);
link("https://github.com/lumapu/ahoy/commits/" + obj["build"], "Git SHA: " + obj["build"] + " :: " + obj["version"], "_blank")
);
} }
function parseIv(obj) { function parseIv(obj) {

129
tools/esp8266/html/style.css

@ -2,6 +2,8 @@ html, body {
font-family: Arial; font-family: Arial;
margin: 0; margin: 0;
padding: 0; padding: 0;
height: 100%;
min-height: 100%;
} }
h2 { h2 {
@ -37,11 +39,11 @@ h2 {
} }
.topnav a:hover { .topnav a:hover {
background-color: #006ec0; background-color: #555 !important;
color: #000; color: #000;
} }
.active { .title {
background-color: #006ec0; background-color: #006ec0;
color: #fff !important; color: #fff !important;
padding-left: 80px !important padding-left: 80px !important
@ -57,14 +59,98 @@ h2 {
border-radius: 2px; border-radius: 2px;
} }
.topnav .active {
background-color: #00afc1;
}
span.seperator { span.seperator {
width: 100%; width: 100%;
height: 1px; height: 1px;
margin: 10px 0px 10px; margin: 10px 0px 10px;
background-color: #444; background-color: #494949;
display: block; display: block;
} }
#wrapper {
min-height: 100%;
}
#content {
padding: 50px 20px 120px 20px;
overflow: auto;
}
#footer {
height: 120px;
margin-top: -120px;
background-color: #555;
width: 100%;
font-size: 13px;
}
#footer .right {
color: #bbb;
margin: 23px 25px;
text-align: right;
}
#footer .left {
color: #bbb;
margin: 23px 0px 0px 25px;
}
#footer ul {
list-style-type: none;
margin: 20px auto;
padding: 0;
}
#footer ul li, #footer a {
color: #bbb;
margin-bottom: 10px;
padding-left: 5px;
font-size: 13px;
}
#footer a:hover {
color: #fff;
}
.hide {
display: none;
}
@media only screen and (min-width: 992px) {
.topnav {
width: 230px !important;
height: 100%;
}
.topnav a.icon {
display: none !important;
}
.topnav a {
padding: 14px 24px;
}
.topnav .title {
padding-left: 24px !important;
}
.topnav .hide {
display: block;
}
#content {
padding: 15px 15px 120px 250px;
}
#footer .left {
margin-left: 250px !important;
}
}
/** old CSS below **/ /** old CSS below **/
p { p {
@ -91,7 +177,6 @@ p.lic, p.lic a {
.s_content { .s_content {
display: none; display: none;
overflow: hidden; overflow: hidden;
} }
.s_collapsible { .s_collapsible {
@ -119,10 +204,6 @@ p.lic, p.lic a {
margin: 0 0 7px 12px; margin: 0 0 7px 12px;
} }
.hide {
display: none;
}
a:link, a:visited { a:link, a:visited {
text-decoration: none; text-decoration: none;
font-size: 13pt; font-size: 13pt;
@ -136,34 +217,12 @@ a:hover, a:focus {
a.btn { a.btn {
background-color: #006ec0; background-color: #006ec0;
color: #fff; color: #fff;
padding: 7px; padding: 7px 15px 7px 15px;
display: inline-block; display: inline-block;
margin-top: 30px;
}
#content {
padding: 60px 15px 60px 15px;
} }
#footer { a.btn:hover {
position: fixed; background-color: #555 !important;
bottom: 0px;
height: 45px;
background-color: #006ec0;
width: 100%;
border-top: 5px solid #fff;
}
#footer p, #footer a {
color: #fff;
padding: 0 7px 0 7px;
font-size: 10pt !important;
}
div.content {
background-color: #fff;
padding-bottom: 65px;
overflow: auto;
} }
input, select { input, select {
@ -214,6 +273,10 @@ label {
vertical-align: top; vertical-align: top;
} }
pre {
white-space: pre-wrap;
}
fieldset { fieldset {
margin-bottom: 15px; margin-bottom: 15px;
} }

54
tools/esp8266/html/system.html

@ -0,0 +1,54 @@
<!doctype html>
<html>
<head>
<title>System</title>
<link rel="stylesheet" type="text/css" href="style.css"/>
<meta name="viewport" content="width=device-width, initial-scale=1">
<script type="text/javascript" src="api.js"></script>
</head>
<body>
<div class="topnav">
<a href="/" class="title">AhoyDTU</a>
<a href="javascript:void(0);" class="icon" onclick="topnav()">
<span></span>
<span></span>
<span></span>
</a>
<div id="topnav" class="hide"></div>
</div>
<div id="wrapper">
<div id="content">
<a href="/factory" class="btn">Factory Reset</a><br/>
<br/>
<a href="/reboot" class="btn">Reboot</a>
</div>
</div>
<div id="footer">
<div class="left">
AhoyDTU &copy 2022
<ul>
<li><a href="https://discord.gg/WzhxEY62mB" target="_blank">Discord</a></li>
<li><a href="https://github.com/lumapu/ahoy" target="_blank">Github</a></li>
</ul>
</div>
<div class="right">
<span id="version"></span><br/><br/>
<a href="https://creativecommons.org/licenses/by-nc-sa/3.0/de" target="_blank" >CC BY-NC-SA 3.0</a>
</div>
</div>
<script type="text/javascript">
function parseSys(obj) {
parseVersion(obj);
}
function parse(obj) {
if(null != obj) {
parseMenu(obj["menu"]);
parseSys(obj["system"]);
}
}
getAjax("/api/index", parse);
</script>
</body>
</html>

39
tools/esp8266/html/update.html

@ -8,7 +8,7 @@
</head> </head>
<body> <body>
<div class="topnav"> <div class="topnav">
<a href="/" class="active">AhoyDTU</a> <a href="/" class="title">AhoyDTU</a>
<a href="javascript:void(0);" class="icon" onclick="topnav()"> <a href="javascript:void(0);" class="icon" onclick="topnav()">
<span></span> <span></span>
<span></span> <span></span>
@ -16,26 +16,35 @@
</a> </a>
<div id="topnav" class="hide"></div> <div id="topnav" class="hide"></div>
</div> </div>
<div id="content" class="content"> <div id="wrapper">
<div> <div id="content">
Make sure that you have noted all your settings before starting an update. New versions may have changed their memory layout which can break your existing settings.<br/> <div>
<br/> Make sure that you have noted all your settings before starting an update. New versions may have changed their memory layout which can break your existing settings.<br/>
<a href="/get_setup" target="_blank">Download your settings (JSON file)</a> <br/>
<a href="/get_setup" target="_blank">Download your settings (JSON file)</a>
</div>
<br/><br/>
<form method="POST" action="/update" enctype="multipart/form-data" accept-charset="utf-8">
<input type="file" name="update"><input type="submit" value="Update">
</form>
</div> </div>
<br/><br/>
<form method="POST" action="/update" enctype="multipart/form-data" accept-charset="utf-8">
<input type="file" name="update"><input type="submit" value="Update">
</form>
</div> </div>
<div id="footer"> <div id="footer">
<p class="left">&copy 2022</p> <div class="left">
<p class="right" id="version"></p> AhoyDTU &copy 2022
<ul>
<li><a href="https://discord.gg/WzhxEY62mB" target="_blank">Discord</a></li>
<li><a href="https://github.com/lumapu/ahoy" target="_blank">Github</a></li>
</ul>
</div>
<div class="right">
<span id="version"></span><br/><br/>
<a href="https://creativecommons.org/licenses/by-nc-sa/3.0/de" target="_blank" >CC BY-NC-SA 3.0</a>
</div>
</div> </div>
<script type="text/javascript"> <script type="text/javascript">
function parseSys(obj) { function parseSys(obj) {
document.getElementById("version").appendChild( parseVersion(obj);
link("https://github.com/lumapu/ahoy/commits/" + obj["build"], "Git SHA: " + obj["build"] + " :: " + obj["version"], "_blank")
);
} }
function parse(obj) { function parse(obj) {

29
tools/esp8266/html/visualization.html

@ -9,7 +9,7 @@
</head> </head>
<body> <body>
<div class="topnav"> <div class="topnav">
<a href="/" class="active">AhoyDTU</a> <a href="/" class="title">AhoyDTU</a>
<a href="javascript:void(0);" class="icon" onclick="topnav()"> <a href="javascript:void(0);" class="icon" onclick="topnav()">
<span></span> <span></span>
<span></span> <span></span>
@ -17,22 +17,31 @@
</a> </a>
<div id="topnav" class="hide"></div> <div id="topnav" class="hide"></div>
</div> </div>
<div id="content" class="content"> <div id="wrapper">
<div id="live"></div> <div id="content">
<p>Every <span id="refresh"></span> seconds the values are updated</p> <div id="live"></div>
<p>Every <span id="refresh"></span> seconds the values are updated</p>
</div>
</div> </div>
<div id="footer"> <div id="footer">
<p class="left">&copy 2022</p> <div class="left">
<p class="right" id="version"></p> AhoyDTU &copy 2022
<ul>
<li><a href="https://discord.gg/WzhxEY62mB" target="_blank">Discord</a></li>
<li><a href="https://github.com/lumapu/ahoy" target="_blank">Github</a></li>
</ul>
</div>
<div class="right">
<span id="version"></span><br/><br/>
<a href="https://creativecommons.org/licenses/by-nc-sa/3.0/de" target="_blank" >CC BY-NC-SA 3.0</a>
</div>
</div> </div>
<script type="text/javascript"> <script type="text/javascript">
var exeOnce = true; var exeOnce = true;
function parseSys(obj) { function parseSys(obj) {
if(true == exeOnce) { if(true == exeOnce)
document.getElementById("version").appendChild( parseVersion(obj);
link("https://github.com/lumapu/ahoy/commits/" + obj["build"], "Git SHA: " + obj["build"] + " :: " + obj["version"], "_blank")
);}
} }
function parseIv(obj, root) { function parseIv(obj, root) {

26
tools/esp8266/web.cpp

@ -18,6 +18,7 @@
#include "html/h/visualization_html.h" #include "html/h/visualization_html.h"
#include "html/h/update_html.h" #include "html/h/update_html.h"
#include "html/h/serial_html.h" #include "html/h/serial_html.h"
#include "html/h/system_html.h"
const char* const pinArgNames[] = {"pinCs", "pinCe", "pinIrq"}; const char* const pinArgNames[] = {"pinCs", "pinCe", "pinIrq"};
@ -51,6 +52,7 @@ void web::setup(void) {
mWeb->on("/favicon.ico", HTTP_GET, std::bind(&web::onFavicon, this, std::placeholders::_1)); mWeb->on("/favicon.ico", HTTP_GET, std::bind(&web::onFavicon, this, std::placeholders::_1));
mWeb->onNotFound ( std::bind(&web::showNotFound, this, std::placeholders::_1)); mWeb->onNotFound ( std::bind(&web::showNotFound, this, std::placeholders::_1));
mWeb->on("/reboot", HTTP_ANY, std::bind(&web::onReboot, this, std::placeholders::_1)); mWeb->on("/reboot", HTTP_ANY, std::bind(&web::onReboot, this, std::placeholders::_1));
mWeb->on("/system", HTTP_ANY, std::bind(&web::onSystem, this, std::placeholders::_1));
mWeb->on("/erase", HTTP_ANY, std::bind(&web::showErase, this, std::placeholders::_1)); mWeb->on("/erase", HTTP_ANY, std::bind(&web::showErase, this, std::placeholders::_1));
mWeb->on("/factory", HTTP_ANY, std::bind(&web::showFactoryRst, this, std::placeholders::_1)); mWeb->on("/factory", HTTP_ANY, std::bind(&web::showFactoryRst, this, std::placeholders::_1));
@ -160,18 +162,18 @@ void web::showNotFound(AsyncWebServerRequest *request) {
//----------------------------------------------------------------------------- //-----------------------------------------------------------------------------
void web::onReboot(AsyncWebServerRequest *request) { void web::onReboot(AsyncWebServerRequest *request) {
String content = ""; mMain->mShouldReboot = true;
int refresh = 120; request->send(200, F("text/html"), F("<!doctype html><html><head><title>Reboot</title><link rel=\"stylesheet\" type=\"text/css\" href=\"style.css\"/><meta http-equiv=\"refresh\" content=\"10; URL=/\"></head><body>reboot. Autoreload after 10 seconds</body></html>"));
if(request->args() > 0) { }
if(request->arg("reboot").toInt() == 1) {
refresh = 10;
content = F("reboot. Autoreload after 10 seconds"); //-----------------------------------------------------------------------------
mMain->mShouldReboot = true; void web::onSystem(AsyncWebServerRequest *request) {
} DPRINTLN(DBG_VERBOSE, F("onSystem"));
}
else AsyncWebServerResponse *response = request->beginResponse_P(200, F("text/html"), system_html, system_html_len);
content = F("<a href=\"/reboot?reboot=1\" class=\"btn\">Reboot</a> <a href=\"/\" class=\"btn\">cancel</a>"); response->addHeader(F("Content-Encoding"), "gzip");
request->send(200, F("text/html"), F("<!doctype html><html><head><title>Reboot</title><link rel=\"stylesheet\" type=\"text/css\" href=\"style.css\"/><meta http-equiv=\"refresh\" content=\"") + String(refresh) + F("; URL=/\"></head><body>") + content + F("</body></html>")); request->send(response);
} }

1
tools/esp8266/web.h

@ -54,6 +54,7 @@ class web {
private: private:
void onSerial(AsyncWebServerRequest *request); void onSerial(AsyncWebServerRequest *request);
void onSystem(AsyncWebServerRequest *request);
AsyncWebServer *mWeb; AsyncWebServer *mWeb;
AsyncEventSource *mEvts; AsyncEventSource *mEvts;

6
tools/esp8266/webApi.cpp

@ -248,7 +248,7 @@ void webApi::getMenu(JsonObject obj) {
obj["link"][0] = "/live"; obj["link"][0] = "/live";
obj["name"][1] = "Serial Console"; obj["name"][1] = "Serial Console";
obj["link"][1] = "/serial"; obj["link"][1] = "/serial";
obj["name"][2] = "Setup"; obj["name"][2] = "Settings";
obj["link"][2] = "/setup"; obj["link"][2] = "/setup";
obj["name"][3] = "-"; obj["name"][3] = "-";
obj["name"][4] = "REST API"; obj["name"][4] = "REST API";
@ -257,8 +257,8 @@ void webApi::getMenu(JsonObject obj) {
obj["name"][5] = "-"; obj["name"][5] = "-";
obj["name"][6] = "Update"; obj["name"][6] = "Update";
obj["link"][6] = "/update"; obj["link"][6] = "/update";
obj["name"][7] = "Reboot"; obj["name"][7] = "System";
obj["link"][7] = "/reboot"; obj["link"][7] = "/system";
} }

Loading…
Cancel
Save