iobroker.mywebui 1.37.69 → 1.37.71

package/io-package.json

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

package/package.json

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

package/www/dist/frontend/config/IobrokerWebuiAppShell.js

@@ -1036,7 +1036,18 @@ export class IobrokerWebuiAppShell extends BaseCustomWebComponentConstructorAppe
         const addBtn = document.createElement('button');
         addBtn.textContent = '+ Add Animation';
         addBtn.style.cssText = 'width:100%;margin-top:6px;padding:5px;font-size:12px;cursor:pointer;border:1px solid #5a9;border-radius:4px;background:#e8f8f0;color:#2a7a5a;font-weight:600;';
-        addBtn.onclick = () => { cfgList.push({}); this._updateAnimationsPanel(); };
+        addBtn.onclick = () => {
+            // Collect currently valid animations from UI
+            const existing = cfgList
+                .filter(c => c._collect)
+                .map(c => c._collect())
+                .filter(c => c.effect || Object.keys(c).some(k => k.endsWith('_bind')));
+            // Add new empty animation with a default effect so it survives save/reload
+            existing.push({ effect: 'opacity', duration: 1, ease: 'power1.inOut', repeat: 0 });
+            const val = existing.length === 1 ? existing[0] : existing;
+            designItem.setAttribute('data-animation', JSON.stringify(val));
+            this._updateAnimationsPanel();
+        };
         content.appendChild(addBtn);
     }
 

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

@@ -87,10 +87,12 @@ function buildTweenConfig(cfg, value) {
         case 'scale':
             config.scale = cfg.valueTo != null ? parseFloat(cfg.valueTo)
                 : (typeof normalVal === 'boolean' ? (normalVal ? 1.5 : 1) : numVal);
+            if (cfg.valueFrom != null) config.startAt = { scale: parseFloat(cfg.valueFrom) };
             break;
         case 'opacity':
             config.opacity = cfg.valueTo != null ? parseFloat(cfg.valueTo)
                 : (typeof normalVal === 'boolean' ? (normalVal ? 1 : 0) : numVal);
+            if (cfg.valueFrom != null) config.startAt = { opacity: parseFloat(cfg.valueFrom) };
             break;
         case 'translateX':
             config.x = cfg.valueTo != null ? parseFloat(cfg.valueTo)
@@ -265,6 +267,8 @@ class AnimationInstance {
     _play() {
         const gsap = window.gsap;
         if (!gsap) return;
+        // If element is display:none, make it visible so GSAP can animate it
+        if (this.element.style.display === 'none') this.element.style.display = '';
         if (this.tween) this.tween.kill();
         const effect = this.cfg.effect;