6.5.0.5 Add compile time GUI color options

6.5.0.5 20190406
 * Add compile time GUI color options (#5586)
This commit is contained in:
Theo Arends 2019-04-06 18:25:26 +02:00
parent 756400de19
commit 43a61b3e24
5 changed files with 98 additions and 19 deletions

View File

@ -1,4 +1,7 @@
/* 6.5.0.4 20190402
/* 6.5.0.5 20190406
* Add compile time GUI color options (#5586)
*
* 6.5.0.4 20190402
* Fix Configure Timer Web GUI (#5568)
* Add validation check when loading settings from flash
* Fixed Display Bug in KNX webmenu for Physical Address

View File

@ -257,6 +257,32 @@
#define WEB_USERNAME "admin" // Web server Admin mode user name
#define USE_EMULATION // Enable Belkin WeMo and Hue Bridge emulation for Alexa (+16k code, +2k mem)
// Black text on white/greyish background (default)
#define COLOR_TEXT "#000" // Global text color - Black
#define COLOR_BACKGROUND "#fff" // Global background color - White
#define COLOR_FORM "#f2f2f2" // Form background color - Greyish
// White text on black/greyish background (alternative)
// #define COLOR_TEXT "#fff" // Global text color - White
// #define COLOR_BACKGROUND "#000" // Global background color - Black
// #define COLOR_FORM "#4f4f4f" // Form background color - Greyish
#define COLOR_TEXT_WARNING "red" // Warning text color - Red
#define COLOR_TEXT_SUCCESS "green" // Success text color - Green
#define COLOR_BUTTON_TEXT "#fff" // Button text color - White
#define COLOR_BUTTON "#1fa3ec" // Button color - Blueish
#define COLOR_BUTTON_HOVER "#0e70a4" // Button color when hovered over - Darker blueish
#define COLOR_BUTTON_RESET "#d43535" // Restart/Reset/Delete button color - Redish
#define COLOR_BUTTON_RESET_HOVER "#931f1f" // Restart/Reset/Delete button color when hovered over - Darker redish
#define COLOR_BUTTON_SAVE "#47c266" // Save button color - Greenish
#define COLOR_BUTTON_SAVE_HOVER "#5aaf6f" // Save button color when hovered over - Darker greenish
#define COLOR_TIMER_TAB_TEXT "#fff" // Config timer tab text color - White
#define COLOR_TIMER_TAB_BACKGROUND "#999" // Config timer tab background color - Light grey
#define COLOR_TIMER_ACTIVE_TAB_TEXT "#000" // Config timer active tab text color - Black
#define COLOR_TIMER_ACTIVE_TAB_BG "transparent" // Config timer active tab text color - Transparent (= COLOR_FORM)
// -- mDNS ----------------------------------------
#define USE_DISCOVERY // Enable mDNS for the following services (+8k code, +0.3k mem)
#define WEBSERVER_ADVERTISE // Provide access to webserver by name <Hostname>.local/

View File

@ -20,6 +20,6 @@
#ifndef _SONOFF_VERSION_H_
#define _SONOFF_VERSION_H_
const uint32_t VERSION = 0x06050004;
const uint32_t VERSION = 0x06050005;
#endif // _SONOFF_VERSION_H_

View File

@ -31,6 +31,43 @@
#define WIFI_SOFT_AP_CHANNEL 1 // Soft Access Point Channel number between 1 and 11 as used by SmartConfig web GUI
#endif
#ifndef COLOR_TEXT_WARNING
#define COLOR_TEXT_WARNING "red" // Warning text color - Red
#endif
#ifndef COLOR_TEXT_SUCCESS
#define COLOR_TEXT_SUCCESS "green" // Success text color - Green
#endif
#ifndef COLOR_TEXT
#define COLOR_TEXT "#000" // Global text color - Black
#endif
#ifndef COLOR_BACKGROUND
#define COLOR_BACKGROUND "#fff" // Global background color - White
#endif
#ifndef COLOR_FORM
#define COLOR_FORM "#f2f2f2" // Form background color - Greyish
#endif
#ifndef COLOR_BUTTON_TEXT
#define COLOR_BUTTON_TEXT "#fff" // Button text color - White
#endif
#ifndef COLOR_BUTTON
#define COLOR_BUTTON "#1fa3ec" // Button color - Blueish
#endif
#ifndef COLOR_BUTTON_HOVER
#define COLOR_BUTTON_HOVER "#0e70a4" // Button color when hovered over - Darker blueish
#endif
#ifndef COLOR_BUTTON_RESET
#define COLOR_BUTTON_RESET "#d43535" // Restart/Reset/Delete button color - Redish
#endif
#ifndef COLOR_BUTTON_RESET_HOVER
#define COLOR_BUTTON_RESET_HOVER "#931f1f" // Restart/Reset/Delete button color when hovered over - Darker redish
#endif
#ifndef COLOR_BUTTON_SAVE
#define COLOR_BUTTON_SAVE "#47c266" // Save button color - Greenish
#endif
#ifndef COLOR_BUTTON_SAVE_HOVER
#define COLOR_BUTTON_SAVE_HOVER "#5aaf6f" // Save button color when hovered over - Darker greenish
#endif
const uint16_t CHUNKED_BUFFER_SIZE = 400; // Chunk buffer size (should be smaller than half mqtt_date size)
const uint16_t HTTP_REFRESH_TIME = 2345; // milliseconds
@ -239,21 +276,21 @@ const char HTTP_HEAD_STYLE1[] PROGMEM =
"<style>"
"div,fieldset,input,select{padding:5px;font-size:1em;}"
"fieldset{background-color:#f2f2f2;}" // Also update HTTP_TIMER_STYLE
"fieldset{background-color:" COLOR_FORM ";}" // Also update HTTP_TIMER_STYLE
"p{margin:0.5em 0;}"
"input{width:100%%;box-sizing:border-box;-webkit-box-sizing:border-box;-moz-box-sizing:border-box;}"
"input[type=checkbox],input[type=radio]{width:1em;margin-right:6px;vertical-align:-1px;}"
"select{width:100%%;}"
"textarea{resize:none;width:98%%;height:318px;padding:5px;overflow:auto;}"
"body{text-align:center;font-family:verdana;}"
"body{text-align:center;font-family:verdana;background-color:" COLOR_BACKGROUND ";}"
"td{padding:0px;}";
const char HTTP_HEAD_STYLE2[] PROGMEM =
"button{border:0;border-radius:0.3rem;background-color:#1fa3ec;color:#fff;line-height:2.4rem;font-size:1.2rem;width:100%%;-webkit-transition-duration:0.4s;transition-duration:0.4s;cursor:pointer;}"
"button:hover{background-color:#0e70a4;}"
".bred{background-color:#d43535;}"
".bred:hover{background-color:#931f1f;}"
".bgrn{background-color:#47c266;}"
".bgrn:hover{background-color:#5aaf6f;}"
"button{border:0;border-radius:0.3rem;background-color:" COLOR_BUTTON ";color:" COLOR_BUTTON_TEXT ";line-height:2.4rem;font-size:1.2rem;width:100%%;-webkit-transition-duration:0.4s;transition-duration:0.4s;cursor:pointer;}"
"button:hover{background-color:" COLOR_BUTTON_HOVER ";}"
".bred{background-color:" COLOR_BUTTON_RESET ";}"
".bred:hover{background-color:" COLOR_BUTTON_RESET_HOVER ";}"
".bgrn{background-color:" COLOR_BUTTON_SAVE ";}"
".bgrn:hover{background-color:" COLOR_BUTTON_SAVE_HOVER ";}"
"a{text-decoration:none;}"
".p{float:left;text-align:left;}"
".q{float:right;text-align:right;}";
@ -262,9 +299,9 @@ const char HTTP_HEAD_STYLE3[] PROGMEM =
"</head>"
"<body>"
"<div style='text-align:left;display:inline-block;min-width:340px;'>"
"<div style='text-align:left;display:inline-block;color:" COLOR_TEXT ";min-width:340px;'>"
#ifdef FIRMWARE_MINIMAL
"<div style='text-align:center;color:red;'><h3>" D_MINIMAL_FIRMWARE_PLEASE_UPGRADE "</h3></div>"
"<div style='text-align:center;color:" COLOR_TEXT_WARNING ";'><h3>" D_MINIMAL_FIRMWARE_PLEASE_UPGRADE "</h3></div>"
#endif
"<div style='text-align:center;'><noscript>" D_NOSCRIPT "<br/></noscript>"
#ifdef LANGUAGE_MODULE_NAME
@ -1096,7 +1133,7 @@ void HandleTemplateConfiguration(void)
if ((i < 6) || ((i > 8) && (i != 11))) { // Ignore flash pins GPIO06, 7, 8 and 11
bool esp8285 = ((9==i)||(10==i));
WSContentSend_P(PSTR("<tr><td><b>%s" D_GPIO "%d%s</b></td><td%s><select id='g%d' name='g%d'></select></td></tr>"),
(esp8285) ? "<font color='red'>" : "", i, (esp8285) ? "</font>" : "", (0==i) ? " style='width:200px'" : "", i, i);
(esp8285) ? "<font color='" COLOR_TEXT_WARNING "'>" : "", i, (esp8285) ? "</font>" : "", (0==i) ? " style='width:200px'" : "", i, i);
}
}
WSContentSend_P(PSTR("</table>"));
@ -1202,7 +1239,7 @@ void HandleModuleConfiguration(void)
if (ValidGPIO(i, cmodule.io[i])) {
snprintf_P(stemp, 3, PINS_WEMOS +i*2);
WSContentSend_P(PSTR("<tr><td style='width:190px'>%s <b>" D_GPIO "%d</b> %s</td><td style='width:176px'><select id='g%d' name='g%d'></select></td></tr>"),
(WEMOS==my_module_type)?stemp:"", i, (0==i)? D_SENSOR_BUTTON "1":(1==i)? D_SERIAL_OUT :(3==i)? D_SERIAL_IN :((9==i)||(10==i))? "<font color='red'>ESP8285</font>" :(12==i)? D_SENSOR_RELAY "1":(13==i)? D_SENSOR_LED "1i":(14==i)? D_SENSOR :"", i, i);
(WEMOS==my_module_type)?stemp:"", i, (0==i)? D_SENSOR_BUTTON "1":(1==i)? D_SERIAL_OUT :(3==i)? D_SERIAL_IN :((9==i)||(10==i))? "<font color='" COLOR_TEXT_WARNING "'>ESP8285</font>" :(12==i)? D_SENSOR_RELAY "1":(13==i)? D_SENSOR_LED "1i":(14==i)? D_SENSOR :"", i, i);
}
}
WSContentSend_P(PSTR("</table>"));
@ -1771,7 +1808,7 @@ void HandleUploadDone(void)
WSContentSendStyle();
WSContentSend_P(PSTR("<div style='text-align:center;'><b>" D_UPLOAD " <font color='"));
if (upload_error) {
WSContentSend_P(PSTR("red'>" D_FAILED "</font></b><br/><br/>"));
WSContentSend_P(PSTR(COLOR_TEXT_WARNING "'>" D_FAILED "</font></b><br/><br/>"));
#ifdef USE_RF_FLASH
if (upload_error < 14) {
#else
@ -1785,7 +1822,7 @@ void HandleUploadDone(void)
AddLog_P2(LOG_LEVEL_DEBUG, PSTR(D_UPLOAD ": %s"), error);
stop_flash_rotate = Settings.flag.stop_flash_rotate;
} else {
WSContentSend_P(PSTR("green'>" D_SUCCESSFUL "</font></b><br/>"));
WSContentSend_P(PSTR(COLOR_TEXT_SUCCESS "'>" D_SUCCESSFUL "</font></b><br/>"));
WSContentSend_P(HTTP_MSG_RSTRT);
ShowWebSource(SRC_WEBGUI);
restart_flag = 2; // Always restart to re-enable disabled features during update

View File

@ -512,6 +512,19 @@ bool TimerCommand(void)
#ifdef USE_WEBSERVER
#ifdef USE_TIMERS_WEB
#ifndef COLOR_TIMER_TAB_TEXT
#define COLOR_TIMER_TAB_TEXT "#fff" // Config timer tab text color - White
#endif
#ifndef COLOR_TIMER_TAB_BACKGROUND
#define COLOR_TIMER_TAB_BACKGROUND "#999" // Config timer tab background color - Light grey
#endif
#ifndef COLOR_TIMER_ACTIVE_TAB_TEXT
#define COLOR_TIMER_ACTIVE_TAB_TEXT "#000" // Config timer active tab text color - Black
#endif
#ifndef COLOR_TIMER_ACTIVE_TAB_BG
#define COLOR_TIMER_ACTIVE_TAB_BG "transparent" // Config timer active tab text color - Transparent (= COLOR_FORM)
#endif
#define WEB_HANDLE_TIMER "tm"
const char S_CONFIGURE_TIMER[] PROGMEM = D_CONFIGURE_TIMER;
@ -596,8 +609,8 @@ const char HTTP_TIMER_SCRIPT4[] PROGMEM =
"if(ct<99){st();}" // Save changes
"ct=t;"
"o=document.getElementsByClassName('tl');" // Restore style to all tabs/buttons
"for(i=0;i<o.length;i++){o[i].style.cssText=\"background-color:#999;color:#fff;font-weight:normal;\"}"
"e.style.cssText=\"background-color:transparent;color:#000;font-weight:bold;\";" // Change style to tab/button used to open content
"for(i=0;i<o.length;i++){o[i].style.cssText=\"background-color:" COLOR_TIMER_TAB_BACKGROUND ";color:" COLOR_TIMER_TAB_TEXT ";font-weight:normal;\"}"
"e.style.cssText=\"background-color:" COLOR_TIMER_ACTIVE_TAB_BG ";color:" COLOR_TIMER_ACTIVE_TAB_TEXT ";font-weight:bold;\";" // Change style to tab/button used to open content
"s=pt[ct];" // Get parameters from array
#ifdef USE_SUNRISE
"p=(s>>29)&3;eb('b'+p).checked=1;" // Set mode
@ -653,7 +666,7 @@ const char HTTP_TIMER_SCRIPT6[] PROGMEM =
"}"
"window.onload=it;";
const char HTTP_TIMER_STYLE[] PROGMEM =
".tl{float:left;border-radius:0;border:1px solid #f2f2f2;padding:1px;width:6.25%%;}"; // Border color needs to be the same as Fieldset background color from HTTP_HEAD_STYLE1 (transparent won't work)
".tl{float:left;border-radius:0;border:1px solid " COLOR_FORM ";padding:1px;width:6.25%%;}"; // Border color needs to be the same as Fieldset background color from HTTP_HEAD_STYLE1 (transparent won't work)
const char HTTP_FORM_TIMER1[] PROGMEM =
"<fieldset style='min-width:470px;text-align:center;'>"
"<legend style='text-align:left;'><b>&nbsp;" D_TIMER_PARAMETERS "&nbsp;</b></legend>"