firmware wip - returnHTMLfooter is now returnHTMLheader, so i can avoid using javascript :)

This commit is contained in:
Marcus 2024-04-30 20:52:19 +02:00
parent 0f8ff91d37
commit 651eb6b847

View file

@ -172,13 +172,16 @@ ESP8266WebServer webserver(80);
*/ */
// Template: const char HTMLexamplepage[] PROGMEM = R"EOF()EOF"; // Template: const char HTMLexamplepage[] PROGMEM = R"EOF()EOF";
const char HTMLheader[] PROGMEM = R"EOF( const char HTMLheaderP1[] PROGMEM = R"EOF(
<!DOCTYPE html> <!DOCTYPE html>
<html> <html>
<head> <head>
<meta charset='UTF-8'> <meta charset='UTF-8'>
<meta name='viewport' content='width=device-width, initial-scale=1.0'> <meta name='viewport' content='width=device-width, initial-scale=1.0'>
<title>CanGrow</title> <title>)EOF";
// page title
const char HTMLheaderP2[] PROGMEM = R"EOF(
</title>
<!-- <link rel='stylesheet' href='/style.css'> --> <!-- <link rel='stylesheet' href='/style.css'> -->
<style> <style>
/* Having the whole CSS here ensures it's all the time present*/ /* Having the whole CSS here ensures it's all the time present*/
@ -285,29 +288,11 @@ const char HTMLheader[] PROGMEM = R"EOF(
background: #292929; background: #292929;
} }
</style> </style>
<script>
function highlightActiveMenu(menuEntry) {
document.getElementById(menuEntry).classList.add('activeMenu');
}
function replaceStr(dst, content) {
document.getElementById(dst).innerHTML = content;
}
</script>
</head> </head>
<body> <body>
<ul class='nav'> <ul class='nav'>)EOF";
<li><a id='MenuGrowName' href='/'>&#x1F331; CanGrow</a></li> // Menu as unordered List, defined in returnHTMLheader
<li><a id='MgrowSettings' href='/growSettings'>Grow settings</a></li>
<li><a id='MsystemSettings' href='/systemSettings'>System settings</a></li>
<li><a id='MwifiSettings' href='/wifiSettings'>WiFi settings</a></li>
<li><a id='Mhelp' href='/help'>Help</a></li>
<li><span id='MenuTime' class='MenuTime'></span></li>
<li><a id='CanGrowVer' href='https://git.la10cy.net/DeltaLima/CanGrow' target='_blank'>CanGrow</a></li>
</ul>
<div class='center'>
)EOF";
const char HTMLfooter[] PROGMEM = R"EOF( const char HTMLfooter[] PROGMEM = R"EOF(
</div> </div>
@ -1286,79 +1271,72 @@ void WebHandler() {
String returnHTMLheader(String MenuEntry = "") { String returnHTMLheader(String MenuEntry = "") {
String header; String header;
header += FPSTR(HTMLheader); String activeMenu = "class='activeMenu'";
// add first part of the header
header += FPSTR(HTMLheaderP1);
// check if GrowName was set. if yes, its part of the page title.
if(strlen(GrowName) > 0) {
header += "Cangrow - ";
header += GrowName;
} else {
header += "Cangrow";
}
header += FPSTR(HTMLheaderP2);
// first menu entry
header += "<li><a href='/'>&#x1F331; ";
if(strlen(GrowName) > 0) {
header += GrowName;
} else {
header += "CanGrow";
}
header += "</a></li>\n";
// second menu entry
header += "<li><a href='/growSettings' ";
if(MenuEntry == "growSettings") {
header += activeMenu;
}
header += ">Grow settings</a></li>\n";
// print actual time in header // third menu entry
//~ footer += "<script>replaceStr('CanGrowVer', 'CanGrow v"; header += "<li><a href='/systemSettings' ";
//~ footer += CanGrowVer; if(MenuEntry == "systemSettings") {
//~ footer += "');\n"; header += activeMenu;
//~ footer += "replaceStr('MenuTime', '"; }
//~ footer += timeClient.getFormattedTime(); header += ">System settings</a></li>\n";
//~ footer += "');\n";
//~ footer += "highlightActiveMenu('M";
//~ footer += MenuEntry;
//~ footer += "');";
//~ footer += "</script>";
//~ // show the GrowName in the menu if set // fourth menu entry
//~ if(strlen(GrowName) > 0){ header += "<li><a href='/wifiSettings' ";
if(MenuEntry == "wifiSettings") {
header += activeMenu;
}
header += ">WiFi settings</a></li>\n";
// fifth menu entry
header += "<li><a href='/help' ";
if(MenuEntry == "help") {
header += activeMenu;
}
header += ">Help</a></li>\n";
//~ footer += "<script>replaceStr('MenuGrowName', '&#x1F331; "; // sixth menu entry
//~ footer += GrowName; header += "<li><span class='MenuTime'>";
//~ footer += "');\n"; header += timeClient.getFormattedTime();
//~ // include the GrowName in the title header += "</span></li>\n";
//~ footer += "document.title = 'CanGrow - ";
//~ footer += GrowName;
//~ footer += "';";
//~ footer += "</script>";
//~ }
//~ footer += FPSTR(HTMLfooter); // seventh menu entry
header += "<li><a href='https://git.la10cy.net/DeltaLima/CanGrow' target='_blank'>CanGrow v";
header += CanGrowVer;
header += "</a></li>\n";
// close <ul> and start <div>
header += "</ul><div class='center'>";
return header; return header;
} }
// returns footer with javascript stuff
String returnHTMLfooter(String MenuEntry = "") {
String footer;
// print actual time in header
footer += "<script>replaceStr('CanGrowVer', 'CanGrow v";
footer += CanGrowVer;
footer += "');\n";
footer += "replaceStr('MenuTime', '";
footer += timeClient.getFormattedTime();
footer += "');\n";
footer += "highlightActiveMenu('M";
footer += MenuEntry;
footer += "');";
footer += "</script>";
// show the GrowName in the menu if set
if(strlen(GrowName) > 0){
footer += "<script>replaceStr('MenuGrowName', '&#x1F331; ";
footer += GrowName;
footer += "');\n";
// include the GrowName in the title
footer += "document.title = 'CanGrow - ";
footer += GrowName;
footer += "';";
footer += "</script>";
}
footer += FPSTR(HTMLfooter);
return footer;
}
/* /*
* returnSelected(bool) * returnSelected(bool)
* returns char[] "selected" if bool is true * returns char[] "selected" if bool is true
@ -1407,14 +1385,14 @@ String returnStrDateFromEpoch(unsigned long epochTime) {
} }
void SysRestart() { void SysRestart() {
String body = FPSTR(HTMLheader); String body = returnHTMLheader();
// TODO only debug and development solution, remove this later // TODO only debug and development solution, remove this later
if( (webserver.hasArg("confirmed")) || (NeedRestart == true) ) { if( (webserver.hasArg("confirmed")) || (NeedRestart == true) ) {
body += "<h1>Restarting</h1>"; body += "<h1>Restarting</h1>";
body += "<div class='infomsg'>After restart CanGrow will be connected to WiFi SSID<br><b>"; body += "<div class='infomsg'>After restart CanGrow will be connected to WiFi SSID<br><b>";
body += WIFIssid; body += WIFIssid;
body += "</b><br>You get its IP-Address from the display or serial console.</div>"; body += "</b><br>You get its IP-Address from the display or serial console.</div>";
body += returnHTMLfooter(); body += FPSTR(HTMLfooter);
webserver.send(200, "text/html", body); webserver.send(200, "text/html", body);
Serial.println("Restarting... see you soon space cowboy!"); Serial.println("Restarting... see you soon space cowboy!");
delay(1000); delay(1000);
@ -1425,17 +1403,17 @@ void SysRestart() {
body += "<br>Please confirm."; body += "<br>Please confirm.";
body += "<form action='/system/restart'><input type='hidden' name='confirmed' value='true' /><input type='submit' value='Confirm restart' /></form>"; body += "<form action='/system/restart'><input type='hidden' name='confirmed' value='true' /><input type='submit' value='Confirm restart' /></form>";
body += "</div>"; body += "</div>";
body += returnHTMLfooter(); body += FPSTR(HTMLfooter);
webserver.send(200, "text/html", body); webserver.send(200, "text/html", body);
} }
} }
void SysWipe() { void SysWipe() {
String body = FPSTR(HTMLheader); String body = returnHTMLheader();
// TODO only debug and development solution, remove this later // TODO only debug and development solution, remove this later
if(webserver.hasArg("confirmed")) { if(webserver.hasArg("confirmed")) {
body += "<div class='warnmsg'><h2>!! Wiping CanGrow's EEPROM !!</h2><br>Device will restart in a few seconds.</div>"; body += "<div class='warnmsg'><h2>!! Wiping CanGrow's EEPROM !!</h2><br>Device will restart in a few seconds.</div>";
body += returnHTMLfooter(); body += FPSTR(HTMLfooter);
webserver.send(200, "text/html", body); webserver.send(200, "text/html", body);
wipeEEPROM(); wipeEEPROM();
} else { } else {
@ -1444,7 +1422,7 @@ void SysWipe() {
body += "<br>Please confirm wiping the EEPROM"; body += "<br>Please confirm wiping the EEPROM";
body += "<form action='/system/wipe'><input type='hidden' name='confirmed' value='true' /><input type='submit' value='Confirm wiping' /></form>"; body += "<form action='/system/wipe'><input type='hidden' name='confirmed' value='true' /><input type='submit' value='Confirm wiping' /></form>";
body += "</div>"; body += "</div>";
body += returnHTMLfooter(); body += FPSTR(HTMLfooter);
webserver.send(200, "text/html", body); webserver.send(200, "text/html", body);
} }
} }
@ -1488,14 +1466,14 @@ void SysWipe() {
*/ */
void WEB404() { void WEB404() {
String body = FPSTR(HTMLheader); String body = returnHTMLheader();
body += "<div class='warnmsg'><h1>404 - not found</h1></div>"; body += "<div class='warnmsg'><h1>404 - not found</h1></div>";
body += returnHTMLfooter(); body += FPSTR(HTMLfooter);
webserver.send(404, "text/html", body); webserver.send(404, "text/html", body);
} }
void WEBlogout() { void WEBlogout() {
String body = FPSTR(HTMLheader); String body = returnHTMLheader();
body += "<h1>you are logged out.</h1>"; body += "<h1>you are logged out.</h1>";
body += FPSTR(HTMLfooter); body += FPSTR(HTMLfooter);
@ -1504,9 +1482,9 @@ void WEBlogout() {
} }
void WEBhelp() { void WEBhelp() {
String body = FPSTR(HTMLheader); String body = returnHTMLheader("help");
body += FPSTR(HTMLhelp); body += FPSTR(HTMLhelp);
body += returnHTMLfooter("help"); body += FPSTR(HTMLfooter);
webserver.send(200, "text/html", body); webserver.send(200, "text/html", body);
} }
@ -1525,7 +1503,7 @@ void WEBroot() {
webserver.sendHeader("Location", String("/growSettings"), true); webserver.sendHeader("Location", String("/growSettings"), true);
webserver.send(302, "text/plain", "please configure growSettings first"); webserver.send(302, "text/plain", "please configure growSettings first");
} else { } else {
String body = FPSTR(HTMLheader); String body = returnHTMLheader();
body += "<h1>&#x1F331; "; body += "<h1>&#x1F331; ";
body += GrowName; body += GrowName;
@ -1586,7 +1564,7 @@ void WEBroot() {
body += returnHTMLfooter(); body += FPSTR(HTMLfooter);
webserver.send(200, "text/html", body); webserver.send(200, "text/html", body);
} }
@ -1598,7 +1576,7 @@ void WEBroot() {
void WEBwifiSettings() { void WEBwifiSettings() {
byte ssidsAvail = WiFi.scanNetworks(); byte ssidsAvail = WiFi.scanNetworks();
String body = FPSTR(HTMLheader); String body = returnHTMLheader("wifiSettings");
if(FirstRun == true) { if(FirstRun == true) {
body += "<h1>Welcome!</h1>"; body += "<h1>Welcome!</h1>";
body += "<p>CanGrow is actually unconfigured. You need to Setup your WiFi first down below.<br>"; body += "<p>CanGrow is actually unconfigured. You need to Setup your WiFi first down below.<br>";
@ -1657,7 +1635,7 @@ void WEBwifiSettings() {
body += "DNS: <input type='text' name='WIFIdns'><br>\n"; body += "DNS: <input type='text' name='WIFIdns'><br>\n";
body += "<input type='submit' value='Save'>\n"; body += "<input type='submit' value='Save'>\n";
body += "</form>\n"; body += "</form>\n";
body += returnHTMLfooter("wifiSettings"); body += FPSTR(HTMLfooter);
webserver.send(200, "text/html", body); webserver.send(200, "text/html", body);
} }
@ -1669,7 +1647,7 @@ void WEBsystemSettings() {
webserver.send(302, "text/plain", "please configure wifiSettings first"); webserver.send(302, "text/plain", "please configure wifiSettings first");
} else { } else {
String body = FPSTR(HTMLheader); String body = returnHTMLheader("systemSettings");
if(configured == false) { if(configured == false) {
body += "<h1>Step 2: System settings</h1>"; body += "<h1>Step 2: System settings</h1>";
@ -1752,7 +1730,7 @@ void WEBsystemSettings() {
body += "<input type='submit' value='Save'>\n"; body += "<input type='submit' value='Save'>\n";
body += "</form>\n"; body += "</form>\n";
body += returnHTMLfooter("systemSettings"); body += FPSTR(HTMLfooter);
webserver.send(200, "text/html", body); webserver.send(200, "text/html", body);
} }
@ -1768,7 +1746,7 @@ void WEBgrowSettings() {
webserver.send(302, "text/plain", "please configure systemSettings first"); webserver.send(302, "text/plain", "please configure systemSettings first");
} else { } else {
String body = FPSTR(HTMLheader); String body = returnHTMLheader("growSettings");
if(strlen(GrowName) < 1) { if(strlen(GrowName) < 1) {
body += "<h1>Final step: Grow settings</h1>"; body += "<h1>Final step: Grow settings</h1>";
@ -1852,7 +1830,7 @@ void WEBgrowSettings() {
body += "<input type='submit' value='Save'>\n"; body += "<input type='submit' value='Save'>\n";
body += "</form>\n"; body += "</form>\n";
body += FPSTR(JSconvertDateToEpoch); body += FPSTR(JSconvertDateToEpoch);
body += returnHTMLfooter("growSettings"); body += FPSTR(HTMLfooter);
webserver.send(200, "text/html", body); webserver.send(200, "text/html", body);
} }
@ -2173,8 +2151,6 @@ void APIgetSensors() {
* TODO LIST / NOTES * TODO LIST / NOTES
* *
* *
* - avoid using javascript to set the GrowName in the Menu and the time
* as well
* - when PWM for fan is set, set fan speed to regulate humidity and * - when PWM for fan is set, set fan speed to regulate humidity and
* temperature * temperature
* - re-organize EEPROM saved values. * - re-organize EEPROM saved values.