Slider div change.

Effect data bugfix.
This commit is contained in:
Blaz Kristan 2022-06-27 22:46:36 +02:00
parent a75b3a53aa
commit 4c60a70c6f
4 changed files with 1759 additions and 1755 deletions

View File

@ -368,18 +368,18 @@ button {
} }
#fx { #fx {
height: calc(100% - 121px); /*height: calc(100% - 121px);*/
overflow-y: scroll; /*overflow-y: scroll;*/
padding-left: 6px; /* compensate scroll bar */ /*padding-left: 6px;*/ /* compensate scroll bar */
} }
#sliders { #sliders {
width: 310px; width: 310px;
margin: 0 auto; margin: 0 auto;
position: absolute; position: sticky;
bottom: 0; bottom: 0;
left: 50%; /*left: 50%;*/
transform: translateX(-50%); /*transform: translateX(-50%);*/
} }
#sliders .labels { #sliders .labels {
@ -391,7 +391,7 @@ button {
background: var(--c-2); background: var(--c-2);
max-width: 310px; max-width: 310px;
min-width: 280px; min-width: 280px;
margin: 0 auto 5px; margin: 0 auto; /* add 5px; if you want some vertical space */
border-radius: 15px; border-radius: 15px;
position: relative; position: relative;
} }
@ -415,7 +415,7 @@ button {
/* Fade in tooltip */ /* Fade in tooltip */
opacity: 0; opacity: 0;
transition: opacity 0.3s; transition: opacity 0.75s;
} }
.slider.top .tooltiptext { .slider.top .tooltiptext {

View File

@ -773,14 +773,14 @@ function populateEffects()
for (let i = 0; i < effects.length; i++) { for (let i = 0; i < effects.length; i++) {
// WLEDSR: add slider and color control to setX (used by requestjson) // WLEDSR: add slider and color control to setX (used by requestjson)
if (effects[i].name.indexOf("Reserved") < 0) { if (effects[i].name.indexOf("Reserved") < 0) {
var extra = !(Array.isArray(fxdata) && fxdata.length>i) ? '' : fxdata[i].substr(1); let id = effects[i].id;
html += generateListItemHtml( html += generateListItemHtml(
'fx', 'fx',
effects[i].id, id,
effects[i].name, effects[i].name,
'setX', 'setX',
'', '',
extra !(Array.isArray(fxdata) && fxdata.length>id) ? '' : fxdata[id].substr(1)
); );
} }
} }
@ -1318,8 +1318,11 @@ function setSliderAndColorControl(idx, applyDef=false)
} }
// set size of fx list // set size of fx list
let topPosition = 5 + parseInt(getComputedStyle(gId("sliders")).height); let topPosition = parseInt(getComputedStyle(gId("sliders")).height);
gId("fx").style.height = `calc(100% - ${topPosition}px)`; //gId("fx").style.height = `calc(100% - ${topPosition}px)`;
//d.styleSheets[0].cssRules[195].style.bottom = topPosition + "px";
let selElement = d.querySelector('#fxlist .selected');
selElement.style.bottom = topPosition + "px";
// set html color items on/off // set html color items on/off
var cslLabel = ''; var cslLabel = '';
@ -1969,7 +1972,10 @@ function setX(ind = null)
d.querySelector(`#fxlist input[name="fx"][value="${ind}"]`).checked = true; d.querySelector(`#fxlist input[name="fx"][value="${ind}"]`).checked = true;
} }
var selElement = d.querySelector('#fxlist .selected'); var selElement = d.querySelector('#fxlist .selected');
if (selElement) selElement.classList.remove('selected'); if (selElement) {
selElement.classList.remove('selected');
selElement.style.bottom = null; // remove element style added in slider handling
}
d.querySelector(`#fxlist .lstI[data-id="${ind}"]`).classList.add('selected'); d.querySelector(`#fxlist .lstI[data-id="${ind}"]`).classList.add('selected');

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 2206261 #define VERSION 2206271
//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