2.1.2 beta.1 - Fixes

.github/workflows/debian.yml

@@ -82,6 +82,8 @@ jobs:
             -v "${{ github.workspace }}:/source:rw" \
             -v "/tmp/deps:/tmp/deps:rw" \
             -w "/source" \
+            -e LANG="C.UTF-8" \
+            -e LC_ALL="C.UTF-8" \
             ghcr.io/hyperion-project/debian:${{ env.DOCKER_TAG }} \
             /bin/bash -c "cmake --preset linux-${{ env.BUILD_TYPE }} ${{ steps.dependencies.outputs.cmakeArgs }} -DPLATFORM=${{ matrix.os.platform }} ${{ env.CPACK_SYSTEM_PROCESSOR }} &&
             cmake --build --preset linux-${{ env.BUILD_TYPE }} --target package &&

CHANGELOG.md

@@ -12,14 +12,28 @@ and this project adheres to [Semantic Versioning](https://semver.org/spec/v2.0.0
 
 ### ✨ Added
 
+- HTTPS support for homeassistant LED devices (#1886)
+
 ---
 
+
 ### 🔧 Changed
 
+- **Fixes:**
+  - UI - Language is not selectable (#1877)
+  - CEC-Handler is not stopped properly
+  - Qt-Grabber (Windows) does not apply pixel ratio (#1882) - _Thanks to @SolberLight_
+  - LED-devices are not retrying to establish connectivity, if supported by the device
+  - LED-devices are resolving IP-addresses for API and UDP two times in sequence
+  - LED-device updates queue up and let Hyperion crash (#1887)
+
 ---
 
 ### 🗑️ Removed
 
+- Removed the ability to revoke API requests which are not issued from the same network segment. This includes the removal of IP-address white- & blacklisting (#1880)
+Rationale: Such kind of functionality is better to be dealt with via proper network management and setup, e.g. via firewalls, VLANs.
+
 ## [2.1.1](https://github.com/hyperion-project/hyperion.ng/compare/2.1.1...HEAD) - 2025-06-14
 
 ### 🔧 Changed

assets/webconfig/css/hyperion.css

@@ -245,20 +245,17 @@ table.first_cell_borderless td:first-child{width: 25px !important;}
 .mdi-lead-pencil, .mdi-delete-forever {font-size: 22px;}
 
 /*led preview & led visualisation*/
-body {
-  --background-var: none;
-  --width-var: 0px;
-  --height-var: 0px;
-}
-
 #leds_canvas {
   position:absolute;
   margin:15px;
   background-repeat:no-repeat;
   background-position: center;
+  --background-var: none;
+  --width-var: 0px;
+  --height-var: 0px;
 }
 
-#leds_canvas:before {
+#leds_canvas::before {
   content: "";
   position:absolute;
 
@@ -279,6 +276,10 @@ body {
 
   filter: blur(10px);
   background-size: cover;
+
+  /* Safari optimization for pseudo-elements */
+  transform: translateZ(0);
+  -webkit-transform: translateZ(0);
 }
 
 .led { display:inline-block; border: 1px solid black; position:absolute; opacity:0.8; text-align:center; vertical-align:middle; padding:4px;  border-radius:2px;}

assets/webconfig/i18n/en.json

@@ -765,6 +765,7 @@
     "edt_dev_spec_useEntertainmentAPI_title": "Use Hue Entertainment API",
     "edt_dev_spec_useOrbSmoothing_title": "Use orb smoothing",
     "edt_dev_spec_useRgbwProtocol_title": "Use RGBW protocol",
+    "edt_dev_spec_useSsl_title": "SSL",
     "edt_dev_spec_username_title": "Username",
     "edt_dev_spec_verbose_title": "Log all Hue commands",
     "edt_dev_spec_vid_title": "VID",
@@ -1239,3 +1240,4 @@
     "ws_processing_exception": "Exception during Websocket message processing"    
 }
 
+

assets/webconfig/js/content_index.js

@@ -442,7 +442,28 @@ $(window.hyperion).on("cmd-config-setconfig", function (event) {
 
 function bindUiHandlers() {
 
-  // Side menu link click activation
+  // Handle language selection
+
+  // Prevent dropdown from closing when selecting language
+  $('#btn_setlang').on('click', function (e) {
+    e.stopPropagation();
+  });
+
+  $('#language-select').on('changed.bs.select', function () {
+    const newLang = $(this).val();
+    if (newLang !== storedLang) {
+      setStorage("langcode", newLang);
+      location.reload();
+    }
+  });
+
+  //Close selector, if open (and no change in language happend)
+  $(document).on("click", function () {
+    $(".bootstrap-select.open").removeClass("open");
+  });
+  //End language selection
+
+  // Side smenu link click activation
   $('#side-menu li a, #side-menu li ul li a').on("click", function () {
     $('#side-menu').find('.active').removeClass('active');
     $(this).addClass('active');
@@ -476,13 +497,6 @@ function bindUiHandlers() {
     logo.style.display = window.scrollY > 65 ? "none" : "";
   }, { passive: true });
 
-  // Language selector
-  $(".langSelect").off().on("click", function () {
-    const newLang = $(this).attr("id").replace("lang_", "");
-    setStorage("lang", newLang);
-    location.reload();
-  });
-
   // Toggle top menu for mobile
   $(".navbar-toggle").off().on("click", function () {
     const target = $(this).data("target");

assets/webconfig/js/content_leds.js

@@ -1412,23 +1412,25 @@
             break;
 
           case "homeassistant":
-            var token = conf_editor.getEditor("root.specificOptions.token").getValue();
+            const port = conf_editor.getEditor("root.specificOptions.port").getValue();
+            const useSsl = conf_editor.getEditor("root.specificOptions.useSsl").getValue();
+            const token = conf_editor.getEditor("root.specificOptions.token").getValue();
             if (token === "") {
               return;
             }
 
-            params = { host: host, token: token, filter: "states" };
+            params = { host, port, useSsl, token, filter: "states" };
             getProperties_device(ledType, host, params);
             break;
 
           case "nanoleaf":
             $('#btn_wiz_holder').show();
 
-            var token = conf_editor.getEditor("root.specificOptions.token").getValue();
+            token = conf_editor.getEditor("root.specificOptions.token").getValue();
             if (token === "") {
               return;
             }
-            params = { host: host, token: token };
+            params = { host, token };
             getProperties_device(ledType, host, params);
             break;
 
@@ -1586,22 +1588,24 @@
       if (token !== "") {
         let params = {};
 
-        var host = "";
+        let host = "";
         switch (ledType) {
           case "homeassistant":
             host = conf_editor.getEditor("root.specificOptions.host").getValue();
             if (host === "") {
               return
             }
-            params = { host: host, token: token, filter: "states" };
+            const port = conf_editor.getEditor("root.specificOptions.port").getValue();
+            const useSsl = conf_editor.getEditor("root.specificOptions.useSsl").getValue();
+            params = { host, port, useSsl, token, filter: "states" };
             break;
 
           case "nanoleaf":
             host = conf_editor.getEditor("root.specificOptions.host").getValue();
             if (host === "") {
               return
             }
-            params = { host: host, token: token };
+            params = { host, token };
             break;
           default:
         }
@@ -1610,6 +1614,54 @@
       }
     });
 
+    conf_editor.watch('root.specificOptions.port', () => {
+
+      const port = conf_editor.getEditor("root.specificOptions.port").getValue();
+
+      if (port !== "") {
+        let params = {};
+
+        switch (ledType) {
+          case "homeassistant":
+            const host = conf_editor.getEditor("root.specificOptions.host").getValue();
+            const token = conf_editor.getEditor("root.specificOptions.token").getValue();
+
+            if (host === "" || token == "") {
+              return
+            }
+            const useSsl = conf_editor.getEditor("root.specificOptions.useSsl").getValue();
+            params = { host, port, useSsl, token, filter: "states" };
+
+            getProperties_device(ledType, host, params);
+
+            break;
+        }
+      }
+    });
+
+    conf_editor.watch('root.specificOptions.useSsl', () => {
+
+      const useSsl = conf_editor.getEditor("root.specificOptions.useSsl").getValue();
+
+      let params = {};
+
+      switch (ledType) {
+        case "homeassistant":
+          const host = conf_editor.getEditor("root.specificOptions.host").getValue();
+          const token = conf_editor.getEditor("root.specificOptions.token").getValue();
+
+          if (host === "" || token == "") {
+            return
+          }
+          const port = conf_editor.getEditor("root.specificOptions.port").getValue();
+          params = { host, port, useSsl, token, filter: "states" };
+
+          getProperties_device(ledType, host, params);
+
+          break;
+      }
+    });
+
     //Yeelight
     conf_editor.watch('root.specificOptions.lights', () => {
       //Disable General Options, as LED count will be resolved from number of lights configured
@@ -1788,36 +1840,46 @@
 
   // Identify/ Test LED-Device
   $("#btn_test_controller").off().on("click", function () {
-    var ledType = $("#leddevices").val();
+    const ledType = $("#leddevices").val();
     let params = {};
 
     switch (ledType) {
       case "cololight":
       case "wled":
-        var host = conf_editor.getEditor("root.specificOptions.host").getValue();
-        params = { host: host };
+        {
+          const host = conf_editor.getEditor("root.specificOptions.host").getValue();
+          params = { host: host };
+        }
         break;
 
       case "homeassistant":
-        var host = conf_editor.getEditor("root.specificOptions.host").getValue();
-        var token = conf_editor.getEditor("root.specificOptions.token").getValue();
-        const entityIds = conf_editor.getEditor("root.specificOptions.entityIds").getValue();
-        params = { host: host, token: token, entity_id: entityIds };
+        {
+          const host = conf_editor.getEditor("root.specificOptions.host").getValue();
+          const port = conf_editor.getEditor("root.specificOptions.port").getValue();
+          const useSsl = conf_editor.getEditor("root.specificOptions.useSsl").getValue();
+          const token = conf_editor.getEditor("root.specificOptions.token").getValue();
+          const entityIds = conf_editor.getEditor("root.specificOptions.entityIds").getValue();
+          params = { host, port, useSsl, token, entity_id: entityIds };
+        }
         break;
 
       case "nanoleaf":
-        var host = conf_editor.getEditor("root.specificOptions.host").getValue();
-        var token = conf_editor.getEditor("root.specificOptions.token").getValue();
-        params = { host: host, token: token };
+        {
+          const host = conf_editor.getEditor("root.specificOptions.host").getValue();
+          const token = conf_editor.getEditor("root.specificOptions.token").getValue();
+          params = { host, token };
+        }
         break;
 
       case "adalight":
       case "skydimo":
-        var currentLedCount = conf_editor.getEditor("root.generalOptions.hardwareLedCount").getValue();
-        params = Object.assign(conf_editor.getEditor("root.generalOptions").getValue(),
-          conf_editor.getEditor("root.specificOptions").getValue(),
-          { currentLedCount }
-        );
+        {
+          const currentLedCount = conf_editor.getEditor("root.generalOptions.hardwareLedCount").getValue();
+          params = Object.assign(conf_editor.getEditor("root.generalOptions").getValue(),
+            conf_editor.getEditor("root.specificOptions").getValue(),
+            { currentLedCount }
+          );
+        }
       default:
     }
 
@@ -2815,3 +2877,4 @@
   return layoutObjects;
 }
 
+

assets/webconfig/js/content_network.js

@@ -266,16 +266,11 @@ $(document).ready(function () {
     $("#conf_cont_tok").insertAfter("#conf_cont_network");
 
     // Initial state check based on server config
-    checkApiTokenState(window.serverConfig.network.internetAccessAPI || window.serverConfig.network.localApiAuth || storedAccess === 'expert');
-
-    // Listen for changes on the Internet access API Auth toggle
-    $('#root_network_internetAccessAPI').on("change", function () {
-      checkApiTokenState($(this).is(":checked") || $('#root_network_localApiAuth').is(":checked"));
-    });
+    checkApiTokenState(window.serverConfig.network.localApiAuth || storedAccess === 'expert');
 
     // Listen for changes on the local API Auth toggle
     $('#root_network_localApiAuth').on("change", function () {
-      checkApiTokenState($(this).is(":checked") || $('#root_network_internetAccessAPI').is(":checked"));
+      checkApiTokenState($(this).is(":checked"));
     });
 
     $('#btn_create_tok').off().on('click', function () {
@@ -317,7 +312,7 @@ $(document).ready(function () {
     }
 
     function checkApiTokenState(state) {
-      if (!state) {
+      if (!state && storedAccess !== 'expert') {
         $("#conf_cont_tok").hide();
       } else {
         $("#conf_cont_tok").show();

assets/webconfig/js/ledsim.js

@@ -6,9 +6,9 @@ $(document).ready(function () {
   var leds;
   var grabberConfig;
   var lC = false;
-  var imageCanvasNodeCtx = document.getElementById("image_preview_canv").getContext("2d");
-  var ledsCanvasNodeCtx = document.getElementById("leds_preview_canv").getContext("2d");
-  var sigDetectAreaCanvasNodeCtx = document.getElementById("grab_preview_canv").getContext("2d");
+  var imageCanvasNodeCtx = document.getElementById("image_preview_canv").getContext("2d", { willReadFrequently: false});
+  var ledsCanvasNodeCtx = document.getElementById("leds_preview_canv").getContext("2d", { willReadFrequently: false});
+  var sigDetectAreaCanvasNodeCtx = document.getElementById("grab_preview_canv").getContext("2d", { willReadFrequently: false});
   var canvas_height;
   var canvas_width;
   var twoDPaths = [];
@@ -205,12 +205,12 @@ $(document).ready(function () {
     canvas_width = $('#ledsim_dialog').outerWidth() - 30;
 
     $("[id$=_preview_canv]").prop({ "width": canvas_width, "height": canvas_height });
-    $("body").get(0).style.setProperty("--width-var", canvas_width + "px");
-    $("body").get(0).style.setProperty("--height-var", canvas_height + "px");
+    $('#leds_canvas').css("--width-var", canvas_width + "px");
+    $('#leds_canvas').css("--height-var", canvas_height + "px");
 
     create2dPaths();
     printLedsToCanvas();
-    $("body").get(0).style.setProperty("--background-var", "none");
+    $('#leds_canvas').css("--background-var", "none");
     resetImage();
   }
 
@@ -227,7 +227,7 @@ $(document).ready(function () {
     if (window.ledStreamActive) {
       requestLedColorsStop();
       ledsCanvasNodeCtx.clear();
-      $("body").get(0).style.setProperty("--background-var", "none");
+      $('#leds_canvas').css("--background-var", "none");
     } else {
       requestLedColorsStart();
     }
@@ -263,11 +263,13 @@ $(document).ready(function () {
   $(window.hyperion).on("cmd-ledcolors-ledstream-update", function (event) {
     if (!modalOpened) {
       requestLedColorsStop();
-      $("body").get(0).style.setProperty("--background-var", "none");
+      $('#leds_canvas').css("--background-var", "none");
     }
     else {
       printLedsToCanvas(event.response.data.leds)
-      $("body").get(0).style.setProperty("--background-var", "url(" + ($('#leds_preview_canv')[0]).toDataURL("image/jpg") + ") no-repeat top left");
+      $('#leds_canvas').css("--background-var", "url(" + ($('#leds_preview_canv')[0]).toDataURL("image/jpg") + ") no-repeat top left");
+      // Safari workaround (redraw canvas)
+      $('#leds_canvas').parent().hide().show(0);
     }
   });