Added logic to send slider changes to the controller. Comments updated.
This commit is contained in:
parent
fb98d1c28b
commit
161a7e2a78
1 changed files with 33 additions and 5 deletions
|
@ -332,6 +332,7 @@ void init_webserver() {
|
||||||
DynamicJsonDocument root(1024);
|
DynamicJsonDocument root(1024);
|
||||||
root["on"] = light_state[light];
|
root["on"] = light_state[light];
|
||||||
root["bri"] = bri[light];
|
root["bri"] = bri[light];
|
||||||
|
root["bricur"] = (int)current_bri[light];
|
||||||
String output;
|
String output;
|
||||||
serializeJson(root, output);
|
serializeJson(root, output);
|
||||||
server.send(200, "text/plain", output);
|
server.send(200, "text/plain", output);
|
||||||
|
@ -446,7 +447,9 @@ void init_webserver() {
|
||||||
|
|
||||||
if (server.hasArg("bri" + (String)light)) {
|
if (server.hasArg("bri" + (String)light)) {
|
||||||
bri[light] = (int)server.arg("bri" + (String)light).toInt();
|
bri[light] = (int)server.arg("bri" + (String)light).toInt();
|
||||||
Serial.print("Brightness set to ");
|
Serial.print("Brightness ");
|
||||||
|
Serial.print(light);
|
||||||
|
Serial.print(" set to ");
|
||||||
Serial.println(bri[light]);
|
Serial.println(bri[light]);
|
||||||
}
|
}
|
||||||
|
|
||||||
|
@ -508,6 +511,7 @@ void init_webserver() {
|
||||||
String http_content = "<!doctype html>";
|
String http_content = "<!doctype html>";
|
||||||
http_content += "<html>";
|
http_content += "<html>";
|
||||||
http_content += "<head>";
|
http_content += "<head>";
|
||||||
|
http_content += "<style></style>";
|
||||||
http_content += "<meta charset=\"utf-8\">";
|
http_content += "<meta charset=\"utf-8\">";
|
||||||
http_content += "<meta name=\"viewport\" content=\"width=device-width, initial-scale=1.0\">";
|
http_content += "<meta name=\"viewport\" content=\"width=device-width, initial-scale=1.0\">";
|
||||||
//http_content += "<meta http-equiv=\"refresh\" content=\"15\">"; // Reload the page every 15 seconds automatically
|
//http_content += "<meta http-equiv=\"refresh\" content=\"15\">"; // Reload the page every 15 seconds automatically
|
||||||
|
@ -527,11 +531,31 @@ void init_webserver() {
|
||||||
http_content += "</div>";
|
http_content += "</div>";
|
||||||
|
|
||||||
http_content += "<form class=\"pure-form pure-form-aligned\" action=\"/\" method=\"post\">";
|
http_content += "<form class=\"pure-form pure-form-aligned\" action=\"/\" method=\"post\">";
|
||||||
|
http_content += "<script>"
|
||||||
|
"let timeoutId;"
|
||||||
|
"function sendSliderValue(x) {"
|
||||||
|
"x = x - 1;"
|
||||||
|
"clearTimeout(timeoutId);"
|
||||||
|
"timeoutId = setTimeout(() => {"
|
||||||
|
"var value = document.getElementById(`bri${x}`).value;"
|
||||||
|
"var url = `http://192.168.0.26/?bri${x}=${value}`;"
|
||||||
|
"fetch(url).then(response => {"
|
||||||
|
"if (!response.ok) {"
|
||||||
|
"throw new Error(`HTTP error! status: ${response.status}`);"
|
||||||
|
"}"
|
||||||
|
"console.log(`Sent slider value ${value} to ${url}`);"
|
||||||
|
"}).catch(error => {"
|
||||||
|
"console.error(`Error sending slider value to ${url}: ${error}`);"
|
||||||
|
"});"
|
||||||
|
"}, 500);"
|
||||||
|
"}</script>";
|
||||||
|
|
||||||
#ifndef DISABLE_WEB_CONTROL
|
#ifndef DISABLE_WEB_CONTROL
|
||||||
http_content += "<br><table border=0><tr><td>";
|
http_content += "<br><table border=0><tr><td>";
|
||||||
// Light control
|
// Light control
|
||||||
for (uint8 light_num = 0; light_num < LIGHTS_COUNT; light_num++) {
|
for (uint8 light_num = 0; light_num < LIGHTS_COUNT; light_num++)
|
||||||
|
{
|
||||||
|
// on/off buttons
|
||||||
http_content += "<h4>Light " + (String)(light_num + 1) + "</h4>";
|
http_content += "<h4>Light " + (String)(light_num + 1) + "</h4>";
|
||||||
http_content += "<div class=\"pure-control-group\">";
|
http_content += "<div class=\"pure-control-group\">";
|
||||||
http_content += "<label for=\"power\"><strong>Power</strong></label>";
|
http_content += "<label for=\"power\"><strong>Power</strong></label>";
|
||||||
|
@ -541,9 +565,10 @@ void init_webserver() {
|
||||||
http_content += "\" href=\"/?on" + (String)light_num + "=false\">OFF</a>";
|
http_content += "\" href=\"/?on" + (String)light_num + "=false\">OFF</a>";
|
||||||
http_content += "</div>";
|
http_content += "</div>";
|
||||||
|
|
||||||
|
// slider for brightness
|
||||||
http_content += "<div class=\"pure-control-group\">";
|
http_content += "<div class=\"pure-control-group\">";
|
||||||
http_content += "<label for=\"bri\"" + (String)light_num + ">Bri</label>";
|
http_content += "<label for=\"bri\"" + (String)light_num + ">Bri</label>";
|
||||||
http_content += "<input id=\"bri" + (String)light_num + "\" name=\"bri" + (String)light_num + "\" type=\"range\" min=\"0\" max=\"255\" value=\"" + (String)bri[light_num] + "\">";
|
http_content += "<input id=\"bri" + (String)light_num + "\" onchange=\"sendSliderValue(" + (String)(light_num+1) + ")\" name=\"bri" + (String)light_num + "\" type=\"range\" min=\"0\" max=\"255\" value=\"" + (String)bri[light_num] + "\">";
|
||||||
http_content += "<label id=\"bri" + (String)light_num + "_val\" name=\"bri" + (String)light_num + "\">" + (String)(int)(bri[light_num] * 100.0 / 255.0) + "</label>%";
|
http_content += "<label id=\"bri" + (String)light_num + "_val\" name=\"bri" + (String)light_num + "\">" + (String)(int)(bri[light_num] * 100.0 / 255.0) + "</label>%";
|
||||||
http_content += "<script>";
|
http_content += "<script>";
|
||||||
http_content += "var slider" + (String)light_num + " = document.getElementById(\"bri" + (String)light_num + "\");";
|
http_content += "var slider" + (String)light_num + " = document.getElementById(\"bri" + (String)light_num + "\");";
|
||||||
|
@ -554,9 +579,10 @@ void init_webserver() {
|
||||||
http_content += "}";
|
http_content += "}";
|
||||||
http_content += "</script>";
|
http_content += "</script>";
|
||||||
http_content += "</div>";
|
http_content += "</div>";
|
||||||
|
|
||||||
}
|
}
|
||||||
|
|
||||||
// timer data processing, startup state and scene for all of the lights
|
// startup state and scene for all of the lights
|
||||||
http_content += "</td><td>";
|
http_content += "</td><td>";
|
||||||
http_content += "<div id=\"plot_chart\"></div>";
|
http_content += "<div id=\"plot_chart\"></div>";
|
||||||
http_content += "</td></tr></table><br>";
|
http_content += "</td></tr></table><br>";
|
||||||
|
@ -577,6 +603,7 @@ void init_webserver() {
|
||||||
http_content += "</select>";
|
http_content += "</select>";
|
||||||
http_content += "</div>";
|
http_content += "</div>";
|
||||||
|
|
||||||
|
// scene
|
||||||
http_content += "<div class=\"pure-control-group\">";
|
http_content += "<div class=\"pure-control-group\">";
|
||||||
http_content += "<label for=\"scene\"><strong>Scene</strong></label>";
|
http_content += "<label for=\"scene\"><strong>Scene</strong></label>";
|
||||||
http_content += "<select onchange = \"this.form.submit()\" id=\"scene\" name=\"scene\">";
|
http_content += "<select onchange = \"this.form.submit()\" id=\"scene\" name=\"scene\">";
|
||||||
|
@ -593,8 +620,9 @@ void init_webserver() {
|
||||||
http_content += "</select>";
|
http_content += "</select>";
|
||||||
http_content += "</div>";
|
http_content += "</div>";
|
||||||
|
|
||||||
|
// timing control button
|
||||||
http_content += "<div class=\"pure-control-group\">";
|
http_content += "<div class=\"pure-control-group\">";
|
||||||
http_content += "<label for=\"power\"><strong>Timing control</strong></label>";
|
http_content += "<label for=\"tc\"><strong>Timing control</strong></label>";
|
||||||
int tc_val = EEPROM.read(EEPROM_TIMING_CONTROL_ENABLED_ADDRESS);
|
int tc_val = EEPROM.read(EEPROM_TIMING_CONTROL_ENABLED_ADDRESS);
|
||||||
http_content += "<a class=\"pure-button";
|
http_content += "<a class=\"pure-button";
|
||||||
if (tc_val == TIMING_CONTROL_ENABLED) http_content += " pure-button-primary";
|
if (tc_val == TIMING_CONTROL_ENABLED) http_content += " pure-button-primary";
|
||||||
|
|
Loading…
Reference in a new issue