lba.gitea/WLED
1
0
Fork 0
Code Issues Pull Requests Packages Projects Releases Wiki Activity

Playlist editor UI changes & fixes.

Browse Source
This commit is contained in:
Blaz Kristan 2021-07-02 17:22:47 +02:00
parent ce725252cc
commit ccf047b1ab
4 changed files with 1932 additions and 1948 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

60
wled00/data/index.css
View File

File diff suppressed because one or more lines are too long

42
wled00/data/index.js
View File

@ -1266,6 +1266,7 @@ function makeSeg()
function resetUtil() function resetUtil()
{ {
gId('segutil').innerHTML = '<button class="btn btn-s btn-i" onclick="makeSeg()"><i class="icons btn-icon">&#xe18a;</i>Add segment</button><br>'; gId('segutil').innerHTML = '<button class="btn btn-s btn-i" onclick="makeSeg()"><i class="icons btn-icon">&#xe18a;</i>Add segment</button><br>';
for (var i=0; i<expanded.length; i++) if (expanded[i]) expand(i); // collapse all expanded elements
} }
var plJson = {"0":{ var plJson = {"0":{
@ -1294,7 +1295,7 @@ function refreshPlE(p) {
for (var i = 0; i < plJson[p].ps.length; i++) { for (var i = 0; i < plJson[p].ps.length; i++) {
content += makePlEntry(p,i); content += makePlEntry(p,i);
} }
content += `<div class="hrz hrz-pl"><button class="btn btn-i btn-pl-add" onclick="addPl(${p},${i})"><i class="icons btn-icon">&#xe18a;</i></button></div>`; content += `<div class="hrz"></div>`;
plEDiv.innerHTML = content; plEDiv.innerHTML = content;
var dels = plEDiv.getElementsByClassName("btn-pl-del"); var dels = plEDiv.getElementsByClassName("btn-pl-del");
if (dels.length < 2 && p > 0) dels[0].style.display = "none"; if (dels.length < 2 && p > 0) dels[0].style.display = "none";
@ -1357,21 +1358,21 @@ function makeP(i,pl) {
if (pl) { if (pl) {
var rep = plJson[i].repeat ? plJson[i].repeat : 0; var rep = plJson[i].repeat ? plJson[i].repeat : 0;
content = content =
`<div id="ple${i}"></div><label class="check revchkl">Shuffle `<div id="ple${i}" style="margin-top:10px;"></div><label class="check revchkl">Shuffle
<input type="checkbox" id="pl${i}rtgl" onchange="plR(${i})" ${plJson[i].r?"checked":""}> <input type="checkbox" id="pl${i}rtgl" onchange="plR(${i})" ${plJson[i].r||rep<0?"checked":""}>
<span class="checkmark schk"></span> <span class="checkmark schk"></span>
</label> </label>
<label class="check revchkl">Repeat indefinitely <label class="check revchkl">Repeat indefinitely
<input type="checkbox" id="pl${i}rptgl" onchange="plR(${i})" ${rep?"":"checked"}> <input type="checkbox" id="pl${i}rptgl" onchange="plR(${i})" ${rep>0?"":"checked"}>
<span class="checkmark schk"></span> <span class="checkmark schk"></span>
</label> </label>
<div id="pl${i}o1" style="display:${rep?"block":"none"}"> <div id="pl${i}o1" style="display:${rep>0?"block":"none"}">
<div class="c">Repeat <input class="noslide" type="number" id="pl${i}rp" oninput="plR(${i})" max=127 min=0 value=${rep>0?rep:1}> times</div> <div class="c">Repeat <input class="noslide" type="number" id="pl${i}rp" oninput="plR(${i})" max=127 min=0 value=${rep>0?rep:1}> times</div>
End preset:<br> <div class="sel">End preset:<br>
<select class="btn sel sel-ple" id="pl${i}selEnd" onchange="plR(${i})" data-val=${plJson[i].end?plJson[i].end:0}> <select class="sel sel-ple" id="pl${i}selEnd" onchange="plR(${i})" data-val=${plJson[i].end?plJson[i].end:0}>
<option value=0>None</option> <option value=0>None</option>
${plSelContent} ${plSelContent}
</select> </select></div>
</div> </div>
<div class="c"><button class="btn btn-i btn-p" onclick="testPl(${i}, this)"><i class='icons btn-icon'>&#xe139;</i>Test</button></div>`; <div class="c"><button class="btn btn-i btn-p" onclick="testPl(${i}, this)"><i class='icons btn-icon'>&#xe139;</i>Test</button></div>`;
} else } else
@ -1416,27 +1417,24 @@ ${(i>0)? ('<div class="h">ID ' +i+ '</div>'):""}`;
function makePUtil() function makePUtil()
{ {
gId('putil').innerHTML = `<div class="seg pres"><div class="segin expanded">${makeP(0)}</div></div>`; gId('putil').innerHTML = `<div class="seg pres"><div class="segin expanded">${makeP(0)}</div></div>`;
// updateTrail(gId('p0p')); for (var i=0; i<expanded.length; i++) if (expanded[i]) expand(i); // collapse all expanded elements
for (var i=0; i<expanded.length; i++) if (expanded[i]) expand(i); // collapse all expanded presets
} }
function makePlEntry(p,i) { function makePlEntry(p,i) {
return ` return `<div class="plentry">
<div class="plentry"> <div class="hrz"></div>
${i>0?'<div class="hrz"></div>':''}
${i+1}:
<select class="btn sel sel-pl" onchange="plePs(${p},${i},this)" data-val="${plJson[p].ps[i]}" data-index="${i}">
${plSelContent}
</select>
<table class="segt"> <table class="segt">
<tr> <tr>
<td width="35%">Duration (s)</td> <td width="80%" colspan=2>
<td width="40%">Transition (s)</td> <select class="sel sel-pl" onchange="plePs(${p},${i},this)" data-val="${plJson[p].ps[i]}" data-index="${i}">
<td></td> ${plSelContent}
</select>
</td>
<td><button class="btn btn-i btn-pl-add" onclick="addPl(${p},${i})"><i class="icons btn-icon">&#xe18a;</i></button></td>
</tr> </tr>
<tr> <tr>
<td><input class="noslide segn" type="number" max=6553.0 min=0.2 step=0.1 oninput="pleDur(${p},${i},this)" value="${plJson[p].dur[i]/10.0}"></td> <td width="40%"><input class="noslide segn" type="number" placeholder="Duration" max=6553.0 min=0.2 step=0.1 oninput="pleDur(${p},${i},this)" value="${plJson[p].dur[i]/10.0}">s</td>
<td><input class="noslide segn" type="number" max=65.0 min=0.0 step=0.1 oninput="pleTr(${p},${i},this)" value="${plJson[p].transition[i]/10.0}"></td> <td width="40%"><input class="noslide segn" type="number" placeholder="Transition" max=65.0 min=0.0 step=0.1 oninput="pleTr(${p},${i},this)" value="${plJson[p].transition[i]/10.0}">s</td>
<td><button class="btn btn-i btn-pl-del" onclick="delPl(${p},${i})"><i class="icons btn-icon">&#xe037;</i></button></div></td> <td><button class="btn btn-i btn-pl-del" onclick="delPl(${p},${i})"><i class="icons btn-icon">&#xe037;</i></button></div></td>
</tr> </tr>
</table> </table>

3772
wled00/html_ui.h
View File

File diff suppressed because it is too large Load Diff

2
wled00/wled.h
View File

@ -8,7 +8,7 @@
*/ */
// version code in format yymmddb (b = daily build) // version code in format yymmddb (b = daily build)
#define VERSION 2107010 #define VERSION 2107021
//uncomment this if you have a "my_config.h" file you'd like to use //uncomment this if you have a "my_config.h" file you'd like to use
//#define WLED_USE_MY_CONFIG //#define WLED_USE_MY_CONFIG