Leds Panel add checkbox to enable/disable the feature (#23048)

2025-07-24 11:16:34 +00:00 · 2025-02-22 12:33:34 +01:00 · 2025-02-22 12:33:34 +01:00 · 0c26698ba6
commit 0c26698ba6
parent 1db796c40f
5 changed files with 46 additions and 12 deletions
--- a/CHANGELOG.md
+++ b/CHANGELOG.md
@ -13,6 +13,7 @@ All notable changes to this project will be documented in this file.
 ### Changed
 - LVGL, prepare for HASPmota theme, change: no-grow when clicked, DPI set to 160
 - LVGL Mirroring add checkbox to enable/disable the feature (in the iterim for a better solution)
+- Leds Panel add checkbox to enable/disable the feature (in the iterim for a better solution)

 ### Fixed

--- a/tasmota/berry/leds_panel/leds_panel.be
+++ b/tasmota/berry/leds_panel/leds_panel.be
@ -707,6 +707,7 @@ class leds_panel

  static var SAMPLING = 100
  static var PORT = 8886      # default port 8886
+  static var HTML_WIDTH = 290
  static var HTML_HEAD1 = 
    "<!DOCTYPE HTML><html><head>"
  static var HTML_URL_F = 
@ -794,10 +795,10 @@ class leds_panel
    '<body>'
      '<style>body{margin:0px;}</style>'
  static var HTML_CONTENT =
-      '<table style="width:100%;border:0px;margin:0px;">'
+     '<table style="width:100%;border:0px;margin:0px;">'
        '<tbody>'
          '<tr><td>'
-            '<canvas id="canvas" width="330" height="10" style="display:block;margin-left:auto;margin-right:auto;"></canvas>'
+            '<canvas id="canvas" width="290" height="10" style="display:block;margin-left:auto;margin-right:auto;"></canvas>'
          '</td></tr>'
        '</tbody>'
    '</table>'
@ -837,7 +838,7 @@ class leds_panel
    self.p_leds = self.strip.pixels_buffer(self.p_leds)   # update buffer
    self.h = tasmota.settings.light_pixels_height_1 + 1
    self.w = self.strip.pixel_count() / (tasmota.settings.light_pixels_height_1 + 1)
-    self.cell_size = tasmota.int(330 / self.w, 4, 25)
+    self.cell_size = tasmota.int(self.HTML_WIDTH / self.w, 4, 25)
    self.cell_space = (self.cell_size <= 6) ? 1 : 2
  end

@ -946,14 +947,46 @@ class leds_panel
      webserver.content_send(
        f'<table style="width:100%;">'
          '<tbody>'
-            '<fieldset style="background-color:{tasmota.webcolor(1)};"><legend style="text-align:left;">&nbsp;Leds mirroring&nbsp;</legend>'
-              '<iframe src="http://{ip}:{self.port}/leds" '
-                'style="color:#eaeaea; border:0px none;height:{height}px;width:340px;margin:0px 8px 0px 8px;padding:0px 0px;">'
-              '</iframe>'
-            '</fieldset>'            
-          '</td>'
-        '</tr>'
-        '</tbody></table>'
+            '<tr>'
+              '<td>'
+                '<fieldset style="background-color:{tasmota.webcolor(1)};">'
+                  '<legend style="text-align:left;">'
+                    '<label>'
+                      '<input type="checkbox" id="ledchk">&nbsp;Leds mirroring&nbsp;'
+                    '</label>'
+                  '</legend>'
+                  '<iframe id="led_iframe" src="about:blank" hidden="true" '
+                    'style="color:#eaeaea;border:0px none;height:{height}px;width:300px;margin:0px 8px 0px 8px;padding:0px 0px;">'
+                  '</iframe>'
+                '</fieldset>'            
+              '</td>'
+            '</tr>'
+          '</tbody>'
+        '</table>'
+        '<script>'
+          'const leduri="http://{ip}:{self.port}/leds";'
+        '</script>'
+      )
+      webserver.content_send(
+        '<script>'
+        'function ledm(){'
+          'ledchk=eb("ledchk");'
+          # checkbox event
+          'ledchk.addEventListener("change",(event)=>{'
+            'const iframe=document.getElementById("led_iframe");'
+            'if(ledchk.checked){'
+              # When checked, reload the original content
+              'iframe.src=leduri;'
+              'iframe.hidden=false;'
+            '}else{'
+              # When unchecked, replace iframe with itself to unload it
+              'iframe.src="about:blank";'
+              'iframe.hidden=true;'
+            '}'
+          '});'
+        '}'
+        'wl(ledm);'
+        '</script>'
      )
    end
  end
--- a/tasmota/berry/leds_panel/leds_panel.bec
+++ b/tasmota/berry/leds_panel/leds_panel.bec
--- a/tasmota/berry/lvgl_panel/lvgl_panel.be
+++ b/tasmota/berry/lvgl_panel/lvgl_panel.be
@ -1024,7 +1024,7 @@ class lvgl_panel
                      '<input type="checkbox" id="lvchk">&nbsp;LVGL screen mirroring&nbsp;'
                    '</label>'
                  '</legend>'
-                  '<iframe id="lvgl_iframe" src="about:blank" hidden="true"'
+                  '<iframe id="lvgl_iframe" src="about:blank" hidden="true" '
                    'style="color:#eaeaea; border:0px none;height:{height}px;width:{width}px;margin:0px 8px 0px 8px;padding:0px 0px;">'
                  '</iframe>'
                '</fieldset>'            
--- a/tasmota/berry/lvgl_panel/lvgl_panel.bec
+++ b/tasmota/berry/lvgl_panel/lvgl_panel.bec