jeans/WLED
jeans/WLED
1
0
Fork 0
mirror of https://github.com/wled/WLED.git synced 2025-04-23 22:37:18 +00:00
Code Issues Packages Projects Releases Wiki Activity

Minor changes to auto UI code generation

Browse Source 
Replace outdated CSS in HTML by style.css import
Fix missing button double press in time settings
FIx missing meta utf-8 in WiFi and UI settings
Modify cdata.js to add an info header to the top of auto-generated files
This commit is contained in:
cschwinne 2020-06-10 12:45:44 +02:00
parent ee6f25cc47
commit 888eacb574
11 changed files with 1173 additions and 1380 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

2
package-lock.json generated
View File

@ -1,6 +1,6 @@
{
"name": "wled",
"version": "1.0.0",
"version": "0.10.0",
"lockfileVersion": 1,
"requires": true,
"dependencies": {

17
tools/cdata.js
View File

@ -84,7 +84,14 @@ function writeHtmlGzipped(sourceFile, resultFile) {
console.info("Compressed " + result.length + " bytes");
const array = hexdump(result);
const src = `
const src = `/*
* Binary array for the Web UI.
* gzip is used for smaller size and improved speeds.
*
* Please see https://github.com/Aircoookie/WLED/wiki/Add-own-functionality#web-ui
* to find out how to easily modify the web UI source!
*/
// Autogenerated from ${sourceFile}, do not edit!!
const uint16_t PAGE_index_L = ${result.length};
const uint8_t PAGE_index[] PROGMEM = {
@ -153,7 +160,13 @@ ${result}
}
function writeChunks(srcDir, specs, resultFile) {
let src = "";
let src = `/*
* More web UI HTML source arrays.
* This file is auto generated, please don't make any changes manually.
* Instead, see https://github.com/Aircoookie/WLED/wiki/Add-own-functionality#web-ui
* to find out how to easily modify the web UI source!
*/
`;
specs.forEach((s) => {
try {
console.info("Reading " + srcDir + "/" + s.file + " as " + s.name);

54
wled00/data/settings_leds.htm
View File

@ -86,57 +86,7 @@
}
</script>
<style>
:root {
--aCol: #fff;
--bCol: #333;
--cCol: #222;
--dCol: #fff;
--sCol: #0000;
}
body {
font-family: Verdana, Helvetica, sans-serif;
text-align: center;
background: var(--cCol);
color: var(--dCol);
line-height: 200%;
margin: 0;
background-attachment: fixed;
}
hr {
border-color: var(--dCol);
filter: drop-shadow( -5px -5px 5px var(--sCol) );
}
button {
background: var(--bCol);
color: var(--dCol);
border: 0.3ch solid var(--bCol);
display: inline-block;
filter: drop-shadow( -5px -5px 5px var(--sCol) );
font-size: 20px;
margin: 8px;
margin-top: 12px;
}
.helpB {
text-align: left;
position: absolute;
width:60px;
}
select {
background: var(--bCol);
color: var(--dCol);
border: 0.5ch solid var(--bCol);
font-family: var(--cFn), sans-serif;
filter: drop-shadow( -5px -5px 5px var(--sCol) );
}
input {
background: var(--bCol);
color: var(--dCol);
border: 0.5ch solid var(--bCol);
filter: drop-shadow( -5px -5px 5px var(--sCol) );
}
input[type=number] {
width: 4em;
}
@import url("style.css");
</style>
</head>
<body onload="S()">
@ -216,7 +166,7 @@
<option value="3">None (not recommended)</option>
</select><br>
Reverse LED order (rotate 180): <input type="checkbox" name="RV"><br>
Skip first LED: <input type="checkbox" name="SL"><br>
Skip first LED: <input type="checkbox" name="SL"><hr>
<button type="button" onclick="B()">Back</button><button type="submit">Save</button>
</form>
</body>

46
wled00/data/settings_sec.htm
View File

@ -23,51 +23,7 @@
}
</script>
<style>
:root {
--aCol: #D9B310;
--bCol: #0B3C5D;
--cCol: #1D2731;
--dCol: #328CC1;
--sCol: #000;
}
body {
font-family: Verdana, Helvetica, sans-serif;
text-align: center;
background: var(--cCol);
color: var(--dCol);
line-height: 2em;
font-size: 16px;
margin: 0;
background-attachment: fixed;
}
hr {
border-color: var(--dCol);
filter: drop-shadow( -5px -5px 5px var(--sCol) );
}
button {
background: var(--bCol);
color: var(--dCol);
border: 0.3ch solid var(--bCol);
display: inline-block;
filter: drop-shadow( -5px -5px 5px var(--sCol) );
font-size: 20px;
margin: 8px;
margin-top: 12px;
}
.helpB {
text-align: left;
position: absolute;
width:60px;
}
input {
background: var(--bCol);
color: var(--dCol);
border: 0.5ch solid var(--bCol);
filter: drop-shadow( -5px -5px 5px var(--sCol) );
}
input[type=number] {
width: 3em;
}
@import url("style.css");
</style>
</head>
<body onload="GetV()">

2
wled00/data/settings_sync.htm
View File

@ -9,7 +9,7 @@ function SetVal(){switch(parseInt(d.Sf.EP.value)){case 5568: d.Sf.DI.value = 556
function S(){GetV();SetVal();}
function GetV(){var d=document;}
</script>
<style>body{font-family:Verdana,sans-serif;text-align:center;background:#222;color:#fff;line-height:200%;margin:0}hr{border-color:#666}button{background:#333;color:#fff;font-family:Verdana,sans-serif;border:.3ch solid #333;display:inline-block;font-size:20px;margin:8px;margin-top:12px}.helpB{text-align:left;position:absolute;width:60px}input{background:#333;color:#fff;font-family:Verdana,sans-serif;border:.5ch solid #333}input[type=number]{width:4em}select{background:#333;color:#fff;font-family:Verdana,sans-serif;border:0.5ch solid #333}td{padding:2px;}.d5{width:4.5em !important;}</style></head>
<style>@import url("style.css");</style></head>
<body onload="S()">
<form id="form_s" name="Sf" method="post">
<div class="helpB"><button type="button" onclick="H()">?</button></div>

62
wled00/data/settings_time.htm
View File

@ -77,64 +77,7 @@
}
</script>
<style>
:root {
--aCol: #D9B310;
--bCol: #0B3C5D;
--cCol: #1D2731;
--dCol: #328CC1;
--sCol: #000;
--tCol: #328CC1;
--cFn: Verdana;
}
body {
font-family: var(--cFn), sans-serif;
text-align: center;
background: var(--cCol);
color: var(--dCol);
line-height: 200%;
margin: 0;
background-attachment: fixed;
}
hr {
border-color: var(--dCol);
filter: drop-shadow( -5px -5px 5px var(--sCol) );
}
button {
background: var(--bCol);
color: var(--dCol);
border: 0.3ch solid var(--bCol);
font-family: var(--cFn), sans-serif;
display: inline-block;
filter: drop-shadow( -5px -5px 5px var(--sCol) );
font-size: 20px;
margin: 8px;
margin-top: 12px;
}
.helpB {
text-align: left;
position: absolute;
width:60px;
}
input {
background: var(--bCol);
color: var(--dCol);
font-family: var(--cFn), sans-serif;
border: 0.5ch solid var(--bCol);
filter: drop-shadow( -5px -5px 5px var(--sCol) );
}
select {
background: var(--bCol);
color: var(--dCol);
border: 0.5ch solid var(--bCol);
font-family: var(--cFn), sans-serif;
filter: drop-shadow( -5px -5px 5px var(--sCol) );
}
td {
padding:2px;
}
input[type=number] {
width: 4em;
}
@import url("style.css");
</style>
</head>
<body onload="S()">
@ -208,7 +151,8 @@
<i>Use 0 for the default action instead of a macro</i><br>
Boot Macro: <input name="MB" type="number" min="0" max="16" required><br>
Alexa On/Off Macros: <input name="A0" type="number" min="0" max="16" required> <input name="A1" type="number" min="0" max="16" required><br>
Button Macro: <input name="MP" type="number" min="0" max="16" required> Long Press: <input name="MD" type="number" min="0" max="16" required><br>
Button short press macro: Macro: <input name="MP" type="number" min="0" max="16" required><br>
Long Press: <input name="ML" type="number" min="0" max="16" required> Double press: <input name="MD" type="number" min="0" max="16" required><br>
Countdown-Over Macro: <input name="MC" type="number" min="0" max="16" required><br>
Timed-Light-Over Macro: <input name="MN" type="number" min="0" max="16" required><br>
Time-Controlled Macros:<br>

57
wled00/data/settings_ui.htm
View File

@ -1,6 +1,7 @@
<!DOCTYPE html>
<html>
<head>
<meta charset="utf-8">
<meta name="viewport" content="width=500">
<title>UI Settings</title>
<script>
@ -36,61 +37,7 @@
}
</script>
<style>
:root {
--aCol: #666;
--bCol: #333;
--cCol: #222;
--dCol: #666;
--tCol: #fff;
--sCol: #0000;
--cFn: Verdana;
}
body {
font-family: var(--cFn), Helvetica, sans-serif;
text-align: center;
background: var(--cCol);
color: var(--tCol);
line-height: 200%;
margin: 0;
background-attachment: fixed;
}
hr {
border-color: var(--dCol);
filter: drop-shadow( -5px -5px 5px var(--sCol) );
}
button {
background: var(--bCol);
color: var(--tCol);
border: 0.3ch solid var(--bCol);
display: inline-block;
font-family: var(--cFn), Helvetica, sans-serif;
filter: drop-shadow( -5px -5px 5px var(--sCol) );
font-size: 20px;
margin: 8px;
margin-top: 12px;
}
.helpB {
text-align: left;
position: absolute;
width:60px;
}
input {
background: var(--bCol);
color: var(--dCol);
border: 0.5ch solid var(--bCol);
filter: drop-shadow( -5px -5px 5px var(--sCol) );
font-family: var(--cFn), Helvetica, sans-serif;
}
select {
background: var(--bCol);
color: var(-tCol);
border: 0.5ch solid var(--bCol);
filter: drop-shadow( -5px -5px 5px var(--sCol) );
font-family: var(--cFn), Helvetica, sans-serif;
}
input[type=number] {
width: 3em;
}
@import url("style.css");
</style>
</head>
<body onload="S()">

53
wled00/data/settings_wifi.htm
View File

@ -1,6 +1,7 @@
<!DOCTYPE html>
<html>
<head>
<meta charset="utf-8">
<meta name="viewport" content="width=500">
<title>WiFi Settings</title>
<script>
@ -18,57 +19,13 @@
}
</script>
<style>
:root {
--aCol: #D9B310;
--bCol: #0B3C5D;
--cCol: #1D2731;
--dCol: #328CC1;
--sCol: #000;
--cFn: Verdana;
}
body {
font-family: Verdana, Helvetica, sans-serif;
text-align: center;
background: var(--cCol);
color: var(--dCol);
line-height: 200%;
margin: 0;
background-attachment: fixed;
}
hr {
border-color: var(--dCol);
filter: drop-shadow( -5px -5px 5px var(--sCol) );
}
button {
background: var(--bCol);
color: var(--dCol);
border: 0.3ch solid var(--bCol);
display: inline-block;
filter: drop-shadow( -5px -5px 5px var(--sCol) );
font-size: 20px;
margin: 8px;
margin-top: 12px;
}
.helpB {
text-align: left;
position: absolute;
width:60px;
}
input {
background: var(--bCol);
color: var(--dCol);
border: 0.5ch solid var(--bCol);
filter: drop-shadow( -5px -5px 5px var(--sCol) );
}
input[type=number] {
width: 3em;
}
@import url("style.css");
</style>
</head>
<body onload="GetV()">
<form id="form_s" name="Sf" method="post">
<div class="helpB"><button type="button" onclick="H()">?</button></div>
<button type="button" onclick="B()">Back</button><button type="submit">Save & Reboot</button><hr>
<button type="button" onclick="B()">Back</button><button type="submit">Save & Connect</button><hr>
<h2>WiFi setup</h2>
<h3>Connect to existing network</h3>
Network name (SSID, empty to not connect): <br><input name="CS" maxlength="32"><br>
@ -102,13 +59,13 @@
<option value="1">Disconnected</option>
<option value="2">Always</option>
<option value="3">Never (not recommended)</option></select><br>
AP IP: <span class="sip"> Not active </span><hr>
AP IP: <span class="sip"> Not active </span><br>
<h3>Experimental</h3>
Disable WiFi sleep: <input type="checkbox" name="WS"><br>
<i>Can help with connectivity issues.<br>
Do not enable if WiFi is working correctly, increases power consumption.</i>
<hr>
<button type="button" onclick="B()">Back</button><button type="submit">Save & Reboot</button>
<button type="button" onclick="B()">Back</button><button type="submit">Save & Connect</button>
</form>
</body>
</html>

6
wled00/html_other.h
View File

@ -1,3 +1,9 @@
/*
* More web UI HTML source arrays.
* This file is auto generated, please don't make any changes manually.
* Instead, see https://github.com/Aircoookie/WLED/wiki/Add-own-functionality#web-ui
* to find out how to easily modify the web UI source!
*/
// Autogenerated from wled00/data/usermod.htm, do not edit!!
const char PAGE_usermod[] PROGMEM = R"=====(<!DOCTYPE html><html><body>No usermod custom web page set.</body></html>)=====";

201
wled00/html_settings.h
View File

@ -1,3 +1,9 @@
/*
* More web UI HTML source arrays.
* This file is auto generated, please don't make any changes manually.
* Instead, see https://github.com/Aircoookie/WLED/wiki/Add-own-functionality#web-ui
* to find out how to easily modify the web UI source!
*/
// Autogenerated from wled00/data/style.css, do not edit!!
const char PAGE_settingsCss[] PROGMEM = R"=====(<style>body{font-family:Verdana,sans-serif;text-align:center;background:#222;color:#fff;line-height:200%;margin:0}hr{border-color:#666}button{background:#333;color:#fff;font-family:Verdana,sans-serif;border:.3ch solid #333;display:inline-block;font-size:20px;margin:8px;margin-top:12px}.helpB{text-align:left;position:absolute;width:60px}input{background:#333;color:#fff;font-family:Verdana,sans-serif;border:.5ch solid #333}input[type=number]{width:4em}select{background:#333;color:#fff;font-family:Verdana,sans-serif;border:.5ch solid #333}td{padding:2px}.d5{width:4.5em!important}</style>)=====";
@ -21,13 +27,14 @@ action="/settings/time"><button type="submit">Time & Macros</button></form><form
// Autogenerated from wled00/data/settings_wifi.htm, do not edit!!
const char PAGE_settings_wifi[] PROGMEM = R"=====(<!DOCTYPE html><html><head><meta name="viewport" content="width=500"><title>
WiFi Settings</title><script>
const char PAGE_settings_wifi[] PROGMEM = R"=====(<!DOCTYPE html><html><head><meta charset="utf-8"><meta name="viewport"
content="width=500"><title>WiFi Settings</title><script>
function H(){window.open("https://github.com/Aircoookie/WLED/wiki/Settings#wifi-settings")}function B(){window.open("/settings","_self")}function GetV() {var d=document;
%CSS%%SCSS%</head><body onload="GetV()"><form id="form_s" name="Sf" method="post">
<div class="helpB"><button type="button" onclick="H()">?</button></div><button
type="button" onclick="B()">Back</button><button type="submit">Save & Reboot
</button><hr><h2>WiFi setup</h2><h3>Connect to existing network</h3>
%CSS%%SCSS%</head><body onload="GetV()">
<form id="form_s" name="Sf" method="post"><div class="helpB"><button
type="button" onclick="H()">?</button></div><button type="button" onclick="B()">
Back</button><button type="submit">Save & Connect</button><hr><h2>WiFi setup
</h2><h3>Connect to existing network</h3>
Network name (SSID, empty to not connect):<br><input name="CS" maxlength="32">
<br>Network password:<br><input type="password" name="CP" maxlength="63"><br>
Static IP (leave at 0.0.0.0 for DHCP):<br><input name="I0" type="number"
@ -50,24 +57,24 @@ maxlength="63"><br>Access Point WiFi channel: <input name="AC" type="number"
min="1" max="13" required><br>AP opens: <select name="AB"><option value="0">
No connection after boot</option><option value="1">Disconnected</option><option
value="2">Always</option><option value="3">Never (not recommended)</option>
</select><br>AP IP: <span class="sip">Not active</span><hr><h3>Experimental</h3>
</select><br>AP IP: <span class="sip">Not active</span><br><h3>Experimental</h3>
Disable WiFi sleep: <input type="checkbox" name="WS"><br><i>
Can help with connectivity issues.<br>
Do not enable if WiFi is working correctly, increases power consumption.</i><hr>
<button type="button" onclick="B()">Back</button><button type="submit">
Save & Reboot</button></form></body></html>)=====";
Save & Connect</button></form></body></html>)=====";
// Autogenerated from wled00/data/settings_leds.htm, do not edit!!
const char PAGE_settings_leds[] PROGMEM = R"=====(<!DOCTYPE html><html><head><meta charset="utf-8"><meta name="viewport"
content="width=500"><title>LED Settings</title><script>
var d=document,laprev=55;function H(){window.open("https://github.com/Aircoookie/WLED/wiki/Settings#led-settings")}function B(){window.open("/settings","_self")}function S(){GetV(),setABL()}function enABL(){var e=d.getElementById("able").checked;d.Sf.LA.value=e?laprev:0,d.getElementById("abl").style.display=e?"inline":"none",d.getElementById("psu2").style.display=e?"inline":"none",0<d.Sf.LA.value&&setABL()}function enLA(){var e=d.Sf.LAsel.value;d.Sf.LA.value=e,d.getElementById("LAdis").style.display=50==e?"inline":"none",UI()}function setABL(){switch(d.getElementById("able").checked=!0,d.Sf.LAsel.value=50,parseInt(d.Sf.LA.value)){case 0:d.getElementById("able").checked=!1,enABL();break;case 30:d.Sf.LAsel.value=30;break;case 35:d.Sf.LAsel.value=35;break;case 55:d.Sf.LAsel.value=55;break;case 255:d.Sf.LAsel.value=255;break;default:d.getElementById("LAdis").style.display="inline"}UI()}function UI(){var e=d.querySelectorAll(".wc"),l=e.length;for(i=0;i<l;i++)e[i].style.display=d.getElementById("rgbw").checked?"inline":"none";d.getElementById("ledwarning").style.display=1e3<d.Sf.LC.value?"inline":"none",d.getElementById("ampwarning").style.display=7200<d.Sf.MA.value?"inline":"none",255==d.Sf.LA.value?laprev=12:0<d.Sf.LA.value&&(laprev=d.Sf.LA.value);var n=5<(n=Math.ceil((100+d.Sf.LC.value*laprev)/500)/2)?Math.ceil(n):n,t="",a=30==d.Sf.LAsel.value,s=255==d.Sf.LAsel.value;n<1.02&&!a&&!s?t="ESP 5V pin with 1A USB supply":(t+=a?"12V ":s?"WS2815 12V ":"5V ",t+=n,t+="A supply connected to LEDs");var u=Math.ceil((100+d.Sf.LC.value*laprev)/1500)/2,c="(for most effects, ~";c+=u=5<u?Math.ceil(u):u,c+="A is enough)<br>",d.getElementById("psu").innerHTML=t,d.getElementById("psu2").innerHTML=s?"":c}function GetV() {var d=document;
%CSS%%SCSS%</head><body onload="S()"><form id="form_s" name="Sf" method="post"><div
class="helpB"><button type="button" onclick="H()">?</button></div><button
type="button" onclick="B()">Back</button><button type="submit">Save</button><hr>
<h2>LED setup</h2>LED count: <input name="LC" type="number" min="1" max="1500"
oninput="UI()" required><br><div id="ledwarning"
style="color:orange;display:none">
%CSS%%SCSS%</head><body onload="S()"><form
id="form_s" name="Sf" method="post"><div class="helpB"><button type="button"
onclick="H()">?</button></div><button type="button" onclick="B()">Back</button>
<button type="submit">Save</button><hr><h2>LED setup</h2>LED count: <input
name="LC" type="number" min="1" max="1500" oninput="UI()" required><br><div
id="ledwarning" style="color:orange;display:none">
&#9888; You might run into stability or lag issues.<br>
Use less than 1000 LEDs per ESP for the best experience!<br></div><i>
Recommended power supply for brightest white:</i><br><b><span id="psu">?</span>
@ -116,7 +123,7 @@ Palette blending: <select name="PB"><option value="0">Linear (wrap if moving)
</option><option value="1">Linear (always wrap)</option><option value="2">
Linear (never wrap)</option><option value="3">None (not recommended)</option>
</select><br>Reverse LED order (rotate 180): <input type="checkbox" name="RV">
<br>Skip first LED: <input type="checkbox" name="SL"><br><button type="button"
<br>Skip first LED: <input type="checkbox" name="SL"><hr><button type="button"
onclick="B()">Back</button><button type="submit">Save</button></form></body>
</html>)=====";
@ -154,41 +161,42 @@ const char PAGE_settings_dmx[] PROGMEM = R"=====()=====";
#endif
// Autogenerated from wled00/data/settings_ui.htm, do not edit!!
const char PAGE_settings_ui[] PROGMEM = R"=====(<!DOCTYPE html><html><head><meta name="viewport" content="width=500"><title>
UI Settings</title><script>
const char PAGE_settings_ui[] PROGMEM = R"=====(<!DOCTYPE html><html><head><meta charset="utf-8"><meta name="viewport"
content="width=500"><title>UI Settings</title><script>
function gId(t){return document.getElementById(t)}function S(){GetV(),Ct()}function H(){window.open("https://github.com/Aircoookie/WLED/wiki/Settings#user-interface-settings")}function B(){window.open("/settings","_self")}function Ct(){gId("co").selected?gId("cth").style.display="block":gId("cth").style.display="none"}function GetV() {var d=document;
%CSS%%SCSS%</head><body onload="S()"><form id="form_s" name="Sf" method="post"><div
class="helpB"><button type="button" onclick="H()">?</button></div><button
type="button" onclick="B()">Back</button><button type="submit">Save</button><hr>
<h2>Web Setup</h2>Server description: <input name="DS" maxlength="32"><br>
Sync button toggles both send and receive: <input type="checkbox" name="ST"><br>
<br><hr><button type="button" onclick="B()">Back</button><button type="submit">
Save</button></form></body></html>)=====";
%CSS%%SCSS%</head><body onload="S()"><form
id="form_s" name="Sf" method="post"><div class="helpB"><button type="button"
onclick="H()">?</button></div><button type="button" onclick="B()">Back</button>
<button type="submit">Save</button><hr><h2>Web Setup</h2>Server description:
<input name="DS" maxlength="32"><br>Sync button toggles both send and receive:
<input type="checkbox" name="ST"><br><br><hr><button type="button"
onclick="B()">Back</button><button type="submit">Save</button></form></body>
</html>)=====";
// Autogenerated from wled00/data/settings_sync.htm, do not edit!!
const char PAGE_settings_sync[] PROGMEM = R"=====(<!DOCTYPE html><html><head><meta name="viewport" content="width=500"><meta
charset="utf-8"><title>Sync Settings</title><script>
var d=document;function H(){window.open("https://github.com/Aircoookie/WLED/wiki/Settings#sync-settings")}function B(){window.open("/settings","_self")}function adj(){6454==d.Sf.DI.value?(1==d.Sf.DA.value&&(d.Sf.DA.value=0),1==d.Sf.EU.value&&(d.Sf.EU.value=0)):5568==d.Sf.DI.value&&(0==d.Sf.DA.value&&(d.Sf.DA.value=1),0==d.Sf.EU.value&&(d.Sf.EU.value=1))}function SP(){var e=d.Sf.DI.value;d.getElementById("xp").style.display=0<e?"none":"block",0<e&&(d.Sf.EP.value=e)}function SetVal(){switch(parseInt(d.Sf.EP.value)){case 5568:d.Sf.DI.value=5568;break;case 6454:d.Sf.DI.value=6454}SP()}function S(){GetV(),SetVal()}function GetV() {
%CSS%%SCSS%</head><body onload="S()"><form id="form_s" name="Sf" method="post"><div
class="helpB"><button type="button" onclick="H()">?</button></div><button
type="button" onclick="B()">Back</button><button type="submit">Save</button><hr>
<h2>Sync setup</h2><h3>Button setup</h3>On/Off button enabled: <input
type="checkbox" name="BT"><br>Infrared remote: <select name="IR"><option
value="0">Disabled</option><option value="1">24-key RGB</option><option
value="2">24-key with CT</option><option value="3">40-key blue</option><option
value="4">44-key RGB</option><option value="5">21-key RGB</option><option
value="6">6-key black</option><option value="7">9-key red</option></select><br>
<a href="https://github.com/Aircoookie/WLED/wiki/Infrared-Control"
target="_blank">IR info</a><h3>WLED Broadcast</h3>UDP Port: <input name="UP"
type="number" min="1" max="65535" class="d5" required><br>Receive <input
type="checkbox" name="RB">Brightness, <input type="checkbox" name="RC">
Color, and <input type="checkbox" name="RX">Effects<br>
Send notifications on direct change: <input type="checkbox" name="SD"><br>
Send notifications on button press: <input type="checkbox" name="SB"><br>
Send Alexa notifications: <input type="checkbox" name="SA"><br>
Send Philips Hue change notifications: <input type="checkbox" name="SH"><br>
Send Macro notifications: <input type="checkbox" name="SM"><br>
%CSS%%SCSS%</head><body onload="S()"><form
id="form_s" name="Sf" method="post"><div class="helpB"><button type="button"
onclick="H()">?</button></div><button type="button" onclick="B()">Back</button>
<button type="submit">Save</button><hr><h2>Sync setup</h2><h3>Button setup</h3>
On/Off button enabled: <input type="checkbox" name="BT"><br>Infrared remote:
<select name="IR"><option value="0">Disabled</option><option value="1">
24-key RGB</option><option value="2">24-key with CT</option><option value="3">
40-key blue</option><option value="4">44-key RGB</option><option value="5">
21-key RGB</option><option value="6">6-key black</option><option value="7">
9-key red</option></select><br><a
href="https://github.com/Aircoookie/WLED/wiki/Infrared-Control" target="_blank">
IR info</a><h3>WLED Broadcast</h3>UDP Port: <input name="UP" type="number"
min="1" max="65535" class="d5" required><br>Receive <input type="checkbox"
name="RB">Brightness, <input type="checkbox" name="RC">Color, and <input
type="checkbox" name="RX">Effects<br>Send notifications on direct change: <input
type="checkbox" name="SD"><br>Send notifications on button press: <input
type="checkbox" name="SB"><br>Send Alexa notifications: <input type="checkbox"
name="SA"><br>Send Philips Hue change notifications: <input type="checkbox"
name="SH"><br>Send Macro notifications: <input type="checkbox" name="SM"><br>
Send notifications twice: <input type="checkbox" name="S2"><h3>Realtime</h3>
Receive UDP realtime: <input type="checkbox" name="RD"><br><br><i>
Network DMX input</i><br>Type: <select name="DI" onchange="SP(),adj()"><option
@ -249,52 +257,54 @@ type="submit">Save</button></form></body></html>)=====";
const char PAGE_settings_time[] PROGMEM = R"=====(<!DOCTYPE html><html><head><meta name="viewport" content="width=500"><meta
charset="utf-8"><title>Time Settings</title><script>
var d=document;function H(){window.open("https://github.com/Aircoookie/WLED/wiki/Settings#time-settings")}function B(){window.open("/settings","_self")}function S(){BTa(),GetV(),Cs(),FC()}function gId(t){return d.getElementById(t)}function Cs(){gId("cac").style.display="none",gId("coc").style.display="block",gId("ccc").style.display="none",gId("ca").selected&&(gId("cac").style.display="block"),gId("cc").selected&&(gId("coc").style.display="none",gId("ccc").style.display="block"),gId("cn").selected&&(gId("coc").style.display="none")}function BTa(){var t="<tr><th>Active</th><th>Hour</th><th>Minute</th><th>Macro</th><th>M</th><th>T</th><th>W</th><th>T</th><th>F</th><th>S</th><th>S</th></tr>";for(i=0;i<8;i++)for(t+='<tr><td><input name="W'+i+'" id="W'+i+'" type="number" style="display:none"><input id="W'+i+'0" type="checkbox"></td><td><input name="H'+i+'" type="number" min="0" max="24"></td><td><input name="N'+i+'" type="number" min="0" max="59"></td><td><input name="T'+i+'" type="number" min="0" max="16"></td>',j=1;j<8;j++)t+='<td><input id="W'+i+j+'" type="checkbox"></td>';gId("TMT").innerHTML=t}function FC(){for(j=0;j<8;j++)for(i=0;i<8;i++)gId("W"+i+j).checked=gId("W"+i).value>>j&1}function Wd(){for(a=[0,0,0,0,0,0,0,0],i=0;i<8;i++){for(m=1,j=0;j<8;j++)a[i]+=gId("W"+i+j).checked*m,m*=2;gId("W"+i).value=a[i]}}function GetV() {
%CSS%%SCSS%</head><body onload="S()"><form id="form_s" name="Sf" method="post"
onsubmit="Wd()"><div class="helpB"><button type="button" onclick="H()">?
</button></div><button type="button" onclick="B()">Back</button><button
type="submit">Save</button><hr><h2>Time setup</h2>Get time from NTP server:
<input type="checkbox" name="NT"><br><input name="NS" maxlength="32"><br>
Use 24h format: <input type="checkbox" name="CF"><br>Time zone: <select
name="TZ"><option value="0" selected="selected">GMT(UTC)</option><option
value="1">GMT/BST</option><option value="2">CET/CEST</option><option value="3">
EET/EEST</option><option value="4">US-EST/EDT</option><option value="5">
US-CST/CDT</option><option value="6">US-MST/MDT</option><option value="7">US-AZ
</option><option value="8">US-PST/PDT</option><option value="9">CST(AWST)
</option><option value="10">JST(KST)</option><option value="11">AEST/AEDT
</option><option value="12">NZST/NZDT</option><option value="13">North Korea
</option></select><br>UTC offset: <input name="UO" type="number" min="-65500"
max="65500" required> seconds (max. 18 hours)<br>Current local time is <span
class="times">unknown</span>.<h3>Clock</h3>Clock Overlay: <select name="OL"
onchange="Cs()"><option value="0" id="cn" selected="selected">None</option>
<option value="1" id="ca">Analog Clock</option><option value="2">
Single Digit Clock</option><option value="3" id="cc">Cronixie Clock</option>
</select><br><div id="coc">First LED: <input name="O1" type="number" min="0"
max="255" required> Last LED: <input name="O2" type="number" min="0" max="255"
required><br><div id="cac">12h LED: <input name="OM" type="number" min="0"
max="255" required><br>Show 5min marks: <input type="checkbox" name="O5"><br>
</div>Seconds (as trail): <input type="checkbox" name="OS"><br></div><div
id="ccc">Cronixie Display: <input name="CX" maxlength="6"><br>
Cronixie Backlight: <input type="checkbox" name="CB"><br></div>Countdown Mode:
<input type="checkbox" name="CE"><br>Countdown Goal:<br>Year: 20 <input
name="CY" type="number" min="0" max="99" required> Month: <input name="CI"
type="number" min="1" max="12" required> Day: <input name="CD" type="number"
min="1" max="31" required><br>Hour: <input name="CH" type="number" min="0"
max="23" required> Minute: <input name="CM" type="number" min="0" max="59"
required> Second: <input name="CS" type="number" min="0" max="59" required><br>
<h3>Advanced Macros</h3>Define API macros here:<br>1: <input name="M1"
maxlength="64"><br>2: <input name="M2" maxlength="64"><br>3: <input name="M3"
maxlength="64"><br>4: <input name="M4" maxlength="64"><br>5: <input name="M5"
maxlength="64"><br>6: <input name="M6" maxlength="64"><br>7: <input name="M7"
maxlength="64"><br>8: <input name="M8" maxlength="64"><br>9: <input name="M9"
maxlength="64"><br>10: <input name="M10" maxlength="64"><br>11: <input
name="M11" maxlength="64"><br>12: <input name="M12" maxlength="64"><br>13:
<input name="M13" maxlength="64"><br>14: <input name="M14" maxlength="64"><br>
15: <input name="M15" maxlength="64"><br>16: <input name="M16" maxlength="64">
<br><br><i>Use 0 for the default action instead of a macro</i><br>Boot Macro:
<input name="MB" type="number" min="0" max="16" required><br>
Alexa On/Off Macros: <input name="A0" type="number" min="0" max="16" required>
<input name="A1" type="number" min="0" max="16" required><br>Button Macro:
<input name="MP" type="number" min="0" max="16" required> Long Press: <input
%CSS%%SCSS%</head><body onload="S()"><form
id="form_s" name="Sf" method="post" onsubmit="Wd()"><div class="helpB"><button
type="button" onclick="H()">?</button></div><button type="button" onclick="B()">
Back</button><button type="submit">Save</button><hr><h2>Time setup</h2>
Get time from NTP server: <input type="checkbox" name="NT"><br><input name="NS"
maxlength="32"><br>Use 24h format: <input type="checkbox" name="CF"><br>
Time zone: <select name="TZ"><option value="0" selected="selected">GMT(UTC)
</option><option value="1">GMT/BST</option><option value="2">CET/CEST</option>
<option value="3">EET/EEST</option><option value="4">US-EST/EDT</option><option
value="5">US-CST/CDT</option><option value="6">US-MST/MDT</option><option
value="7">US-AZ</option><option value="8">US-PST/PDT</option><option value="9">
CST(AWST)</option><option value="10">JST(KST)</option><option value="11">
AEST/AEDT</option><option value="12">NZST/NZDT</option><option value="13">
North Korea</option></select><br>UTC offset: <input name="UO" type="number"
min="-65500" max="65500" required> seconds (max. 18 hours)<br>
Current local time is <span class="times">unknown</span>.<h3>Clock</h3>
Clock Overlay: <select name="OL" onchange="Cs()"><option value="0" id="cn"
selected="selected">None</option><option value="1" id="ca">Analog Clock</option>
<option value="2">Single Digit Clock</option><option value="3" id="cc">
Cronixie Clock</option></select><br><div id="coc">First LED: <input name="O1"
type="number" min="0" max="255" required> Last LED: <input name="O2"
type="number" min="0" max="255" required><br><div id="cac">12h LED: <input
name="OM" type="number" min="0" max="255" required><br>Show 5min marks: <input
type="checkbox" name="O5"><br></div>Seconds (as trail): <input type="checkbox"
name="OS"><br></div><div id="ccc">Cronixie Display: <input name="CX"
maxlength="6"><br>Cronixie Backlight: <input type="checkbox" name="CB"><br>
</div>Countdown Mode: <input type="checkbox" name="CE"><br>Countdown Goal:<br>
Year: 20 <input name="CY" type="number" min="0" max="99" required> Month: <input
name="CI" type="number" min="1" max="12" required> Day: <input name="CD"
type="number" min="1" max="31" required><br>Hour: <input name="CH"
type="number" min="0" max="23" required> Minute: <input name="CM" type="number"
min="0" max="59" required> Second: <input name="CS" type="number" min="0"
max="59" required><br><h3>Advanced Macros</h3>Define API macros here:<br>1:
<input name="M1" maxlength="64"><br>2: <input name="M2" maxlength="64"><br>3:
<input name="M3" maxlength="64"><br>4: <input name="M4" maxlength="64"><br>5:
<input name="M5" maxlength="64"><br>6: <input name="M6" maxlength="64"><br>7:
<input name="M7" maxlength="64"><br>8: <input name="M8" maxlength="64"><br>9:
<input name="M9" maxlength="64"><br>10: <input name="M10" maxlength="64"><br>
11: <input name="M11" maxlength="64"><br>12: <input name="M12" maxlength="64">
<br>13: <input name="M13" maxlength="64"><br>14: <input name="M14"
maxlength="64"><br>15: <input name="M15" maxlength="64"><br>16: <input
name="M16" maxlength="64"><br><br><i>
Use 0 for the default action instead of a macro</i><br>Boot Macro: <input
name="MB" type="number" min="0" max="16" required><br>Alexa On/Off Macros:
<input name="A0" type="number" min="0" max="16" required> <input name="A1"
type="number" min="0" max="16" required><br>Button short press macro: Macro:
<input name="MP" type="number" min="0" max="16" required><br>Long Press: <input
name="ML" type="number" min="0" max="16" required> Double press: <input
name="MD" type="number" min="0" max="16" required><br>Countdown-Over Macro:
<input name="MC" type="number" min="0" max="16" required><br>
Timed-Light-Over Macro: <input name="MN" type="number" min="0" max="16"
@ -307,12 +317,13 @@ required><br>Time-Controlled Macros:<br><div style="display:inline-block"><table
const char PAGE_settings_sec[] PROGMEM = R"=====(<!DOCTYPE html><html><head><meta name="viewport" content="width=500"><meta
charset="utf-8"><title>Misc Settings</title><script>
function H(){window.open("https://github.com/Aircoookie/WLED/wiki/Settings#security-settings")}function B(){window.open("/settings","_self")}function U(){window.open("/update","_self")}function GetV() {var d=document;
%CSS%%SCSS%</head><body onload="GetV()"><form id="form_s" name="Sf" method="post">
<div class="helpB"><button type="button" onclick="H()">?</button></div><button
type="button" onclick="B()">Back</button><button type="submit">Save & Reboot
</button><hr><h2>Security & Update setup</h2>
Lock wireless (OTA) software update: <input type="checkbox" name="NO"><br>
Passphrase: <input type="password" name="OP" maxlength="32"><br>
%CSS%%SCSS%</head><body onload="GetV()">
<form id="form_s" name="Sf" method="post"><div class="helpB"><button
type="button" onclick="H()">?</button></div><button type="button" onclick="B()">
Back</button><button type="submit">Save & Reboot</button><hr><h2>
Security & Update setup</h2>Lock wireless (OTA) software update: <input
type="checkbox" name="NO"><br>Passphrase: <input type="password" name="OP"
maxlength="32"><br>
To enable OTA, for security reasons you need to also enter the correct password!
<br>The password should be changed when OTA is enabled.<br><b>
Disable OTA when not in use, otherwise an attacker can reflash device software!

2053
wled00/html_ui.h
View File

File diff suppressed because it is too large Load Diff