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

Small adjustments to UI mainly

Browse Source
This commit is contained in:
Henrik 2023-04-09 16:49:41 +02:00
parent aaea9ff018
commit e74dfb2ba6
1 changed files with 25 additions and 14 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

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

@ -212,7 +212,7 @@
position = truePos; position = truePos;
} }
const thisColor = `#${Math.floor(Math.random()*16777215).toString(16)}`; // set random color as default const thisColor = `#${(Math.random() * 0xFFFFFF << 0).toString(16).padStart(6, '0')}`;// set random color as default
const colorMarker = cE('span'); // create a marker for the color position const colorMarker = cE('span'); // create a marker for the color position
colorMarker.className = 'color-marker'; colorMarker.className = 'color-marker';
@ -250,10 +250,8 @@
colorMarker.style.backgroundColor = colorPicker.value; // set marker color to match color picker colorMarker.style.backgroundColor = colorPicker.value; // set marker color to match color picker
colorPickerMarker.style.backgroundColor = colorPicker.value; colorPickerMarker.style.backgroundColor = colorPicker.value;
//colorPicker.style.backgroundColor = colorPicker.value;
gradientBox.appendChild(colorPicker); // append the color picker to the row div gradientBox.appendChild(colorPicker);
//colorPickerMarker.appendChild(colorPicker);
gradientBox.appendChild(colorMarker); gradientBox.appendChild(colorMarker);
gradientBox.appendChild(colorPickerMarker); gradientBox.appendChild(colorPickerMarker);
if(position != 0 && position != 255) {gradientBox.appendChild(deleteMarker)}; // append the marker if not start or end if(position != 0 && position != 255) {gradientBox.appendChild(deleteMarker)}; // append the marker if not start or end
@ -274,7 +272,6 @@
colorMarkers.forEach((colorMarker, index) => { colorMarkers.forEach((colorMarker, index) => {
const thisColorPicker = gId(colorMarkers[index].id.replace('colorMarker', 'colorPicker')); const thisColorPicker = gId(colorMarkers[index].id.replace('colorMarker', 'colorPicker'));
const colorToSet = thisColorPicker.value; const colorToSet = thisColorPicker.value;
//thisColorPicker.style.backgroundColor = colorToSet;
gId(colorMarkers[index].id.replace('colorMarker', 'colorPickerMarker')).style.backgroundColor = colorToSet; gId(colorMarkers[index].id.replace('colorMarker', 'colorPickerMarker')).style.backgroundColor = colorToSet;
colorMarkers[index].style.backgroundColor = colorToSet; colorMarkers[index].style.backgroundColor = colorToSet;
colorMarkers[index].setAttribute("data-truecol", colorToSet); colorMarkers[index].setAttribute("data-truecol", colorToSet);
@ -421,15 +418,29 @@
} }
function uploadJSON(jsonString, fileName) { function uploadJSON(jsonString, fileName) {
var req = new XMLHttpRequest(); const ss = gId('sendSvgP');
var blob = new Blob([jsonString], {type: "application/json"}); ss.setAttribute('fill', '#555');
req.addEventListener('load', function(){console.log(this.responseText, ' - ', this.status)}); var req = new XMLHttpRequest();
req.addEventListener('error', function(e){console.log('Error: ', e); console.log(' Status: ', this.status);}); var blob = new Blob([jsonString], {type: "application/json"});
req.open("POST", "/upload"); req.addEventListener('load', function(){
var formData = new FormData(); console.log(this.responseText, ' - ', this.status)
formData.append("data", blob, fileName); ss.setAttribute('fill', '#056b0a');
req.send(formData); setTimeout(function() {
return false; ss.setAttribute('fill', '#fff');
}, 1000);
});
req.addEventListener('error', function(e){
console.log('Error: ', e); console.log(' Status: ', this.status);
ss.setAttribute('fill', '#6b050c');
setTimeout(function() {
ss.setAttribute('fill', '#fff');
}, 1000);
});
req.open("POST", "/upload");
var formData = new FormData();
formData.append("data", blob, fileName);
req.send(formData);
return false;
} }
// Get segments from device // Get segments from device