diff --git a/wled00/data/settings_ui.htm b/wled00/data/settings_ui.htm index ba84a77d8..f484281c5 100644 --- a/wled00/data/settings_ui.htm +++ b/wled00/data/settings_ui.htm @@ -118,12 +118,13 @@ function genForm(s) { var str = ""; str = addRec(s,"",l); + oldUrl = ""; gId('gen').innerHTML = str; if (gId('theme_bg_rnd').checked) { - oldUrl = ""; toggle("Image"); - randomBg(); + } else if (gId('theme_bg_url').value.startsWith('data:')) { + gId("bg_url").classList.add("hide"); } else oldUrl = gId("theme_bg_url").value; } function GetLS() @@ -239,9 +240,31 @@ url = "https://picsum.photos/1920/1080"; if (gId(`${t}Grayscale`).checked) url += "?grayscale"; if (gId(`${t}Blur`).checked) url += (url.includes("?") ? "&" : "?") + "blur"; + gId("theme_bg_img").value = ""; + gId("bg_url").classList.remove("hide"); } gId("theme_bg_url").value = url; } + // own BG image + function ownBg(element) { + const file = element.files[0]; + const reader = new FileReader(); + reader.onload = () => { + gId("theme_bg_url").value = reader.result; + gId("bg_url").classList.add("hide"); + if (gId("theme_bg_rnd").checked) toggle("Image"); + gId("theme_bg_rnd").checked = false; + } + reader.readAsDataURL(file); + } + function removeBgImg() { + gId("theme_bg_url").value = ""; + gId("theme_bg_img").value = ""; + gId("bg_url").classList.remove("hide"); + if (gId("theme_bg_rnd").checked) toggle("Image"); + gId("theme_bg_rnd").checked = false; + } + function uploadFile(fO,name) { var req = new XMLHttpRequest(); req.addEventListener('load', function(){showToast(this.responseText,this.status >= 400)}); @@ -290,9 +313,12 @@ :
:
:
+ BG image:
:
- :
+
+ :
+

Random BG image settings