Fixed JShint warnings and minify HTML

This commit is contained in:
cschwinne 2020-12-21 19:48:21 +01:00
parent 2e2f7fa6c3
commit f7893d4e4b
6 changed files with 2148 additions and 2243 deletions

View File

@ -2,6 +2,12 @@
### Development versions after 0.11.1 release ### Development versions after 0.11.1 release
#### Build 2012210
- Split index.htm in separate CSS + JS files (PR #1542)
- Minify UI HTML, saving >1.5kB flash
- Fixed JShint warnings
#### Build 2012180 #### Build 2012180
- Boot brightness 0 will now use the brightness from preset - Boot brightness 0 will now use the brightness from preset

View File

@ -69,6 +69,8 @@ function writeHtmlGzipped(sourceFile, resultFile) {
console.info("Reading " + sourceFile); console.info("Reading " + sourceFile);
new inliner(sourceFile, function (error, html) { new inliner(sourceFile, function (error, html) {
console.info("Inlined " + html.length + " characters"); console.info("Inlined " + html.length + " characters");
html = filter(html, "html-minify-ui");
console.info("Minified to " + html.length + " characters");
if (error) { if (error) {
console.warn(error); console.warn(error);
@ -123,6 +125,16 @@ function filter(str, type) {
continueOnParseError: false, continueOnParseError: false,
removeComments: true, removeComments: true,
}); });
} else if (type == "html-minify-ui") {
return MinifyHTML(str, {
collapseWhitespace: true,
conservativeCollapse: true,
maxLineLength: 80,
minifyCSS: true,
minifyJS: true,
continueOnParseError: false,
removeComments: true,
});
} else { } else {
console.warn("Unknown filter: " + type); console.warn("Unknown filter: " + type);
return str; return str;

View File

@ -1,5 +1,5 @@
<!DOCTYPE html> <!DOCTYPE html>
<html> <html lang="en">
<head> <head>
<meta name="viewport" content="width=device-width, initial-scale=1, minimum-scale=1"> <meta name="viewport" content="width=device-width, initial-scale=1, minimum-scale=1">
<meta charset="utf-8"> <meta charset="utf-8">

View File

@ -1,6 +1,6 @@
//page js //page js
var loc = false, locip; var loc = false, locip;
var ps = false, noNewSegs = false; var noNewSegs = false;
var isOn = false, nlA = false, isLv = false, isInfo = false, syncSend = false, syncTglRecv = true, isRgbw = false; var isOn = false, nlA = false, isLv = false, isInfo = false, syncSend = false, syncTglRecv = true, isRgbw = false;
var whites = [0,0,0]; var whites = [0,0,0];
var expanded = [false]; var expanded = [false];
@ -16,7 +16,7 @@ var pcMode = false, pcModeA = false, lastw = 0;
var d = document; var d = document;
const ranges = RangeTouch.setup('input[type="range"]', {}); const ranges = RangeTouch.setup('input[type="range"]', {});
var pJson = {}; var pJson = {};
var pO = null, pN = "", pI = 0; var pN = "", pI = 0;
var pmt = 1, pmtLS = 0, pmtLast = 0; var pmt = 1, pmtLS = 0, pmtLast = 0;
var lastinfo = {}; var lastinfo = {};
var cfg = { var cfg = {
@ -184,7 +184,7 @@ function onLoad() {
loadBg(cfg.theme.bg.url); loadBg(cfg.theme.bg.url);
var cd = d.getElementById('csl').children; var cd = d.getElementById('csl').children;
for (i = 0; i < cd.length; i++) { for (var i = 0; i < cd.length; i++) {
cd[i].style.backgroundColor = "rgb(0, 0, 0)"; cd[i].style.backgroundColor = "rgb(0, 0, 0)";
} }
selectSlot(0); selectSlot(0);
@ -194,7 +194,7 @@ function onLoad() {
setColor(1); setColor(1);
}); });
pmtLS = localStorage.getItem('wledPmt'); pmtLS = localStorage.getItem('wledPmt');
setTimeout(function(){requestJson(null, false)}, 25); setTimeout(function(){requestJson(null, false);}, 25);
d.addEventListener("visibilitychange", handleVisibilityChange, false); d.addEventListener("visibilitychange", handleVisibilityChange, false);
size(); size();
d.getElementById("cv").style.opacity=0; d.getElementById("cv").style.opacity=0;
@ -205,14 +205,13 @@ function onLoad() {
sl.addEventListener('touchstart', toggleBubble); sl.addEventListener('touchstart', toggleBubble);
sl.addEventListener('touchend', toggleBubble); sl.addEventListener('touchend', toggleBubble);
} }
} }
function updateTablinks(tabI) function updateTablinks(tabI)
{ {
tablinks = d.getElementsByClassName("tablinks"); var tablinks = d.getElementsByClassName("tablinks");
for (i = 0; i < tablinks.length; i++) { for (var i of tablinks) {
tablinks[i].className = tablinks[i].className.replace(" active", ""); i.className = i.className.replace(" active", "");
} }
if (pcMode) return; if (pcMode) return;
tablinks[tabI].className += " active"; tablinks[tabI].className += " active";
@ -220,7 +219,6 @@ function updateTablinks(tabI)
function openTab(tabI, force = false) { function openTab(tabI, force = false) {
if (pcMode && !force) return; if (pcMode && !force) return;
var i, tabcontent, tablinks;
iSlide = tabI; iSlide = tabI;
_C.classList.toggle('smooth', false); _C.classList.toggle('smooth', false);
_C.style.setProperty('--i', iSlide); _C.style.setProperty('--i', iSlide);
@ -235,7 +233,6 @@ function showToast(text, error = false) {
x.className = error ? "error":"show"; x.className = error ? "error":"show";
clearTimeout(timeout); clearTimeout(timeout);
x.style.animation = 'none'; x.style.animation = 'none';
x.offsetHeight;
x.style.animation = null; x.style.animation = null;
timeout = setTimeout(function(){ x.className = x.className.replace("show", ""); }, 2900); timeout = setTimeout(function(){ x.className = x.className.replace("show", ""); }, 2900);
} }
@ -281,7 +278,7 @@ function getLowestUnusedP()
function checkUsed(i) { function checkUsed(i) {
var id = d.getElementById(`p${i}id`).value; var id = d.getElementById(`p${i}id`).value;
if (pJson[id] && (i == 0 || id != i)) { if (pJson[id] && (i == 0 || id != i)) {
d.getElementById(`p${i}warn`).innerHTML = `&#9888; Overwriting ${pName(id)}!` d.getElementById(`p${i}warn`).innerHTML = `&#9888; Overwriting ${pName(id)}!`;
} else { } else {
d.getElementById(`p${i}warn`).innerHTML = ""; d.getElementById(`p${i}warn`).innerHTML = "";
} }
@ -315,7 +312,7 @@ function cpBck() {
document.execCommand("copy"); document.execCommand("copy");
showToast("Copied to clipboard!") showToast("Copied to clipboard!");
} }
function presetError(empty) function presetError(empty)
@ -341,7 +338,7 @@ function presetError(empty)
else else
cn += `Here is a backup of the last known good state:`; cn += `Here is a backup of the last known good state:`;
cn += `<textarea id="bck"></textarea><br> cn += `<textarea id="bck"></textarea><br>
<button class="btn btn-p" onclick="cpBck()">Copy to clipboard</button>` <button class="btn btn-p" onclick="cpBck()">Copy to clipboard</button>`;
} }
cn += `</div>`; cn += `</div>`;
d.getElementById('pcont').innerHTML = cn; d.getElementById('pcont').innerHTML = cn;
@ -373,7 +370,7 @@ function loadPresets()
showToast(error, true); showToast(error, true);
console.log(error); console.log(error);
presetError(false); presetError(false);
}) });
} }
var pQL = []; var pQL = [];
@ -385,9 +382,9 @@ function populateQL()
cn += `<p class="labels">Quick load</p>`; cn += `<p class="labels">Quick load</p>`;
var it = 0; var it = 0;
for (var key in pQL) for (var key of (pQL||[]))
{ {
cn += `<button class="xxs btn psts" id="p${pQL[key][0]}qlb" onclick="setPreset(${pQL[key][0]});">${pQL[key][1]}</button>`; cn += `<button class="xxs btn psts" id="p${key[0]}qlb" onclick="setPreset(${key[0]});">${key[1]}</button>`;
it++; it++;
if (it > 4) { if (it > 4) {
it = 0; it = 0;
@ -412,11 +409,11 @@ function populatePresets(fromls)
pQL = []; pQL = [];
var is = []; var is = [];
for (var key in arr) for (var key of (arr||[]))
{ {
if (!isObject(arr[key][1])) continue; if (!isObject(key[1])) continue;
var i = parseInt(arr[key][0]); let i = parseInt(key[0]);
var qll = arr[key][1]["ql"]; var qll = key[1].ql;
if (qll) pQL.push([i, qll]); if (qll) pQL.push([i, qll]);
is.push(i); is.push(i);
@ -437,8 +434,8 @@ function populatePresets(fromls)
localStorage.setItem("wledP", JSON.stringify(pJson)); localStorage.setItem("wledP", JSON.stringify(pJson));
} }
pmtLS = pmt; pmtLS = pmt;
for (var a in is) { for (var a = 0; a < is.length; a++) {
var i = is[a]; let i = is[a];
if (expanded[i+100]) expand(i+100, true); if (expanded[i+100]) expand(i+100, true);
} }
} else { presetError(true); } } else { presetError(true); }
@ -456,7 +453,8 @@ function populateInfo(i)
if (pwr > 1000) {pwr /= 1000; pwr = pwr.toFixed((pwr > 10) ? 0 : 1); pwru = pwr + " A";} if (pwr > 1000) {pwr /= 1000; pwr = pwr.toFixed((pwr > 10) ? 0 : 1); pwru = pwr + " A";}
else if (pwr > 0) {pwr = 50 * Math.round(pwr/50); pwru = pwr + " mA";} else if (pwr > 0) {pwr = 50 * Math.round(pwr/50); pwru = pwr + " mA";}
var urows=""; var urows="";
for (var k in i.u) if (i.u) {
for (var k = 0; k < i.u.length; k++)
{ {
var val = i.u[k]; var val = i.u[k];
if (val[1]) { if (val[1]) {
@ -464,6 +462,7 @@ function populateInfo(i)
} else { } else {
urows += inforow(k,val); urows += inforow(k,val);
} }
}
} }
var vcn = "Kuuhaku"; var vcn = "Kuuhaku";
if (i.ver.startsWith("0.11.")) vcn = "Mirai"; if (i.ver.startsWith("0.11.")) vcn = "Mirai";
@ -486,14 +485,14 @@ function populateInfo(i)
function populateSegments(s) function populateSegments(s)
{ {
var cn = ""; var cn = "";
segCount = 0, lowestUnused = 0; lSeg = 0; segCount = 0; lowestUnused = 0; lSeg = 0;
for (y in s.seg) for (var y = 0; y < (s.seg||[]).length; y++)
{ {
segCount++; segCount++;
var inst=s.seg[y]; var inst=s.seg[y];
var i = parseInt(inst.id); let i = parseInt(inst.id);
powered[i] = inst.on; powered[i] = inst.on;
if (i == lowestUnused) lowestUnused = i+1; if (i == lowestUnused) lowestUnused = i+1;
if (i > lSeg) lSeg = i; if (i > lSeg) lSeg = i;
@ -559,7 +558,7 @@ function populateSegments(s)
resetUtil(); resetUtil();
noNewSegs = false; noNewSegs = false;
} }
for (i = 0; i <= lSeg; i++) { for (var i = 0; i <= lSeg; i++) {
updateLen(i); updateLen(i);
updateTrail(d.getElementById(`seg${i}bri`)); updateTrail(d.getElementById(`seg${i}bri`));
if (segCount < 2) d.getElementById(`segd${lSeg}`).style.display = "none"; if (segCount < 2) d.getElementById(`segd${lSeg}`).style.display = "none";
@ -570,7 +569,7 @@ function populateSegments(s)
function updateTrail(e, slidercol) function updateTrail(e, slidercol)
{ {
if (e==null) return; if (e==null) return;
var max = e.hasAttribute('max') ? e.attributes['max'].value : 255; var max = e.hasAttribute('max') ? e.attributes.max.value : 255;
var progress = e.value * 100 / max; var progress = e.value * 100 / max;
progress = parseInt(progress); progress = parseInt(progress);
var scol; var scol;
@ -586,11 +585,10 @@ function updateTrail(e, slidercol)
function updateBubble(e) function updateBubble(e)
{ {
var bubble = e.target.parentNode.getElementsByTagName('output')[0] var bubble = e.target.parentNode.getElementsByTagName('output')[0];
var max = e.target.hasAttribute('max') ? e.target.attributes.max.value : 255;
if (bubble) { if (bubble) {
bubble.innerHTML = e.target.value bubble.innerHTML = e.target.value;
} }
} }
@ -605,11 +603,11 @@ function updateLen(s)
var start = parseInt(d.getElementById(`seg${s}s`).value); var start = parseInt(d.getElementById(`seg${s}s`).value);
var stop = parseInt(d.getElementById(`seg${s}e`).value); var stop = parseInt(d.getElementById(`seg${s}e`).value);
var len = stop - start; var len = stop - start;
var out = "(delete)" var out = "(delete)";
if (len > 1) { if (len > 1) {
out = `${len} LEDs`; out = `${len} LEDs`;
} else if (len == 1) { } else if (len == 1) {
out = "1 LED" out = "1 LED";
} }
if (d.getElementById(`seg${s}grp`) != null) if (d.getElementById(`seg${s}grp`) != null)
@ -627,11 +625,11 @@ function updateLen(s)
function updatePA() function updatePA()
{ {
var ps = d.getElementsByClassName("seg"); var ps = d.getElementsByClassName("seg");
for (i = 0; i < ps.length; i++) { for (let i = 0; i < ps.length; i++) {
ps[i].style.backgroundColor = "var(--c-2)"; ps[i].style.backgroundColor = "var(--c-2)";
} }
ps = d.getElementsByClassName("psts"); ps = d.getElementsByClassName("psts");
for (i = 0; i < ps.length; i++) { for (let i = 0; i < ps.length; i++) {
ps[i].style.backgroundColor = "var(--c-2)"; ps[i].style.backgroundColor = "var(--c-2)";
} }
if (currentPreset > 0) { if (currentPreset > 0) {
@ -656,7 +654,7 @@ function updateUI()
updateTrail(d.getElementById('sliderW')); updateTrail(d.getElementById('sliderW'));
if (isRgbw) d.getElementById('wwrap').style.display = "block"; if (isRgbw) d.getElementById('wwrap').style.display = "block";
spal = d.getElementById("selectPalette"); var spal = d.getElementById("selectPalette");
spal.style.backgroundColor = (spal.selectedIndex > 0) ? "var(--c-6)":"var(--c-3)"; spal.style.backgroundColor = (spal.selectedIndex > 0) ? "var(--c-6)":"var(--c-3)";
updatePA(); updatePA();
updateHex(); updateHex();
@ -681,21 +679,20 @@ function cmpP(a, b) {
} }
var jsonTimeout; var jsonTimeout;
var reqC = 0;
function requestJson(command, rinfo = true, verbose = true) { function requestJson(command, rinfo = true, verbose = true) {
d.getElementById('connind').style.backgroundColor = "#a90"; d.getElementById('connind').style.backgroundColor = "#a90";
lastUpdate = new Date(); lastUpdate = new Date();
if (!jsonTimeout) jsonTimeout = setTimeout(showErrorToast, 3000); if (!jsonTimeout) jsonTimeout = setTimeout(showErrorToast, 3000);
var req = null; var req = null;
e1 = d.getElementById('fxlist'); var e1 = d.getElementById('fxlist');
e2 = d.getElementById('selectPalette'); var e2 = d.getElementById('selectPalette');
url = rinfo ? '/json/si': (command ? '/json/state':'/json'); var url = rinfo ? '/json/si': (command ? '/json/state':'/json');
if (loc) { if (loc) {
url = `http://${locip}${url}`; url = `http://${locip}${url}`;
} }
type = command ? 'post':'get'; var type = command ? 'post':'get';
if (command) if (command)
{ {
command.v = verbose; command.v = verbose;
@ -735,16 +732,16 @@ function requestJson(command, rinfo = true, verbose = true) {
pmtLast = pmt; pmtLast = pmt;
var x='',y='<option value="0">Default</option>'; var x='',y='<option value="0">Default</option>';
json.effects.shift(); //remove solid json.effects.shift(); //remove solid
for (i in json.effects) json.effects[i] = {id: parseInt(i)+1, name:json.effects[i]}; for (let i = 0; i < json.effects.length; i++) json.effects[i] = {id: parseInt(i)+1, name:json.effects[i]};
json.effects.sort(compare); json.effects.sort(compare);
for (i in json.effects) { for (let i = 0; i < json.effects.length; i++) {
x += `<button class="btn${(i==0)?" first":""}" id="fxb${json.effects[i].id}" onclick="setX(${json.effects[i].id});">${json.effects[i].name}</button><br>`; x += `<button class="btn${(i==0)?" first":""}" id="fxb${json.effects[i].id}" onclick="setX(${json.effects[i].id});">${json.effects[i].name}</button><br>`;
} }
json.palettes.shift(); //remove default json.palettes.shift(); //remove default
for (i in json.palettes) json.palettes[i] = {"id": parseInt(i)+1, "name":json.palettes[i]}; for (let i = 0; i < json.palettes.length; i++) json.palettes[i] = {"id": parseInt(i)+1, "name":json.palettes[i]};
json.palettes.sort(compare); json.palettes.sort(compare);
for (i in json.palettes) { for (let i = 0; i < json.palettes.length; i++) {
y += `<option value="${json.palettes[i].id}">${json.palettes[i].name}</option>`; y += `<option value="${json.palettes[i].id}">${json.palettes[i].name}</option>`;
} }
e1.innerHTML=x; e2.innerHTML=y; e1.innerHTML=x; e2.innerHTML=y;
@ -776,7 +773,6 @@ function requestJson(command, rinfo = true, verbose = true) {
nlTar = s.nl.tbri; nlTar = s.nl.tbri;
nlFade = s.nl.fade; nlFade = s.nl.fade;
syncSend = s.udpn.send; syncSend = s.udpn.send;
savedPresets = s.pss;
currentPreset = s.ps; currentPreset = s.ps;
d.getElementById('cyToggle').checked = (s.pl < 0) ? false : true; d.getElementById('cyToggle').checked = (s.pl < 0) ? false : true;
d.getElementById('cycs').value = s.ccnf.min; d.getElementById('cycs').value = s.ccnf.min;
@ -786,7 +782,7 @@ function requestJson(command, rinfo = true, verbose = true) {
var selc=0; var ind=0; var selc=0; var ind=0;
populateSegments(s); populateSegments(s);
for (i in s.seg) for (let i = 0; i < (s.seg||[]).length; i++)
{ {
if(s.seg[i].sel) {selc = ind; break;} ind++; if(s.seg[i].sel) {selc = ind; break;} ind++;
} }
@ -797,7 +793,7 @@ function requestJson(command, rinfo = true, verbose = true) {
return; return;
} }
var cd = d.getElementById('csl').children; var cd = d.getElementById('csl').children;
for (e = 2; e >= 0; e--) for (let e = 2; e >= 0; e--)
{ {
cd[e].style.backgroundColor = "rgb(" + i.col[e][0] + "," + i.col[e][1] + "," + i.col[e][2] + ")"; cd[e].style.backgroundColor = "rgb(" + i.col[e][0] + "," + i.col[e][1] + "," + i.col[e][2] + ")";
if (isRgbw) whites[e] = parseInt(i.col[e][3]); if (isRgbw) whites[e] = parseInt(i.col[e][3]);
@ -828,7 +824,7 @@ function requestJson(command, rinfo = true, verbose = true) {
.catch(function (error) { .catch(function (error) {
showToast(error, true); showToast(error, true);
console.log(error); console.log(error);
}) });
} }
function togglePower() { function togglePower() {
@ -974,7 +970,7 @@ function tglCs(i){
function selSegEx(s) function selSegEx(s)
{ {
var obj = {"seg":[]}; var obj = {"seg":[]};
for(i=0; i<=lSeg; i++){ for (let i=0; i<=lSeg; i++){
obj.seg.push({"sel":(i==s)?true:false}); obj.seg.push({"sel":(i==s)?true:false});
} }
requestJson(obj); requestJson(obj);
@ -989,7 +985,7 @@ function selSeg(s){
function setSeg(s){ function setSeg(s){
var start = parseInt(d.getElementById(`seg${s}s`).value); var start = parseInt(d.getElementById(`seg${s}s`).value);
var stop = parseInt(d.getElementById(`seg${s}e`).value); var stop = parseInt(d.getElementById(`seg${s}e`).value);
if (stop <= start) {delSeg(s); return;}; if (stop <= start) {delSeg(s); return;}
var obj = {"seg": {"id": s, "start": start, "stop": stop}}; var obj = {"seg": {"id": s, "start": start, "stop": stop}};
if (d.getElementById(`seg${s}grp`)) if (d.getElementById(`seg${s}grp`))
{ {
@ -1078,7 +1074,7 @@ function toggleCY() {
} }
function setPreset(i) { function setPreset(i) {
var obj = {"ps": i} var obj = {"ps": i};
showToast("Loading preset " + pName(i) +" (" + i + ")"); showToast("Loading preset " + pName(i) +" (" + i + ")");
@ -1096,7 +1092,7 @@ function saveP(i) {
try { try {
obj = JSON.parse(raw); obj = JSON.parse(raw);
} catch (e) { } catch (e) {
obj["win"] = raw; obj.win = raw;
if (raw.length < 2) { if (raw.length < 2) {
d.getElementById(`p${i}warn`).innerHTML = "&#9888; Please enter your API command first"; d.getElementById(`p${i}warn`).innerHTML = "&#9888; Please enter your API command first";
return; return;
@ -1108,27 +1104,27 @@ function saveP(i) {
return; return;
} }
} }
obj["o"] = true; obj.o = true;
} else { } else {
obj["ib"] = d.getElementById(`p${i}ibtgl`).checked; obj.ib = d.getElementById(`p${i}ibtgl`).checked;
obj["sb"] = d.getElementById(`p${i}sbtgl`).checked; obj.sb = d.getElementById(`p${i}sbtgl`).checked;
} }
obj["psave"] = pI; obj["n"] = pN; obj.psave = pI; obj.n = pN;
var pQN = d.getElementById(`p${i}ql`).value; var pQN = d.getElementById(`p${i}ql`).value;
if (pQN.length > 0) obj["ql"] = pQN; if (pQN.length > 0) obj.ql = pQN;
showToast("Saving " + pN +" (" + pI + ")"); showToast("Saving " + pN +" (" + pI + ")");
requestJson(obj); requestJson(obj);
if (obj["o"]) { if (obj.o) {
pJson[pI] = obj; pJson[pI] = obj;
delete pJson[pI]["psave"]; delete pJson[pI].psave;
delete pJson[pI]["o"]; delete pJson[pI].o;
delete pJson[pI]["v"]; delete pJson[pI].v;
delete pJson[pI]["time"]; delete pJson[pI].time;
} else { } else {
pJson[pI] = {"n":pN, "win":"Please refresh the page to see this newly saved command."}; pJson[pI] = {"n":pN, "win":"Please refresh the page to see this newly saved command."};
if (obj["win"]) pJson[pI]["win"] = obj["win"]; if (obj.win) pJson[pI].win = obj.win;
if (obj["ql"]) pJson[pI]["ql"] = obj["ql"]; if (obj.ql) pJson[pI].ql = obj.ql;
} }
populatePresets(); populatePresets();
resetPUtil(); resetPUtil();
@ -1144,7 +1140,7 @@ function delP(i) {
function selectSlot(b) { function selectSlot(b) {
csel = b; csel = b;
var cd = d.getElementById('csl').children; var cd = d.getElementById('csl').children;
for (i = 0; i < cd.length; i++) { for (let i = 0; i < cd.length; i++) {
cd[i].style.border="2px solid white"; cd[i].style.border="2px solid white";
cd[i].style.margin="5px"; cd[i].style.margin="5px";
cd[i].style.width="42px"; cd[i].style.width="42px";
@ -1243,7 +1239,7 @@ function setColor(sr) {
var hc = 0; var hc = 0;
setInterval(function(){if (!isInfo) return; hc+=18; if (hc>300) hc=0; if (hc>200)hc=306; if (hc==144) hc+=36; if (hc==108) hc+=18; setInterval(function(){if (!isInfo) return; hc+=18; if (hc>300) hc=0; if (hc>200)hc=306; if (hc==144) hc+=36; if (hc==108) hc+=18;
d.getElementById('heart').style.color = `hsl(${hc}, 100%, 50%)`}, 910); d.getElementById('heart').style.color = `hsl(${hc}, 100%, 50%)`;}, 910);
function openGH() function openGH()
{ {
@ -1277,7 +1273,7 @@ function rSegs()
bt.style.color = "#fff"; bt.style.color = "#fff";
bt.innerHTML = "Reset segments"; bt.innerHTML = "Reset segments";
var obj = {"seg":[{"start":0,"stop":ledCount,"sel":true}]}; var obj = {"seg":[{"start":0,"stop":ledCount,"sel":true}]};
for(i=1; i<=lSeg; i++){ for (let i=1; i<=lSeg; i++){
obj.seg.push({"stop":0}); obj.seg.push({"stop":0});
} }
requestJson(obj); requestJson(obj);
@ -1287,7 +1283,7 @@ function expand(i,a)
{ {
if (!a) expanded[i] = !expanded[i]; if (!a) expanded[i] = !expanded[i];
d.getElementById('seg' +i).style.display = (expanded[i]) ? "block":"none"; d.getElementById('seg' +i).style.display = (expanded[i]) ? "block":"none";
d.getElementById('sege' +i).style.transform = (expanded[i]) ? "rotate(180deg)":"rotate(0deg)" d.getElementById('sege' +i).style.transform = (expanded[i]) ? "rotate(180deg)":"rotate(0deg)";
if (i > 100) { //presets if (i > 100) { //presets
var p = i-100; var p = i-100;
d.getElementById(`p${p}o`).style.background = (expanded[i] || p != currentPreset)?"var(--c-2)":"var(--c-6)"; d.getElementById(`p${p}o`).style.background = (expanded[i] || p != currentPreset)?"var(--c-2)":"var(--c-6)";
@ -1312,7 +1308,7 @@ const _C = document.querySelector('.container'), N = 4;
let iSlide = 0, x0 = null, scrollS = 0, locked = false, w; let iSlide = 0, x0 = null, scrollS = 0, locked = false, w;
function unify(e) { return e.changedTouches ? e.changedTouches[0] : e } function unify(e) { return e.changedTouches ? e.changedTouches[0] : e; }
function hasIroClass(classList) { function hasIroClass(classList) {
for (var i = 0; i < classList.length; i++) { for (var i = 0; i < classList.length; i++) {
@ -1334,7 +1330,7 @@ function lock(e) {
x0 = unify(e).clientX; x0 = unify(e).clientX;
scrollS = d.getElementsByClassName("tabcontent")[iSlide].scrollTop; scrollS = d.getElementsByClassName("tabcontent")[iSlide].scrollTop;
_C.classList.toggle('smooth', !(locked = true)) _C.classList.toggle('smooth', !(locked = true));
} }
function move(e) { function move(e) {
@ -1342,16 +1338,16 @@ function move(e) {
var dx = unify(e).clientX - x0, s = Math.sign(dx), var dx = unify(e).clientX - x0, s = Math.sign(dx),
f = +(s*dx/w).toFixed(2); f = +(s*dx/w).toFixed(2);
if((iSlide > 0 || s < 0) && (iSlide < N - 1 || s > 0) if((iSlide > 0 || s < 0) && (iSlide < N - 1 || s > 0) &&
&& f > .12 f > 0.12 &&
&& d.getElementsByClassName("tabcontent")[iSlide].scrollTop == scrollS) { d.getElementsByClassName("tabcontent")[iSlide].scrollTop == scrollS) {
_C.style.setProperty('--i', iSlide -= s); _C.style.setProperty('--i', iSlide -= s);
f = 1 - f; f = 1 - f;
updateTablinks(iSlide); updateTablinks(iSlide);
} }
_C.style.setProperty('--f', f); _C.style.setProperty('--f', f);
_C.classList.toggle('smooth', !(locked = false)); _C.classList.toggle('smooth', !(locked = false));
x0 = null x0 = null;
} }
function size() { function size() {

File diff suppressed because it is too large Load Diff

View File

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