Add power_infos

jmcollin78 · Nov 7, 2023 · d3e7ce1 · d3e7ce1
1 parent af8e7c1
commit d3e7ce1
Show file tree

Hide file tree

Showing 7 changed files with 232 additions and 33 deletions.
diff --git a/dist/versatile-thermostat-ui-card.js b/dist/versatile-thermostat-ui-card.js
diff --git a/package.json b/package.json
@@ -1,6 +1,6 @@
 {
   "name": "versatile-thermostat-ui-card",
-  "version": "0.1.0",
+  "version": "0.3.0",
   "description": "Lovelace versatile-thermostat-ui",
   "keywords": [
     "home-assistant",

diff --git a/src/const.ts b/src/const.ts
@@ -1 +1 @@
-export const CARD_VERSION = '0.1.0';
+export const CARD_VERSION = '0.3.0';
diff --git a/src/localize/languages/en.json b/src/localize/languages/en.json
@@ -14,7 +14,8 @@
         "disable_menu": "Disable menu",
         "set_current_as_main": "Exchange target temperature and room temperature",
         "disable_security_warning": "Disable battery warning",
-        "disable_buttons": "Disable plus/minus buttons"
+        "disable_buttons": "Disable plus/minus buttons",
+        "disable_power_infos": "Disable power infos"
       }
     }
   },

diff --git a/src/localize/languages/fr.json b/src/localize/languages/fr.json
@@ -13,7 +13,8 @@
         "disable_off": "Désactiver arret",
         "set_current_as_main": "Echanger temperature cible avec temperature locale",
         "disable_security_warning": "Désactiver sécurité messages",
-        "disable_buttons": "Désactiver les boutons +/-"
+        "disable_buttons": "Désactiver les boutons +/-",
+        "disable_power_infos": "Désactiver les infos de puissance"
       }
     }
   },

diff --git a/src/versatile-thermostat-ui-card-editor.ts b/src/versatile-thermostat-ui-card-editor.ts
@@ -32,7 +32,7 @@ const loadHaComponents = (version: string) => {
     }
 };
 
-const CLIMATE_LABELS = ["disable_window", "disable_overpowering", "disable_heat", "disable_cool", "disable_off", "disable_menu", "disable_security_warning", "disable_buttons", "set_current_as_main"] as string[];
+const CLIMATE_LABELS = ["disable_window", "disable_overpowering", "disable_heat", "disable_cool", "disable_off", "disable_menu", "disable_security_warning", "disable_buttons", "set_current_as_main", "disable_power_infos"] as string[];
 
 const computeSchema = memoizeOne(
     (): any[] => [
@@ -50,7 +50,8 @@ const computeSchema = memoizeOne(
                 { name: "disable_menu", selector: { boolean: {} } },
                 { name: "disable_security_warning", selector: { boolean: {} } },
                 { name: "disable_buttons", selector: { boolean: {}}},
-                { name: "set_current_as_main", selector: { boolean: {}}}
+                { name: "set_current_as_main", selector: { boolean: {}}},
+                { name: "disable_power_infos", selector: { Boolean: {}}}
             ],
         },
     ]

diff --git a/src/versatile-thermostat-ui.ts b/src/versatile-thermostat-ui.ts
@@ -42,7 +42,10 @@ import {
   mdiSofa,
   mdiRocketLaunch,
   mdiHandWave,
-  mdiHomeLightningBolt
+  mdiHomeLightningBolt,
+  mdiFlash,
+  mdiMeterElectric,
+  mdiThermometerAuto
 } from "@mdi/js";
 
 import {
@@ -91,8 +94,12 @@ const modeIcons: {
   humidity: mdiWaterPercent,
   ok: mdiAirConditioner,
   thermometerAlert: mdiThermometerAlert,
-  none: mdiHandWave
-
+  none: mdiHandWave,
+  auto_regulation_mode: mdiThermometerAuto,
+  power_percent: mdiMeterElectric,
+  mean_power_cycle: mdiFlash,
+  valve_open_percent: mdiMeterElectric,
+  regulated_target_temp: mdiMeterElectric
 };
 type Target = "value" | "low" | "high";
 
@@ -180,6 +187,7 @@ export class VersatileThermostatUi extends LitElement implements LovelaceCard {
   @property({ type: String }) public mode: string = "off";
   @property({ type: String }) public preset: string = "manual";
   @property({ type: Boolean, reflect: true }) public dragging = false;
+
   @state()
   private changingHigh?: number;
 
@@ -279,6 +287,7 @@ export class VersatileThermostatUi extends LitElement implements LovelaceCard {
   private modes: any = [];
   private presets: any = [];
   private security_state: any = {};
+  private power_infos: any = {};
   private error: any = [];
 
   @state() private _config?: ClimateCardConfig;
@@ -538,6 +547,41 @@ export class VersatileThermostatUi extends LitElement implements LovelaceCard {
         margin-right: 5px;
       }
 
+      #power-infos {
+        z-index: 3;
+        position: absolute;
+        display: block;
+        width: auto;
+        justify-content: center;
+        padding-bottom: 0.2em;
+        left: 0%;
+        top: 30%;
+      }
+
+      #power-infos > * {
+        color: var(--disabled-text-color);
+      }
+
+      .power-info-label {
+        cursor: pointer;
+        user-select: none;
+        -webkit-tap-highlight-color: transparent;
+        display: flex;
+        position: relative;
+        align-items: center;
+        justify-content: flex-start;
+        overflow: hidden;
+        padding-top: 0px;
+        padding-bottom: 0px;
+        padding-left: 5px;
+        padding-right: 5px;
+        outline: 0px;
+        height: 48px;
+        color: var(--mdc-theme-text-primary-on-background,rgba(0,0,0,.87));
+        margin-left: 5px;
+        margin-right: 5px;
+      }
+
       #vt-control-buttons {
         z-index: 3;
         position: absolute;
@@ -816,6 +860,7 @@ export class VersatileThermostatUi extends LitElement implements LovelaceCard {
           this.windowByPass = false;
         }
 
+        // Build Security state
         if (attributes?.security_state && !this?._config?.disable_security_warning) {
           this.security_state = [];
           if (attributes.last_temperature_datetime) {
@@ -842,6 +887,7 @@ export class VersatileThermostatUi extends LitElement implements LovelaceCard {
           this.security_state = null;
         }
 
+        // Build Errors
         if (attributes?.errors !== undefined) {
           const errors = JSON.parse(attributes.errors);
           if (errors.length > 0) {
@@ -852,6 +898,58 @@ export class VersatileThermostatUi extends LitElement implements LovelaceCard {
         } else {
           this.error = [];
         }
+
+        // Build Power Infos 
+        this.power_infos = [];
+        if (!this?._config?.disable_power_infos) {
+          if (attributes?.is_over_switch) {
+            this.power_infos.push({
+              name: "mean_power_cycle",
+              value: attributes?.mean_cycle_power,
+              unit: attributes?.mean_cycle_power < 20 ? "kW" : "W",
+              class: "vt-power-color"
+            });
+            this.power_infos.push({
+              name: "power_percent",
+              value: attributes?.power_percent,
+              unit: "%",
+              class: "vt-power-color"
+            });
+          }
+
+          if (attributes?.is_over_valve) {
+            this.power_infos.push({
+              name: "valve_open_percent",
+              value: attributes?.valve_open_percent,
+              unit: "%",
+              class: "vt-power-color"
+            });
+          }
+
+          if (attributes?.is_over_climate) {
+            this.power_infos.push({
+              name: "mean_power_cycle",
+              value: attributes?.mean_cycle_power,
+              unit:  attributes?.mean_cycle_power < 20 ? "kW" : "W",
+              class: "vt-power-color"
+            });
+            if (attributes?.is_regulated) {
+              this.power_infos.push({
+                name: "regulated_target_temp",
+                value: attributes?.regulated_target_temp,
+                unit: attributes?.temperature_unit,
+                class: "vt-temp-color"
+              });
+              this.power_infos.push({
+                name: "auto_regulation_mode",
+                value: attributes?.auto_regulation_mode,
+                unit: "",
+                class: "vt-label-color"
+              });
+            }
+          }
+        }
+
         this._updateDisplay();
       }
   }
@@ -880,6 +978,14 @@ export class VersatileThermostatUi extends LitElement implements LovelaceCard {
     });
   }
 
+  private _handleClickInfo(e: MouseEvent): void {
+    // TODO removes this or complete thie
+    this.hass!.callService("versatile_thermostat", "set_device_power", {
+      entity_id: this._config!.entity,
+      preset_mode: (e.currentTarget as any).preset,
+    });
+  }
+
   private _setTemperature(): void {
       this.hass!.callService("climate", "set_temperature", {
           entity_id: this._config!.entity,
@@ -951,6 +1057,27 @@ export class VersatileThermostatUi extends LitElement implements LovelaceCard {
     `;
   }
 
+  private _renderPowerInfo(info: any): TemplateResult {
+    const localizeInfo = this.hass!.localize(`component.climate.state._.${info.name}`) || localize({ hass: this.hass, string: `extra_states.${info.name}` });
+    return html `
+      <div class="power-info-label">
+        <span>
+          <ha-icon-button
+            title="${localizeInfo}"
+            class=${info.class} 
+            .name=${info.name}
+            @click=${this._handleClickInfo}
+            tabindex="0"
+            .path=${modeIcons[info.name]}
+            .label=${localizeInfo}
+          >
+        </ha-icon-button>
+        </span>
+        <span>${info.value} ${info.unit}</span>
+      </div>
+    `;
+  }
+
   private _handleMoreInfo() {
     fireEvent(this, "hass-more-info", {
         entityId: this._config!.entity,
@@ -1153,6 +1280,16 @@ export class VersatileThermostatUi extends LitElement implements LovelaceCard {
           })}
         `}
       </div>
+
+      <div id="power-infos">
+      ${svg`
+        ${this.power_infos.map((infos) => {
+          return this._renderPowerInfo(infos);
+        })}
+      `}
+    </div>
+      
+
     </ha-card>
   `;
   };
Original file line number	Diff line number	Diff line change
		@@ -1 +1 @@
		export const CARD_VERSION = '0.1.0';
		export const CARD_VERSION = '0.3.0';