lba.gitea/WLED
1
0
Fork 0
Code Issues Pull Requests Packages Projects Releases Wiki Activity

Allow hex strings for palette

Browse Source
This commit is contained in:
Blaz Kristan 2023-04-25 13:02:09 +02:00
parent 16373919d4
commit e42836b07f
1 changed files with 92 additions and 82 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

26
wled00/data/cpal/cpal.htm
View File

@ -571,7 +571,7 @@
const sendSpan = document.createElement("span"); const sendSpan = document.createElement("span");
sendSpan.id = `sendSpan${i}`; sendSpan.id = `sendSpan${i}`;
sendSpan.onclick = function() {initiateUpload(i)}; sendSpan.onclick = function() {initiateUpload(i)};
sendSpan.setAttribute('title', `Send current editor to slot ${i}`); sendSpan.setAttribute('title', `Send current editor to slot ${i}`); // perhaps Save instead of Send?
sendSpan.innerHTML = svgSave; sendSpan.innerHTML = svgSave;
sendSpan.classList.add("sendSpan") sendSpan.classList.add("sendSpan")
const editSpan = document.createElement("span"); const editSpan = document.createElement("span");
@ -583,12 +583,17 @@
gradientDiv.classList.add("paletteGradients"); gradientDiv.classList.add("paletteGradients");
let gradientColors = ""; let gradientColors = "";
for (let j = 0; j < palette.palette.length; j += 4) { for (let j = 0; j < palette.palette.length; j += 2) {
const position = palette.palette[j]; const position = palette.palette[j];
if (typeOf(palette.palette[j+1]) === "string") {
gradientColors += `#${palette.palette[j+1]} ${position/255*100}%, `;
} else {
const red = palette.palette[j + 1]; const red = palette.palette[j + 1];
const green = palette.palette[j + 2]; const green = palette.palette[j + 2];
const blue = palette.palette[j + 3]; const blue = palette.palette[j + 3];
gradientColors += `rgba(${red}, ${green}, ${blue}, 1) ${position/255*100}%, `; gradientColors += `rgba(${red}, ${green}, ${blue}, 1) ${position/255*100}%, `;
j += 2;
}
} }
gradientColors = gradientColors.slice(0, -2); // remove the last comma and space gradientColors = gradientColors.slice(0, -2); // remove the last comma and space
@ -603,9 +608,9 @@
palettesDiv.appendChild(paletteDiv); palettesDiv.appendChild(paletteDiv);
} }
} }
function loadForEdit(i){ function loadForEdit(i){
console.log("Lets edit no: ", i); console.log("Lets edit no: ", i);
document.querySelectorAll('input[id^="colorPicker"]').forEach((input) => { document.querySelectorAll('input[id^="colorPicker"]').forEach((input) => {
input.parentNode.removeChild(input); input.parentNode.removeChild(input);
@ -616,21 +621,26 @@ function loadForEdit(i){
let colArray = JSON.parse(gId(`palette${i}`).getAttribute("data-colarray")); let colArray = JSON.parse(gId(`palette${i}`).getAttribute("data-colarray"));
for (let j = 0; j < colArray.length; j += 4) { for (let j = 0; j < colArray.length; j += 2) {
const position = colArray[j]; const position = colArray[j];
if (typeof(colArray[j+1]) === "string") {
const hex = `#${colArray[j+1]}`;
} else {
const red = colArray[j + 1]; const red = colArray[j + 1];
const green = colArray[j + 2]; const green = colArray[j + 2];
const blue = colArray[j + 3]; const blue = colArray[j + 3];
const hex = rgbToHex(red, green, blue); const hex = rgbToHex(red, green, blue);
j += 2;
}
console.log(position, hex) console.log(position, hex)
addC(position, hex); addC(position, hex);
} }
} }
function rgbToHex(r, g, b) { function rgbToHex(r, g, b) {
const hex = ((r << 16) | (g << 8) | b).toString(16); const hex = ((r << 16) | (g << 8) | b).toString(16);
return "#" + "0".repeat(6 - hex.length) + hex; return "#" + "0".repeat(6 - hex.length) + hex;
} }
function getLocalStorageData(){ function getLocalStorageData(){
// Retrieve the "wledPalx" JSON from local storage // Retrieve the "wledPalx" JSON from local storage