From 47190b75caf8dcf75da044ccf0980f246523e361 Mon Sep 17 00:00:00 2001
From: Paul Bottein <paul.bottein@gmail.com>
Date: Tue, 5 Mar 2024 16:49:44 +0100
Subject: [PATCH] Add grid support to cover card

---
 src/cards/cover-card/cover-card.ts            | 39 +++++++++++++------
 src/cards/light-card/light-card.ts            | 11 ++++--
 .../media-player-card/media-player-card.ts    |  6 +--
 3 files changed, 37 insertions(+), 19 deletions(-)

diff --git a/src/cards/cover-card/cover-card.ts b/src/cards/cover-card/cover-card.ts
index d647d1bb..8b00bb62 100644
--- a/src/cards/cover-card/cover-card.ts
+++ b/src/cards/cover-card/cover-card.ts
@@ -51,7 +51,10 @@ registerCustomCard({
 });
 
 @customElement(COVER_CARD_NAME)
-export class CoverCard extends MushroomBaseCard implements LovelaceCard {
+export class CoverCard
+    extends MushroomBaseCard<CoverCardConfig, CoverEntity>
+    implements LovelaceCard
+{
     public static async getConfigElement(): Promise<LovelaceCardEditor> {
         await import("./cover-card-editor");
         return document.createElement(COVER_CARD_EDITOR_NAME) as LovelaceCardEditor;
@@ -66,12 +69,12 @@ export class CoverCard extends MushroomBaseCard implements LovelaceCard {
         };
     }
 
-    @state() private _config?: CoverCardConfig;
+    protected get hasControls(): boolean {
+        return this._controls.length > 0;
+    }
 
     @state() private _activeControl?: CoverCardControl;
 
-    @state() private _controls: CoverCardControl[] = [];
-
     get _nextControl(): CoverCardControl | undefined {
         if (this._activeControl) {
             return (
@@ -91,7 +94,7 @@ export class CoverCard extends MushroomBaseCard implements LovelaceCard {
     }
 
     setConfig(config: CoverCardConfig): void {
-        this._config = {
+        super.setConfig({
             tap_action: {
                 action: "toggle",
             },
@@ -99,26 +102,38 @@ export class CoverCard extends MushroomBaseCard implements LovelaceCard {
                 action: "more-info",
             },
             ...config,
-        };
+        });
+        this.updateActiveControl();
+        this.updatePosition();
+    }
+
+    private get _controls(): CoverCardControl[] {
+        if (!this._config || !this._stateObj) return [];
         const controls: CoverCardControl[] = [];
-        if (this._config?.show_buttons_control) {
+        if (this._config.show_buttons_control) {
             controls.push("buttons_control");
         }
-        if (this._config?.show_position_control) {
+        if (this._config.show_position_control) {
             controls.push("position_control");
         }
-        if (this._config?.show_tilt_position_control) {
+        if (this._config.show_tilt_position_control) {
             controls.push("tilt_position_control");
         }
-        this._controls = controls;
-        this._activeControl = controls[0];
-        this.updatePosition();
+        return controls;
+    }
+
+    updateActiveControl() {
+        const isActiveControlSupported = this._activeControl
+            ? this._controls.includes(this._activeControl)
+            : false;
+        this._activeControl = isActiveControlSupported ? this._activeControl : this._controls[0];
     }
 
     protected updated(changedProperties: PropertyValues) {
         super.updated(changedProperties);
         if (this.hass && changedProperties.has("hass")) {
             this.updatePosition();
+            this.updateActiveControl();
         }
     }
 
diff --git a/src/cards/light-card/light-card.ts b/src/cards/light-card/light-card.ts
index a0e5fa52..ffc49655 100644
--- a/src/cards/light-card/light-card.ts
+++ b/src/cards/light-card/light-card.ts
@@ -59,7 +59,10 @@ registerCustomCard({
 });
 
 @customElement(LIGHT_CARD_NAME)
-export class LightCard extends MushroomBaseCard<LightCardConfig, LightEntity> implements LovelaceCard {
+export class LightCard
+    extends MushroomBaseCard<LightCardConfig, LightEntity>
+    implements LovelaceCard
+{
     public static async getConfigElement(): Promise<LovelaceCardEditor> {
         await import("./light-card-editor");
         return document.createElement(LIGHT_CARD_EDITOR_NAME) as LovelaceCardEditor;
@@ -106,7 +109,7 @@ export class LightCard extends MushroomBaseCard<LightCardConfig, LightEntity> im
             },
             ...config,
         });
-        this.updateActiveControls();
+        this.updateActiveControl();
         this.updateBrightness();
     }
 
@@ -118,7 +121,7 @@ export class LightCard extends MushroomBaseCard<LightCardConfig, LightEntity> im
     protected updated(changedProperties: PropertyValues) {
         super.updated(changedProperties);
         if (this.hass && changedProperties.has("hass")) {
-            this.updateActiveControls();
+            this.updateActiveControl();
             this.updateBrightness();
         }
     }
@@ -140,7 +143,7 @@ export class LightCard extends MushroomBaseCard<LightCardConfig, LightEntity> im
         }
     }
 
-    updateActiveControls() {
+    updateActiveControl() {
         const isActiveControlSupported = this._activeControl
             ? this._controls.includes(this._activeControl)
             : false;
diff --git a/src/cards/media-player-card/media-player-card.ts b/src/cards/media-player-card/media-player-card.ts
index 2e5c82f0..304f9162 100644
--- a/src/cards/media-player-card/media-player-card.ts
+++ b/src/cards/media-player-card/media-player-card.ts
@@ -106,14 +106,14 @@ export class MediaPlayerCard
 
     setConfig(config: MediaPlayerCardConfig): void {
         super.setConfig(config);
-        this.updateActiveControls();
+        this.updateActiveControl();
         this.updateVolume();
     }
 
     protected updated(changedProperties: PropertyValues) {
         super.updated(changedProperties);
         if (this.hass && changedProperties.has("hass")) {
-            this.updateActiveControls();
+            this.updateActiveControl();
             this.updateVolume();
         }
     }
@@ -139,7 +139,7 @@ export class MediaPlayerCard
         }
     }
 
-    updateActiveControls() {
+    updateActiveControl() {
         const isActiveControlSupported = this._activeControl
             ? this._controls.includes(this._activeControl)
             : false;