topaLE
/
ahoy
mirror of https://github.com/lumapu/ahoy.git
1
0
Fork 0
Code Issues Projects Releases Wiki Activity
Browse Source

added central menu

pull/372/head
lumapu 2 years ago
parent
0f0bbd4b7f
commit
bb1f345e29
10 changed files with 220 additions and 42 deletions
Whitespace
Show all changes Ignore whitespace when comparing lines Ignore changes in amount of whitespace Ignore changes in whitespace at EOL
Split View
Diff Options
Show Stats Download Patch File Download Diff File
  1. 2
      tools/esp8266/defines.h
  2. 12
      tools/esp8266/html/api.js
  3. 40
      tools/esp8266/html/index.html
  4. 31
      tools/esp8266/html/serial.html
  5. 28
      tools/esp8266/html/setup.html
  6. 65
      tools/esp8266/html/style.css
  7. 33
      tools/esp8266/html/update.html
  8. 29
      tools/esp8266/html/visualization.html
  9. 21
      tools/esp8266/webApi.cpp
  10. 1
      tools/esp8266/webApi.h

2
tools/esp8266/defines.h
View File

@ -13,7 +13,7 @@
//-------------------------------------
#define VERSION_MAJOR 0
#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');
}
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) {
var xhr = new XMLHttpRequest();
if(xhr != null) {
@ -98,7 +107,8 @@ function link(dst, text, target=null) {
var a = document.createElement('a');
var t = document.createTextNode(text);
a.href = dst;
a.target = target;
if(null != target)
a.target = target;
a.appendChild(t);
return a;
}

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

@ -7,9 +7,17 @@
<script type="text/javascript" src="api.js"></script>
</head>
<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">
<SCRIPT>
<script>
function promptFunction() {
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" +
@ -21,15 +29,7 @@
return true;
}
</SCRIPT>
<p>
<a href="/live">Visualization</a><br/>
<br/>
<a href="/setup">Setup</a><br/>
<br/>
<a href="/serial">Webserial & Commands</a><br/>
</p>
</script>
<p><span class="des">Uptime: </span><span id="uptime"></span></p>
<p><span class="des">ESP-Time: </span><span id="date"></span></p>
<div id="sun">
@ -62,10 +62,7 @@
</div>
<div id="footer">
<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"><a href="/reboot">Reboot</a></p>
<p class="right"><a href="/api">REST API</a></p>
</div>
<script type="text/javascript">
var exeOnce = true;
@ -88,6 +85,20 @@
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) {
// Disclaimer
//if(obj["disclaimer"] == false) sessionStorage.setItem("gDisclaimer", promptFunction());
@ -176,6 +187,7 @@
function parse(obj) {
if(null != obj) {
parseMenu(obj["menu"]);
parseSys(obj["system"]);
parseStat(obj["statistics"]);
parseIv(obj["inverter"]);

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

@ -7,7 +7,16 @@
<script type="text/javascript" src="api.js"></script>
</head>
<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 class="serial">
<textarea id="serial" cols="80" rows="20" readonly></textarea><br/>
@ -54,13 +63,24 @@
</div>
<div id="footer">
<p class="left">&copy 2022</p>
<p class="left"><a href="/">Home</a></p>
<p class="right" id="version"></p>
</div>
<script type="text/javascript">
var mAutoScroll = true;
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) {
var up = obj["ts_uptime"];
@ -73,16 +93,17 @@
+ ("0"+min).substr(-2) + ":"
+ ("0"+sec).substr(-2);
if(false == mIntervalSet) {
if(true == exeOnce) {
document.getElementById("version").appendChild(
link("https://github.com/lumapu/ahoy/commits/" + obj["build"], "Git SHA: " + obj["build"] + " :: " + obj["version"], "_blank")
);
window.setInterval("getAjax('/api/system', parseSys)", 10000);
mIntervalSet = true;
exeOnce = false;
}
}
function parse(root) {
parseMenu(root["menu"]);
select = document.getElementById('InvID');
if(null == root) return;

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

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

65
tools/esp8266/html/style.css
View File

@ -1,19 +1,63 @@
h1 {
html, body {
font-family: Arial;
margin: 0;
padding: 20pt;
font-size: 22pt;
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;
background-color: #006ec0;
}
.topnav a.icon {
background: #333;
display: block;
text-transform: uppercase;
position: absolute;
right: 0;
top: 0;
}
html, body {
font-family: Arial;
margin: 0;
padding: 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 {
text-align: justify;
font-size: 13pt;
@ -32,6 +76,7 @@ p.lic, p.lic a {
.s_active, .s_collapsible:hover {
background-color: #006ec0;
color: #fff;
}
.s_content {
@ -88,7 +133,7 @@ a.erase {
}
#content {
padding: 15px 15px 60px 15px;
padding: 60px 15px 60px 15px;
}
#footer {

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

@ -7,7 +7,15 @@
<script type="text/javascript" src="api.js"></script>
</head>
<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>
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 id="footer">
<p class="left">&copy 2022</p>
<p class="left"><a href="/">Home</a></p>
<p class="right" id="version"></p>
</div>
<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) {
document.getElementById("version").appendChild(
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>
</body>
</html>

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

@ -8,20 +8,42 @@
<script type="text/javascript" src="api.js"></script>
</head>
<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="live"></div>
<p>Every <span id="refresh"></span> seconds the values are updated</p>
</div>
<div id="footer">
<p class="left">&copy 2022</p>
<p class="left"><a href="/">Home</a></p>
<p class="right" id="version"></p>
</div>
<script type="text/javascript">
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) {
if(exeOnce == true) {
if(true == exeOnce) {
document.getElementById("version").appendChild(
link("https://github.com/lumapu/ahoy/commits/" + obj["build"], "Git SHA: " + obj["build"] + " :: " + obj["version"], "_blank")
);}
@ -111,6 +133,7 @@
function parse(obj) {
if(null != obj) {
parseMenu(obj["menu"]);
parseSys(obj["system"]);
parseIv(obj["inverter"], obj);
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);
else if(path == "statistics") getStatistics(root);
else if(path == "inverter/list") getInverterList(root);
else if(path == "menu") getMenu(root);
else if(path == "index") getIndex(root);
else if(path == "setup") getSetup(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) {
getMenu(obj.createNestedObject(F("menu")));
getSystem(obj.createNestedObject(F("system")));
getStatistics(obj.createNestedObject(F("statistics")));
obj["refresh_interval"] = SEND_INTERVAL;
@ -281,6 +300,7 @@ void webApi::getIndex(JsonObject obj) {
//-----------------------------------------------------------------------------
void webApi::getSetup(JsonObject obj) {
getMenu(obj.createNestedObject(F("menu")));
getSystem(obj.createNestedObject(F("system")));
getInverterList(obj.createNestedObject(F("inverter")));
getMqtt(obj.createNestedObject(F("mqtt")));
@ -300,6 +320,7 @@ void webApi::getNetworks(JsonObject obj) {
//-----------------------------------------------------------------------------
void webApi::getLive(JsonObject obj) {
getMenu(obj.createNestedObject(F("menu")));
getSystem(obj.createNestedObject(F("system")));
JsonArray invArr = obj.createNestedArray(F("inverter"));
obj["refresh_interval"] = SEND_INTERVAL;

1
tools/esp8266/webApi.h
View File

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

Write Preview
Loading…
Cancel
Save