Sync Interfaces settings: hide sections for disabled features (#2865)

* Add network debug printer

* hide settings for disabled features

If not enabled at compile time, this change hides "Sync interfaces" settings for Alexa, MQTT, Blynk, HueSync.
The html sections are just hidden by a <div> with style display:none.

* Update Animated Staircas for 0.14

* Faster strip updates.

* Add ESP32 variant display in update page.

* Net debug optimizations

Fix ESP8266 (unaligned progmem flash string reads)
Do not send an extra package for \n in println
Only resolve IP/hostname once

* Compile time option for PIR sensor off timer

* Fix Gitpod compiling (#2875)

* Install Platformio not in Gitpod Image

* Install platformio at runtime

remove outdated extensions

* Bugfix for color transitioning.
Return palette option for Candle.
Fix for "* Color..." palette hiding.
Comment out debug output.

* Optimization & bugfix for net debug.
- Inherited from Print class.
- Added UI option to disable net  debug output.

* Reduce fxdata size by about 200 bytes

Removed redundant commas before semicolon delimiter (`,;` -> `;`)
No need to transmit `@` in /json/fxdata

* NetworkDebugPrinter packet optimization.

* Revert NetworkDebugPrinter changes.

* Remove flush() in bus manager.

* Optimizations.

Co-authored-by: Shaheen Gandhi <shaheen@fb.com>
Co-authored-by: Blaz Kristan <blaz@kristan-sp.si>
Co-authored-by: cschwinne <dev.aircoookie@gmail.com>
Co-authored-by: Jason2866 <24528715+Jason2866@users.noreply.github.com>
This commit is contained in:
Frank 2022-11-11 20:20:11 +01:00 committed by GitHub
parent 61b5e5ad7e
commit 50875d5759
No known key found for this signature in database
GPG Key ID: 4AEE18F83AFDEB23
7 changed files with 1076 additions and 1027 deletions

View File

@ -70,7 +70,7 @@
function addPanel(i=0) {
let p = gId("panels");
if (p.children.length >= maxPanels) return;
let b = `<div id="pnl${i}">${i===0?"":'<hr style="width:260px">'}Panel ${i}<br>1<sup>st</sup> LED: <select name="P${i}B">
let b = `<div id="pnl${i}">${i===0?"":'<hr class="sml">'}Panel ${i}<br>1<sup>st</sup> LED: <select name="P${i}B">
<option value="0">Top</option>
<option value="1">Bottom</option>
</select><select name="P${i}R">
@ -134,11 +134,11 @@ Serpentine: <input type="checkbox" name="P${i}S"></div>`;
<option value="1">Vertical</option>
</select><br>
Serpentine: <input type="checkbox" name="PS">
<hr style="width:260px">
<hr class="sml">
<i>A matrix is made of 1 or more physical LED panels of the same dimensions.<br>
Panels should be arranged from top-left to bottom-right order, starting with lower panel number on the left (or top if transposed).<br>
Each panel can have different LED orientation and/or starting point and/or layout.</i><br>
<hr style="width:260px">
<hr class="sml">
<h3>LED panel layout</h3>
<div id="panels">
</div>

View File

@ -322,7 +322,7 @@
if (n==1) {
// npm run build has trouble minimizing spaces inside string
var cn = `<div class="iST">
<hr style="width:260px">
<hr class="sml">
${i+1}:
<select name="LT${i}" onchange="UI(true)">
<option value="22" selected>WS281x</option>
@ -388,7 +388,7 @@ ${i+1}:
if (i >= 10) return;
var b = `<div class="com_entry">
<hr style="width:260px">
<hr class="sml">
${i+1}: Start: <input type="number" name="XS${i}" id="xs${i}" class="l starts" min="0" max="65535" value="${start}" oninput="UI();" required="">&nbsp;
Length: <input type="number" name="XC${i}" id="xc${i}" class="l" min="1" max="65535" value="${len}" required="" oninput="UI()">
<div style="display:inline">Color Order:
@ -594,7 +594,7 @@ Length: <input type="number" name="XC${i}" id="xc${i}" class="l" min="1" max="65
</div>
<h3>Hardware setup</h3>
<div id="mLC">LED outputs:</div>
<hr style="width:260px">
<hr class="sml">
<button type="button" id="+" onclick="addLEDs(1,false)">+</button>
<button type="button" id="-" onclick="addLEDs(-1,false)">-</button><br>
LED Memory Usage: <span id="m0">0</span> / <span id="m1">?</span> B<br>
@ -603,19 +603,19 @@ Length: <input type="number" name="XC${i}" id="xc${i}" class="l" min="1" max="65
&#9888; You might run into stability or lag issues.<br>
Use less than <span id="wreason">800 LEDs per output</span> for the best experience!<br>
</div>
<hr style="width:260px">
<hr class="sml">
Make a segment for each output: <input type="checkbox" name="MS"><br>
Custom bus start indices: <input type="checkbox" onchange="tglSi(this.checked)" id="si"><br>
Use global LED buffer: <input type="checkbox" name="LD"><br>
<hr style="width:260px">
<hr class="sml">
<div id="color_order_mapping">
Color Order Override:
<div id="com_entries"></div>
<hr style="width:260px">
<hr class="sml">
<button type="button" id="com_add" onclick="addCOM()">+</button>
<button type="button" id="com_rem" onclick="remCOM()">-</button><br>
</div>
<hr style="width:260px">
<hr class="sml">
<div id="btns"></div>
Touch threshold: <input type="number" class="s" min="0" max="100" name="TT" required><br>
IR GPIO: <input type="number" min="-1" max="48" name="IR" onchange="UI()" class="xs"><select name="IT" onchange="UI()">
@ -633,7 +633,7 @@ Length: <input type="number" name="XC${i}" id="xc${i}" class="l" min="1" max="65
<div id="json" style="display:none;">JSON file: <input type="file" name="data" accept=".json"><button type="button" class="sml" onclick="uploadFile('/ir.json')">Upload</button><br></div>
<a href="https://kno.wled.ge/interfaces/infrared/" target="_blank">IR info</a><br>
Relay GPIO: <input type="number" min="-1" max="48" name="RL" onchange="UI()" class="xs"> Invert <input type="checkbox" name="RM"><span style="cursor: pointer;" onclick="off('RL')">&nbsp;&#x2715;</span><br>
<hr style="width:260px">
<hr class="sml">
<h3>Defaults</h3>
Turn LEDs on after power up/reset: <input type="checkbox" name="BO"><br>
Default brightness: <input name="CA" type="number" class="m" min="0" max="255" required> (0-255)<br><br>
@ -679,7 +679,7 @@ Length: <input type="number" name="XC${i}" id="xc${i}" class="l" min="1" max="65
<option value="3">None (not recommended)</option>
</select><br>
Target refresh rate: <input type="number" class="s" min="1" max="120" name="FR" required> FPS
<hr style="width:260px">
<hr class="sml">
<div id="cfg">Config template: <input type="file" name="data2" accept=".json"><button type="button" class="sml" onclick="loadCfg(d.Sf.data2)">Apply</button><br></div>
<hr>
<button type="button" onclick="B()">Back</button><button type="submit">Save</button>

View File

@ -7,10 +7,8 @@
<title>Sync Settings</title>
<script>var d=document;
var loc = false, locip;
function gId(s)
{
return d.getElementById(s);
}
function gId(s){return d.getElementById(s);}
function toggle(el){gId(el).classList.toggle("hide"); gId('No'+el).classList.toggle("hide");}
function H(){window.open("https://kno.wled.ge/interfaces/udp-notifier/");}
function B(){window.open("/settings","_self");}
function adj(){if (d.Sf.DI.value == 6454) {if (d.Sf.EU.value == 1) d.Sf.EU.value = 0;}
@ -81,11 +79,11 @@
<h2>Sync setup</h2>
<h3>WLED Broadcast</h3>
UDP Port: <input name="UP" type="number" min="1" max="65535" class="d5" required><br>
2nd Port: <input name="U2" type="number" min="1" max="65535" class="d5" required><br><br>
2nd Port: <input name="U2" type="number" min="1" max="65535" class="d5" required><br>
<h3>Sync grups</h3>
<input name="GS" id="GS" type="number" style="display: none;"><!-- hidden inputs for bitwise group checkboxes -->
<input name="GR" id="GR" type="number" style="display: none;">
<table style="margin: 0 auto;">
<tr><td colspan="9" style="text-align:center">Sync groups</td></tr>
<tr>
<td></td>
<td>1</td>
@ -129,9 +127,11 @@ Send Philips Hue change notifications: <input type="checkbox" name="SH"><br>
Send Macro notifications: <input type="checkbox" name="SM"><br>
UDP packet retransmissions: <input name="UR" type="number" min="0" max="30" class="d5" required><br><br>
<i>Reboot required to apply changes. </i>
<hr class="sml">
<h3>Instance List</h3>
Enable instance list: <input type="checkbox" name="NL"><br>
Make this instance discoverable: <input type="checkbox" name="NB">
<hr class="sml">
<h3>Realtime</h3>
Receive UDP realtime: <input type="checkbox" name="RD"><br>
Use main segment only: <input type="checkbox" name="MO"><br><br>
@ -163,20 +163,38 @@ Timeout: <input name="ET" type="number" min="1" max="65000" required> ms<br>
Force max brightness: <input type="checkbox" name="FB"><br>
Disable realtime gamma correction: <input type="checkbox" name="RG"><br>
Realtime LED offset: <input name="WO" type="number" min="-255" max="255" required>
<hr class="sml">
<h3>Alexa Voice Assistant</h3>
<div id="NoAlexa" class="hide">
<em style="color:#fa0;">This firmware build does not include Alexa support.<br></em><br>
</div>
<div id="Alexa">
Emulate Alexa device: <input type="checkbox" name="AL"><br>
Alexa invocation name: <input type="text" name="AI" maxlength="32"><br>
Also emulate devices to call the first <input name="AP" type="number" class="s" min="0" max="9" required> presets
<h3>Blynk</h3>
<b>Blynk, MQTT and Hue sync all connect to external hosts!<br>
This may impact the responsiveness of the ESP8266.</b><br>
Also emulate devices to call the first <input name="AP" type="number" class="s" min="0" max="9" required> presets<br><br>
</div>
<hr class="sml">
<div style="color: #fa0;">&#9888; <b>Blynk, MQTT and Hue sync all connect to external hosts!<br>
This may impact the responsiveness of WLED.</b><br>
</div>
For best results, only use one of these services at a time.<br>
(alternatively, connect a second ESP to them and use the UDP sync)<br><br>
(alternatively, connect a second ESP to them and use the UDP sync)
<hr class="sml">
<h3>Blynk</h3>
<div id="NoBlynk" class="hide">
<em style="color:#fa0;">This firmware build does not include Blynk support.<br></em>
</div>
<div id="Blynk">
Host: <input type="text" name="BH" maxlength="32">
Port: <input name="BP" type="number" min="1" max="65535" value="80" class="d5"><br>
Device Auth token: <input name="BK" maxlength="33"><br>
<i>Clear the token field to disable. </i><a href="https://kno.wled.ge/interfaces/blynk/" target="_blank">Setup info</a>
</div>
<h3>MQTT</h3>
<div id="NoMQTT" class="hide">
<em style="color:#fa0;">This firmware build does not include MQTT support.<br></em>
</div>
<div id="MQTT">
Enable MQTT: <input type="checkbox" name="MQ"><br>
Broker: <input type="text" name="MS" maxlength="32">
Port: <input name="MQPORT" type="number" min="1" max="65535" class="d5"><br>
@ -189,7 +207,12 @@ Device Topic: <input type="text" name="MD" maxlength="32"><br>
Group Topic: <input type="text" name="MG" maxlength="32"><br>
Publish on button press: <input type="checkbox" name="BM"><br>
<i>Reboot required to apply changes. </i><a href="https://kno.wled.ge/interfaces/mqtt/" target="_blank">MQTT info</a>
</div>
<h3>Philips Hue</h3>
<div id="NoHue" class="hide">
<em style="color:#fa0;">This firmware build does not include Philips Hue support.<br></em>
</div>
<div id="Hue">
<i>You can find the bridge IP and the light number in the 'About' section of the hue app.</i><br>
Poll Hue light <input name="HL" type="number" min="1" max="99" > every <input name="HI" type="number" min="100" max="65000"> ms: <input type="checkbox" name="HP"><br>
Then, receive <input type="checkbox" name="HO"> On/Off, <input type="checkbox" name="HB"> Brightness, and <input type="checkbox" name="HC"> Color<br>
@ -201,6 +224,7 @@ Hue Bridge IP:<br>
<b>Press the pushlink button on the bridge, after that save this page!</b><br>
(when first connecting)<br>
Hue status: <span class="sip"> Disabled in this build </span>
</div>
<h3>Serial</h3>
Baud rate:
<select name=BD>

View File

@ -106,7 +106,7 @@
}
function addField(k,f,o,a=false) { //key, field, (sub)object, isArray
if (isO(o)) {
urows += '<hr style="width:260px">';
urows += '<hr class="sml">';
for (const [s,v] of Object.entries(o)) {
// possibility to nest objects (only 1 level)
if (f!=='unknown' && !k.includes(":")) addField(k+":"+f,s,v);
@ -236,7 +236,7 @@
<i style="color: orange;">(only changable on ESP32, change requires reboot!)</i><br>
SDA:<input type="number" min="-1" max="48" name="SDA" onchange="check(this,'if')" class="s" placeholder="SDA">
SCL:<input type="number" min="-1" max="48" name="SCL" onchange="check(this,'if')" class="s" placeholder="SCL">
<hr style="width:260px">
<hr class="sml">
Global SPI GPIOs (HW)<br>
<i style="color: orange;">(only changable on ESP32, change requires reboot!)</i><br>
MOSI:<input type="number" min="-1" max="48" name="MOSI" onchange="check(this,'if')" class="s" placeholder="MOSI">

View File

@ -13,6 +13,9 @@ body {
hr {
border-color: #666;
}
hr.sml {
width: 260px;
}
a, a:hover {
color: #28f;
text-decoration: none;
@ -52,6 +55,9 @@ button.sml {
position: absolute;
width: 60px;
}
.hide {
display: none;
}
input {
background: #333;
color: #fff;

File diff suppressed because it is too large Load Diff

View File

@ -510,10 +510,15 @@ void getSettingsJS(byte subPage, char* dest)
sappends('s',SET_F("AI"),alexaInvocationName);
sappend('c',SET_F("SA"),notifyAlexa);
sappend('v',SET_F("AP"),alexaNumPresets);
#ifdef WLED_DISABLE_ALEXA
oappend(SET_F("toggle('Alexa');")); // hide Alexa settings
#endif
sappends('s',SET_F("BK"),(char*)((blynkEnabled)?SET_F("Hidden"):""));
#ifndef WLED_DISABLE_BLYNK
sappends('s',SET_F("BH"),blynkHost);
sappend('v',SET_F("BP"),blynkPort);
#else
oappend(SET_F("toggle('Blynk');")); // hide BLYNK settings
#endif
#ifdef WLED_ENABLE_MQTT
@ -530,6 +535,8 @@ void getSettingsJS(byte subPage, char* dest)
sappends('s',"MD",mqttDeviceTopic);
sappends('s',SET_F("MG"),mqttGroupTopic);
sappend('c',SET_F("BM"),buttonPublishMqtt);
#else
oappend(SET_F("toggle('MQTT');")); // hide MQTT settings
#endif
#ifndef WLED_DISABLE_HUESYNC
@ -557,6 +564,8 @@ void getSettingsJS(byte subPage, char* dest)
}
sappends('m',SET_F("(\"sip\")[0]"),hueErrorString);
#else
oappend(SET_F("toggle('Hue');")); // hide Hue Sync settings
#endif
sappend('v',SET_F("BD"),serialBaud);
}