feat(config): add show_animations option to disable canvas animations

src/components/card.ts

@@ -91,6 +91,21 @@ export class AnimatedWeatherCard extends LitElement {
 
   updated(changedProperties: Map<string, unknown>): void {
     super.updated(changedProperties);
+
+    if (changedProperties.has('config')) {
+      const prev = changedProperties.get('config') as WeatherCardConfigInternal | undefined;
+      const wasAnimating = prev ? prev.showAnimations !== false : true;
+      const isAnimating = this.config.showAnimations !== false;
+      if (wasAnimating && !isAnimating) {
+        this.animationManager.destroy();
+      } else if (!wasAnimating && isAnimating) {
+        this.updateComplete.then(() => {
+          const container = this.shadowRoot?.querySelector('.canvas-container');
+          if (container) this.animationManager.setup(container);
+        });
+      }
+    }
+
     if (changedProperties.has('hass') || changedProperties.has('config')) {
       const entity = this.config.entity;
       const showDaily = this.config.showDailyForecast ?? false;
@@ -177,6 +192,7 @@ export class AnimatedWeatherCard extends LitElement {
       overlayOpacity: config.overlay_opacity !== undefined ? config.overlay_opacity : DEFAULT_CONFIG.overlayOpacity,
       language: config.language || DEFAULT_CONFIG.language,
       windSpeedUnit: config.wind_speed_unit || DEFAULT_CONFIG.windSpeedUnit,
+      showAnimations: config.show_animations !== false,
       sunriseEntity: config.sunrise_entity || null,
       sunsetEntity: config.sunset_entity || null,
       templowAttribute: config.templow_attribute || null,
@@ -259,7 +275,7 @@ export class AnimatedWeatherCard extends LitElement {
         @pointercancel=${(e: PointerEvent) => this.actionHandler.handlePointerUp(e)}
       >
         <div class="${cardClasses}" style="min-height: ${minHeight}; ${bgStyle}; ${overlayStyle} cursor: pointer;">
-          <div class="canvas-container"></div>
+          ${this.config.showAnimations !== false ? html`<div class="canvas-container"></div>` : ''}
           <div class="content">
             ${this.config.name && this.config.name.trim() !== '' ? html`
               <div class="header">

src/components/editor.ts

@@ -32,6 +32,7 @@ export class DynamicWeatherCardEditor extends LitElement {
       show_daily_forecast: DEFAULT_CONFIG.showDailyForecast,
       daily_forecast_days: DEFAULT_CONFIG.dailyForecastDays,
       show_sunrise_sunset: DEFAULT_CONFIG.showSunriseSunset,
+      show_animations: DEFAULT_CONFIG.showAnimations,
       show_clock: DEFAULT_CONFIG.showClock,
       clock_position: DEFAULT_CONFIG.clockPosition,
       clock_format: DEFAULT_CONFIG.clockFormat,
@@ -96,6 +97,7 @@ export class DynamicWeatherCardEditor extends LitElement {
           }
         }
       },
+      { name: 'show_animations', selector: { boolean: {} } },
       { name: 'overlay_opacity', selector: { number: { min: 0, max: 1, step: 0.05, mode: 'box' } } },
       {
         name: 'language',

src/constants.ts

@@ -41,5 +41,6 @@ export const DEFAULT_CONFIG: Required<Omit<WeatherCardConfig, 'entity' | 'type'>
   overlayOpacity: 0.1,
   language: 'auto',
   height: null,
-  windSpeedUnit: 'ms'
+  windSpeedUnit: 'ms',
+  showAnimations: true
 };

src/internationalization/locales/de/translation.json

@@ -69,7 +69,8 @@
     "language_hu": "Ungarisch",
     "wind_speed_unit": "Einheit der Windgeschwindigkeit",
     "wind_speed_unit_ms": "m/s",
-    "wind_speed_unit_kmh": "km/h"
+    "wind_speed_unit_kmh": "km/h",
+    "show_animations": "Animationen anzeigen"
   },
   "demo": {
     "pageTitle": "Dynamische Wetterkarte",

src/internationalization/locales/en/translation.json

@@ -69,7 +69,8 @@
     "language_hu": "Hungarian",
     "wind_speed_unit": "Wind Speed Unit",
     "wind_speed_unit_ms": "m/s",
-    "wind_speed_unit_kmh": "km/h"
+    "wind_speed_unit_kmh": "km/h",
+    "show_animations": "Show Animations"
   },
   "demo": {
     "pageTitle": "Dynamic Weather Card",

src/internationalization/locales/es/translation.json

@@ -69,7 +69,8 @@
     "language_hu": "Húngaro",
     "wind_speed_unit": "Unidad de velocidad del viento",
     "wind_speed_unit_ms": "m/s",
-    "wind_speed_unit_kmh": "km/h"
+    "wind_speed_unit_kmh": "km/h",
+    "show_animations": "Mostrar animaciones"
   },
   "demo": {
     "pageTitle": "Tarjeta Meteorológica Dinámica",

src/internationalization/locales/fr/translation.json

@@ -69,7 +69,8 @@
     "language_hu": "Hongrois",
     "wind_speed_unit": "Unité de vitesse du vent",
     "wind_speed_unit_ms": "m/s",
-    "wind_speed_unit_kmh": "km/h"
+    "wind_speed_unit_kmh": "km/h",
+    "show_animations": "Afficher les animations"
   },
   "demo": {
     "pageTitle": "Carte Météo Dynamique",

src/internationalization/locales/hu/translation.json

@@ -69,7 +69,8 @@
     "language_sk": "Szlovák",
     "wind_speed_unit": "Szélsebesség egység",
     "wind_speed_unit_ms": "m/s",
-    "wind_speed_unit_kmh": "km/h"
+    "wind_speed_unit_kmh": "km/h",
+    "show_animations": "Animációk megjelenítése"
   },
   "demo": {
     "pageTitle": "Dynamic Weather Card",

src/internationalization/locales/it/translation.json

@@ -69,7 +69,8 @@
     "language_hu": "Ungherese",
     "wind_speed_unit": "Unità velocità del vento",
     "wind_speed_unit_ms": "m/s",
-    "wind_speed_unit_kmh": "km/h"
+    "wind_speed_unit_kmh": "km/h",
+    "show_animations": "Mostra animazioni"
   },
   "demo": {
     "pageTitle": "Dynamic Weather Card",

src/internationalization/locales/nl/translation.json

@@ -69,7 +69,8 @@
     "language_hu": "Hongaars",
     "wind_speed_unit": "Windsnelheidseenheid",
     "wind_speed_unit_ms": "m/s",
-    "wind_speed_unit_kmh": "km/u"
+    "wind_speed_unit_kmh": "km/u",
+    "show_animations": "Animaties weergeven"
   },
   "demo": {
     "pageTitle": "Dynamische Weerkaart",

src/internationalization/locales/ru/translation.json

@@ -69,7 +69,8 @@
     "language_hu": "Венгерский",
     "wind_speed_unit": "Единицы скорости ветра",
     "wind_speed_unit_ms": "м/с",
-    "wind_speed_unit_kmh": "км/ч"
+    "wind_speed_unit_kmh": "км/ч",
+    "show_animations": "Показывать анимации"
   },
   "demo": {
     "pageTitle": "Динамическая карточка погоды",

src/internationalization/locales/sk/translation.json

@@ -69,7 +69,8 @@
     "language_hu": "Maďarčina",
     "wind_speed_unit": "Jednotka rýchlosti vetra",
     "wind_speed_unit_ms": "m/s",
-    "wind_speed_unit_kmh": "km/h"
+    "wind_speed_unit_kmh": "km/h",
+    "show_animations": "Zobraziť animácie"
   },
   "demo": {
     "pageTitle": "Dynamická karta počasia",

src/internationalization/types.ts

@@ -120,6 +120,7 @@ export interface EditorTranslations {
   wind_speed_unit: string;
   wind_speed_unit_ms: string;
   wind_speed_unit_kmh: string;
+  show_animations: string;
 }
 
 export interface Translation {

src/types.ts

@@ -128,6 +128,7 @@ export interface WeatherCardConfig {
   language?: 'auto' | 'en' | 'ru' | 'de' | 'nl' | 'fr' | 'es' | 'it' | 'sk' | 'hu';
   height?: number | null;
   windSpeedUnit?: 'ms' | 'kmh';
+  showAnimations?: boolean;
 }
 
 // Time of Day
@@ -219,6 +220,7 @@ export interface ConfigInput {
   overlay_opacity?: number;
   language?: 'auto' | 'en' | 'ru' | 'de' | 'nl' | 'fr' | 'es' | 'it' | 'sk' | 'hu';
   wind_speed_unit?: 'ms' | 'kmh';
+  show_animations?: boolean;
   sunrise_entity?: string;
   sunset_entity?: string;
   templow_attribute?: string;