From 27035a8e1dc557322df392a6ee21dd6e92cb32c7 Mon Sep 17 00:00:00 2001
From: Woody <xaver@holzapfel.net>
Date: Thu, 11 Jan 2024 23:13:26 +0100
Subject: [PATCH] Better sorting and naming of static palettes

---
 wled00/data/cpal/cpal.htm | 16 +++++++++++++---
 1 file changed, 13 insertions(+), 3 deletions(-)

diff --git a/wled00/data/cpal/cpal.htm b/wled00/data/cpal/cpal.htm
index d91b8591f..773c02d20 100644
--- a/wled00/data/cpal/cpal.htm
+++ b/wled00/data/cpal/cpal.htm
@@ -201,6 +201,7 @@
   var gradientLength = rect.width;
   var mOffs = Math.round((gradientLength / 256) / 2) - 5;
   var paletteArray = []; //Holds the palettes after load.
+  var paletteName = []; // Holds the names of the palettes after load.
   var svgSave = '<svg style="width:25px;height:25px" viewBox="0 0 24 24"><path fill=#fff d="M22,12A10,10 0 0,1 12,22A10,10 0 0,1 2,12A10,10 0 0,1 12,2A10,10 0 0,1 22,12M7,12L12,17V14H16V10H12V7L7,12Z"/></svg>'
   var svgEdit = '<svg style="width:25px;height:25px" viewBox="0 0 24 24"><path fill=#fff d="M12,2C6.47,2 2,6.47 2,12C2,17.53 6.47,22 12,22C17.53,22 22,17.53 22,12C22,6.47 17.53,2 12,2M15.1,7.07C15.24,7.07 15.38,7.12 15.5,7.23L16.77,8.5C17,8.72 17,9.07 16.77,9.28L15.77,10.28L13.72,8.23L14.72,7.23C14.82,7.12 14.96,7.07 15.1,7.07M13.13,8.81L15.19,10.87L9.13,16.93H7.07V14.87L13.13,8.81Z"/></svg>'
 
@@ -520,8 +521,10 @@
     if (hst.length > 0 ) {
       try {
         var arr = [];
-        const response = await fetch('http://'+hst+'/json/info');
-        const json = await response.json();
+        const responseInfo = await fetch('http://'+hst+'/json/info');
+        const responsePalettes = await fetch('http://'+hst+'/json/palettes');
+        const json = await responseInfo.json();
+        paletteName = await responsePalettes.json();
         cpalc = json.cpalcount;
         fetchPalettes(cpalc-1);
       } catch (error) {
@@ -560,6 +563,7 @@
       alert("The cache of palettes are missig from your browser. You should probably return to the main page and let it load properly for the palettes cache to regenerate before returning here.","Missing cached palettes!")
     } else {
       for (const key in wledPalx.p) {
+        wledPalx.p[key].name = paletteName[key];
         if (key > 245) {
           delete wledPalx.p[key];
           continue;
@@ -591,8 +595,11 @@
       }
 
       const pArray = Object.entries(wledPalx.p).map(([key, value]) => ({
-        [key]: value.flat()
+        [key]: value.flat(),
+        name: value.name
       }));
+      // Sort pArray by name
+      pArray.sort((a, b) => a.name.localeCompare(b.name));
 
       paletteArray.push( ...pArray);
     }
@@ -634,6 +641,9 @@
       editSpan.id = `editSpan${i}`;
       editSpan.onclick = function() {loadForEdit(i)};
       editSpan.setAttribute('title', `Copy slot ${i} palette to editor`);
+      if (paletteArray[i].name) {
+        editSpan.setAttribute('title', `Copy ${paletteArray[i].name} palette to editor`);
+      }
       editSpan.innerHTML = svgEdit;
       editSpan.classList.add("editSpan")