From 1ed0a372c6a7d25873fe9a26aed1bc9e751d2706 Mon Sep 17 00:00:00 2001
From: Theo Arends <11044339+arendst@users.noreply.github.com>
Date: Fri, 22 Nov 2019 10:49:15 +0100
Subject: [PATCH] Fix colorpicker when using USE_JAVASCRIPT_ES6

Fix colorpicker when using USE_JAVASCRIPT_ES6 (#6994)
---
 tasmota/xdrv_01_webserver.ino | 42 ++++++++++++++++++++---------------
 1 file changed, 24 insertions(+), 18 deletions(-)

diff --git a/tasmota/xdrv_01_webserver.ino b/tasmota/xdrv_01_webserver.ino
index f3928205b..61c639931 100644
--- a/tasmota/xdrv_01_webserver.ino
+++ b/tasmota/xdrv_01_webserver.ino
@@ -161,12 +161,12 @@ const char HTTP_SCRIPT_ROOT[] PROGMEM =
   "}"
   "function lc(v,i,p){"
     "la('&'+v+i+'='+p);"
-  "}" 
+  "}"
+#endif  // USE_JAVASCRIPT_ES6
   "function ld(v,p){"
   "eb('s').style.backgroundImage='linear-gradient(to right,grey,hsl('+p+',100%%,50%%))';"
   "la('&'+v+'='+p);"
   "}"
-#endif  // USE_JAVASCRIPT_ES6
 
   "wl(la);";
 
@@ -378,14 +378,20 @@ const char HTTP_HEAD_STYLE3[] PROGMEM =
 
 const char HTTP_MSG_SLIDER1[] PROGMEM =
   "<div><span class='p'>%s</span><span class='q'>%s</span></div>"
-  "<div><input type='range' min='%d' max='%d' value='%d' onchange='lb(\"%c\", value)'></div>";
+  "<div><input type='range' min='%d' max='%d' value='%d' onchange='lb(\"%c\",value)'></div>"
+  "<div></div>";
 const char HTTP_MSG_SLIDER2[] PROGMEM =
   "<div><span class='p'>%s</span><span class='q'>%s</span></div>"
-  "<div><input type='range' min='%d' max='%d' value='%d' onchange='lc(\"%c\", %d, value)'></div>";
+  "<div><input type='range' min='%d' max='%d' value='%d' onchange='lc(\"%c\",%d,value)'></div>"
+  "<div></div>";
 const char HTTP_MSG_SLIDER3[] PROGMEM = // HUE
-  "<br><div style='background-image:linear-gradient(to right, %s'><input type='range' min='%d' max='%d' value='%d' onchange='ld(\"%c\", value)'></div><br>";
+//  "<br><div style='background-image:linear-gradient(to right, %s'><input type='range' min='%d' max='%d' value='%d' onchange='ld(\"%c\", value)'></div><br>";
+  "<div style='background-image:linear-gradient(to right,%s'><input type='range' min='%d' max='%d' value='%d' onchange='ld(\"%c\",value)'></div>"
+  "<div></div>";
 const char HTTP_MSG_SLIDER4[] PROGMEM = // SATURATION
-  "<br><div id='s' style='background-image:linear-gradient(to right, %s'><input type='range' min='%d' max='%d' value='%d' onchange='lb(\"%c\", value)'></div><br>";
+//  "<br><div id='s' style='background-image:linear-gradient(to right, %s'><input type='range' min='%d' max='%d' value='%d' onchange='lb(\"%c\", value)'></div><br>";
+  "<div id='s' style='background-image:linear-gradient(to right,%s'><input type='range' min='%d' max='%d' value='%d' onchange='lb(\"%c\",value)'></div>"
+  "<div></div>";
 const char HTTP_MSG_RSTRT[] PROGMEM =
   "<br><div style='text-align:center;'>" D_DEVICE_WILL_RESTART "</div><br>";
 
@@ -1016,23 +1022,23 @@ void HandleRoot(void)
       } else {  // Settings.flag3.pwm_multi_channels - SetOption68 1 - Enable multi-channels PWM instead of Color PWM
         uint32_t pwm_channels = (light_type & 7) > LST_MAX ? LST_MAX : (light_type & 7);
         for (uint32_t i = 0; i < pwm_channels; i++) {
-          snprintf_P(stemp, sizeof(stemp), PSTR("c%d"), i);
+          snprintf_P(stemp, sizeof(stemp), PSTR("C%d"), i);
           WSContentSend_P(HTTP_MSG_SLIDER2, stemp, FPSTR("100%"),
             1, 100,
             changeUIntScale(Settings.light_color[i], 0, 255, 0, 100), 'd', i+1);
         }
       }  // Settings.flag3.pwm_multi_channels
-        if (light_type > 2) {
-          char hexColor[65];
-          snprintf_P(hexColor, sizeof(hexColor), PSTR("grey,#%02X%02X%02X );border-radius:0.3em;"), Settings.light_color[0],Settings.light_color[1],Settings.light_color[2]);
-          uint16_t hue;
-          uint8_t sat;
-          uint8_t bri;
-          LightGetHSB(&hue, &sat, &bri);
-          // AddLog_P2(LOG_LEVEL_INFO, PSTR("HSB: %u %u %u "), hue,sat,bri);
-          WSContentSend_P(HTTP_MSG_SLIDER3, F("red,orange,yellow,green,blue,indigo,violet,red);border-radius:0.3em;"), 1, 359, hue, 'u'); // hue
-          WSContentSend_P(HTTP_MSG_SLIDER4, hexColor, 1, 100, changeUIntScale(sat, 0, 255, 0, 100), 'n'); // saturation
-        }
+      if (light_type > 2) {
+        char hexColor[65];
+        snprintf_P(hexColor, sizeof(hexColor), PSTR("grey,#%02X%02X%02X );border-radius:0.3em;"), Settings.light_color[0],Settings.light_color[1],Settings.light_color[2]);
+        uint16_t hue;
+        uint8_t sat;
+        uint8_t bri;
+        LightGetHSB(&hue, &sat, &bri);
+        // AddLog_P2(LOG_LEVEL_INFO, PSTR("HSB: %u %u %u "), hue,sat,bri);
+        WSContentSend_P(HTTP_MSG_SLIDER3, F("red,orange,yellow,green,blue,indigo,violet,red);border-radius:0.3em;"), 1, 359, hue, 'u'); // hue
+        WSContentSend_P(HTTP_MSG_SLIDER4, hexColor, 1, 100, changeUIntScale(sat, 0, 255, 0, 100), 'n'); // saturation
+      }
     }
 #endif // USE_LIGHT
 #ifdef USE_SHUTTER