More compact playlist entries

This commit is contained in:
cschwinne 2021-07-04 00:55:32 +02:00
parent 793a01f7ca
commit 1bb7e36a65
6 changed files with 1870 additions and 1858 deletions

View File

@ -2,6 +2,11 @@
### Builds after release 0.12.0 ### Builds after release 0.12.0
#### Build 2107040
- Playlist entries are now more compact
- Added the possibility to enter negative numbers for segment offset
#### Build 2107021 #### Build 2107021
- Added WebSockets support to UI - Added WebSockets support to UI

View File

@ -322,7 +322,7 @@ button {
} }
.first { .first {
margin-top: 18px !important; margin-top: 10px;
} }
#toast { #toast {
@ -588,18 +588,13 @@ input[type=range]:active + .sliderbubble {
} }
.btn-xs { .btn-xs {
width: 39px; width: 39px;
margin: 2px 0 0 0;
} }
.btn-pl-add { .btn-pl-add {
position: absolute; margin-left: 9px;
bottom: -29px;
left: 94px;
}
.btn-pl-del {
position: absolute;
right: 2px;
bottom: -3px;
} }
#qcs-w { #qcs-w {
margin-top: 10px; margin-top: 10px;
} }
@ -623,8 +618,9 @@ input[type=range]:active + .sliderbubble {
} }
.sel-pl { .sel-pl {
width: 200px; width: 192px;
background-position: 176px 16px; background-position: 168px 16px;
margin: 8px 7px 0 0;
} }
.sel-ple { .sel-ple {
@ -696,11 +692,6 @@ input[type=text] {
margin: 26px 0 6px 12px !important; margin: 26px 0 6px 12px !important;
} }
.plentry {
margin-top: 16px;
position: relative;
}
.stxt { .stxt {
width: 50px !important; width: 50px !important;
} }
@ -714,6 +705,23 @@ input[type=number]::-webkit-outer-spin-button {
-webkit-appearance: none; -webkit-appearance: none;
} }
.pln {
border-radius: 25px !important;
width: 67px !important;
margin: 0 2px 8px 0 !important;
text-align: center;
}
.plnl {
width: 86px;
margin: 0 2px 0 0;
display: inline-block;
}
.pli {
width: 38px;
margin: 0 0 0 29px;
display: inline-block;
}
.segn { .segn {
margin: 3px 0 6px 0 !important; margin: 3px 0 6px 0 !important;
} }
@ -1055,11 +1063,7 @@ input[type="text"].search:not(:placeholder-shown) {
.hrz { .hrz {
width: auto; width: auto;
height: 2px; height: 2px;
background-color: var(--c-e); background-color: var(--c-b);
}
.hrz-pl {
margin: 20px 0;
position: relative;
} }
::-webkit-scrollbar { ::-webkit-scrollbar {

View File

@ -546,7 +546,7 @@ function populateSegments(s)
<tr> <tr>
<td class="segtd"><input class="noslide segn" id="seg${i}s" type="number" min="0" max="${ledCount-1}" value="${inst.start}" oninput="updateLen(${i})"></td> <td class="segtd"><input class="noslide segn" id="seg${i}s" type="number" min="0" max="${ledCount-1}" value="${inst.start}" oninput="updateLen(${i})"></td>
<td class="segtd"><input class="noslide segn" id="seg${i}e" type="number" min="0" max="${ledCount}" value="${inst.stop}" oninput="updateLen(${i})"></td> <td class="segtd"><input class="noslide segn" id="seg${i}e" type="number" min="0" max="${ledCount}" value="${inst.stop}" oninput="updateLen(${i})"></td>
<td class="segtd"><input class="noslide segn" id="seg${i}of" type="number" min="0" max="${ledCount-1}" value="${inst.of}" oninput="updateLen(${i})"></td> <td class="segtd"><input class="noslide segn" id="seg${i}of" type="number" value="${inst.of}" oninput="updateLen(${i})"></td>
</tr> </tr>
</table> </table>
<table class="infot"> <table class="infot">
@ -1315,6 +1315,7 @@ 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 class="first c">Playlist Entries</div>
<div id="ple${i}"></div><label class="check revchkl"> <div id="ple${i}"></div><label class="check revchkl">
Shuffle 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?"checked":""}>
@ -1387,23 +1388,15 @@ function makePUtil() {
function makePlEntry(p,i) { function makePlEntry(p,i) {
return ` return `
<div class="plentry"> <div class="plentry">
${i+1}:
<select class="btn sel sel-pl" onchange="plePs(${p},${i},this)" data-val=${plJson[p].ps[i]} data-index=${i}> <select class="btn sel sel-pl" onchange="plePs(${p},${i},this)" data-val=${plJson[p].ps[i]} data-index=${i}>
${plSelContent} ${plSelContent}
</select> </select>
<table class="segt"> <button class="btn btn-i btn-xs btn-pl-del" onclick="delPl(${p},${i})"><i class="icons btn-icon">&#xe037;</i></button>
<tr> <div class="h plnl">Duration</div><div class="h plnl">Transition</div><div class="h pli">#${i+1}</div><br>
<td class="segtd">Duration</td> <input class="noslide pln" type="number" max=6553.0 min=0.2 step=0.1 oninput="pleDur(${p},${i},this)" value=${plJson[p].dur[i]/10.0}>
<td class="segtd">Transition</td> <input class="noslide pln" type="number" max=65.0 min=0.0 step=0.1 oninput="pleTr(${p},${i},this)" value=${plJson[p].transition[i]/10.0}> s
</tr> <button class="btn btn-i btn-xs btn-pl-add" onclick="addPl(${p},${i})"><i class="icons btn-icon">&#xe18a;</i></button>
<tr> <div class="hrz"></div>
<td class="segtd"><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 class="segtd"><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}> s</td>
</tr>
</table>
<button class="btn btn-i btn-xs btn-pl-del" onclick="delPl(${p},${i})"><i class="icons btn-icon">&#xe037;</i></button></div>
<div class="hrz hrz-pl" />
<button class="btn btn-i btn-xs btn-pl-add" onclick="addPl(${p},${i})"><i class="icons btn-icon">&#xe18a;</i></button></div>
</div>`; </div>`;
} }

File diff suppressed because it is too large Load Diff

View File

@ -25,8 +25,17 @@ void deserializeSegment(JsonObject elem, byte it, byte presetId)
uint16_t grp = elem[F("grp")] | seg.grouping; uint16_t grp = elem[F("grp")] | seg.grouping;
uint16_t spc = elem[F("spc")] | seg.spacing; uint16_t spc = elem[F("spc")] | seg.spacing;
strip.setSegment(id, start, stop, grp, spc); strip.setSegment(id, start, stop, grp, spc);
seg.offset = elem[F("of")] | seg.offset;
if (stop > start && seg.offset > stop - start -1) seg.offset = stop - start -1; uint16_t len = 1;
if (stop > start) len = stop - start;
int offset = elem[F("of")] | INT32_MAX;
if (offset != INT32_MAX) {
int offsetAbs = abs(offset);
if (offsetAbs > len - 1) offsetAbs %= len;
if (offset < 0) offsetAbs = len - offsetAbs;
seg.offset = offsetAbs;
}
if (stop > start && seg.offset > len -1) seg.offset = len -1;
int segbri = elem["bri"] | -1; int segbri = elem["bri"] | -1;
if (segbri == 0) { if (segbri == 0) {

View File

@ -8,7 +8,7 @@
*/ */
// version code in format yymmddb (b = daily build) // version code in format yymmddb (b = daily build)
#define VERSION 2107022 #define VERSION 2107040
//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