diff --git a/src/const.ts b/src/const.ts
index 002e97a..0f842e7 100644
--- a/src/const.ts
+++ b/src/const.ts
@@ -84,3 +84,14 @@ export const selectedProgramMapping = {
'2': 'Home',
'3': 'Work',
};
+
+export const windowsStateMapping = {
+ windowstatusrearleft: { name: 'Window rear left', state: { 2: 'closed', 0: 'open' } },
+ windowstatusrearright: { name: 'Window rear right', state: { 2: 'closed', 0: 'open' } },
+ windowstatusfrontleft: { name: 'Window front left', state: { 2: 'closed', 0: 'open' } },
+ windowstatusfrontright: { name: 'Window front right', state: { 2: 'closed', 0: 'open' } },
+ windowstatusrearleftblind: { name: 'Window rear left blind', state: { 2: 'closed', 0: 'open' } },
+ windowstatusrearrightblind: { name: 'Window rear right blind', state: { 2: 'closed', 0: 'open' } },
+ windowstatusfrontleftblind: { name: 'Window front left blind', state: { 2: 'closed', 0: 'open' } },
+ windowstatusfrontrightblind: { name: 'Window front right blind', state: { 2: 'closed', 0: 'open' } },
+};
diff --git a/src/vehicle-info-card.ts b/src/vehicle-info-card.ts
index 53303e1..829edbf 100644
--- a/src/vehicle-info-card.ts
+++ b/src/vehicle-info-card.ts
@@ -16,7 +16,7 @@ import {
// Custom Types and Constants
import { ExtendedThemes, VehicleCardConfig, defaultConfig, EntityConfig, VehicleEntity, EntityAttr } from './types';
-import { lockAttrMapping, lockStateMapping, cardTypes, selectedProgramMapping } from './const';
+import { lockAttrMapping, lockStateMapping, cardTypes, selectedProgramMapping, windowsStateMapping } from './const';
import { localize } from './localize/localize';
import { formatTimestamp } from './utils/helpers';
import { logCardInfo, getVehicleEntities, setupCardListeners } from './utils/utils';
@@ -59,6 +59,7 @@ export class VehicleCard extends LitElement {
@state() private activeCardType: string | null = null;
private lockAttributesVisible = false;
+ private windowAttributesVisible = false;
private chargingInfoVisible = false;
get isCharging() {
@@ -542,8 +543,6 @@ export class VehicleCard extends LitElement {
private _renderDefaultVehicleCard(): TemplateResult | void {
const { vehicleEntities } = this;
- const vehicleDataKeys = [{ key: 'parkBrake' }, { key: 'windowsClosed' }];
-
const warningsDataKeys = [
{ key: 'tirePressureWarning' },
{ key: 'lowBrakeFluid' },
@@ -553,7 +552,8 @@ export class VehicleCard extends LitElement {
];
const lockInfoData = this.getLockEntityInfo();
- const vehicleData = this.createDataArray(vehicleDataKeys);
+ const windowData = this.createDataArray([{ key: 'windowsClosed' }]);
+ const parkBrakeData = this.createDataArray([{ key: 'parkBrake' }]);
const warningsData = this.createDataArray(warningsDataKeys);
return html`
@@ -570,26 +570,48 @@ export class VehicleCard extends LitElement {
${this._renderLockAttributes()}
- ${vehicleData.map(
- ({ key, icon, state, name }) => html`
+ ${windowData.map(({ name, icon, state }) => {
+ return html`
this.toggleMoreInfo(vehicleEntities[key]?.entity_id)}
+ @click=${() => this.toggleMoreInfo(vehicleEntities.windowsClosed?.entity_id)}
>
${name}
-
this.toggleMoreInfo(vehicleEntities[key]?.entity_id)}>
+
this.toggleWindowAttributes()}>
${state}
-
+
- `,
- )}
+ `;
+ })}
+ ${this._renderWindowAttributes()}
+ ${parkBrakeData.map(({ name, icon, state }) => {
+ return html`
+
+
+ this.toggleMoreInfo(vehicleEntities.parkBrake?.entity_id)}
+ >
+ ${name}
+
+
this.toggleMoreInfo(vehicleEntities.parkBrake?.entity_id)}
+ >
+ ${state}
+
+
+
+ `;
+ })}
-
${warningsData.map(
@@ -598,7 +620,7 @@ export class VehicleCard extends LitElement {
this.toggleMoreInfo(vehicleEntities[key]?.entity_id)}
>
${name}
@@ -616,6 +638,34 @@ export class VehicleCard extends LitElement {
`;
}
+ private _renderDefaultEcoCard(): TemplateResult | void {
+ const ecoDataKeys = [
+ { key: 'ecoScoreBonusRange', name: 'Bonus range' },
+ { key: 'ecoScoreAcceleraion', name: 'Acceleration' },
+ { key: 'ecoScoreConstant', name: 'Constant' },
+ { key: 'ecoScoreFreeWheel', name: 'Free wheel' },
+ ];
+
+ const ecoData = this.createDataArray(ecoDataKeys);
+ return html`
+
+ ${this._renderEcoChart()}
+
+ ${this.createItemDataRow('Scores', ecoData)}`;
+ }
+
+ private _renderDefaultTyreCard(): TemplateResult | void {
+ const tyreDataKeys = [
+ { key: 'tirePressureFrontLeft', name: 'Front left', icon: 'mdi:tire' },
+ { key: 'tirePressureFrontRight', name: 'Front right', icon: 'mdi:tire' },
+ { key: 'tirePressureRearLeft', name: 'Rear left', icon: 'mdi:tire' },
+ { key: 'tirePressureRearRight', name: 'Rear right', icon: 'mdi:tire' },
+ ];
+
+ const tyreData = this.createDataArray(tyreDataKeys);
+ return this.createItemDataRow('Tyre pressures', tyreData);
+ }
+
private _renderLockAttributes(): TemplateResult {
const lockAttributeStates: Record
= {};
// Iterate over the keys of the lockAttrMapping object
@@ -651,32 +701,40 @@ export class VehicleCard extends LitElement {
`;
}
- private _renderDefaultEcoCard(): TemplateResult | void {
- const ecoDataKeys = [
- { key: 'ecoScoreBonusRange', name: 'Bonus range' },
- { key: 'ecoScoreAcceleraion', name: 'Acceleration' },
- { key: 'ecoScoreConstant', name: 'Constant' },
- { key: 'ecoScoreFreeWheel', name: 'Free wheel' },
- ];
-
- const ecoData = this.createDataArray(ecoDataKeys);
- return html`
-
- ${this._renderEcoChart()}
-
- ${this.createItemDataRow('Scores', ecoData)}`;
- }
+ private _renderWindowAttributes(): TemplateResult {
+ const windowAttributeStates: Record = {};
+ // Iterate over the keys of the Windows object
+ Object.keys(windowsStateMapping).forEach((attribute) => {
+ const attributeState = this.getEntityAttribute(this.vehicleEntities.windowsClosed?.entity_id, attribute);
+ if (attributeState !== undefined && attributeState !== null) {
+ windowAttributeStates[attribute] = attributeState;
+ }
+ });
- private _renderDefaultTyreCard(): TemplateResult | void {
- const tyreDataKeys = [
- { key: 'tirePressureFrontLeft', name: 'Front left', icon: 'mdi:tire' },
- { key: 'tirePressureFrontRight', name: 'Front right', icon: 'mdi:tire' },
- { key: 'tirePressureRearLeft', name: 'Rear left', icon: 'mdi:tire' },
- { key: 'tirePressureRearRight', name: 'Rear right', icon: 'mdi:tire' },
- ];
+ const attributesClass = this.windowAttributesVisible ? 'sub-attributes active' : 'sub-attributes';
- const tyreData = this.createDataArray(tyreDataKeys);
- return this.createItemDataRow('Tyre pressures', tyreData);
+ // Render the window attributes
+ return html`
+
+ ${Object.keys(windowAttributeStates).map((attribute) => {
+ const rawState = windowAttributeStates[attribute];
+ // Check if the state is valid and the attribute mapping exists
+ if (rawState !== undefined && rawState !== null && windowsStateMapping[attribute]) {
+ const readableState = windowsStateMapping[attribute].state[rawState] || 'Unknown';
+ return html`
+
+
${windowsStateMapping[attribute].name}
+
+ ${readableState}
+
+
+ `;
+ }
+ // Return nothing if the attribute state is not valid or attribute mapping does not exist
+ return '';
+ })}
+
+ `;
}
private _showWarning(warning: string): TemplateResult {
@@ -731,6 +789,11 @@ export class VehicleCard extends LitElement {
this.requestUpdate(); // Trigger a re-render
};
+ private toggleWindowAttributes = () => {
+ this.windowAttributesVisible = !this.windowAttributesVisible;
+ this.requestUpdate();
+ };
+
/* -------------------------------------------------------------------------- */
/* GET ENTITIES STATE AND ATTRIBUTES */
/* -------------------------------------------------------------------------- */