Shuffle tooltips.

This commit is contained in:
Blaz Kristan 2022-06-28 12:36:23 +02:00
parent a3b0b8b3d0
commit cd46d84dcb
4 changed files with 1437 additions and 1448 deletions

View File

@ -367,19 +367,11 @@ button {
bottom: 5px; bottom: 5px;
} }
#fx {
/*height: calc(100% - 121px);*/
/*overflow-y: scroll;*/
/*padding-left: 6px;*/ /* compensate scroll bar */
}
#sliders { #sliders {
width: 310px; width: 310px;
margin: 0 auto; margin: 0 auto;
position: sticky; position: sticky;
bottom: 0; bottom: 0;
/*left: 50%;*/
/*transform: translateX(-50%);*/
} }
#sliders .labels { #sliders .labels {
@ -391,7 +383,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; /* add 5px; if you want some vertical space */ margin: 0 auto; /* add 5px; if you want some vertical space but looks ugly */
border-radius: 15px; border-radius: 15px;
position: relative; position: relative;
} }
@ -417,12 +409,12 @@ button {
opacity: 0; opacity: 0;
transition: opacity 0.75s; transition: opacity 0.75s;
} }
/*
.slider.top .tooltiptext { .slider.top .tooltiptext {
top: 100%; top: 100%;
bottom: unset; bottom: unset;
} }
*/
/* Tooltip arrow */ /* Tooltip arrow */
.slider .tooltiptext::after { .slider .tooltiptext::after {
content: ""; content: "";
@ -434,14 +426,14 @@ button {
border-style: solid; border-style: solid;
border-color: var(--c-5) transparent transparent transparent; border-color: var(--c-5) transparent transparent transparent;
} }
/*
.slider.top .tooltiptext::after { .slider.top .tooltiptext::after {
bottom: 100%; bottom: 100%;
left: 50%; left: 50%;
top: unset; top: unset;
border-color: transparent transparent var(--c-5) transparent; border-color: transparent transparent var(--c-5) transparent;
} }
*/
/* Show the tooltip text when you mouse over the tooltip container */ /* Show the tooltip text when you mouse over the tooltip container */
.slider:hover .tooltiptext { .slider:hover .tooltiptext {
visibility: visible; visibility: visible;

View File

@ -1308,21 +1308,21 @@ function setSliderAndColorControl(idx, applyDef=false)
else if (i==0) label.innerHTML = "Effect speed"; else if (i==0) label.innerHTML = "Effect speed";
else if (i==1) label.innerHTML = "Effect intensity"; else if (i==1) label.innerHTML = "Effect intensity";
else label.innerHTML = "Custom" + (i-1); else label.innerHTML = "Custom" + (i-1);
if (sldCnt++===0) slider.classList.add("top"); sldCnt++;
//if (sldCnt++===0) slider.classList.add("top");
slider.classList.remove("hide"); slider.classList.remove("hide");
//slider.setAttribute('title',label.innerHTML); //slider.setAttribute('title',label.innerHTML);
} else { } else {
slider.classList.add("hide"); slider.classList.add("hide");
slider.classList.remove("top"); //slider.classList.remove("top");
} }
} }
// set size of fx list // set the bottom position of selected effect (sticky) as the top of sliders div
let topPosition = parseInt(getComputedStyle(gId("sliders")).height); let top = parseInt(getComputedStyle(gId("sliders")).height);
//gId("fx").style.height = `calc(100% - ${topPosition}px)`; /*if (sldCnt===1)*/ top += 28; // size of tooltip
//d.styleSheets[0].cssRules[195].style.bottom = topPosition + "px"; let sel = d.querySelector('#fxlist .selected');
let selElement = d.querySelector('#fxlist .selected'); if (sel) sel.style.bottom = top + "px"; // we will need to remove this when unselected (in setX())
selElement.style.bottom = topPosition + "px";
// set html color items on/off // set html color items on/off
var cslLabel = ''; var cslLabel = '';
@ -2038,12 +2038,12 @@ function setPreset(i)
{ {
var obj = {"ps":i}; var obj = {"ps":i};
if (pJson && pJson[i] && (!pJson[i].win || pJson[i].win.indexOf("Please") <= 0)) { if (pJson && pJson[i] && (!pJson[i].win || pJson[i].win.indexOf("Please") <= 0)) {
// we will send complete preset content as to avoid delay introduced by
// async nature of applyPreset(). json.cpp has to decide wether to call applyPreset()
// or not (by looking at the JSON content, if "ps" only)
Object.assign(obj, pJson[i]); Object.assign(obj, pJson[i]);
delete obj.ql; // no need for quick load delete obj.ql; // no need for quick load
delete obj.n; // no need for name delete obj.n; // no need for name
// obj.pt = i; // this will set preset ID but not force state update
// } else {
// 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 + ")");

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