implemented highlighting active nav entry
This commit is contained in:
parent
bafb623392
commit
1765748422
5 changed files with 54 additions and 21 deletions
|
@ -30,6 +30,10 @@
|
||||||
|
|
||||||
#include "Common_HTML.h"
|
#include "Common_HTML.h"
|
||||||
|
|
||||||
|
/*
|
||||||
|
* TestHeaderFooter - checks if the given var from the webserver processor
|
||||||
|
* is actual a template variable from header or footer.
|
||||||
|
*/
|
||||||
bool TestHeaderFooter(const String& var) {
|
bool TestHeaderFooter(const String& var) {
|
||||||
#ifdef DEBUG
|
#ifdef DEBUG
|
||||||
Serial.print(":: [Webserver:Page:root:proc:hf] var: ");
|
Serial.print(":: [Webserver:Page:root:proc:hf] var: ");
|
||||||
|
@ -37,20 +41,40 @@ bool TestHeaderFooter(const String& var) {
|
||||||
#endif
|
#endif
|
||||||
|
|
||||||
if(
|
if(
|
||||||
(var == "HEADER") ||
|
(var == "HEADER") ||
|
||||||
(var == "FOOTER") ||
|
(var == "FOOTER") ||
|
||||||
(var == "CGVER") ||
|
(var == "CGVER") ||
|
||||||
(var == "CGBUILD") ||
|
(var == "CGBUILD") ||
|
||||||
(var == "GROWNAME") ||
|
(var == "GROWNAME") ||
|
||||||
(var == "CANGROW_CSS") ||
|
(var == "CANGROW_CSS") ||
|
||||||
(var == "NEED_RESTART")) {
|
(var == "NEED_RESTART") ||
|
||||||
|
(var == "ACTIVE_NAV_GROW") ||
|
||||||
|
(var == "ACTIVE_NAV_SYSTEM") ||
|
||||||
|
(var == "ACTIVE_NAV_WIFI") ||
|
||||||
|
(var == "ACTIVE_NAV_HELP") ||
|
||||||
|
(var == "PLACEHOLDER")) {
|
||||||
return true;
|
return true;
|
||||||
} else {
|
} else {
|
||||||
return false;
|
return false;
|
||||||
}
|
}
|
||||||
}
|
}
|
||||||
|
|
||||||
String AddHeaderFooter(const String& var) {
|
|
||||||
|
/*
|
||||||
|
* AddHeaderFooter - processor for header and footer template variables
|
||||||
|
*
|
||||||
|
* String& var:
|
||||||
|
* the string we receive from the processor is the actual
|
||||||
|
* variable name we replace here.
|
||||||
|
* byte activeNav:
|
||||||
|
* contains the number representing which page is active
|
||||||
|
* 1 - grow settings
|
||||||
|
* 2 - system settings
|
||||||
|
* 3 - wifi settings
|
||||||
|
* 4 - help page
|
||||||
|
*/
|
||||||
|
String AddHeaderFooter(const String& var, byte activeNav = 0) {
|
||||||
|
String activeNav_ClassName = "activeNav";
|
||||||
if(var == "HEADER") {
|
if(var == "HEADER") {
|
||||||
return String(Header_HTML);
|
return String(Header_HTML);
|
||||||
} else if(var == "FOOTER") {
|
} else if(var == "FOOTER") {
|
||||||
|
@ -63,12 +87,21 @@ String AddHeaderFooter(const String& var) {
|
||||||
return String(config.grow.growName);
|
return String(config.grow.growName);
|
||||||
} else if(var == "CANGROW_CSS") {
|
} else if(var == "CANGROW_CSS") {
|
||||||
return String(File_cangrow_CSS);
|
return String(File_cangrow_CSS);
|
||||||
|
} else if((var == "ACTIVE_NAV_GROW") && (activeNav == 1)) {
|
||||||
|
return activeNav_ClassName;
|
||||||
|
} else if((var == "ACTIVE_NAV_SYSTEM") && (activeNav == 2)) {
|
||||||
|
return activeNav_ClassName;
|
||||||
|
} else if((var == "ACTIVE_NAV_WIFI") && (activeNav == 3)) {
|
||||||
|
return activeNav_ClassName;
|
||||||
|
} else if((var == "ACTIVE_NAV_HELP") && (activeNav == 4)) {
|
||||||
|
return activeNav_ClassName;
|
||||||
} else if(var == "NEED_RESTART") {
|
} else if(var == "NEED_RESTART") {
|
||||||
if(needRestart == true) {
|
if(needRestart == true) {
|
||||||
return String(Common_HTML_NEED_RESTART);
|
return String(Common_HTML_NEED_RESTART);
|
||||||
} else {
|
} else {
|
||||||
return String();
|
return String();
|
||||||
}
|
}
|
||||||
|
|
||||||
} else {
|
} else {
|
||||||
return String();
|
return String();
|
||||||
}
|
}
|
||||||
|
|
|
@ -137,7 +137,7 @@ a:active {
|
||||||
}
|
}
|
||||||
|
|
||||||
.subnav li {
|
.subnav li {
|
||||||
/*background: #026b45;*/
|
background: #262B27;
|
||||||
list-style: none;
|
list-style: none;
|
||||||
border-radius: 3px;
|
border-radius: 3px;
|
||||||
margin-bottom: 3px;
|
margin-bottom: 3px;
|
||||||
|
@ -163,7 +163,7 @@ a:active {
|
||||||
padding: 5px 10px;
|
padding: 5px 10px;
|
||||||
}
|
}
|
||||||
|
|
||||||
.nav li a:hover, .subnav li a:hover, .activeMenu, .button:link:hover, .button:visited:hover, input[type=button]:hover, input[type=submit]:hover, input[type=reset]:hover {
|
.nav li a:hover, .subnav li a:hover, .activeNav, .button:link:hover, .button:visited:hover, input[type=button]:hover, input[type=submit]:hover, input[type=reset]:hover {
|
||||||
background: #04AA6D;
|
background: #04AA6D;
|
||||||
color: #fff;
|
color: #fff;
|
||||||
border-radius: 3px;
|
border-radius: 3px;
|
||||||
|
@ -174,11 +174,11 @@ a:active {
|
||||||
color: #cae0d0;
|
color: #cae0d0;
|
||||||
}
|
}
|
||||||
|
|
||||||
.activeMenu {
|
.activeNav {
|
||||||
background: #444;
|
background: #444;
|
||||||
}
|
}
|
||||||
|
|
||||||
.MenuTime {
|
.navTime {
|
||||||
background: #292929;
|
background: #292929;
|
||||||
}
|
}
|
||||||
|
|
||||||
|
|
|
@ -40,11 +40,11 @@ const char* Header_HTML PROGMEM = R"(<!DOCTYPE html>
|
||||||
</head>
|
</head>
|
||||||
<body>
|
<body>
|
||||||
<ul class='nav'><li><a href='/'>🌱 %GROWNAME%</a></li>
|
<ul class='nav'><li><a href='/'>🌱 %GROWNAME%</a></li>
|
||||||
<li><a href='/grow/' >🔆 Grow settings</a></li>
|
<li><a class='%ACTIVE_NAV_GROW%' href='/grow/' >🔆 Grow settings</a></li>
|
||||||
<li><a href='/system/' >⚙ System settings</a></li>
|
<li><a class='%ACTIVE_NAV_SYSTEM%' href='/system/' >⚙ System settings</a></li>
|
||||||
<li><a href='/wifi/' >📡 WiFi settings</a></li>
|
<li><a class='%ACTIVE_NAV_WIFI%' href='/wifi/' >📡 WiFi settings</a></li>
|
||||||
<li><a href='/help' >❓ Help</a></li>
|
<li><a class='%ACTIVE_NAV_HELP%' href='/help' >❓ Help</a></li>
|
||||||
<li><span class='MenuTime'>05:01:40</span></li>
|
<li><span class='navTime'>04:20:23</span></li>
|
||||||
<li><a href='https://git.la10cy.net/DeltaLima/CanGrow' target='_blank'>CanGrow v%CGVER%</a></li>
|
<li><a href='https://git.la10cy.net/DeltaLima/CanGrow' target='_blank'>CanGrow v%CGVER%</a></li>
|
||||||
</ul>
|
</ul>
|
||||||
<div class='center'>
|
<div class='center'>
|
||||||
|
|
|
@ -38,7 +38,7 @@
|
||||||
// https://techtutorialsx.com/2018/07/23/esp32-arduino-http-server-template-processing-with-multiple-placeholders/
|
// https://techtutorialsx.com/2018/07/23/esp32-arduino-http-server-template-processing-with-multiple-placeholders/
|
||||||
String Proc_WebPage_system(const String& var) {
|
String Proc_WebPage_system(const String& var) {
|
||||||
if(TestHeaderFooter(var)) {
|
if(TestHeaderFooter(var)) {
|
||||||
return AddHeaderFooter(var);
|
return AddHeaderFooter(var, 2);
|
||||||
} else if(var == "SUBNAV") {
|
} else if(var == "SUBNAV") {
|
||||||
return String(Page_system_HTML_SUBNAV);
|
return String(Page_system_HTML_SUBNAV);
|
||||||
} else {
|
} else {
|
||||||
|
@ -99,7 +99,7 @@ void WebPage_system(AsyncWebServerRequest *request) {
|
||||||
*/
|
*/
|
||||||
String Proc_WebPage_system_restart(const String& var) {
|
String Proc_WebPage_system_restart(const String& var) {
|
||||||
if(TestHeaderFooter(var)) {
|
if(TestHeaderFooter(var)) {
|
||||||
return AddHeaderFooter(var);
|
return AddHeaderFooter(var, 2);
|
||||||
} else if(var == "SUBNAV") {
|
} else if(var == "SUBNAV") {
|
||||||
return String(Page_system_HTML_SUBNAV);
|
return String(Page_system_HTML_SUBNAV);
|
||||||
} else if(var == "RESTART_MSG") {
|
} else if(var == "RESTART_MSG") {
|
||||||
|
@ -173,7 +173,7 @@ void WebPage_system_update_ApplyUpdate(AsyncWebServerRequest *request, String fi
|
||||||
|
|
||||||
String Proc_WebPage_system_update(const String& var) {
|
String Proc_WebPage_system_update(const String& var) {
|
||||||
if(TestHeaderFooter(var)) {
|
if(TestHeaderFooter(var)) {
|
||||||
return AddHeaderFooter(var);
|
return AddHeaderFooter(var, 2);
|
||||||
} else if(var == "SUBNAV") {
|
} else if(var == "SUBNAV") {
|
||||||
return String(Page_system_HTML_SUBNAV);
|
return String(Page_system_HTML_SUBNAV);
|
||||||
} else {
|
} else {
|
||||||
|
|
|
@ -55,7 +55,7 @@ String WebPage_wifi_ScanNetworks() {
|
||||||
// https://techtutorialsx.com/2018/07/23/esp32-arduino-http-server-template-processing-with-multiple-placeholders/
|
// https://techtutorialsx.com/2018/07/23/esp32-arduino-http-server-template-processing-with-multiple-placeholders/
|
||||||
String Proc_WebPage_wifi(const String& var) {
|
String Proc_WebPage_wifi(const String& var) {
|
||||||
if(TestHeaderFooter(var)) {
|
if(TestHeaderFooter(var)) {
|
||||||
return AddHeaderFooter(var);
|
return AddHeaderFooter(var, 3);
|
||||||
//CURRENT_SETTINGS
|
//CURRENT_SETTINGS
|
||||||
} else if(var == "CURRENT_SETTINGS") {
|
} else if(var == "CURRENT_SETTINGS") {
|
||||||
if(strlen(config.wifi.ssid) > 0) {
|
if(strlen(config.wifi.ssid) > 0) {
|
||||||
|
|
Loading…
Reference in a new issue