Comment fix.

This commit is contained in:
Blaz Kristan 2022-03-09 18:21:52 +01:00
parent 261260b232
commit d8d9259c36
4 changed files with 1710 additions and 1737 deletions

View File

@ -528,7 +528,6 @@ img {
height: 28px; height: 28px;
top: 0; bottom: 0; top: 0; bottom: 0;
left: 0; right: 0; left: 0; right: 0;
/*border: 1px solid var(--c-b);*/
} }
#rwrap .sliderdisplay { background: linear-gradient(90deg, #000 0%, #f00); } #rwrap .sliderdisplay { background: linear-gradient(90deg, #000 0%, #f00); }
#gwrap .sliderdisplay { background: linear-gradient(90deg, #000 0%, #0f0); } #gwrap .sliderdisplay { background: linear-gradient(90deg, #000 0%, #0f0); }
@ -557,6 +556,7 @@ output.sliderbubbleshow {
opacity: 1; opacity: 1;
} }
/* wrapper divs hidden by default */
#rgbwrap, #kwrap, #wwrap, #wbal, #qcs-w, #hexw { #rgbwrap, #kwrap, #wwrap, #wbal, #qcs-w, #hexw {
display: none; display: none;
} }
@ -690,6 +690,8 @@ input[type=range]::-moz-range-thumb {
margin: 0; margin: 0;
white-space: nowrap; white-space: nowrap;
} }
/* Quick color select wrapper div */
#qcs-w { #qcs-w {
margin-top: 10px; margin-top: 10px;
} }
@ -813,15 +815,7 @@ input[type=number]::-webkit-inner-spin-button,
input[type=number]::-webkit-outer-spin-button { input[type=number]::-webkit-outer-spin-button {
-webkit-appearance: none; -webkit-appearance: none;
} }
/*
.segntxt {
max-width: 160px;
overflow: hidden;
text-overflow: clip;
}
*/
.segname, .pname { .segname, .pname {
/*padding: 4px 0;*/
white-space: nowrap; white-space: nowrap;
cursor: pointer; cursor: pointer;
text-align: center; text-align: center;
@ -1040,7 +1034,6 @@ input[type=number]::-webkit-outer-spin-button {
background-color: var(--c-2); background-color: var(--c-2);
overflow: hidden; overflow: hidden;
position: sticky; position: sticky;
/*border: 1px solid var(--c-2);*/
border-radius: 24px; border-radius: 24px;
margin: 10px auto 0; margin: 10px auto 0;
min-height: 24px; min-height: 24px;
@ -1054,7 +1047,6 @@ input[type=number]::-webkit-outer-spin-button {
#pcont .pres:hover:not([class*="expanded"]), #pcont .pres:hover:not([class*="expanded"]),
#pcont .selected:hover:not([class*="expanded"]), #pcont .selected:hover:not([class*="expanded"]),
.lstI:hover { .lstI:hover {
/*border: 1px solid var(--c-5);*/
background: var(--c-5); background: var(--c-5);
} }
@ -1105,15 +1097,14 @@ input[type=number]::-webkit-outer-spin-button {
white-space: nowrap; white-space: nowrap;
} }
/* palette preview */
.lstIprev { .lstIprev {
/*
width: 100%; width: 100%;
height: 7px; height: 7px;
position: absolute; position: absolute;
bottom: 0; bottom: 0;
left: 0; left: 0;
z-index: -1; z-index: -1;
*/
} }
.fnd { .fnd {
@ -1130,7 +1121,6 @@ input[type="text"].fnd {
text-align: left; text-align: left;
border-radius: 25px; border-radius: 25px;
background: var(--c-2); background: var(--c-2);
/*border: 1px solid var(--c-3);*/
} }
input[type="text"].fnd:focus { input[type="text"].fnd:focus {

View File

@ -168,29 +168,16 @@
<i class="icons search-icon">&#xe0a1;</i> <i class="icons search-icon">&#xe0a1;</i>
</div> </div>
<div id="pallist" class="list"> <div id="pallist" class="list">
<!--div class="lstIprev">
<div class="lstI" data-id="0">
<label class="radio schkl">
<input type="radio" value="0" name="palette" onChange="setPalette()" checked>
<span class="radiomark schk"></span>
</label>
<div class="lstIcontent">
<span class="lstIname">
Default
</span>
</div>
</div>
</div-->
<div class="lstIprev">
<div class="lstI"> <div class="lstI">
<div class="lstIcontent"> <label class="radio schkl" onclick="loadPalettes()">
<span class="lstIname"> <div class="lstIcontent">
Loading... <span class="lstIname">
</span> Loading...
</div> </span>
</div>
</label>
</div> </div>
</div> </div>
</div>
</div> </div>
</div> </div>

View File

@ -252,7 +252,7 @@ function onLoad()
loadPalettesData(redrawPalPrev); loadPalettesData(redrawPalPrev);
loadFX(()=>{ loadFX(()=>{
loadFXData(); loadFXData();
setTimeout(()=>{ //ESP8266 can't handle quick requests setTimeout(()=>{ // ESP8266 can't handle quick requests
loadPresets(()=>{ loadPresets(()=>{
requestJson(); // will create WS requestJson(); // will create WS
}); });
@ -424,16 +424,16 @@ function presetError(empty)
function loadPresets(callback = null) function loadPresets(callback = null)
{ {
//1st boot (because there is a callback) // 1st boot (because there is a callback)
if (callback && pmt == pmtLS && pmt > 0) { if (callback && pmt == pmtLS && pmt > 0) {
//we have a copy of the presets in local storage and don't need to fetch another one // we have a copy of the presets in local storage and don't need to fetch another one
populatePresets(true); populatePresets(true);
pmtLast = pmt; pmtLast = pmt;
callback(); callback();
return; return;
} }
//afterwards // afterwards
if (!callback && pmt == pmtLast) return; if (!callback && pmt == pmtLast) return;
pmtLast = pmt; pmtLast = pmt;
@ -596,7 +596,7 @@ function parseInfo() {
var li = lastinfo; var li = lastinfo;
var name = li.name; var name = li.name;
gId('namelabel').innerHTML = name; gId('namelabel').innerHTML = name;
// if (name === "Dinnerbone") d.documentElement.style.transform = "rotate(180deg)"; //if (name === "Dinnerbone") d.documentElement.style.transform = "rotate(180deg)";
if (li.live) name = "(Live) " + name; if (li.live) name = "(Live) " + name;
if (loc) name = "(L) " + name; if (loc) name = "(L) " + name;
d.title = name; d.title = name;
@ -746,7 +746,7 @@ function populateEffects()
var effects = eJson; var effects = eJson;
var html = ""; var html = "";
effects.shift(); //remove solid effects.shift(); // remove solid
for (let i = 0; i < effects.length; i++) effects[i] = {id: effects[i][0], name:effects[i][1]}; for (let i = 0; i < effects.length; i++) effects[i] = {id: effects[i][0], name:effects[i][1]};
effects.sort((a,b) => (a.name).localeCompare(b.name)); effects.sort((a,b) => (a.name).localeCompare(b.name));
@ -781,7 +781,7 @@ function populateEffects()
function populatePalettes() function populatePalettes()
{ {
var palettes = lJson; var palettes = lJson;
palettes.shift(); //remove default palettes.shift(); // remove default
for (let i = 0; i < palettes.length; i++) { for (let i = 0; i < palettes.length; i++) {
palettes[i] = { palettes[i] = {
"id": palettes[i][0], "id": palettes[i][0],
@ -942,7 +942,7 @@ function loadNodes()
}); });
} }
//update the 'sliderdisplay' background div of a slider for a visual indication of slider position // update the 'sliderdisplay' background div of a slider for a visual indication of slider position
function updateTrail(e) function updateTrail(e)
{ {
if (e==null) return; if (e==null) return;
@ -956,14 +956,14 @@ function updateTrail(e)
if (b) b.innerHTML = e.value; if (b) b.innerHTML = e.value;
} }
//rangetouch slider function // rangetouch slider function
function toggleBubble(e) function toggleBubble(e)
{ {
var b = e.target.parentNode.parentNode.getElementsByTagName('output')[0]; var b = e.target.parentNode.parentNode.getElementsByTagName('output')[0];
b.classList.toggle('sliderbubbleshow'); b.classList.toggle('sliderbubbleshow');
} }
//updates segment length upon input of segment values // updates segment length upon input of segment values
function updateLen(s) function updateLen(s)
{ {
if (!gId(`seg${s}s`)) return; if (!gId(`seg${s}s`)) return;
@ -989,7 +989,7 @@ function updateLen(s)
gId(`seg${s}len`).innerHTML = out; gId(`seg${s}len`).innerHTML = out;
} }
//updates background color of currently selected preset // updates background color of currently selected preset
function updatePA() function updatePA()
{ {
let ps; let ps;
@ -1068,7 +1068,7 @@ function updateSelectedFx()
var selectedEffect = parent.querySelector(`.lstI[data-id="${selectedFx}"]`); var selectedEffect = parent.querySelector(`.lstI[data-id="${selectedFx}"]`);
if (selectedEffect) { if (selectedEffect) {
selectedEffect.classList.add('selected'); selectedEffect.classList.add('selected');
var fx = (selectedFx != prevFx) && currentPreset==-1; //effect changed & preset==none var fx = (selectedFx != prevFx) && currentPreset==-1; // effect changed & preset==none
var ps = (prevPS != currentPreset) && currentPreset==-1; // preset changed & preset==none var ps = (prevPS != currentPreset) && currentPreset==-1; // preset changed & preset==none
// WLEDSR: extract the Slider and color control string from the HTML element and set it. // WLEDSR: extract the Slider and color control string from the HTML element and set it.
setSliderAndColorControl(selectedFx, (fx || ps)); setSliderAndColorControl(selectedFx, (fx || ps));
@ -1096,14 +1096,13 @@ function cmpP(a, b)
} }
function makeWS() { function makeWS() {
//if (ws) { ws.close(); ws=null; }
if (ws || lastinfo.ws < 0) return; if (ws || lastinfo.ws < 0) return;
ws = new WebSocket((window.location.protocol == "https:"?"wss":"ws")+'://'+(loc?locip:window.location.hostname)+'/ws'); ws = new WebSocket((window.location.protocol == "https:"?"wss":"ws")+'://'+(loc?locip:window.location.hostname)+'/ws');
ws.binaryType = "arraybuffer"; ws.binaryType = "arraybuffer";
ws.onmessage = (e)=>{ ws.onmessage = (e)=>{
if (e.data instanceof ArrayBuffer) return; //liveview packet if (e.data instanceof ArrayBuffer) return; // liveview packet
var json = JSON.parse(e.data); var json = JSON.parse(e.data);
if (json.leds) return; //JSON liveview packet if (json.leds) return; // JSON liveview packet
clearTimeout(jsonTimeout); clearTimeout(jsonTimeout);
jsonTimeout = null; jsonTimeout = null;
lastUpdate = new Date(); lastUpdate = new Date();
@ -1124,11 +1123,11 @@ function makeWS() {
}; };
ws.onclose = (e)=>{ ws.onclose = (e)=>{
gId('connind').style.backgroundColor = "var(--c-r)"; gId('connind').style.backgroundColor = "var(--c-r)";
setTimeout(makeWS,1500); //retry WS connection setTimeout(makeWS,1500); // retry WS connection
ws = null; ws = null;
} }
ws.onopen = (e)=>{ ws.onopen = (e)=>{
//ws.send("{'v':true}"); //unnecessary (https://github.com/Aircoookie/WLED/blob/master/wled00/ws.cpp#L18) //ws.send("{'v':true}"); // unnecessary (https://github.com/Aircoookie/WLED/blob/master/wled00/ws.cpp#L18)
reqsLegal = true; reqsLegal = true;
} }
} }
@ -1169,7 +1168,6 @@ function readState(s,command=false)
hasWhite |= !!(lc & 0x08); // & 0x02 contains W channel hasWhite |= !!(lc & 0x08); // & 0x02 contains W channel
hasCCT |= !!(lc & 0x04); hasCCT |= !!(lc & 0x04);
} }
//if(s.seg[i].sel) {selc = ind; break;} ind++;
} }
var i=s.seg[selc]; var i=s.seg[selc];
if (sellvl == 1) { if (sellvl == 1) {
@ -1190,7 +1188,6 @@ function readState(s,command=false)
cd[e].dataset.g = i.col[e][1]; cd[e].dataset.g = i.col[e][1];
cd[e].dataset.b = i.col[e][2]; cd[e].dataset.b = i.col[e][2];
if (hasWhite) { let w = cd[e].dataset.w = i.col[e][3]; } if (hasWhite) { let w = cd[e].dataset.w = i.col[e][3]; }
//cd[e].style.backgroundColor = rgbStr(cd[e].dataset); // or:
setCSL(cd[e]); setCSL(cd[e]);
} }
selectSlot(csel); selectSlot(csel);
@ -1228,7 +1225,7 @@ function readState(s,command=false)
prevFx = selectedFx; prevFx = selectedFx;
selectedPal = i.pal; selectedPal = i.pal;
selectedFx = i.fx; selectedFx = i.fx;
redrawPalPrev(); // if any color changed (random palette did at least) redrawPalPrev(); // if any color changed (random palette did at least)
updateUI(); updateUI();
} }
@ -1274,7 +1271,7 @@ function setSliderAndColorControl(idx, applyDef=false)
if ((!controlDefined && i < ((idx<128)?2:nSliders)) || (slOnOff.length>i && slOnOff[i] != "")) { if ((!controlDefined && i < ((idx<128)?2:nSliders)) || (slOnOff.length>i && slOnOff[i] != "")) {
label.style.display = "block"; label.style.display = "block";
if (slOnOff.length>i && slOnOff[i].indexOf("=")>0) { if (slOnOff.length>i && slOnOff[i].indexOf("=")>0) {
//embeded default values // embeded default values
var dPos = slOnOff[i].indexOf("="); var dPos = slOnOff[i].indexOf("=");
var v = Math.max(0,Math.min(255,parseInt(slOnOff[i].substr(dPos+1)))); var v = Math.max(0,Math.min(255,parseInt(slOnOff[i].substr(dPos+1))));
if (i==0) { if (applyDef) gId("sliderSpeed").value = v; obj.seg.sx = v; } if (i==0) { if (applyDef) gId("sliderSpeed").value = v; obj.seg.sx = v; }
@ -1353,7 +1350,7 @@ function setSliderAndColorControl(idx, applyDef=false)
if ((!controlDefined) || (paOnOff.length>0 && paOnOff[0]!="" && isNaN(paOnOff[0]))) { if ((!controlDefined) || (paOnOff.length>0 && paOnOff[0]!="" && isNaN(paOnOff[0]))) {
palw.style.display = "inline-block"; palw.style.display = "inline-block";
if (paOnOff.length>0 && paOnOff[0].indexOf("=")>0) { if (paOnOff.length>0 && paOnOff[0].indexOf("=")>0) {
//embeded default values // embeded default values
var dPos = paOnOff[0].indexOf("="); var dPos = paOnOff[0].indexOf("=");
var v = Math.max(0,Math.min(255,parseInt(paOnOff[0].substr(dPos+1)))); var v = Math.max(0,Math.min(255,parseInt(paOnOff[0].substr(dPos+1))));
var p = d.querySelector(`#pallist input[name="palette"][value="${v}"]`); var p = d.querySelector(`#pallist input[name="palette"][value="${v}"]`);
@ -1371,7 +1368,7 @@ function setSliderAndColorControl(idx, applyDef=false)
// if numeric set as selected palette // if numeric set as selected palette
if (paOnOff.length>0 && paOnOff[0]!="" && !isNaN(paOnOff[0]) && parseInt(paOnOff[0])!=selectedPal) obj.seg.pal = parseInt(paOnOff[0]); if (paOnOff.length>0 && paOnOff[0]!="" && !isNaN(paOnOff[0]) && parseInt(paOnOff[0])!=selectedPal) obj.seg.pal = parseInt(paOnOff[0]);
} }
if (!isEmpty(obj.seg) && applyDef) requestJson(obj); //update default values (may need throttling on ESP8266) if (!isEmpty(obj.seg) && applyDef) requestJson(obj); // update default values (may need throttling on ESP8266)
} }
var jsonTimeout; var jsonTimeout;
@ -1380,7 +1377,7 @@ var reqsLegal = false;
function requestJson(command=null) function requestJson(command=null)
{ {
gId('connind').style.backgroundColor = "var(--c-r)"; gId('connind').style.backgroundColor = "var(--c-r)";
if (command && !reqsLegal) return; //stop post requests from chrome onchange event on page restore if (command && !reqsLegal) return; // stop post requests from chrome onchange event on page restore
if (!jsonTimeout) jsonTimeout = setTimeout(()=>{if (ws) ws.close(); ws=null; showErrorToast()}, 3000); if (!jsonTimeout) jsonTimeout = setTimeout(()=>{if (ws) ws.close(); ws=null; showErrorToast()}, 3000);
var req = null; var req = null;
var url = (loc?`http://${locip}`:'') + '/json/si'; var url = (loc?`http://${locip}`:'') + '/json/si';
@ -1395,13 +1392,13 @@ function requestJson(command=null)
if (tn != tr) command.transition = tn; if (tn != tr) command.transition = tn;
} }
req = JSON.stringify(command); req = JSON.stringify(command);
if (req.length > 1000) useWs = false; //do not send very long requests over websocket if (req.length > 1000) useWs = false; // do not send very long requests over websocket
}; };
if (useWs) { if (useWs) {
ws.send(req?req:'{"v":true}'); ws.send(req?req:'{"v":true}');
return; return;
} else if (command && command.ps) { //refresh UI if we don't use WS (async loading of presets) } else if (command && command.ps) { // refresh UI if we don't use WS (async loading of presets)
setTimeout(requestJson,250); setTimeout(requestJson,250);
} }
@ -1485,7 +1482,7 @@ function toggleInfo()
{ {
if (isNodes) toggleNodes(); if (isNodes) toggleNodes();
isInfo = !isInfo; isInfo = !isInfo;
if (isInfo) requestJson(); // loadInfo(); if (isInfo) requestJson();
gId('info').style.transform = (isInfo) ? "translateY(0px)":"translateY(100%)"; gId('info').style.transform = (isInfo) ? "translateY(0px)":"translateY(100%)";
gId('buttonI').className = (isInfo) ? "active":""; gId('buttonI').className = (isInfo) ? "active":"";
} }
@ -1541,7 +1538,7 @@ function resetUtil()
var plJson = {"0":{ var plJson = {"0":{
"ps": [0], "ps": [0],
"dur": [100], "dur": [100],
"transition": [-1], //to be inited to default transition dur "transition": [-1], // to be inited to default transition dur
"repeat": 0, "repeat": 0,
"r": false, "r": false,
"end": 0 "end": 0
@ -1553,7 +1550,7 @@ function makePlSel(incPl=false) {
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]}>${n}</option>`
} }
return plSelContent; return plSelContent;
@ -1580,7 +1577,7 @@ function refreshPlE(p) {
} }
} }
//p: preset ID, i: ps index // p: preset ID, i: ps index
function addPl(p,i) { function addPl(p,i) {
plJson[p].ps.splice(i+1,0,0); plJson[p].ps.splice(i+1,0,0);
plJson[p].dur.splice(i+1,0,plJson[p].dur[i]); plJson[p].dur.splice(i+1,0,plJson[p].dur[i]);
@ -1613,7 +1610,7 @@ function pleTr(p,i,field) {
function plR(p) { function plR(p) {
var pl = plJson[p]; var pl = plJson[p];
pl.r = gId(`pl${p}rtgl`).checked; pl.r = gId(`pl${p}rtgl`).checked;
if (gId(`pl${p}rptgl`).checked) { //infinite if (gId(`pl${p}rptgl`).checked) { // infinite
pl.repeat = 0; pl.repeat = 0;
delete pl.end; delete pl.end;
gId(`pl${p}o1`).style.display = "none"; gId(`pl${p}o1`).style.display = "none";
@ -1935,7 +1932,7 @@ function setLor(i)
function setPreset(i) function setPreset(i)
{ {
var obj = {"ps": i}; var obj = {"ps": i};
if (isPlaylist(i)) obj.on = true; //force on if (isPlaylist(i)) obj.on = true; // force on
showToast("Loading preset " + pName(i) +" (" + i + ")"); showToast("Loading preset " + pName(i) +" (" + i + ")");
requestJson(obj); requestJson(obj);
} }
@ -1997,7 +1994,7 @@ function saveP(i,pl)
} }
populatePresets(); populatePresets();
resetPUtil(); resetPUtil();
if (i>0) expand(pI+100); // collapse edited preset or expand created preset. if (i>0) expand(pI+100); // collapse edited preset or expand created preset.
} }
function testPl(i,bt) { function testPl(i,bt) {
@ -2040,15 +2037,14 @@ function selectSlot(b)
for (let i of cd) i.classList.remove('xxs-w'); for (let i of cd) i.classList.remove('xxs-w');
cd[b].classList.add('xxs-w'); cd[b].classList.add('xxs-w');
setPicker(cd[b].style.backgroundColor); setPicker(cd[b].style.backgroundColor);
//force slider update on initial load (picker "color:change" not fired if black) // force slider update on initial load (picker "color:change" not fired if black)
if (cpick.color.value == 0) updatePSliders(); if (cpick.color.value == 0) updatePSliders();
gId('sliderW').value = parseInt(cd[b].dataset.w); gId('sliderW').value = parseInt(cd[b].dataset.w);
//updateTrail(gId('sliderW')); //updateTrail(gId('sliderW'));
redrawPalPrev(); redrawPalPrev();
//updatePSliders();
} }
//set the color from a hex string. Used by quick color selectors // set the color from a hex string. Used by quick color selectors
var lasth = 0; var lasth = 0;
function pC(col) function pC(col)
{ {
@ -2065,31 +2061,29 @@ function pC(col)
} }
function updatePSliders() { function updatePSliders() {
//update RGB sliders // update RGB sliders
var col = cpick.color.rgb; var col = cpick.color.rgb;
gId('sliderR').value = col.r; gId('sliderR').value = col.r;
gId('sliderG').value = col.g; gId('sliderG').value = col.g;
gId('sliderB').value = col.b; gId('sliderB').value = col.b;
//update hex field // update hex field
var str = cpick.color.hexString.substring(1); var str = cpick.color.hexString.substring(1);
var w = parseInt(gId("csl").children[csel].dataset.w); var w = parseInt(gId("csl").children[csel].dataset.w);
if (w > 0) str += w.toString(16); if (w > 0) str += w.toString(16);
gId('hexc').value = str; gId('hexc').value = str;
gId('hexcnf').style.backgroundColor = "var(--c-3)"; gId('hexcnf').style.backgroundColor = "var(--c-3)";
//update value slider // update value slider
var v = gId('sliderV'); var v = gId('sliderV');
v.value = cpick.color.value; v.value = cpick.color.value;
//background color as if color had full value // background color as if color had full value
var hsv = {"h":cpick.color.hue,"s":cpick.color.saturation,"v":100}; var hsv = {"h":cpick.color.hue,"s":cpick.color.saturation,"v":100};
var c = iro.Color.hsvToRgb(hsv); var c = iro.Color.hsvToRgb(hsv);
var cs = 'rgb('+c.r+','+c.g+','+c.b+')'; var cs = 'rgb('+c.r+','+c.g+','+c.b+')';
v.nextElementSibling.style.backgroundImage = `linear-gradient(90deg, #000 0%, ${cs})`; v.nextElementSibling.style.backgroundImage = `linear-gradient(90deg, #000 0%, ${cs})`;
//v.parentNode.getElementsByClassName('sliderdisplay')[0].style.setProperty('--bg',cs);
//updateTrail(v);
//update Kelvin slider // update Kelvin slider
gId('sliderK').value = cpick.color.kelvin; gId('sliderK').value = cpick.color.kelvin;
} }
@ -2147,13 +2141,12 @@ function fromRgb()
function fromW() function fromW()
{ {
let w = gId('sliderW'); let w = gId('sliderW');
//updateTrail(w);
let cd = gId('csl').children; // color slots let cd = gId('csl').children; // color slots
cd[csel].dataset.w = w.value; cd[csel].dataset.w = w.value;
setCSL(cd[csel]); setCSL(cd[csel]);
} }
//sr 0: from RGB sliders, 1: from picker, 2: from hex // sr 0: from RGB sliders, 1: from picker, 2: from hex
function setColor(sr) function setColor(sr)
{ {
var cd = gId('csl').children; // color slots var cd = gId('csl').children; // color slots
@ -2166,7 +2159,6 @@ function setColor(sr)
cdd.g = g = hasRGB ? col.g : w; cdd.g = g = hasRGB ? col.g : w;
cdd.b = b = hasRGB ? col.b : w; cdd.b = b = hasRGB ? col.b : w;
cdd.w = w; cdd.w = w;
//cd[csel].style.backgroundColor = rgbStr(cd[csel].dataset); // or:
setCSL(cd[csel]); setCSL(cd[csel]);
var obj = {"seg": {"col": [[r, g, b, w],[],[]]}}; var obj = {"seg": {"col": [[r, g, b, w],[],[]]}};
if (csel == 1) { if (csel == 1) {
@ -2235,7 +2227,7 @@ function loadPalettesData(callback = null)
var d = JSON.parse(lsPalData); var d = JSON.parse(lsPalData);
if (d && d.vid == d.vid) { if (d && d.vid == d.vid) {
palettesData = d.p; palettesData = d.p;
if (callback) callback(); // redrawPalPrev() if (callback) callback(); // actually redrawPalPrev()
return; return;
} }
} catch (e) {} } catch (e) {}
@ -2247,7 +2239,7 @@ function loadPalettesData(callback = null)
p: palettesData, p: palettesData,
vid: lastinfo.vid vid: lastinfo.vid
})); }));
if (callback) setTimeout(callback, 99); //redrawPalPrev() if (callback) setTimeout(callback, 99); // actually redrawPalPrev()
}); });
} }
@ -2296,7 +2288,7 @@ function clean(c)
i.dispatchEvent(new Event('input')); i.dispatchEvent(new Event('input'));
} }
//make sure "dur" and "transition" are arrays with at least the length of "ps" // make sure "dur" and "transition" are arrays with at least the length of "ps"
function formatArr(pl) { function formatArr(pl) {
var l = pl.ps.length; var l = pl.ps.length;
if (!Array.isArray(pl.dur)) { if (!Array.isArray(pl.dur)) {
@ -2344,7 +2336,7 @@ function expand(i, c=false)
if (expanded[i]) { if (expanded[i]) {
if (isPlaylist(p)) { if (isPlaylist(p)) {
plJson[p] = pJson[p].playlist; plJson[p] = pJson[p].playlist;
//make sure all keys are present in plJson[p] // make sure all keys are present in plJson[p]
formatArr(plJson[p]); formatArr(plJson[p]);
if (isNaN(plJson[p].repeat)) plJson[p].repeat = 0; if (isNaN(plJson[p].repeat)) plJson[p].repeat = 0;
if (!plJson[p].r) plJson[p].r = false; if (!plJson[p].r) plJson[p].r = false;
@ -2376,7 +2368,7 @@ function unfocusSliders()
gId("sliderIntensity").blur(); gId("sliderIntensity").blur();
} }
//sliding UI // sliding UI
const _C = d.querySelector('.container'), N = 4; const _C = d.querySelector('.container'), N = 4;
let iSlide = 0, x0 = null, scrollS = 0, locked = false, w; let iSlide = 0, x0 = null, scrollS = 0, locked = false, w;

File diff suppressed because it is too large Load Diff