iobroker.mywebui 1.37.91 → 1.37.93

package/io-package.json

@@ -1,7 +1,7 @@
 {
   "common": {
     "name": "mywebui",
-    "version": "1.37.91",
+    "version": "1.37.93",
     "titleLang": {
       "en": "mywebui",
       "de": "mywebui",

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "iobroker.mywebui",
-  "version": "1.37.91",
+  "version": "1.37.93",
   "description": "ioBroker mywebui - Custom edited mywebui by gokturk413",
   "type": "module",
   "main": "dist/backend/main.js",

package/www/dist/frontend/runtime/AnimationService.js

@@ -413,7 +413,10 @@ class AnimationInstance {
         const effect = this.cfg.effect;
 
         if (effect === 'motionPath' && this.cfg.pathId) {
-            const pathEl = document.getElementById(this.cfg.pathId);
+            // Search in shadow root first — document.getElementById doesn't see shadow DOM elements
+            const rootNode = this.element.getRootNode();
+            const pathEl = (rootNode instanceof ShadowRoot ? rootNode : document).getElementById(this.cfg.pathId)
+                        ?? document.getElementById(this.cfg.pathId);
             if (!pathEl) { console.warn('[AnimationService] motionPath: path element not found:', this.cfg.pathId); return; }
             this.tween = gsap.to(this.element, {
                 duration: parseFloat(this.cfg.duration) || 1,
@@ -422,8 +425,8 @@ class AnimationInstance {
                 yoyo: this.cfg.yoyo === true,
                 paused: true,
                 motionPath: {
-                    path: '#' + this.cfg.pathId,
-                    align: this.cfg.alignToPath ? '#' + this.cfg.pathId : false,
+                    path: pathEl,
+                    align: this.cfg.alignToPath ? pathEl : false,
                     autoRotate: this.cfg.orientToPath === true,
                     alignOrigin: [0.5, 0.5],
                     start: this.cfg.valueFrom ? parseFloat(this.cfg.valueFrom) / 100 : 0,

package/www/dist/frontend/runtime/ScreenViewer.js

@@ -388,6 +388,10 @@ let ScreenViewer = class ScreenViewer extends BaseCustomWebComponentConstructorA
         if (window.location.href.includes('runtime.html')) return;
         const shouldPause = window.appShell?._editorAnimationsEnabled === true;
         if (shouldPause) {
+            // Stop GSAP-driven animations and effects (background-color, effects, etc.)
+            cleanupAnimations(this._rootShadow);
+            cleanupEffects(this._rootShadow);
+            // Also pause any remaining CSS @keyframes animations
             if (!this._editorPauseSheet) {
                 this._editorPauseSheet = new CSSStyleSheet();
                 this._editorPauseSheet.replaceSync('*, ::before, ::after { animation-play-state: paused !important; transition: none !important; }');
@@ -395,8 +399,14 @@ let ScreenViewer = class ScreenViewer extends BaseCustomWebComponentConstructorA
             if (!this._rootShadow.adoptedStyleSheets.includes(this._editorPauseSheet))
                 this._rootShadow.adoptedStyleSheets = [...this._rootShadow.adoptedStyleSheets, this._editorPauseSheet];
         } else {
+            // Remove CSS pause sheet
             if (this._editorPauseSheet)
                 this._rootShadow.adoptedStyleSheets = this._rootShadow.adoptedStyleSheets.filter(s => s !== this._editorPauseSheet);
+            // Restart GSAP animations if screen content is present
+            if (this._rootShadow.childElementCount > 0) {
+                scanAndApplyAnimations(this._rootShadow).catch(() => {});
+                scanAndApplyEffects(this._rootShadow).catch(() => {});
+            }
         }
     }
     _onEditorAnimationsChanged = (e) => this._applyEditorAnimationState();