Skip to content

Commit ea3358e

Browse files
committed
Autodiscovery improvements
1 parent 6c997f5 commit ea3358e

File tree

8 files changed

+167
-164
lines changed

8 files changed

+167
-164
lines changed

wled00/NodeStruct.cpp

Lines changed: 0 additions & 16 deletions
This file was deleted.

wled00/NodeStruct.h

Lines changed: 10 additions & 10 deletions
Original file line numberDiff line numberDiff line change
@@ -1,5 +1,5 @@
1-
#ifndef DATASTRUCTS_NODESTRUCT_H
2-
#define DATASTRUCTS_NODESTRUCT_H
1+
#ifndef WLED_NODESTRUCT_H
2+
#define WLED_NODESTRUCT_H
33

44
/*********************************************************************************************\
55
* NodeStruct from the ESP Easy project (https://github.com/letscontrolit/ESPEasy)
@@ -8,27 +8,27 @@
88
#include <map>
99
#include <IPAddress.h>
1010

11-
1211
#define NODE_TYPE_ID_UNDEFINED 0
13-
#define NODE_TYPE_ID_ESP8266 1
14-
#define NODE_TYPE_ID_ESP32 2
15-
16-
String getNodeTypeDisplayString(uint8_t nodeType);
12+
#define NODE_TYPE_ID_ESP8266 8266
13+
#define NODE_TYPE_ID_ESP32 32
1714

1815
/*********************************************************************************************\
1916
* NodeStruct
2017
\*********************************************************************************************/
2118
struct NodeStruct
2219
{
23-
NodeStruct();
24-
2520
String nodeName;
2621
IPAddress ip;
2722
uint8_t unit;
2823
uint8_t age;
2924
uint8_t nodeType;
3025
uint32_t build;
26+
27+
NodeStruct() : age(0), nodeType(0), build(0)
28+
{
29+
for (uint8_t i = 0; i < 4; ++i) { ip[i] = 0; }
30+
}
3131
};
3232
typedef std::map<uint8_t, NodeStruct> NodesMap;
3333

34-
#endif // DATASTRUCTS_NODESTRUCT_H
34+
#endif // WLED_NODESTRUCT_H

wled00/const.h

Lines changed: 7 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -187,4 +187,11 @@
187187
#define JSON_BUFFER_SIZE 16384
188188
#endif
189189

190+
// Maximum size of node map (list of other WLED instances)
191+
#ifdef ESP8266
192+
#define WLED_MAX_NODES 15
193+
#else
194+
#define WLED_MAX_NODES 150
195+
#endif
196+
190197
#endif

wled00/data/index.css

Lines changed: 17 additions & 10 deletions
Original file line numberDiff line numberDiff line change
@@ -90,9 +90,10 @@ button {
9090

9191
#namelabel {
9292
position: fixed;
93-
bottom: calc(var(--bh) + 5px);
93+
bottom: calc(var(--bh) + 6px);
9494
right: 4px;
9595
color: var(--c-6);
96+
cursor: pointer;
9697
writing-mode: vertical-rl;
9798
}
9899

@@ -148,10 +149,6 @@ button {
148149
padding-bottom: 8px;
149150
}
150151

151-
.valtd i {
152-
font-size: small;
153-
}
154-
155152
.slider-icon
156153
{
157154
transform: translate(6px,3px);
@@ -207,10 +204,6 @@ button {
207204
background-color: var(--c-tb);
208205
}
209206

210-
#btnNodes {
211-
display: none;
212-
}
213-
214207
.tab button {
215208
background-color: transparent;
216209
float: left;
@@ -378,6 +371,14 @@ button {
378371
z-index: 2;
379372
}
380373

374+
#ndlt {
375+
margin: 12px 0;
376+
}
377+
378+
.valtd i {
379+
font-size: 14px;
380+
}
381+
381382
#roverstar {
382383
position: fixed;
383384
top: calc(var(--th) + 5px);
@@ -938,8 +939,14 @@ input[type=number]::-webkit-outer-spin-button {
938939
}
939940
}
940941

942+
@media all and (max-width: 770px) {
943+
#buttonNodes {
944+
display: none;
945+
}
946+
}
947+
941948
@media all and (max-width: 1249px) {
942-
#buttonPcm, #buttonNo {
949+
#buttonPcm {
943950
display: none;
944951
}
945952
}

wled00/data/index.htm

Lines changed: 24 additions & 21 deletions
Original file line numberDiff line numberDiff line change
@@ -23,11 +23,11 @@
2323
<button id="buttonNl" onclick="toggleNl()"><i class="icons">&#xe2a2;</i><p class="tab-label">Timer</p></button>
2424
<button id="buttonSync" onclick="toggleSync()"><i class="icons">&#xe116;</i><p class="tab-label">Sync</p></button>
2525
<button id="buttonSr" onclick="toggleLiveview()"><i class="icons">&#xe410;</i><p class="tab-label">Peek</p></button>
26-
<button id="buttonI" onclick="toggleInfo()"><i class="icons">&#xe34b;</i><p class="tab-label">Info</p></button>
26+
<button id="buttonI" onclick="toggleInfo()"><i class="icons">&#xe34b;</i><p class="tab-label">Info</p></button>
27+
<button id="buttonNodes" onclick="toggleNodes()"><i class="icons">&#xe22d;</i><p class="tab-label">Nodes</p></button></div>
2728
<button onclick="window.location.href = '/settings';"><i class="icons">&#xe0a2;</i><p class="tab-label">Config</p></button>
28-
<button id="buttonPcm" onclick="togglePcMode(true)"><i class="icons">&#xe23d;</i><p class="tab-label">PC Mode</p></button>
29-
<button id="buttonNo" onclick="toggleNodes()"><i class="icons">&#xe22d;</i><p class="tab-label">Nodes</p></button>
30-
</div>
29+
<button id="buttonPcm" onclick="togglePcMode(true)"><i class="icons">&#xe23d;</i><p class="tab-label">PC Mode</p></button>
30+
</div>
3131
<div id="briwrap">
3232
<p class="hd">Brightness</p>
3333
<div class="il">
@@ -67,17 +67,17 @@
6767
</div>
6868
</div>
6969
<div id="qcs-w">
70-
<div class="qcs" onclick="pC('#ff0000');" style="background-color:#ff0000;"></div>
71-
<div class="qcs" onclick="pC('#ffa000');" style="background-color:#ffa000;"></div>
72-
<div class="qcs" onclick="pC('#ffc800');" style="background-color:#ffc800;"></div>
73-
<div class="qcs" onclick="pC('#ffe0a0');" style="background-color:#ffe0a0;"></div>
74-
<div class="qcs" onclick="pC('#ffffff');" style="background-color:#ffffff;"></div>
75-
<div class="qcs qcsb" onclick="pC('#000000');" style="background-color:#000000;"></div><br>
76-
<div class="qcs" onclick="pC('#ff00ff');" style="background-color:#ff00ff;"></div>
77-
<div class="qcs" onclick="pC('#0000ff');" style="background-color:#0000ff;"></div>
78-
<div class="qcs" onclick="pC('#00ffc8');" style="background-color:#00ffc8;"></div>
79-
<div class="qcs" onclick="pC('#08ff00');" style="background-color:#08ff00;"></div>
80-
<div class="qcs" onclick="pC('rnd');" style="background-color:var(--c-3); padding: 4px 8px; transform: translateY(-10px);">R</div>
70+
<div class="qcs" onclick="pC('#ff0000');" title="Red" style="background-color:#ff0000;"></div>
71+
<div class="qcs" onclick="pC('#ffa000');" title="Orange" style="background-color:#ffa000;"></div>
72+
<div class="qcs" onclick="pC('#ffc800');" title="Yellow" style="background-color:#ffc800;"></div>
73+
<div class="qcs" onclick="pC('#ffe0a0');" title="Warm White" style="background-color:#ffe0a0;"></div>
74+
<div class="qcs" onclick="pC('#ffffff');" title="White" style="background-color:#ffffff;"></div>
75+
<div class="qcs qcsb" onclick="pC('#000000');" title="Black" style="background-color:#000000;"></div><br>
76+
<div class="qcs" onclick="pC('#ff00ff');" title="Pink" style="background-color:#ff00ff;"></div>
77+
<div class="qcs" onclick="pC('#0000ff');" title="Blue" style="background-color:#0000ff;"></div>
78+
<div class="qcs" onclick="pC('#00ffc8');" title="Cyan" style="background-color:#00ffc8;"></div>
79+
<div class="qcs" onclick="pC('#08ff00');" title="Green" style="background-color:#08ff00;"></div>
80+
<div class="qcs" onclick="pC('rnd');" title="Random" style="background-color:var(--c-3); padding: 4px 8px; transform: translateY(-10px);">R</div>
8181
</div>
8282
<div id="csl">
8383
<button class="xxs cl btn" onclick="selectSlot(0);">1</button>
@@ -166,28 +166,30 @@
166166
<button class="tablinks" onclick="openTab(1)"><i class="icons">&#xe23d;</i><p class="tab-label">Effects</p></button>
167167
<button class="tablinks" onclick="openTab(2)"><i class="icons">&#xe34b;</i><p class="tab-label">Segments</p></button>
168168
<button class="tablinks" onclick="openTab(3)"><i class="icons">&#xe04c;</i><p class="tab-label">Favorites</p></button>
169-
<button id="btnNodes" class="tablinks" onclick="toggleNodes()"><i class="icons">&#xe22d;</i><p class="tab-label">Nodes</p></button>
170169
</div>
171170

172171
<div id="connind"></div>
173172
<div id="toast"></div>
174-
<div id="namelabel"></div>
173+
<div id="namelabel" onclick="toggleNodes()"></div>
175174
<div id="info" class="modal">
176175
<div id="imgw">
177176
<img alt="" src="data:image/png;base64,iVBORw0KGgoAAAANSUhEUgAAAggAAACMCAYAAAAZQlGEAAAAAXNSR0IArs4c6QAAAARnQU1BAACxjwv8YQUAAAAJcEhZcwAADsMAAA7DAcdvqGQAAAKLSURBVHhe7dgxjtwwEADBpf//5zUDwklnpzFAnKoSTigNFTT0AQAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAGDcOieX+G5nvNLaznil6f1Nv+/tz3c7+3tmen/Tpu/jbe877c85AQD+EQgAQAgEACAEAgAQAgEACIEAAIRAAABCIAAAIRAAgBAIAEAIBAAgBAIAEAIBAAiBAACEQAAAQiAAACEQAIAQCABACAQAINY5+aHvdsYRazvjK9jfM7fvz/0+Y3+/2+336w8CABACAQAIgQAAhEAAAEIgAAAhEACAEAgAQAgEACAEAgAQAgEACIEAAIRAAABCIAAAIRAAgBAIAEAIBAAgBAIAEAIBAAiBAADEOudrfLczXmltZ3yF6fuwv2em9+d+n5ne3zT3cZfp+/AHAQAIgQAAhEAAAEIgAAAhEACAEAgAQAgEACAEAgAQAgEACIEAAIRAAABCIAAAIRAAgBAIAEAIBAAgBAIAEAIBAAiBAACEQAAAYp3zNb7bGUes7Yz8wO334fmeuf35bmd/z9y+v9ufzx8EACAEAgAQAgEACIEAAIRAAABCIAAAIRAAgBAIAEAIBAAgBAIAEAIBAAiBAACEQAAAQiAAACEQAIAQCABACAQAIAQCABACAQCIdc4x3+2MV1rbGfmFpr+/6e/l9ue73fT+pt1+H2/bn+/lGX8QAIAQCABACAQAIAQCABACAQAIgQAAhEAAAEIgAAAhEACAEAgAQAgEACAEAgAQAgEACIEAAIRAAABCIAAAIRAAgBAIAEAIBAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAgP/u8/kLYCqAxINTyZkAAAAASUVORK5CYII=">
178177
</div><br>
179178
<div id="kv">Loading...</div><br>
180179
<button class="btn infobtn" onclick="requestJson(null)">Refresh</button>
181180
<button class="btn infobtn" onclick="toggleInfo()">Close Info</button><br>
182-
<button class="btn infobtn" onclick="openGH()">WLED Wiki</button>
181+
<button class="btn infobtn" onclick="toggleNodes()">Instance List</button>
183182
<button class="btn infobtn" id="resetbtn" onclick="cnfReset()">Reboot WLED</button><br>
184183
<span class="h">Made with <span id="heart">&#10084;&#xFE0E;</span> by Aircoookie and the WLED community</span>
185184
</div>
185+
186186
<div id="nodes" class="modal">
187-
<div id="kn">Loading...</div><br>
188-
<button class="btn infobtn" onclick="requestJson(null)">Refresh</button>
189-
<button class="btn infobtn" onclick="toggleNodes()">Close</button><br>
187+
<div id="ndlt">Other WLED instances on network</div>
188+
<div id="kn">Loading...</div><br>
189+
<button class="btn infobtn" onclick="loadNodes()">Refresh</button>
190+
<button class="btn infobtn" onclick="toggleNodes()">Close list</button><br>
190191
</div>
192+
191193
<div id="rover" class="modal">
192194
<i class="icons huge">&#xe410;</i><br>
193195
<div id="lv">?</div><br><br>
@@ -197,6 +199,7 @@
197199
<button class="btn" onclick="setLor(2)">Override until reboot</button><br>
198200
<span class="h">For best performance, it is recommended to turn off the streaming source when not in use.</span>
199201
</div>
202+
200203
<i id="roverstar" class="icons huge" onclick="setLor(0)">&#xe410;</i><br>
201204
<script src="iro.js"></script>
202205
<script src="rangetouch.js"></script>

wled00/data/index.js

Lines changed: 68 additions & 42 deletions
Original file line numberDiff line numberDiff line change
@@ -443,35 +443,6 @@ function populatePresets(fromls)
443443
populateQL();
444444
}
445445

446-
function populateNodes(i)
447-
{
448-
var cn="";
449-
var urows="";
450-
if (i.nodes) {
451-
i.nodes.sort((a,b) => (a.name).localeCompare(b.name));
452-
for (var x=0;x<i.nodes.length;x++) {
453-
var o = i.nodes[x];
454-
if (o.name) {
455-
var url = `<button class="btn btna-icon tab" onclick="location.assign('http://${o.ip}');">${o.name}</button>`;
456-
urows += inforow(url,`${o.type}<br><i>${o.build==0?"N/A":o.build}</i>`);
457-
}
458-
}
459-
if (i.nodes.length>0) {
460-
var botButtons = d.querySelectorAll('.bot button');
461-
for (btn of botButtons) {
462-
btn.style.width = '20%';
463-
}
464-
d.getElementById('btnNodes').style.display = "inline";
465-
} else
466-
d.getElementById('btnNodes').style.display = "none";
467-
}
468-
cn += `<table class="infot">
469-
${urows}
470-
${inforow("Current node:",i.name)}
471-
</table>`;
472-
d.getElementById('kn').innerHTML = cn;
473-
}
474-
475446
function populateInfo(i)
476447
{
477448
var cn="";
@@ -492,16 +463,7 @@ function populateInfo(i)
492463
}
493464
}
494465
}
495-
if (i.nodes) {
496-
for (var x=0;x<i.nodes.length;x++)
497-
{
498-
var o = i.nodes[x];
499-
if (o.name) {
500-
var url = `<button class="btn btna-icon tab" onclick="location.assign('http://${o.ip}');">${o.name}</button>`;
501-
urows += inforow(url,o.type);
502-
}
503-
}
504-
}
466+
505467
var vcn = "Kuuhaku";
506468
if (i.ver.startsWith("0.11.")) vcn = "Mirai";
507469
if (i.cn) vcn = i.cn;
@@ -604,6 +566,69 @@ function populateSegments(s)
604566
d.getElementById('rsbtn').style.display = (segCount > 1) ? "inline":"none";
605567
}
606568

569+
function btype(b){
570+
switch (b) {
571+
case 1: return "ESP8266";
572+
case 32: return "ESP32";
573+
case 8266: return "ESP8266";
574+
}
575+
return "?";
576+
}
577+
function bname(o){
578+
if (o.name=="WLED") return o.ip;
579+
return o.name;
580+
}
581+
582+
function populateNodes(i,n)
583+
{
584+
var cn="";
585+
var urows="";
586+
var nnodes = 0;
587+
if (n.nodes) {
588+
n.nodes.sort((a,b) => (a.name).localeCompare(b.name));
589+
for (var x=0;x<n.nodes.length;x++) {
590+
var o = n.nodes[x];
591+
if (o.name) {
592+
var url = `<button class="btn btna-icon tab" onclick="location.assign('http://${o.ip}');">${bname(o)}</button>`;
593+
urows += inforow(url,`${btype(o.type)}<br><i>${o.vid==0?"N/A":o.vid}</i>`);
594+
nnodes++;
595+
}
596+
}
597+
}
598+
if (nnodes == 0) cn += `No other instances found.`;
599+
cn += `<table class="infot">
600+
${urows}
601+
${inforow("Current node:",i.name)}
602+
</table>`;
603+
d.getElementById('kn').innerHTML = cn;
604+
}
605+
606+
function loadNodes()
607+
{
608+
var url = '/json/nodes';
609+
if (loc) {
610+
url = `http://${locip}/json/nodes`;
611+
}
612+
613+
fetch
614+
(url, {
615+
method: 'get'
616+
})
617+
.then(res => {
618+
if (!res.ok) {
619+
showToast('Could not load Node list!', true);
620+
}
621+
return res.json();
622+
})
623+
.then(json => {
624+
populateNodes(lastinfo, json);
625+
})
626+
.catch(function (error) {
627+
showToast(error, true);
628+
console.log(error);
629+
});
630+
}
631+
607632
function updateTrail(e, slidercol)
608633
{
609634
if (e==null) return;
@@ -804,7 +829,6 @@ function requestJson(command, rinfo = true, verbose = true) {
804829
s = json.state;
805830
displayRover(info, s);
806831
}
807-
populateNodes(info);
808832
isOn = s.on;
809833
d.getElementById('sliderBri').value= s.bri;
810834
nlA = s.nl.on;
@@ -908,17 +932,19 @@ function toggleLiveview() {
908932
}
909933

910934
function toggleInfo() {
935+
if (isNodes) toggleNodes();
911936
isInfo = !isInfo;
912937
if (isInfo) populateInfo(lastinfo);
913938
d.getElementById('info').style.transform = (isInfo) ? "translateY(0px)":"translateY(100%)";
914939
d.getElementById('buttonI').className = (isInfo) ? "active":"";
915940
}
916941

917942
function toggleNodes() {
943+
if (isInfo) toggleInfo();
918944
isNodes = !isNodes;
919-
if (isNodes) populateNodes(lastinfo);
920945
d.getElementById('nodes').style.transform = (isNodes) ? "translateY(0px)":"translateY(100%)";
921-
d.getElementById('buttonNo').className = (isNodes) ? "active":"";
946+
d.getElementById('buttonNodes').className = (isNodes) ? "active":"";
947+
if (isNodes) loadNodes();
922948
}
923949

924950
function makeSeg() {

0 commit comments

Comments
 (0)