Conflicts:
	wled00/data/index.css
	wled00/data/index.htm
	wled00/data/index.js
	wled00/html_ui.h
	wled00/json.cpp
This commit is contained in:
Blaz Kristan 2021-03-20 14:48:49 +01:00
commit e6d50f94ee
7 changed files with 2283 additions and 2284 deletions

3
.gitignore vendored
View File

@ -7,9 +7,10 @@
/wled00/Release /wled00/Release
/wled00/extLibs /wled00/extLibs
/platformio_override.ini /platformio_override.ini
/wled00/my_config.h /wled00/my_config.h
/build_output /build_output
.DS_Store .DS_Store
.gitignore .gitignore
.clang-format .clang-format
node_modules node_modules
.idea

View File

@ -166,6 +166,7 @@ button {
} }
.sel-icon { .sel-icon {
cursor: pointer;
transform: translateX(3px); transform: translateX(3px);
color: var(--c-d); color: var(--c-d);
} }
@ -553,6 +554,7 @@ input[type=range]::-moz-range-thumb {
font-size: 19px; font-size: 19px;
background-color: var(--c-3); background-color: var(--c-3);
color: var(--c-f); color: var(--c-f);
cursor: pointer;
border: 0px solid white; border: 0px solid white;
border-radius: 25px; border-radius: 25px;
transition-duration: 0.5s; transition-duration: 0.5s;
@ -769,7 +771,7 @@ input[type=number]::-webkit-outer-spin-button {
cursor: pointer; cursor: pointer;
} }
.check { .check, .radio {
display: inline-block; display: inline-block;
position: relative; position: relative;
padding-bottom: 32px; padding-bottom: 32px;
@ -789,7 +791,13 @@ input[type=number]::-webkit-outer-spin-button {
margin-top: 8px; margin-top: 8px;
} }
.check input { .fxchkl {
position: absolute;
top: 0px;
left: 8px;
}
.check input, .radio input {
position: absolute; position: absolute;
opacity: 0; opacity: 0;
cursor: pointer; cursor: pointer;
@ -797,7 +805,7 @@ input[type=number]::-webkit-outer-spin-button {
width: 0; width: 0;
} }
.checkmark { .checkmark, .radiomark {
position: absolute; position: absolute;
bottom: 0; bottom: 0;
left: 0; left: 0;
@ -807,6 +815,12 @@ input[type=number]::-webkit-outer-spin-button {
border-radius: 10px; border-radius: 10px;
} }
.radiomark {
height: 24px;
width: 24px;
border-radius: 50%;
}
.schk { .schk {
top: 0; top: 0;
} }
@ -833,13 +847,13 @@ input[type=number]::-webkit-outer-spin-button {
background-color: var(--c-6); background-color: var(--c-6);
} }
.checkmark:after { .checkmark:after, .radiomark:after {
content: ""; content: "";
position: absolute; position: absolute;
display: none; display: none;
} }
.check input:checked ~ .checkmark:after { .check input:checked ~ .checkmark:after, .radio input:checked ~ .radiomark:after {
display: block; display: block;
} }
@ -855,6 +869,16 @@ input[type=number]::-webkit-outer-spin-button {
transform: rotate(45deg); transform: rotate(45deg);
} }
.radio .radiomark:after {
width: 12px;
height: 12px;
top: 50%;
left: 50%;
margin: -6px;
border-radius: 50%;
background: var(--c-f);
}
.h { .h {
font-size: 13px; font-size: 13px;
text-align: center; text-align: center;

View File

@ -99,9 +99,8 @@
<input id="hexc" type="text" class="noslide" onkeydown="hexEnter(this)" autocomplete="off" maxlength="8" /> <input id="hexc" type="text" class="noslide" onkeydown="hexEnter(this)" autocomplete="off" maxlength="8" />
<button id="hexcnf" class="xxs btn" onclick="fromHex();"><i class="icons btna-icon">&#xe390;</i></button> <button id="hexcnf" class="xxs btn" onclick="fromHex();"><i class="icons btna-icon">&#xe390;</i></button>
</div> </div>
<p class="labels">Color palette</p> <p class="labels"><i class="icons sel-icon" onclick="tglHex()">&#xe2b3;</i> Color palette</p>
<div class="il"> <div class="il">
<i class="icons sel-icon" onclick="tglHex()">&#xe2b3;</i>
<div class="staytop fnd"> <div class="staytop fnd">
<input type="text" class="fnd" placeholder="Search" oninput="search(this,'selectPalette')" onfocus="search(this)" /> <input type="text" class="fnd" placeholder="Search" oninput="search(this,'selectPalette')" onfocus="search(this)" />
<span onclick="clean(this)" class="icons">&#xe38f;</span> <span onclick="clean(this)" class="icons">&#xe38f;</span>
@ -109,10 +108,10 @@
</div> </div>
<div id="selectPalette" class="list"> <div id="selectPalette" class="list">
<div class="lstI" data-id="0"> <div class="lstI" data-id="0">
<label class="check schkl"> <label class="radio schkl">
&nbsp; &nbsp;
<input type="radio" value="${palettes[i].id}" name="palette" onChange="setPalette()"> <input type="radio" value="${palettes[i].id}" name="palette" onChange="setPalette()">
<span class="checkmark schk"></span> <span class="radiomark schk"></span>
</label> </label>
<div class="lstIcontent"> <div class="lstIcontent">
<span class="lstIname"> <span class="lstIname">
@ -123,7 +122,7 @@
<div class="lstI"> <div class="lstI">
<div class="lstIcontent"> <div class="lstIcontent">
<span class="lstIname"> <span class="lstIname">
Loading Loading...
</span> </span>
</div> </div>
</div> </div>

View File

@ -1,5 +1,4 @@
//page js //page js
const lsPalKey = "wledPalx";
var loc = false, locip; var loc = false, locip;
var noNewSegs = false; var noNewSegs = false;
var isOn = false, nlA = false, isLv = false, isInfo = false, isNodes = false, syncSend = false, syncTglRecv = true, isRgbw = false; var isOn = false, nlA = false, isLv = false, isInfo = false, isNodes = false, syncSend = false, syncTglRecv = true, isRgbw = false;
@ -189,7 +188,6 @@ function onLoad()
pmtLS = localStorage.getItem('wledPmt'); pmtLS = localStorage.getItem('wledPmt');
// Load initial data // Load initial data
getPalettesDataCached();
loadPalettes(function() { loadPalettes(function() {
loadFX(function() { loadFX(function() {
loadPresets(function() { loadPresets(function() {
@ -319,9 +317,7 @@ function cpBck()
copyText.select(); copyText.select();
copyText.setSelectionRange(0, 999999); copyText.setSelectionRange(0, 999999);
d.execCommand("copy"); d.execCommand("copy");
showToast("Copied to clipboard!"); showToast("Copied to clipboard!");
} }
@ -803,10 +799,10 @@ function genPalPrevCss(id)
function generateListItemHtml(listName, id, name, clickAction, extraHtml = '') function generateListItemHtml(listName, id, name, clickAction, extraHtml = '')
{ {
return `<div class="lstI" data-id="${id}"> return `<div class="lstI" data-id="${id}">
<label class="check schkl"> <label class="radio schkl">
&nbsp; &nbsp;
<input type="radio" value="${id}" name="${listName}" onChange="${clickAction}()"> <input type="radio" value="${id}" name="${listName}" onChange="${clickAction}()">
<span class="checkmark schk"></span> <span class="radiomark schk"></span>
</label> </label>
<div class="lstIcontent" onClick="${clickAction}(${id})"> <div class="lstIcontent" onClick="${clickAction}(${id})">
<span class="lstIname"> <span class="lstIname">
@ -1089,6 +1085,8 @@ function requestJson(command, rinfo = true, verbose = true, callback = null)
lastinfo = info; lastinfo = info;
if (isInfo) populateInfo(info); if (isInfo) populateInfo(info);
displayRover(info, s); displayRover(info, s);
if (!rinfo) loadPalettesData();
} }
if (!handleJson(s)) { if (!handleJson(s)) {
@ -1609,34 +1607,27 @@ function rSegs()
function loadPalettesData() function loadPalettesData()
{ {
if (palettesData || getPalettesDataCached()) return; if (palettesData) return;
const lsKey = "wledPalx";
var dateExpiration = new Date(); var palettesDataJson = localStorage.getItem(lsKey);
palettesData = {}; if (palettesDataJson) {
getPalettesData(1, function() {
localStorage.setItem(lsPalKey, JSON.stringify({
p: palettesData,
expiration: dateExpiration.getTime() + (24 * 60 * 60 * 1000) // 24 hrs expiration
}));
requestJson(null, false);
});
}
function getPalettesDataCached()
{
var palDataJson = localStorage.getItem(lsPalKey);
if (palDataJson) {
try { try {
palDataJson = JSON.parse(palDataJson); palettesDataJson = JSON.parse(palettesDataJson);
var d = new Date(); if (palettesDataJson && palettesDataJson.vid == lastinfo.vid) {
if (palDataJson && palDataJson.expiration && palDataJson.expiration > d.getTime()) { palettesData = palettesDataJson.p;
palettesData = palDataJson.p; return;
redrawPalPrev();
return true;
} }
} catch (e) {} } catch (e) {}
} }
return false;
palettesData = {};
getPalettesData(0, function() {
localStorage.setItem(lsKey, JSON.stringify({
p: palettesData,
vid: lastinfo.vid
}));
redrawPalPrev();
});
} }
function getPalettesData(page, callback) function getPalettesData(page, callback)
@ -1655,7 +1646,7 @@ function getPalettesData(page, callback)
}) })
.then(json => { .then(json => {
palettesData = Object.assign({}, palettesData, json.p); palettesData = Object.assign({}, palettesData, json.p);
if (page < json.m) setTimeout(function() { getPalettesData(page + 1, callback); }, 100); if (page < json.m) setTimeout(function() { getPalettesData(page + 1, callback); }, 50);
else callback(); else callback();
}) })
.catch(function(error) { .catch(function(error) {

File diff suppressed because it is too large Load Diff

View File

@ -59,13 +59,14 @@ void deserializeSegment(JsonObject elem, byte it)
if (sz == 0) continue; //do nothing on empty array if (sz == 0) continue; //do nothing on empty array
byte cp = copyArray(colX, rgbw, 4); byte cp = copyArray(colX, rgbw, 4);
if (cp == 1 && rgbw[0] == 0) seg.setColor(i, 0, id); if (cp == 1 && rgbw[0] == 0)
seg.setColor(i, 0, id);
colValid = true; colValid = true;
} }
if (!colValid) continue; if (!colValid) continue;
if (id == strip.getMainSegmentId() && i < 2) //temporary, to make transition work on main segment if (id == strip.getMainSegmentId() && i < 2) //temporary, to make transition work on main segment
{ {
if (i == 0) {col[0] = rgbw[0]; col[1] = rgbw[1]; col[2] = rgbw[2]; col[3] = rgbw[3];} if (i == 0) {col[0] = rgbw[0]; col[1] = rgbw[1]; col[2] = rgbw[2]; col[3] = rgbw[3];}
if (i == 1) {colSec[0] = rgbw[0]; colSec[1] = rgbw[1]; colSec[2] = rgbw[2]; colSec[3] = rgbw[3];} if (i == 1) {colSec[0] = rgbw[0]; colSec[1] = rgbw[1]; colSec[2] = rgbw[2]; colSec[3] = rgbw[3];}
} else { //normal case, apply directly to segment } else { //normal case, apply directly to segment
@ -86,7 +87,7 @@ void deserializeSegment(JsonObject elem, byte it)
parseLxJson(ly, id, true); parseLxJson(ly, id, true);
} }
#endif #endif
//if (pal != seg.palette && pal < strip.getPaletteCount()) strip.setPalette(pal); //if (pal != seg.palette && pal < strip.getPaletteCount()) strip.setPalette(pal);
seg.setOption(SEG_OPTION_SELECTED, elem[F("sel")] | seg.getOption(SEG_OPTION_SELECTED)); seg.setOption(SEG_OPTION_SELECTED, elem[F("sel")] | seg.getOption(SEG_OPTION_SELECTED));
seg.setOption(SEG_OPTION_REVERSED, elem["rev"] | seg.getOption(SEG_OPTION_REVERSED)); seg.setOption(SEG_OPTION_REVERSED, elem["rev"] | seg.getOption(SEG_OPTION_REVERSED));
@ -159,9 +160,9 @@ bool deserializeState(JsonObject root)
{ {
strip.applyToAllSelected = false; strip.applyToAllSelected = false;
bool stateResponse = root[F("v")] | false; bool stateResponse = root[F("v")] | false;
bri = root["bri"] | bri; bri = root["bri"] | bri;
bool on = root["on"] | (bri > 0); bool on = root["on"] | (bri > 0);
if (!on != !bri) toggleOnOff(); if (!on != !bri) toggleOnOff();
@ -305,16 +306,16 @@ void serializeSegment(JsonObject& root, WS2812FX::Segment& seg, byte id, bool fo
root["bri"] = (segbri) ? segbri : 255; root["bri"] = (segbri) ? segbri : 255;
JsonArray colarr = root.createNestedArray("col"); JsonArray colarr = root.createNestedArray("col");
for (uint8_t i = 0; i < 3; i++) for (uint8_t i = 0; i < 3; i++)
{ {
JsonArray colX = colarr.createNestedArray(); JsonArray colX = colarr.createNestedArray();
if (id == strip.getMainSegmentId() && i < 2) //temporary, to make transition work on main segment if (id == strip.getMainSegmentId() && i < 2) //temporary, to make transition work on main segment
{ {
if (i == 0) { if (i == 0) {
colX.add(col[0]); colX.add(col[1]); colX.add(col[2]); if (useRGBW) colX.add(col[3]); colX.add(col[0]); colX.add(col[1]); colX.add(col[2]); if (useRGBW) colX.add(col[3]);
} else { } else {
colX.add(colSec[0]); colX.add(colSec[1]); colX.add(colSec[2]); if (useRGBW) colX.add(colSec[3]); colX.add(colSec[0]); colX.add(colSec[1]); colX.add(colSec[2]); if (useRGBW) colX.add(colSec[3]);
} }
} else { } else {
colX.add((seg.colors[i] >> 16) & 0xFF); colX.add((seg.colors[i] >> 16) & 0xFF);
@ -335,7 +336,7 @@ void serializeSegment(JsonObject& root, WS2812FX::Segment& seg, byte id, bool fo
} }
void serializeState(JsonObject root, bool forPreset, bool includeBri, bool segmentBounds) void serializeState(JsonObject root, bool forPreset, bool includeBri, bool segmentBounds)
{ {
if (includeBri) { if (includeBri) {
root["on"] = (bri > 0); root["on"] = (bri > 0);
root["bri"] = briLast; root["bri"] = briLast;
@ -344,12 +345,9 @@ void serializeState(JsonObject root, bool forPreset, bool includeBri, bool segme
if (!forPreset) { if (!forPreset) {
if (errorFlag) root[F("error")] = errorFlag; if (errorFlag) root[F("error")] = errorFlag;
root[F("ps")] = currentPreset; root[F("ps")] = currentPreset;
root[F("pl")] = (presetCyclingEnabled) ? 0: -1; root[F("pl")] = (presetCyclingEnabled) ? 0: -1;
// JsonObject um = root.createNestedObject(F("um"));
// usermods.addToJsonState(um);
usermods.addToJsonState(root); usermods.addToJsonState(root);
//temporary for preset cycle //temporary for preset cycle
@ -419,7 +417,7 @@ void serializeInfo(JsonObject root)
root[F("ver")] = versionString; root[F("ver")] = versionString;
root[F("vid")] = VERSION; root[F("vid")] = VERSION;
//root[F("cn")] = WLED_CODENAME; //root[F("cn")] = WLED_CODENAME;
JsonObject leds = root.createNestedObject("leds"); JsonObject leds = root.createNestedObject("leds");
leds[F("count")] = ledCount; leds[F("count")] = ledCount;
leds[F("rgbw")] = useRGBW; leds[F("rgbw")] = useRGBW;
@ -440,7 +438,7 @@ void serializeInfo(JsonObject root)
leds[F("seglock")] = false; //will be used in the future to prevent modifications to segment config leds[F("seglock")] = false; //will be used in the future to prevent modifications to segment config
root[F("str")] = syncToggleReceive; root[F("str")] = syncToggleReceive;
root[F("name")] = serverDescription; root[F("name")] = serverDescription;
root[F("udpport")] = udpPort; root[F("udpport")] = udpPort;
root["live"] = (bool)realtimeMode; root["live"] = (bool)realtimeMode;
@ -509,13 +507,13 @@ void serializeInfo(JsonObject root)
#endif #endif
root[F("lwip")] = LWIP_VERSION_MAJOR; root[F("lwip")] = LWIP_VERSION_MAJOR;
#endif #endif
root[F("freeheap")] = ESP.getFreeHeap(); root[F("freeheap")] = ESP.getFreeHeap();
root[F("uptime")] = millis()/1000 + rolloverMillis*4294967; root[F("uptime")] = millis()/1000 + rolloverMillis*4294967;
if (sunrise && sunset) root[F("isday")] = daytime; if (sunrise && sunset) root[F("isday")] = daytime;
usermods.addToJsonInfo(root); usermods.addToJsonInfo(root);
byte os = 0; byte os = 0;
#ifdef WLED_DEBUG #ifdef WLED_DEBUG
os = 0x80; os = 0x80;
@ -538,11 +536,11 @@ void serializeInfo(JsonObject root)
#ifdef WLED_ENABLE_ADALIGHT #ifdef WLED_ENABLE_ADALIGHT
os += 0x02; os += 0x02;
#endif #endif
#ifndef WLED_DISABLE_OTA #ifndef WLED_DISABLE_OTA
os += 0x01; os += 0x01;
#endif #endif
root[F("opt")] = os; root[F("opt")] = os;
root[F("brand")] = "WLED"; root[F("brand")] = "WLED";
root[F("product")] = F("FOSS"); root[F("product")] = F("FOSS");
root["mac"] = escapedMac; root["mac"] = escapedMac;
@ -596,25 +594,19 @@ void serializePalettes(JsonObject root, AsyncWebServerRequest* request)
int itemPerPage = 8; int itemPerPage = 8;
#endif #endif
int page; int page = 0;
if (request->hasParam("page")) { if (request->hasParam("page")) {
page = request->getParam("page")->value().toInt(); page = request->getParam("page")->value().toInt();
} else {
page = 1;
} }
int palettesCount = strip.getPaletteCount(); int palettesCount = strip.getPaletteCount();
int maxPage = ceil((float)palettesCount / (float)itemPerPage); int maxPage = (palettesCount -1) / itemPerPage;
if (page > maxPage) { if (page > maxPage) page = maxPage;
page = maxPage;
}
int start = itemPerPage * (page - 1); int start = itemPerPage * page;
int end = start + itemPerPage; int end = start + itemPerPage;
if (end > palettesCount - 1) { if (end >= palettesCount) end = palettesCount;
end = palettesCount;
}
root[F("m")] = maxPage; root[F("m")] = maxPage;
JsonObject palettes = root.createNestedObject("p"); JsonObject palettes = root.createNestedObject("p");
@ -629,19 +621,10 @@ void serializePalettes(JsonObject root, AsyncWebServerRequest* request)
setPaletteColors(curPalette, PartyColors_p); setPaletteColors(curPalette, PartyColors_p);
break; break;
case 1: //random case 1: //random
curPalette.add(F("r")); curPalette.add("r");
curPalette.add(F("r")); curPalette.add("r");
curPalette.add(F("r")); curPalette.add("r");
curPalette.add(F("r")); curPalette.add("r");
/**setPaletteColors(
curPalette,
CRGBPalette16(
CHSV(random8(), 255, random8(128, 255)),
CHSV(random8(), 255, random8(128, 255)),
CHSV(random8(), 192, random8(128, 255)),
CHSV(random8(), 255, random8(128, 255))
)
);**/
break; break;
case 2: //primary color only case 2: //primary color only
curPalette.add(F("c1")); curPalette.add(F("c1"));
@ -753,7 +736,7 @@ void serveJson(AsyncWebServerRequest* request)
request->send( 501, "application/json", F("{\"error\":\"Not implemented\"}")); request->send( 501, "application/json", F("{\"error\":\"Not implemented\"}"));
return; return;
} }
AsyncJsonResponse* response = new AsyncJsonResponse(JSON_BUFFER_SIZE); AsyncJsonResponse* response = new AsyncJsonResponse(JSON_BUFFER_SIZE);
JsonObject doc = response->getRoot(); JsonObject doc = response->getRoot();
@ -770,7 +753,7 @@ void serveJson(AsyncWebServerRequest* request)
default: //all default: //all
JsonObject state = doc.createNestedObject("state"); JsonObject state = doc.createNestedObject("state");
serializeState(state); serializeState(state);
JsonObject info = doc.createNestedObject("info"); JsonObject info = doc.createNestedObject("info");
serializeInfo(info); serializeInfo(info);
if (subJson != 3) if (subJson != 3)
{ {
@ -778,7 +761,7 @@ void serveJson(AsyncWebServerRequest* request)
doc[F("palettes")] = serialized((const __FlashStringHelper*)JSON_palette_names); doc[F("palettes")] = serialized((const __FlashStringHelper*)JSON_palette_names);
} }
} }
response->setLength(); response->setLength();
request->send(response); request->send(response);
} }

View File

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