Adde more default options.

UI bugfix.
This commit is contained in:
Blaz Kristan 2022-07-24 16:21:29 +02:00
parent 18884111a6
commit 026425407e
5 changed files with 1846 additions and 1821 deletions

View File

@ -827,17 +827,19 @@ input[type=range]::-moz-range-thumb {
} }
select { select {
padding: 4px; padding: 4px 0 4px 8px;
margin: 0; margin: 0;
font-size: 19px; font-size: 19px;
background-color: var(--c-3); background-color: var(--c-3);
color: var(--c-d); color: var(--c-d);
cursor: pointer; cursor: pointer;
border: 1px solid var(--c-2); border: 1px solid var(--c-2);
border-radius: 5px; border-radius: 20px;
transition-duration: 0.5s; transition-duration: 0.5s;
-webkit-backface-visibility: hidden; -webkit-backface-visibility: hidden;
-webkit-transform:translate3d(0,0,0); -webkit-transform:translate3d(0,0,0);
-webkit-appearance: none;
-moz-appearance: none;
backface-visibility: hidden; backface-visibility: hidden;
transform:translate3d(0,0,0); transform:translate3d(0,0,0);
} }
@ -847,16 +849,26 @@ select {
.cl { .cl {
background-color: #000; background-color: #000;
} }
.sel-p { select.sel-p, select.sel-pl, select.sel-ple {
margin: 5px 0 10px; margin: 5px 0;
width: 5em;
}
.sel-pl {
width: 100%; width: 100%;
background-position: 141px 16px; height: 40px;
} }
.sel-ple { div.sel-p {
width: 100%; position: relative;
}
div.sel-p:after {
content: "";
position: absolute;
right: 10px;
top: 22px;
width: 0;
height: 0;
border-left: 8px solid transparent;
border-right: 8px solid transparent;
border-top: 8px solid var(--c-f);
}
select.sel-ple {
text-align: center; text-align: center;
} }
option { option {
@ -1175,8 +1187,10 @@ TD .checkmark, TD .radiomark {
.lbl-s { .lbl-s {
display: inline-block; display: inline-block;
margin: 10px 4px 0 0; /* margin: 10px 4px 0 0; */
font-size: 13px; font-size: 13px;
width: 48%;
text-align: center;
} }
/* list wrapper */ /* list wrapper */

View File

@ -697,22 +697,22 @@ function populateSegments(s)
rvYck = `<label class="check revchkl">Reverse<input type="checkbox" id="seg${i}rY" onchange="setRevY(${i})" ${inst.rY?"checked":""}><span class="checkmark schk"></span></label>`; rvYck = `<label class="check revchkl">Reverse<input type="checkbox" id="seg${i}rY" onchange="setRevY(${i})" ${inst.rY?"checked":""}><span class="checkmark schk"></span></label>`;
miYck = `<label class="check revchkl">Mirror<input type="checkbox" id="seg${i}mY" onchange="setMiY(${i})" ${inst.mY?"checked":""}><span class="checkmark schk"></span></label>`; miYck = `<label class="check revchkl">Mirror<input type="checkbox" id="seg${i}mY" onchange="setMiY(${i})" ${inst.mY?"checked":""}><span class="checkmark schk"></span></label>`;
} }
let map2D = `<div id="seg${i}map2D" data-map="map2D" class="lbl-s hide">Expand 1D FX:<br> let map2D = `<div id="seg${i}map2D" data-map="map2D" class="lbl-s hide">Expand 1D FX<br>
<select class="sel-p" id="seg${i}mp12" onchange="setMp12(${i})"> <div class="sel-p"><select class="sel-p" id="seg${i}mp12" onchange="setMp12(${i})">
<option value="0" ${inst.mp12==0?' selected':''}>None</option> <option value="0" ${inst.mp12==0?' selected':''}>None</option>
<option value="1" ${inst.mp12==1?' selected':''}>Vertical</option> <option value="1" ${inst.mp12==1?' selected':''}>Bar</option>
<option value="2" ${inst.mp12==2?' selected':''}>Circle</option> <option value="2" ${inst.mp12==2?' selected':''}>Arc</option>
<option value="3" ${inst.mp12==3?' selected':''}>Block</option> <option value="3" ${inst.mp12==3?' selected':''}>Corner</option>
</select> </select></div>
</div>`; </div>`;
let sndSim = `<div data-snd="ssim" class="lbl-s hide">Sound sim:<br> let sndSim = `<div data-snd="ssim" class="lbl-s hide">Sound sim<br>
<select class="sel-p" id="seg${i}ssim" onchange="setSSim(${i})"> <div class="sel-p"><select class="sel-p" id="seg${i}ssim" onchange="setSSim(${i})">
<option value="0" ${inst.ssim==0?' selected':''}>Off</option> <option value="0" ${inst.ssim==0?' selected':''}>Off</option>
<option value="1" ${inst.ssim==1?' selected':''}>BeatSin</option> <option value="1" ${inst.ssim==1?' selected':''}>BeatSin</option>
<option value="2" ${inst.ssim==2?' selected':''}>WeWillRockYou</option> <option value="2" ${inst.ssim==2?' selected':''}>WeWillRockYou</option>
<option value="3" ${inst.ssim==3?' selected':''}>U10_3</option> <option value="3" ${inst.ssim==3?' selected':''}>U10_3</option>
<option value="4" ${inst.ssim==4?' selected':''}>U14_3</option> <option value="4" ${inst.ssim==4?' selected':''}>U14_3</option>
</select> </select></div>
</div>`; </div>`;
cn += `<div class="seg lstI ${i==s.mainseg ? 'selected' : ''} ${exp ? "expanded":""}" id="seg${i}"> cn += `<div class="seg lstI ${i==s.mainseg ? 'selected' : ''} ${exp ? "expanded":""}" id="seg${i}">
<label class="check schkl"> <label class="check schkl">
@ -1611,14 +1611,14 @@ var plJson = {"0":{
"end": 0 "end": 0
}}; }};
function makePlSel(incPl=false) { function makePlSel(el, incPl=false) {
var plSelContent = ""; var plSelContent = "";
delete pJson["0"]; // remove filler preset delete pJson["0"]; // remove filler preset
var arr = Object.entries(pJson); var arr = Object.entries(pJson);
for (var i = 0; i < arr.length; i++) { for (var i = 0; i < arr.length; i++) {
var n = arr[i][1].n ? arr[i][1].n : "Preset " + arr[i][0]; var n = arr[i][1].n ? arr[i][1].n : "Preset " + arr[i][0];
if (!incPl && arr[i][1].playlist && arr[i][1].playlist.ps) continue; // remove playlists, sub-playlists not yet supported if (!incPl && arr[i][1].playlist && arr[i][1].playlist.ps) continue; // remove playlists, sub-playlists not yet supported
plSelContent += `<option value="${arr[i][0]}">${n}</option>` plSelContent += `<option value="${arr[i][0]}" ${arr[i][0]==el?"selected":""}>${n}</option>`
} }
return plSelContent; return plSelContent;
} }
@ -1704,11 +1704,11 @@ function makeP(i,pl) {
<div id="pl${i}o1" style="display:${rep>0?"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>
<div class="sel">End preset:<br> <div class="sel">End preset:<br>
<select class="sel-ple" id="pl${i}selEnd" onchange="plR(${i})" data-val=${plJson[i].end?plJson[i].end:0}> <div class="sel-p"><select class="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>
<option value="255">Restore preset</option> <option value="255">Restore preset</option>
${makePlSel(true)} ${makePlSel(plJson[i].end?plJson[i].end:0, true)}
</select></div> </select></div></div>
</div> </div>
<div class="c"><button class="btn btn-p" onclick="testPl(${i}, this)"><i class='icons btn-icon'>&#xe139;</i>Test</button></div>`; <div class="c"><button class="btn btn-p" onclick="testPl(${i}, this)"><i class='icons btn-icon'>&#xe139;</i>Test</button></div>`;
} else { } else {
@ -1788,9 +1788,9 @@ function makePlEntry(p,i) {
<table> <table>
<tr> <tr>
<td width="80%" colspan=2> <td width="80%" colspan=2>
<select class="sel-pl" onchange="plePs(${p},${i},this)" data-val="${plJson[p].ps[i]}" data-index="${i}"> <div class="sel-p"><select class="sel-pl" onchange="plePs(${p},${i},this)" data-val="${plJson[p].ps[i]}" data-index="${i}">
${makePlSel()} ${makePlSel(plJson[p].ps[i])}
</select> </select></div>
</td> </td>
<td class="c"><button class="btn btn-pl-add" onclick="addPl(${p},${i})"><i class="icons btn-icon">&#xe18a;</i></button></td> <td class="c"><button class="btn btn-pl-add" onclick="addPl(${p},${i})"><i class="icons btn-icon">&#xe18a;</i></button></td>
</tr> </tr>

File diff suppressed because it is too large Load Diff

View File

@ -194,8 +194,14 @@ void deserializeSegment(JsonObject elem, byte it, byte presetId)
} }
extractModeSlider(fx, 255, buf, 4, &seg.palette); extractModeSlider(fx, 255, buf, 4, &seg.palette);
int16_t sOpt; int16_t sOpt;
sOpt = extractModeDefaults(fx, SET_F("mp12")); if (sOpt >= 0) seg.map1D2D = sOpt & 0x03; sOpt = extractModeDefaults(fx, SET_F("sx")); if (sOpt >= 0) seg.speed = sOpt;
sOpt = extractModeDefaults(fx, SET_F("ssim")); if (sOpt >= 0) seg.soundSim = sOpt & 0x07; sOpt = extractModeDefaults(fx, SET_F("ix")); if (sOpt >= 0) seg.intensity = sOpt;
sOpt = extractModeDefaults(fx, SET_F("c1")); if (sOpt >= 0) seg.custom1 = sOpt;
sOpt = extractModeDefaults(fx, SET_F("c2")); if (sOpt >= 0) seg.custom2 = sOpt;
sOpt = extractModeDefaults(fx, SET_F("c3")); if (sOpt >= 0) seg.custom3 = sOpt;
sOpt = extractModeDefaults(fx, "pal"); if (sOpt >= 0) seg.palette = sOpt;
sOpt = extractModeDefaults(fx, SET_F("mp12")); if (sOpt >= 0) seg.map1D2D = sOpt & 0x03;
sOpt = extractModeDefaults(fx, SET_F("ssim")); if (sOpt >= 0) seg.soundSim = sOpt & 0x07;
sOpt = extractModeDefaults(fx, "rev"); if (sOpt >= 0) seg.setOption(SEG_OPTION_REVERSED, (bool)sOpt); sOpt = extractModeDefaults(fx, "rev"); if (sOpt >= 0) seg.setOption(SEG_OPTION_REVERSED, (bool)sOpt);
sOpt = extractModeDefaults(fx, SET_F("mi")); if (sOpt >= 0) seg.setOption(SEG_OPTION_MIRROR, (bool)sOpt); sOpt = extractModeDefaults(fx, SET_F("mi")); if (sOpt >= 0) seg.setOption(SEG_OPTION_MIRROR, (bool)sOpt);
sOpt = extractModeDefaults(fx, SET_F("rY")); if (sOpt >= 0) seg.setOption(SEG_OPTION_REVERSED_Y, (bool)sOpt); sOpt = extractModeDefaults(fx, SET_F("rY")); if (sOpt >= 0) seg.setOption(SEG_OPTION_REVERSED_Y, (bool)sOpt);

View File

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