From acfc166a11fc0837659e27681d4f76cb74742018 Mon Sep 17 00:00:00 2001
From: Alerson Jorge <ajotanc@gmail.com>
Date: Thu, 28 Sep 2023 09:09:42 -0300
Subject: [PATCH] Corrections

---
 wled00/data/index.css |  6 ++++++
 wled00/data/index.htm |  1 -
 wled00/data/index.js  | 27 +++++++--------------------
 3 files changed, 13 insertions(+), 21 deletions(-)

diff --git a/wled00/data/index.css b/wled00/data/index.css
index 0193305e..cb04e479 100644
--- a/wled00/data/index.css
+++ b/wled00/data/index.css
@@ -285,6 +285,11 @@ button {
     position: relative;
 }
 
+.btn-pxm {
+    width: 100% !important;
+    margin: 10px 0 !important;
+}
+
 .tab {
 	background-color: transparent;
 	color: var(--c-d);
@@ -812,6 +817,7 @@ input[type=range]::-moz-range-thumb {
 	text-overflow: ellipsis;
 	border: 1px solid var(--c-3);
 	background-color: var(--c-3);
+    z-index: 9;
 }
 #segutil .btn-s:hover,
 #segutil2 .btn-s:hover,
diff --git a/wled00/data/index.htm b/wled00/data/index.htm
index cd8a92cf..33968bd3 100644
--- a/wled00/data/index.htm
+++ b/wled00/data/index.htm
@@ -65,7 +65,6 @@
 			<button id="buttonNl" onclick="toggleNl()"><i class="icons">&#xe2a2;</i><p class="tab-label">Timer</p></button>
 			<button id="buttonSync" onclick="toggleSync()"><i class="icons">&#xe116;</i><p class="tab-label">Sync</p></button>
 			<button id="buttonSr" onclick="toggleLiveview()"><i class="icons">&#xe410;</i><p class="tab-label">Peek</p></button>
-			<button id="buttonPixelMagicTool" onclick="togglePixelMagicTool()"><i class="icons">&#xe2b3;</i><p class="tab-label">Pixel Magic</p></button>
 			<button id="buttonI" onclick="toggleInfo()"><i class="icons">&#xe066;</i><p class="tab-label">Info</p></button>
 			<button id="buttonNodes" onclick="toggleNodes()"><i class="icons">&#xe22d;</i><p class="tab-label">Nodes</p></button>
 			<button onclick="window.location.href=getURL('/settings');"><i class="icons">&#xe0a2;</i><p class="tab-label">Config</p></button>
diff --git a/wled00/data/index.js b/wled00/data/index.js
index 1fcb6eda..94ae9d47 100644
--- a/wled00/data/index.js
+++ b/wled00/data/index.js
@@ -39,9 +39,6 @@ var hol = [
 	[0,0,1,1,"https://initiate.alphacoders.com/download/wallpaper/1198800/images/jpg/2522807481585600"] // new year
 ];
 
-// Buttons
-var btnPXM = gId('buttonPixelMagicTool');
-
 function handleVisibilityChange() {if (!d.hidden && new Date () - lastUpdate > 3000) requestJson();}
 function sCol(na, col) {d.documentElement.style.setProperty(na, col);}
 function gId(c) {return d.getElementById(c);}
@@ -279,7 +276,6 @@ function onLoad()
 		});
 	});
 	resetUtil();
-
 	d.addEventListener("visibilitychange", handleVisibilityChange, false);
 	//size();
 	gId("cv").style.opacity=0;
@@ -288,8 +284,6 @@ function onLoad()
 		sl.addEventListener('touchstart', toggleBubble);
 		sl.addEventListener('touchend', toggleBubble);
 	}
-
-    btnPXM.style.display = cfg.comp.pxm ? "block" : "none";
 }
 
 function updateTablinks(tabI)
@@ -462,7 +456,6 @@ function loadPresets(callback = null)
 	})
 	.then(res => {
 		if (res.status=="404") return {"0":{}};
-		//if (!res.ok) showErrorToast();
 		return res.json();
 	})
 	.then(json => {
@@ -1766,14 +1759,9 @@ function togglePixelMagicTool()
         }
     }
 
-	btnPXM.className = (isPXM) ? "active":"";
     size();
 }
 
-function updateNameResize(){
-    btnPXM.querySelector('p').textContent = (wW < 1024) ? "PXM" : "Pixel Magic";
-}
-
 function makeSeg()
 {
 	var ns = 0, ct = 0;
@@ -2066,10 +2054,12 @@ function resetPUtil()
 {
 	gId('psFind').classList.add('staytop');
 	let p = gId('putil');
+    let dpxm = cfg.comp.pxm ? "inline-block" : "none";
 	p.classList.add('staybot');
 	p.classList.remove('pres');
 	p.innerHTML = `<button class="btn btn-s" onclick="makePUtil()" style="float:left;"><i class="icons btn-icon">&#xe18a;</i>Preset</button>`
-	+ `<button class="btn btn-s" onclick="makePlUtil()" style="float:right;"><i class="icons btn-icon">&#xe18a;</i>Playlist</button>`;
+	+ `<button class="btn btn-s" onclick="makePlUtil()" style="float:right;"><i class="icons btn-icon">&#xe18a;</i>Playlist</button>`
+    + `<button class="btn btn-pxm" id="buttonPixelMagicTool" onclick="togglePixelMagicTool()" style="display: ${dpxm};"><i class="icons btn-icon">&#xe410;</i>Pixel Magic Tool</button>`;
 }
 
 function tglCs(i)
@@ -2918,18 +2908,15 @@ function size()
 	if (isLv) h -= 4;
 	sCol('--tp', h + "px");
 	togglePcMode();
-    updateNameResize();
 	lastw = wW;
 }
 
 function listenMessage(e){
     const { origin, data } = e;
-    
     if (origin === window.location.origin) {
-        switch(data){
-            case 'loadPresets':
-                setTimeout(()=>{pmtLast=0; loadPresets();}, 250);
-                break;
+        if(data === 'loadPresets'){
+	        populatePresets();
+            setTimeout(()=>{pmtLast=0; loadPresets();}, 750); // force reloading of presets
         }
     }
 }
@@ -2980,4 +2967,4 @@ _C.addEventListener('touchstart', lock, false);
 
 _C.addEventListener('mouseout', move, false);
 _C.addEventListener('mouseup', move, false);
-_C.addEventListener('touchend', move, false);
+_C.addEventListener('touchend', move, false);
\ No newline at end of file