Multiple fixes:

- ability so select mainseg (UI)
- changed preset sort (UI)
- IR40 white +/- fix
- IR repeatable actions fix
- minor UI CSS change
- removed unnecessary color functions
This commit is contained in:
Blaz Kristan 2022-02-27 22:19:05 +01:00
parent fc845dc936
commit 4ce557a829
6 changed files with 2320 additions and 2302 deletions

View File

@ -10,33 +10,6 @@ void setRandomColor(byte* rgb)
colorHStoRGB(lastRandomIndex*256,255,rgb);
}
void colorFromUint32(uint32_t in, bool secondary)
{
byte *_col = secondary ? colSec : col;
_col[0] = R(in);
_col[1] = G(in);
_col[2] = B(in);
_col[3] = W(in);
}
//load a color without affecting the white channel
void colorFromUint24(uint32_t in, bool secondary)
{
byte *_col = secondary ? colSec : col;
_col[0] = R(in);
_col[1] = G(in);
_col[2] = B(in);
}
//relatively change white brightness, minumum A=5
void relativeChangeWhite(int8_t amount, byte lowerBoundary)
{
int16_t new_val = (int16_t) col[3] + amount;
if (new_val > 0xFF) new_val = 0xFF;
else if (new_val < lowerBoundary) new_val = lowerBoundary;
col[3] = new_val;
}
void colorHStoRGB(uint16_t hue, byte sat, byte* rgb) //hue, sat to rgb
{
float h = ((float)hue)/65535.0;

View File

@ -760,11 +760,12 @@ input[type=number]::-webkit-outer-spin-button {
margin: 3px 0 6px 0 !important;
}
.segname {
.pname, .plname, .segname {
position: absolute;
top: 0px;
left: 50%;
padding: 9px 0;
text-align: center;
overflow: hidden;
text-overflow: clip;
transform: translateX(-50%);
white-space: nowrap;
cursor: pointer;
@ -776,12 +777,19 @@ input[type=number]::-webkit-outer-spin-button {
text-overflow: clip;
}
.pname {
.segname {
top: 2px;
padding: 9px 0;
}
.pname, .plname {
width: 208px;
padding: 8px 0;
text-align: center;
overflow: hidden;
text-overflow: clip;
}
.pname {
top: 2px;
}
.plname {
top:0;
}
.pid {
@ -824,10 +832,12 @@ input[type=number]::-webkit-outer-spin-button {
}
.cnf-s {
position: absolute;
/*position: absolute;
bottom: 100px;
right: 23px;
padding: 7px 22px;
right: 23px;*/
padding: 9px 22px 7px;
margin: 0;
display: inline;
}
.pwr {
@ -889,17 +899,16 @@ input[type=number]::-webkit-outer-spin-button {
.checkmark, .radiomark {
position: absolute;
bottom: 0;
top: 6px;
left: 0;
height: 25px;
width: 25px;
background-color: var(--c-3);
height: 24px;
width: 24px;
background-color: var(--c-4);
border-radius: 10px;
/*border: 1px solid var(--c-2);*/
}
.radiomark {
height: 24px;
width: 24px;
border-radius: 50%;
background-color: transparent;
}
@ -925,11 +934,11 @@ input[type=number]::-webkit-outer-spin-button {
.check:hover input ~ .checkmark {
background-color: var(--c-4);
}
/*
.check input:checked ~ .checkmark {
background-color: var(--c-6);
}
*/
.checkmark:after, .radiomark:after {
content: "";
position: absolute;
@ -942,7 +951,7 @@ input[type=number]::-webkit-outer-spin-button {
.check .checkmark:after {
left: 9px;
top: 5px;
top: 4px;
width: 5px;
height: 10px;
border: solid var(--c-f);
@ -953,11 +962,11 @@ input[type=number]::-webkit-outer-spin-button {
}
.radio .radiomark:after {
width: 12px;
height: 12px;
width: 14px;
height: 14px;
top: 50%;
left: 50%;
margin: -6px;
margin: -7px;
border-radius: 50%;
background: var(--c-f);
}
@ -972,7 +981,7 @@ input[type=number]::-webkit-outer-spin-button {
margin-bottom: 5px;
}
.seg {
.seg, .pres {
position: relative;
display: inline-block;
padding: 8px;
@ -988,6 +997,13 @@ input[type=number]::-webkit-outer-spin-button {
filter: brightness(1);
}
.selected {
background-color: var(--c-4);
}
.selected .checkmark, .selected .radiokmark {
background-color: var(--c-6);
}
.list {
position: relative;
transition: background-color 0.5s;

View File

@ -370,7 +370,7 @@ function presetError(empty)
} catch (e) {
}
var cn = `<div class="seg c">`;
var cn = `<div class="pres c">`;
if (empty)
cn += `You have no presets yet!`;
else
@ -479,9 +479,9 @@ function populatePresets(fromls)
if (qll) pQL.push([i, qll]);
is.push(i);
cn += `<div class="seg pres" id="p${i}o">`;
cn += `<div class="pres" id="p${i}o">`;
if (cfg.comp.pid) cn += `<div class="pid">${i}</div>`;
cn += `<div class="segname pname" onclick="setPreset(${i})">${isPlaylist(i)?"<i class='icons btn-icon'>&#xe139;</i>":""}${pName(i)}</div>
cn += `<div class="${isPlaylist(i)?'plname':'pname'}" onclick="setPreset(${i})">${isPlaylist(i)?"<i class='icons btn-icon'>&#xe139;</i>":""}${pName(i)}</div>
<i class="icons e-icon flr ${expanded[i+100] ? "exp":""}" id="sege${i+100}" onclick="expand(${i+100})">&#xe395;</i>
<div class="segin" id="seg${i+100}"></div>
</div><br>`;
@ -560,7 +560,7 @@ function populateSegments(s)
if (i == lowestUnused) lowestUnused = i+1;
if (i > lSeg) lSeg = i;
cn += `<div class="seg">
cn += `<div class="seg ${i==s.mainseg ? 'selected' : ''}">
<label class="check schkl">
&nbsp;
<input type="checkbox" id="seg${i}sel" onchange="selSeg(${i})" ${inst.sel ? "checked":""}>
@ -904,9 +904,10 @@ function updateLen(s)
//updates background color of currently selected preset
function updatePA()
{
var ps = d.getElementsByClassName("seg"); //reset all preset buttons
var ps = d.getElementsByClassName("pres"); //reset all preset buttons
for (let i = 0; i < ps.length; i++) {
ps[i].style.backgroundColor = "var(--c-2)";
//ps[i].style.backgroundColor = "var(--c-2)";
ps[i].classList.remove("selected");
}
ps = d.getElementsByClassName("psts"); //reset all quick selectors
for (let i = 0; i < ps.length; i++) {
@ -915,9 +916,12 @@ function updatePA()
if (currentPreset > 0) {
var acv = d.getElementById(`p${currentPreset}o`);
if (acv && !expanded[currentPreset+100])
acv.style.background = "var(--c-6)"; //highlight current preset
//acv.style.background = "var(--c-6)"; //highlight current preset
acv.classList.add("selected");
acv = d.getElementById(`p${currentPreset}qlb`);
if (acv) acv.style.background = "var(--c-6)"; //highlight quick selector
if (acv)
//acv.style.background = "var(--c-6)"; //highlight quick selector
acv.classList.add("selected");
}
}
@ -952,7 +956,14 @@ function compare(a, b) {
}
function cmpP(a, b) {
if (!a[1].n) return (a[0] > b[0]);
return a[1].n.localeCompare(b[1].n,undefined, {numeric: true});
//return a[1].n.localeCompare(b[1].n,undefined, {numeric: true});
// sort playlists first, followed by presets with characters and last presets with special 1st character
const c = a[1].n.charCodeAt(0);
const d = b[1].n.charCodeAt(0);
if ((c>47 && c<58) || (c>64 && c<91) || (c>96 && c<123) || c>255) x = '='; else x = '>';
if ((d>47 && d<58) || (d>64 && d<91) || (d>96 && d<123) || d>255) y = '='; else y = '>';
const n = (a[1].playlist ? '<' : x) + a[1].n;
return n.localeCompare((b[1].playlist ? '<' : y) + b[1].n, undefined, {numeric: true});
}
//forces a WebSockets reconnect if timeout (error toast), or successful HTTP response to JSON request
@ -1446,8 +1457,8 @@ ${(i>0)? ('<div class="h">ID ' +i+ '</div>'):""}`;
}
function makePUtil() {
d.getElementById('putil').innerHTML = `<div class="seg pres">
<div class="segname newseg">
d.getElementById('putil').innerHTML = `<div class="pres">
<div class="pname newseg">
New preset</div>
<div class="segin expanded">
${makeP(0)}</div></div>`;
@ -1473,8 +1484,8 @@ function makePlUtil() {
showToast("Please make a preset first!"); return;
}
if (plJson[0].transition[0] < 0) plJson[0].transition[0] = tr;
d.getElementById('putil').innerHTML = `<div class="seg pres">
<div class="segname newseg">
d.getElementById('putil').innerHTML = `<div class="pres">
<div class="pname newseg">
New playlist</div>
<div class="segin expanded" id="seg100">
${makeP(0,true)}</div></div>`;
@ -1503,9 +1514,8 @@ function tglSegn(s)
function selSegEx(s)
{
var obj = {"seg":[]};
for (let i=0; i<=lSeg; i++){
obj.seg.push({"sel":(i==s)?true:false});
}
for (let i=0; i<=lSeg; i++) obj.seg.push({"id":i,"sel":(i==s)});
obj.mainseg = s;
requestJson(obj);
}

View File

@ -58,10 +58,7 @@ bool getJsonValue(const JsonVariant& element, DestType& destination, const Defau
//colors.cpp
void colorFromUint32(uint32_t in, bool secondary = false);
void colorFromUint24(uint32_t in, bool secondary = false);
inline uint32_t colorFromRgbw(byte* rgbw) { return uint32_t((byte(rgbw[3]) << 24) | (byte(rgbw[0]) << 16) | (byte(rgbw[1]) << 8) | (byte(rgbw[2]))); }
void relativeChangeWhite(int8_t amount, byte lowerBoundary = 0);
void colorHStoRGB(uint16_t hue, byte sat, byte* rgb); //hue, sat to rgb
void colorKtoRGB(uint16_t kelvin, byte* rgb);
void colorCTtoRGB(uint16_t mired, byte* rgb); //white spectrum to rgb

File diff suppressed because it is too large Load Diff

View File

@ -251,17 +251,27 @@ void changeColor(uint32_t c, int16_t cct=-1)
stateChanged = true;
}
void changeWhite(int8_t amount, int16_t cct=-1)
{
WS2812FX::Segment& seg = irApplyToAllSelected ? strip.getFirstSelectedSeg() : strip.getMainSegment();
byte r = R(seg.colors[0]);
byte g = G(seg.colors[0]);
byte b = B(seg.colors[0]);
byte w = relativeChange(W(seg.colors[0]), amount, 5);
changeColor(RGBW32(r, g, b, w), cct);
}
void decodeIR(uint32_t code)
{
if (code == 0xFFFFFFFF) //repeated code, continue brightness up/down
{
if (code == 0xFFFFFFFF) {
//repeated code, continue brightness up/down
irTimesRepeated++;
applyRepeatActions();
return;
}
lastValidCode = 0; irTimesRepeated = 0;
//if (decodeIRCustom(code)) return;
lastRepeatableAction = ACTION_NONE;
if (irEnabled == 8) { // any remote configurable with ir.json file
decodeIRJson(code);
stateUpdated(CALL_MODE_BUTTON);
@ -271,11 +281,8 @@ void decodeIR(uint32_t code)
switch (irEnabled) {
case 1:
if (code > 0xF80000) {
decodeIR24OLD(code); // white 24-key remote (old) - it sends 0xFF0000 values
} else {
decodeIR24(code); // 24-key remote - 0xF70000 to 0xF80000
}
if (code > 0xF80000) decodeIR24OLD(code); // white 24-key remote (old) - it sends 0xFF0000 values
else decodeIR24(code); // 24-key remote - 0xF70000 to 0xF80000
break;
case 2: decodeIR24CT(code); break; // white 24-key remote with CW, WW, CT+ and CT- keys
case 3: decodeIR40(code); break; // blue 40-key remote with 25%, 50%, 75% and 100% keys
@ -289,7 +296,7 @@ void decodeIR(uint32_t code)
}
if (nightlightActive && bri == 0) nightlightActive = false;
colorUpdated(CALL_MODE_BUTTON); //for notifier, IR is considered a button input
stateUpdated(CALL_MODE_BUTTON); //for notifier, IR is considered a button input
}
void applyRepeatActions()
@ -298,24 +305,24 @@ void applyRepeatActions()
decodeIRJson(lastValidCode);
return;
} else switch (lastRepeatableAction) {
case ACTION_BRIGHT_UP : incBrightness(); colorUpdated(CALL_MODE_BUTTON); return;
case ACTION_BRIGHT_DOWN : decBrightness(); colorUpdated(CALL_MODE_BUTTON); return;
case ACTION_SPEED_UP : changeEffectSpeed(lastRepeatableValue); colorUpdated(CALL_MODE_BUTTON); return;
case ACTION_SPEED_DOWN : changeEffectSpeed(lastRepeatableValue); colorUpdated(CALL_MODE_BUTTON); return;
case ACTION_INTENSITY_UP : changeEffectIntensity(lastRepeatableValue); colorUpdated(CALL_MODE_BUTTON); return;
case ACTION_INTENSITY_DOWN : changeEffectIntensity(lastRepeatableValue); colorUpdated(CALL_MODE_BUTTON); return;
case ACTION_BRIGHT_UP : incBrightness(); stateUpdated(CALL_MODE_BUTTON); return;
case ACTION_BRIGHT_DOWN : decBrightness(); stateUpdated(CALL_MODE_BUTTON); return;
case ACTION_SPEED_UP : changeEffectSpeed(lastRepeatableValue); stateUpdated(CALL_MODE_BUTTON); return;
case ACTION_SPEED_DOWN : changeEffectSpeed(lastRepeatableValue); stateUpdated(CALL_MODE_BUTTON); return;
case ACTION_INTENSITY_UP : changeEffectIntensity(lastRepeatableValue); stateUpdated(CALL_MODE_BUTTON); return;
case ACTION_INTENSITY_DOWN : changeEffectIntensity(lastRepeatableValue); stateUpdated(CALL_MODE_BUTTON); return;
default: break;
}
if (lastValidCode == IR40_WPLUS) {
relativeChangeWhite(10);
colorUpdated(CALL_MODE_BUTTON);
changeWhite(10);
stateUpdated(CALL_MODE_BUTTON);
} else if (lastValidCode == IR40_WMINUS) {
relativeChangeWhite(-10, 5);
colorUpdated(CALL_MODE_BUTTON);
changeWhite(-10);
stateUpdated(CALL_MODE_BUTTON);
} else if ((lastValidCode == IR24_ON || lastValidCode == IR40_ON) && irTimesRepeated > 7 ) {
nightlightActive = true;
nightlightStartTime = millis();
colorUpdated(CALL_MODE_BUTTON);
stateUpdated(CALL_MODE_BUTTON);
}
}
@ -417,6 +424,11 @@ void decodeIR24CT(uint32_t code)
void decodeIR40(uint32_t code)
{
WS2812FX::Segment& seg = irApplyToAllSelected ? strip.getFirstSelectedSeg() : strip.getMainSegment();
byte r = R(seg.colors[0]);
byte g = G(seg.colors[0]);
byte b = B(seg.colors[0]);
byte w = W(seg.colors[0]);
switch (code) {
case IR40_BPLUS : incBrightness(); break;
case IR40_BMINUS : decBrightness(); break;
@ -442,10 +454,10 @@ void decodeIR40(uint32_t code)
case IR40_WHITE : changeColor(COLOR_NEUTRALWHITE, 127); changeEffect(FX_MODE_STATIC); break;
case IR40_COLDWHITE : changeColor(COLOR_COLDWHITE, 191); changeEffect(FX_MODE_STATIC); break;
case IR40_COLDWHITE2 : changeColor(COLOR_COLDWHITE2, 255); changeEffect(FX_MODE_STATIC); break;
case IR40_WPLUS : relativeChangeWhite(10); break;
case IR40_WMINUS : relativeChangeWhite(-10, 5); break;
case IR40_WOFF : whiteLast = col[3]; col[3] = 0; break;
case IR40_WON : col[3] = whiteLast; break;
case IR40_WPLUS : changeWhite(10); break;
case IR40_WMINUS : changeWhite(-10); break;
case IR40_WOFF : if (w) whiteLast = w; changeColor(RGBW32(r, g, b, 0)); break;
case IR40_WON : changeColor(RGBW32(r, g, b, whiteLast)); break;
case IR40_W25 : bri = 63; break;
case IR40_W50 : bri = 127; break;
case IR40_W75 : bri = 191; break;