3pp-mirror/ahoy
1
0
Fork 0
mirror of https://github.com/lumapu/ahoy.git synced 2025-05-12 08:26:38 +02:00
Code Issues Projects Releases Packages Wiki Activity

added central menu

Browse source
This commit is contained in:
lumapu 2022-10-23 01:47:58 +02:00
parent 0f0bbd4b7f
commit bb1f345e29
10 changed files with 221 additions and 43 deletions
Download patch file Download diff file Expand all files Collapse all files

2
tools/esp8266/defines.h
View file

@ -13,7 +13,7 @@
//------------------------------------- //-------------------------------------
#define VERSION_MAJOR 0 #define VERSION_MAJOR 0
#define VERSION_MINOR 5 #define VERSION_MINOR 5
#define VERSION_PATCH 22 #define VERSION_PATCH 23
//------------------------------------- //-------------------------------------

12
tools/esp8266/html/api.js
View file

@ -8,6 +8,15 @@ function toggle(id, hide) {
elm.classList.remove('hide'); elm.classList.remove('hide');
} }
function toggle(id) {
var e = document.getElementById(id);
if(!e.classList.contains("hide"))
e.classList.add("hide");
else
e.classList.remove('hide');
}
function getAjax(url, ptr, method="GET", json=null) { function getAjax(url, ptr, method="GET", json=null) {
var xhr = new XMLHttpRequest(); var xhr = new XMLHttpRequest();
if(xhr != null) { if(xhr != null) {
@ -98,7 +107,8 @@ function link(dst, text, target=null) {
var a = document.createElement('a'); var a = document.createElement('a');
var t = document.createTextNode(text); var t = document.createTextNode(text);
a.href = dst; a.href = dst;
a.target = target; if(null != target)
a.target = target;
a.appendChild(t); a.appendChild(t);
return a; return a;
} }

40
tools/esp8266/html/index.html
View file

@ -7,9 +7,17 @@
<script type="text/javascript" src="api.js"></script> <script type="text/javascript" src="api.js"></script>
</head> </head>
<body> <body>
<h1>AHOY</h1> <div class="topnav">
<a href="/" class="active">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="content" class="content"> <div id="content" class="content">
<SCRIPT> <script>
function promptFunction() { function promptFunction() {
var Text = prompt("This project was started from https://www.mikrocontroller.net/topic/525778 this discussion.\n\n" + var Text = prompt("This project was started from https://www.mikrocontroller.net/topic/525778 this discussion.\n\n" +
"The Hoymiles protocol was decrypted through the voluntary efforts of many participants. ahoy, among others, was developed based on this work.\n" + "The Hoymiles protocol was decrypted through the voluntary efforts of many participants. ahoy, among others, was developed based on this work.\n" +
@ -21,15 +29,7 @@
return true; return true;
} }
</SCRIPT> </script>
<p>
<a href="/live">Visualization</a><br/>
<br/>
<a href="/setup">Setup</a><br/>
<br/>
<a href="/serial">Webserial & Commands</a><br/>
</p>
<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">
@ -62,10 +62,7 @@
</div> </div>
<div id="footer"> <div id="footer">
<p class="left">&copy 2022</p> <p class="left">&copy 2022</p>
<p class="left"><a href="/update">Update Firmware</a></p>
<p class="right" id="version"></p> <p class="right" id="version"></p>
<p class="right"><a href="/reboot">Reboot</a></p>
<p class="right"><a href="/api">REST API</a></p>
</div> </div>
<script type="text/javascript"> <script type="text/javascript">
var exeOnce = true; var exeOnce = true;
@ -88,6 +85,20 @@
getAjax("/api/setup", apiCb, "POST", JSON.stringify(obj)); getAjax("/api/setup", apiCb, "POST", JSON.stringify(obj));
} }
function topnav() {
toggle("topnav");
}
function parseMenu(obj) {
if(true == exeOnce) {
var e = document.getElementById("topnav");
e.innerHTML = "";
for(var i = 0; i < obj["name"].length; i ++) {
e.appendChild(link(obj["link"][i], obj["name"][i]));
}
}
}
function parseSys(obj) { function parseSys(obj) {
// Disclaimer // Disclaimer
//if(obj["disclaimer"] == false) sessionStorage.setItem("gDisclaimer", promptFunction()); //if(obj["disclaimer"] == false) sessionStorage.setItem("gDisclaimer", promptFunction());
@ -176,6 +187,7 @@
function parse(obj) { function parse(obj) {
if(null != obj) { if(null != obj) {
parseMenu(obj["menu"]);
parseSys(obj["system"]); parseSys(obj["system"]);
parseStat(obj["statistics"]); parseStat(obj["statistics"]);
parseIv(obj["inverter"]); parseIv(obj["inverter"]);

31
tools/esp8266/html/serial.html
View file

@ -7,7 +7,16 @@
<script type="text/javascript" src="api.js"></script> <script type="text/javascript" src="api.js"></script>
</head> </head>
<body> <body>
<h1>Serial Console</h1> <div class="topnav">
<a href="/" class="active">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>
<h2>Serial Console</h2>
<div id="content" class="content"> <div id="content" class="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/>
@ -54,13 +63,24 @@
</div> </div>
<div id="footer"> <div id="footer">
<p class="left">&copy 2022</p> <p class="left">&copy 2022</p>
<p class="left"><a href="/">Home</a></p>
<p class="right" id="version"></p> <p class="right" id="version"></p>
</div> </div>
<script type="text/javascript"> <script type="text/javascript">
var mAutoScroll = true; var mAutoScroll = true;
var con = document.getElementById("serial"); var con = document.getElementById("serial");
var mIntervalSet = false; var exeOnce = true;
function topnav() {
toggle("topnav");
}
function parseMenu(obj) {
var e = document.getElementById("topnav");
e.innerHTML = "";
for(var i = 0; i < obj["name"].length; i ++) {
e.appendChild(link(obj["link"][i], obj["name"][i]));
}
}
function parseSys(obj) { function parseSys(obj) {
var up = obj["ts_uptime"]; var up = obj["ts_uptime"];
@ -73,16 +93,17 @@
+ ("0"+min).substr(-2) + ":" + ("0"+min).substr(-2) + ":"
+ ("0"+sec).substr(-2); + ("0"+sec).substr(-2);
if(false == mIntervalSet) { if(true == exeOnce) {
document.getElementById("version").appendChild( document.getElementById("version").appendChild(
link("https://github.com/lumapu/ahoy/commits/" + obj["build"], "Git SHA: " + obj["build"] + " :: " + obj["version"], "_blank") 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);
mIntervalSet = true; exeOnce = false;
} }
} }
function parse(root) { function parse(root) {
parseMenu(root["menu"]);
select = document.getElementById('InvID'); select = document.getElementById('InvID');
if(null == root) return; if(null == root) return;

28
tools/esp8266/html/setup.html
View file

@ -18,7 +18,15 @@
</script> </script>
</head> </head>
<body onload="load()"> <body onload="load()">
<h1>Setup</h1> <div class="topnav">
<a href="/" class="active">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="setup" class="content"> <div id="setup" class="content">
<div id="content"> <div id="content">
<a class="erase" href="/erase">ERASE SETTINGS (not WiFi)</a> <a class="erase" href="/erase">ERASE SETTINGS (not WiFi)</a>
@ -139,11 +147,9 @@
</div> </div>
</div> </div>
<div id="footer"> <div id="footer">
<p class="left"><a href="/">Home</a></p> <p class="left">&copy 2022</p>
<p class="left"><a href="/update">Update Firmware</a></p>
<p class="right" id="version"></p> <p class="right" id="version"></p>
<p class="right"><a href="/factory">Factory Reset</a></p> <p class="right"><a href="/factory">Factory Reset</a></p>
<p class="right"><a href="/reboot">Reboot</a></p>
</div> </div>
<script type="text/javascript"> <script type="text/javascript">
var highestId = 0; var highestId = 0;
@ -265,6 +271,18 @@
document.getElementsByName(i[0])[0].value = obj[i[1]]; document.getElementsByName(i[0])[0].value = obj[i[1]];
} }
function topnav() {
toggle("topnav");
}
function parseMenu(obj) {
var e = document.getElementById("topnav");
e.innerHTML = "";
for(var i = 0; i < obj["name"].length; i ++) {
e.appendChild(link(obj["link"][i], obj["name"][i]));
}
}
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]];
@ -374,6 +392,7 @@
function parse(root) { function parse(root) {
if(null != root) { if(null != root) {
parseMenu(root["menu"]);
parseSys(root["system"]); parseSys(root["system"]);
parseIv(root["inverter"]); parseIv(root["inverter"]);
parseMqtt(root["mqtt"]); parseMqtt(root["mqtt"]);
@ -383,7 +402,6 @@
parseRadio(root["radio"]); parseRadio(root["radio"]);
parseSerial(root["serial"]); parseSerial(root["serial"]);
} }
getAjax('/api/setup/networks', listNetworks);
window.setInterval("getAjax('/api/setup/networks', listNetworks)", 7000); window.setInterval("getAjax('/api/setup/networks', listNetworks)", 7000);
} }

67
tools/esp8266/html/style.css
View file

@ -1,19 +1,63 @@
h1 {
margin: 0;
padding: 20pt;
font-size: 22pt;
color: #fff;
background-color: #006ec0;
display: block;
text-transform: uppercase;
}
html, body { html, body {
font-family: Arial; font-family: Arial;
margin: 0; margin: 0;
padding: 0; padding: 0;
} }
h2 {
padding-left: 10px;
}
.topnav {
background-color: #333;
position: fixed;
top: 0;
width: 100%;
}
.topnav a {
color: white;
padding: 14px 14px;
text-decoration: none;
font-size: 17px;
display: block;
height: 20px;
}
#topnav a {
color: #fff;
}
.topnav a.icon {
background: #333;
display: block;
position: absolute;
right: 0;
top: 0;
}
.topnav a:hover {
background-color: #006ec0;
color: #000;
}
.active {
background-color: #006ec0;
color: #fff !important;
}
.topnav span {
display: block;
width: 30px;
height: 3px;
margin-bottom: 5px;
position: relative;
background: #fff;
border-radius: 2px;
}
/** old CSS below **/
p { p {
text-align: justify; text-align: justify;
font-size: 13pt; font-size: 13pt;
@ -32,6 +76,7 @@ p.lic, p.lic a {
.s_active, .s_collapsible:hover { .s_active, .s_collapsible:hover {
background-color: #006ec0; background-color: #006ec0;
color: #fff;
} }
.s_content { .s_content {
@ -88,7 +133,7 @@ a.erase {
} }
#content { #content {
padding: 15px 15px 60px 15px; padding: 60px 15px 60px 15px;
} }
#footer { #footer {

33
tools/esp8266/html/update.html
View file

@ -7,7 +7,15 @@
<script type="text/javascript" src="api.js"></script> <script type="text/javascript" src="api.js"></script>
</head> </head>
<body> <body>
<h1>Update</h1> <div class="topnav">
<a href="/" class="active">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="content" class="content"> <div id="content" class="content">
<div> <div>
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/> 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/>
@ -21,17 +29,36 @@
</div> </div>
<div id="footer"> <div id="footer">
<p class="left">&copy 2022</p> <p class="left">&copy 2022</p>
<p class="left"><a href="/">Home</a></p>
<p class="right" id="version"></p> <p class="right" id="version"></p>
</div> </div>
<script type="text/javascript"> <script type="text/javascript">
function topnav() {
toggle("topnav");
}
function parseMenu(obj) {
var e = document.getElementById("topnav");
e.innerHTML = "";
for(var i = 0; i < obj["name"].length; i ++) {
e.appendChild(link(obj["link"][i], obj["name"][i]));
}
}
function parseSys(obj) { function parseSys(obj) {
document.getElementById("version").appendChild( document.getElementById("version").appendChild(
link("https://github.com/lumapu/ahoy/commits/" + obj["build"], "Git SHA: " + obj["build"] + " :: " + obj["version"], "_blank") link("https://github.com/lumapu/ahoy/commits/" + obj["build"], "Git SHA: " + obj["build"] + " :: " + obj["version"], "_blank")
); );
} }
getAjax("/api/system", parseSys); function parse(obj) {
if(null != obj) {
parseMenu(obj["menu"]);
parseSys(obj["system"]);
}
}
getAjax("/api/index", parse);
</script> </script>
</body> </body>
</html> </html>

29
tools/esp8266/html/visualization.html
View file

@ -8,20 +8,42 @@
<script type="text/javascript" src="api.js"></script> <script type="text/javascript" src="api.js"></script>
</head> </head>
<body> <body>
<h1>AHOY</h1> <div class="topnav">
<a href="/" class="active">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="content" class="content"> <div id="content" class="content">
<div id="live"></div> <div id="live"></div>
<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> </div>
<div id="footer"> <div id="footer">
<p class="left">&copy 2022</p> <p class="left">&copy 2022</p>
<p class="left"><a href="/">Home</a></p>
<p class="right" id="version"></p> <p class="right" id="version"></p>
</div> </div>
<script type="text/javascript"> <script type="text/javascript">
var exeOnce = true; var exeOnce = true;
function topnav() {
toggle("topnav");
}
function parseMenu(obj) {
if(true == exeOnce) {
var e = document.getElementById("topnav");
e.innerHTML = "";
for(var i = 0; i < obj["name"].length; i ++) {
e.appendChild(link(obj["link"][i], obj["name"][i]));
}
}
}
function parseSys(obj) { function parseSys(obj) {
if(exeOnce == true) { if(true == exeOnce) {
document.getElementById("version").appendChild( document.getElementById("version").appendChild(
link("https://github.com/lumapu/ahoy/commits/" + obj["build"], "Git SHA: " + obj["build"] + " :: " + obj["version"], "_blank") link("https://github.com/lumapu/ahoy/commits/" + obj["build"], "Git SHA: " + obj["build"] + " :: " + obj["version"], "_blank")
);} );}
@ -111,6 +133,7 @@
function parse(obj) { function parse(obj) {
if(null != obj) { if(null != obj) {
parseMenu(obj["menu"]);
parseSys(obj["system"]); parseSys(obj["system"]);
parseIv(obj["inverter"], obj); parseIv(obj["inverter"], obj);
document.getElementById("refresh").innerHTML = obj["refresh_interval"]; document.getElementById("refresh").innerHTML = obj["refresh_interval"];

21
tools/esp8266/webApi.cpp
View file

@ -48,6 +48,7 @@ void webApi::onApi(AsyncWebServerRequest *request) {
if(path == "system") getSystem(root); if(path == "system") getSystem(root);
else if(path == "statistics") getStatistics(root); else if(path == "statistics") getStatistics(root);
else if(path == "inverter/list") getInverterList(root); else if(path == "inverter/list") getInverterList(root);
else if(path == "menu") getMenu(root);
else if(path == "index") getIndex(root); else if(path == "index") getIndex(root);
else if(path == "setup") getSetup(root); else if(path == "setup") getSetup(root);
else if(path == "setup/networks") getNetworks(root); else if(path == "setup/networks") getNetworks(root);
@ -241,8 +242,26 @@ void webApi::getSerial(JsonObject obj) {
} }
//-----------------------------------------------------------------------------
void webApi::getMenu(JsonObject obj) {
obj["name"][0] = "Live";
obj["link"][0] = "/live";
obj["name"][1] = "Serial Console";
obj["link"][1] = "/serial";
obj["name"][2] = "Setup";
obj["link"][2] = "/setup";
obj["name"][3] = "Update";
obj["link"][3] = "/update";
obj["name"][4] = "REST API";
obj["link"][4] = "/api";
obj["name"][5] = "Reboot";
obj["link"][5] = "/reboot";
}
//----------------------------------------------------------------------------- //-----------------------------------------------------------------------------
void webApi::getIndex(JsonObject obj) { void webApi::getIndex(JsonObject obj) {
getMenu(obj.createNestedObject(F("menu")));
getSystem(obj.createNestedObject(F("system"))); getSystem(obj.createNestedObject(F("system")));
getStatistics(obj.createNestedObject(F("statistics"))); getStatistics(obj.createNestedObject(F("statistics")));
obj["refresh_interval"] = SEND_INTERVAL; obj["refresh_interval"] = SEND_INTERVAL;
@ -281,6 +300,7 @@ void webApi::getIndex(JsonObject obj) {
//----------------------------------------------------------------------------- //-----------------------------------------------------------------------------
void webApi::getSetup(JsonObject obj) { void webApi::getSetup(JsonObject obj) {
getMenu(obj.createNestedObject(F("menu")));
getSystem(obj.createNestedObject(F("system"))); getSystem(obj.createNestedObject(F("system")));
getInverterList(obj.createNestedObject(F("inverter"))); getInverterList(obj.createNestedObject(F("inverter")));
getMqtt(obj.createNestedObject(F("mqtt"))); getMqtt(obj.createNestedObject(F("mqtt")));
@ -300,6 +320,7 @@ void webApi::getNetworks(JsonObject obj) {
//----------------------------------------------------------------------------- //-----------------------------------------------------------------------------
void webApi::getLive(JsonObject obj) { void webApi::getLive(JsonObject obj) {
getMenu(obj.createNestedObject(F("menu")));
getSystem(obj.createNestedObject(F("system"))); getSystem(obj.createNestedObject(F("system")));
JsonArray invArr = obj.createNestedArray(F("inverter")); JsonArray invArr = obj.createNestedArray(F("inverter"));
obj["refresh_interval"] = SEND_INTERVAL; obj["refresh_interval"] = SEND_INTERVAL;

1
tools/esp8266/webApi.h
View file

@ -42,6 +42,7 @@ class webApi {
void getRadio(JsonObject obj); void getRadio(JsonObject obj);
void getSerial(JsonObject obj); void getSerial(JsonObject obj);
void getMenu(JsonObject obj);
void getIndex(JsonObject obj); void getIndex(JsonObject obj);
void getSetup(JsonObject obj); void getSetup(JsonObject obj);
void getNetworks(JsonObject obj); void getNetworks(JsonObject obj);