From d9783b68767fa29045e192bd194bc76bcbaecc12 Mon Sep 17 00:00:00 2001 From: Robert Resch Date: Thu, 6 Feb 2020 11:47:16 +0100 Subject: [PATCH 1/8] Convert more-info-vacuum to Lit --- .../more-info/controls/more-info-vacuum.js | 263 ---------------- .../more-info/controls/more-info-vacuum.ts | 291 ++++++++++++++++++ 2 files changed, 291 insertions(+), 263 deletions(-) delete mode 100644 src/dialogs/more-info/controls/more-info-vacuum.js create mode 100644 src/dialogs/more-info/controls/more-info-vacuum.ts diff --git a/src/dialogs/more-info/controls/more-info-vacuum.js b/src/dialogs/more-info/controls/more-info-vacuum.js deleted file mode 100644 index d7124671632b..000000000000 --- a/src/dialogs/more-info/controls/more-info-vacuum.js +++ /dev/null @@ -1,263 +0,0 @@ -import "@polymer/iron-flex-layout/iron-flex-layout-classes"; -import "@polymer/iron-icon/iron-icon"; -import "@polymer/paper-icon-button/paper-icon-button"; -import "@polymer/paper-item/paper-item"; -import "@polymer/paper-listbox/paper-listbox"; -import { html } from "@polymer/polymer/lib/utils/html-tag"; -import { PolymerElement } from "@polymer/polymer/polymer-element"; - -import "../../../components/ha-attributes"; -import "../../../components/ha-paper-dropdown-menu"; -import { supportsFeature } from "../../../common/entity/supports-feature"; - -class MoreInfoVacuum extends PolymerElement { - static get template() { - return html` - - - -
-
- Status: [[stateObj.attributes.status]] -
-
- - [[stateObj.attributes.battery_level]] % -
-
-
-

-
Vacuum cleaner commands:
-
- - - -
- -
-
- -
-
- -
-
- -
-
-
- -
-
- - - - - -
- - [[stateObj.attributes.fan_speed]] -
-
-

-
- - `; - } - - static get properties() { - return { - hass: { - type: Object, - }, - - inDialog: { - type: Boolean, - value: false, - }, - - stateObj: { - type: Object, - }, - }; - } - - supportsPause(stateObj) { - return supportsFeature(stateObj, 4); - } - - supportsStop(stateObj) { - return supportsFeature(stateObj, 8); - } - - supportsReturnHome(stateObj) { - return supportsFeature(stateObj, 16); - } - - supportsFanSpeed(stateObj) { - return supportsFeature(stateObj, 32); - } - - supportsBattery(stateObj) { - return supportsFeature(stateObj, 64); - } - - supportsStatus(stateObj) { - return supportsFeature(stateObj, 128); - } - - supportsLocate(stateObj) { - return supportsFeature(stateObj, 512); - } - - supportsCleanSpot(stateObj) { - return supportsFeature(stateObj, 1024); - } - - supportsStart(stateObj) { - return supportsFeature(stateObj, 8192); - } - - supportsCommandBar(stateObj) { - return ( - supportsFeature(stateObj, 4) | - supportsFeature(stateObj, 8) | - supportsFeature(stateObj, 16) | - supportsFeature(stateObj, 512) | - supportsFeature(stateObj, 1024) | - supportsFeature(stateObj, 8192) - ); - } - - fanSpeedChanged(ev) { - var oldVal = this.stateObj.attributes.fan_speed; - var newVal = ev.detail.value; - - if (!newVal || oldVal === newVal) return; - - this.hass.callService("vacuum", "set_fan_speed", { - entity_id: this.stateObj.entity_id, - fan_speed: newVal, - }); - } - - onStop() { - this.hass.callService("vacuum", "stop", { - entity_id: this.stateObj.entity_id, - }); - } - - onPlayPause() { - this.hass.callService("vacuum", "start_pause", { - entity_id: this.stateObj.entity_id, - }); - } - - onPause() { - this.hass.callService("vacuum", "pause", { - entity_id: this.stateObj.entity_id, - }); - } - - onStart() { - this.hass.callService("vacuum", "start", { - entity_id: this.stateObj.entity_id, - }); - } - - onLocate() { - this.hass.callService("vacuum", "locate", { - entity_id: this.stateObj.entity_id, - }); - } - - onCleanSpot() { - this.hass.callService("vacuum", "clean_spot", { - entity_id: this.stateObj.entity_id, - }); - } - - onReturnHome() { - this.hass.callService("vacuum", "return_to_base", { - entity_id: this.stateObj.entity_id, - }); - } -} - -customElements.define("more-info-vacuum", MoreInfoVacuum); diff --git a/src/dialogs/more-info/controls/more-info-vacuum.ts b/src/dialogs/more-info/controls/more-info-vacuum.ts new file mode 100644 index 000000000000..3e3826d4202b --- /dev/null +++ b/src/dialogs/more-info/controls/more-info-vacuum.ts @@ -0,0 +1,291 @@ +import "@polymer/iron-icon/iron-icon"; +import "@polymer/paper-icon-button/paper-icon-button"; +import "@polymer/paper-item/paper-item"; +import "@polymer/paper-listbox/paper-listbox"; + +import { + css, + CSSResult, + customElement, + html, + LitElement, + property, + TemplateResult, +} from "lit-element"; + +import "../../../components/ha-paper-dropdown-menu"; +import "../../../components/ha-attributes"; + +import { supportsFeature } from "../../../common/entity/supports-feature"; +import { HomeAssistant } from "../../../types"; + +import { HassEntity } from "home-assistant-js-websocket"; + +@customElement("more-info-vacuum") +class MoreInfoVacuum extends LitElement { + @property() public hass!: HomeAssistant; + + @property() public stateObj?: HassEntity; + + protected render(): TemplateResult { + if (!this.hass || !this.stateObj) { + return html``; + } + + const stateObj = this.stateObj; + + const supportsPause = supportsFeature(stateObj, 4); + const supportsStop = supportsFeature(stateObj, 8); + const supportsReturnHome = supportsFeature(stateObj, 16); + const supportsFanSpeed = supportsFeature(stateObj, 32); + const supportsBattery = supportsFeature(stateObj, 64); + const supportsStatus = supportsFeature(stateObj, 128); + const supportsLocate = supportsFeature(stateObj, 512); + const supportsCleanSpot = supportsFeature(stateObj, 1024); + const supportsStart = supportsFeature(stateObj, 8192); + + const filterExtraAtrributes = + "fan_speed,fan_speed_list,status,battery_level,battery_icon"; + + const supportsCommandBar = + supportsPause || + supportsStop || + supportsReturnHome || + supportsLocate || + supportsCleanSpot || + supportsStart; + + return html` +
+ ${supportsStatus + ? html` +
+ Status: + ${stateObj.attributes.status} +
+ ` + : ""} + ${supportsBattery + ? html` + + + + ${stateObj.attributes.battery_level} % + +
` + : ""} + + + ${supportsCommandBar + ? html` +
+

+
Vacuum cleaner commands:
+
+ ${supportsStart + ? html` +
+ +
+ ${supportsPause + ? html` +
+ +
+ ` + : ""} + ` + : supportsPause + ? html` +
+ +
+ ` + : ""} + ${supportsStop + ? html` +
+ +
+ ` + : ""} + ${supportsCleanSpot + ? html` +
+ +
+ ` + : ""} + ${supportsLocate + ? html` +
+ +
+ ` + : ""} + ${supportsReturnHome + ? html` +
+ +
+ ` + : ""} +
+
+ ` + : ""} + ${supportsFanSpeed + ? html` +
+
+ + + ${stateObj.attributes.fan_speed_list!.map( + (mode) => html` + + ${mode} + + ` + )} + + +
+ + + ${stateObj.attributes.fan_speed} + +
+
+

+
+ ` + : ""} + + + `; + } + + private handleStop() { + this.hass.callService("vacuum", "stop", { + entity_id: this.stateObj!.entity_id, + }); + } + + private handlePlayPause() { + this.hass.callService("vacuum", "start_pause", { + entity_id: this.stateObj!.entity_id, + }); + } + + private handlePause() { + this.hass.callService("vacuum", "pause", { + entity_id: this.stateObj!.entity_id, + }); + } + + private handleStart() { + this.hass.callService("vacuum", "start", { + entity_id: this.stateObj!.entity_id, + }); + } + + private handleLocate() { + this.hass.callService("vacuum", "locate", { + entity_id: this.stateObj!.entity_id, + }); + } + + private handleCleanSpot() { + this.hass.callService("vacuum", "clean_spot", { + entity_id: this.stateObj!.entity_id, + }); + } + + private handleReturnHome() { + this.hass.callService("vacuum", "return_to_base", { + entity_id: this.stateObj!.entity_id, + }); + } + + private handleFanSpeedChanged(ev: CustomEvent) { + const oldVal = this.stateObj!.attributes.fan_speed; + const newVal = ev.detail.item.getAttribute("item-name"); + + if (!newVal || oldVal === newVal) { + return; + } + + this.hass.callService("vacuum", "set_fan_speed", { + entity_id: this.stateObj!.entity_id, + fan_speed: newVal, + }); + } + + static get styles(): CSSResult { + return css` + :host { + @apply --paper-font-body1; + line-height: 1.5; + } + .status-subtitle { + color: var(--secondary-text-color); + } + paper-item { + cursor: pointer; + } + .flex-horizontal { + display: flex; + flex-direction: row; + justify-content: space-between; + } + `; + } +} + +declare global { + interface HTMLElementTagNameMap { + "more-info-vacuum": MoreInfoVacuum; + } +} From ccac568cb1655f8c732241fc1f9b716f7a4825eb Mon Sep 17 00:00:00 2001 From: Robert Resch Date: Thu, 6 Feb 2020 13:49:26 +0100 Subject: [PATCH 2/8] Introduce VacuumCommand to reduce render complexity and duplicate code --- src/data/vacuum.ts | 22 ++ .../more-info/controls/more-info-vacuum.ts | 239 ++++++++---------- 2 files changed, 134 insertions(+), 127 deletions(-) create mode 100644 src/data/vacuum.ts diff --git a/src/data/vacuum.ts b/src/data/vacuum.ts new file mode 100644 index 000000000000..0ad0738d1b4c --- /dev/null +++ b/src/data/vacuum.ts @@ -0,0 +1,22 @@ +import { + HassEntityAttributeBase, + HassEntityBase, +} from "home-assistant-js-websocket"; + +export const VACUUM_SUPPORT_PAUSE = 4; +export const VACUUM_SUPPORT_STOP = 8; +export const VACUUM_SUPPORT_RETURN_HOME = 16; +export const VACUUM_SUPPORT_FAN_SPEED = 32; +export const VACUUM_SUPPORT_BATTERY = 64; +export const VACUUM_SUPPORT_STATUS = 128; +export const VACUUM_SUPPORT_LOCATE = 512; +export const VACUUM_SUPPORT_CLEAN_SPOT = 1024; +export const VACUUM_SUPPORT_START = 8192; + +export type VacuumEntity = HassEntityBase & { + attributes: HassEntityAttributeBase & { + battery_level: number; + fan_speed: any; + [key: string]: any; + }; +}; diff --git a/src/dialogs/more-info/controls/more-info-vacuum.ts b/src/dialogs/more-info/controls/more-info-vacuum.ts index 3e3826d4202b..421114d25aa5 100644 --- a/src/dialogs/more-info/controls/more-info-vacuum.ts +++ b/src/dialogs/more-info/controls/more-info-vacuum.ts @@ -13,19 +13,92 @@ import { TemplateResult, } from "lit-element"; +import { supportsFeature } from "../../../common/entity/supports-feature"; +import { HomeAssistant } from "../../../types"; + import "../../../components/ha-paper-dropdown-menu"; import "../../../components/ha-attributes"; +import { + VACUUM_SUPPORT_BATTERY, + VACUUM_SUPPORT_CLEAN_SPOT, + VACUUM_SUPPORT_FAN_SPEED, + VACUUM_SUPPORT_LOCATE, + VACUUM_SUPPORT_PAUSE, + VACUUM_SUPPORT_RETURN_HOME, + VACUUM_SUPPORT_START, + VACUUM_SUPPORT_STATUS, + VACUUM_SUPPORT_STOP, + VacuumEntity, +} from "../../../data/vacuum"; -import { supportsFeature } from "../../../common/entity/supports-feature"; -import { HomeAssistant } from "../../../types"; +class VacuumCommand { + public title: string; + public icon: string; + public serviceName: string; + private funcIsVisible: (stateObj: VacuumEntity) => boolean; + + constructor( + title: string, + icon: string, + serviceName: string, + funcIsVisible: (stateObj: VacuumEntity) => boolean + ) { + this.title = title; + this.icon = icon; + this.serviceName = serviceName; + this.funcIsVisible = funcIsVisible; + } + + public shouldVisible(stateObj: VacuumEntity): boolean { + return this.funcIsVisible(stateObj); + } +} -import { HassEntity } from "home-assistant-js-websocket"; +const VACUUM_COMMANDS: VacuumCommand[] = [ + new VacuumCommand("Start", "hass:play", "start", (stateObj) => + supportsFeature(stateObj, VACUUM_SUPPORT_START) + ), + new VacuumCommand( + "Pause", + "hass:pause", + "pause", + (stateObj) => + // We need also to check if Start is supported because if not we show play-pause + supportsFeature(stateObj, VACUUM_SUPPORT_START) && + supportsFeature(stateObj, VACUUM_SUPPORT_PAUSE) + ), + new VacuumCommand( + "Pause", + "hass:play-pause", + "start_pause", + (stateObj) => + // If start is supoorted, we don't show this button + !supportsFeature(stateObj, VACUUM_SUPPORT_START) && + supportsFeature(stateObj, VACUUM_SUPPORT_PAUSE) + ), + new VacuumCommand("Stop", "hass:stop", "stop", (stateObj) => + supportsFeature(stateObj, VACUUM_SUPPORT_STOP) + ), + new VacuumCommand("Clean spot", "hass:broom", "clean_spot", (stateObj) => + supportsFeature(stateObj, VACUUM_SUPPORT_CLEAN_SPOT) + ), + new VacuumCommand("Locate", "hass:map-marker", "locate", (stateObj) => + supportsFeature(stateObj, VACUUM_SUPPORT_LOCATE) + ), + new VacuumCommand( + "Return home", + "hass:home-map-marker", + "return_to_base", + (stateObj) => supportsFeature(stateObj, VACUUM_SUPPORT_RETURN_HOME) + ), +]; +// tslint:disable-next-line:max-classes-per-file @customElement("more-info-vacuum") class MoreInfoVacuum extends LitElement { @property() public hass!: HomeAssistant; - @property() public stateObj?: HassEntity; + @property() public stateObj?: VacuumEntity; protected render(): TemplateResult { if (!this.hass || !this.stateObj) { @@ -34,15 +107,24 @@ class MoreInfoVacuum extends LitElement { const stateObj = this.stateObj; - const supportsPause = supportsFeature(stateObj, 4); - const supportsStop = supportsFeature(stateObj, 8); - const supportsReturnHome = supportsFeature(stateObj, 16); - const supportsFanSpeed = supportsFeature(stateObj, 32); - const supportsBattery = supportsFeature(stateObj, 64); - const supportsStatus = supportsFeature(stateObj, 128); - const supportsLocate = supportsFeature(stateObj, 512); - const supportsCleanSpot = supportsFeature(stateObj, 1024); - const supportsStart = supportsFeature(stateObj, 8192); + const supportsPause = supportsFeature(stateObj, VACUUM_SUPPORT_PAUSE); + const supportsStop = supportsFeature(stateObj, VACUUM_SUPPORT_STOP); + const supportsReturnHome = supportsFeature( + stateObj, + VACUUM_SUPPORT_RETURN_HOME + ); + const supportsFanSpeed = supportsFeature( + stateObj, + VACUUM_SUPPORT_FAN_SPEED + ); + const supportsBattery = supportsFeature(stateObj, VACUUM_SUPPORT_BATTERY); + const supportsStatus = supportsFeature(stateObj, VACUUM_SUPPORT_STATUS); + const supportsLocate = supportsFeature(stateObj, VACUUM_SUPPORT_LOCATE); + const supportsCleanSpot = supportsFeature( + stateObj, + VACUUM_SUPPORT_CLEAN_SPOT + ); + const supportsStart = supportsFeature(stateObj, VACUUM_SUPPORT_START); const filterExtraAtrributes = "fan_speed,fan_speed_list,status,battery_level,battery_icon"; @@ -82,82 +164,20 @@ class MoreInfoVacuum extends LitElement {

Vacuum cleaner commands:
- ${supportsStart - ? html` -
- -
- ${supportsPause - ? html` -
- -
- ` - : ""} - ` - : supportsPause - ? html` -
- -
- ` - : ""} - ${supportsStop - ? html` -
- -
- ` - : ""} - ${supportsCleanSpot - ? html` -
- -
- ` - : ""} - ${supportsLocate - ? html` -
- -
- ` - : ""} - ${supportsReturnHome - ? html` -
- -
- ` - : ""} + ${VACUUM_COMMANDS.filter((item) => + item.shouldVisible(stateObj) + ).map( + (item) => html` +
+ +
+ ` + )}
` @@ -207,44 +227,9 @@ class MoreInfoVacuum extends LitElement { `; } - private handleStop() { - this.hass.callService("vacuum", "stop", { - entity_id: this.stateObj!.entity_id, - }); - } - - private handlePlayPause() { - this.hass.callService("vacuum", "start_pause", { - entity_id: this.stateObj!.entity_id, - }); - } - - private handlePause() { - this.hass.callService("vacuum", "pause", { - entity_id: this.stateObj!.entity_id, - }); - } - - private handleStart() { - this.hass.callService("vacuum", "start", { - entity_id: this.stateObj!.entity_id, - }); - } - - private handleLocate() { - this.hass.callService("vacuum", "locate", { - entity_id: this.stateObj!.entity_id, - }); - } - - private handleCleanSpot() { - this.hass.callService("vacuum", "clean_spot", { - entity_id: this.stateObj!.entity_id, - }); - } - - private handleReturnHome() { - this.hass.callService("vacuum", "return_to_base", { + private callService(ev: CustomEvent) { + const entry = (ev.target! as any).entry as VacuumCommand; + this.hass.callService("vacuum", entry.serviceName, { entity_id: this.stateObj!.entity_id, }); } From 53f5b75220a0b766cf0885b93942eea36e0d969d Mon Sep 17 00:00:00 2001 From: Robert Resch Date: Thu, 6 Feb 2020 16:46:37 +0100 Subject: [PATCH 3/8] Add localization for more-info-vacuum --- .../more-info/controls/more-info-vacuum.ts | 56 +++++++++++-------- src/translations/en.json | 11 ++++ 2 files changed, 44 insertions(+), 23 deletions(-) diff --git a/src/dialogs/more-info/controls/more-info-vacuum.ts b/src/dialogs/more-info/controls/more-info-vacuum.ts index 421114d25aa5..ac238b66d341 100644 --- a/src/dialogs/more-info/controls/more-info-vacuum.ts +++ b/src/dialogs/more-info/controls/more-info-vacuum.ts @@ -32,18 +32,18 @@ import { } from "../../../data/vacuum"; class VacuumCommand { - public title: string; + public translationKey: string; public icon: string; public serviceName: string; private funcIsVisible: (stateObj: VacuumEntity) => boolean; constructor( - title: string, + translationKey: string, icon: string, serviceName: string, funcIsVisible: (stateObj: VacuumEntity) => boolean ) { - this.title = title; + this.translationKey = translationKey; this.icon = icon; this.serviceName = serviceName; this.funcIsVisible = funcIsVisible; @@ -55,11 +55,11 @@ class VacuumCommand { } const VACUUM_COMMANDS: VacuumCommand[] = [ - new VacuumCommand("Start", "hass:play", "start", (stateObj) => + new VacuumCommand("start", "hass:play", "start", (stateObj) => supportsFeature(stateObj, VACUUM_SUPPORT_START) ), new VacuumCommand( - "Pause", + "pause", "hass:pause", "pause", (stateObj) => @@ -68,7 +68,7 @@ const VACUUM_COMMANDS: VacuumCommand[] = [ supportsFeature(stateObj, VACUUM_SUPPORT_PAUSE) ), new VacuumCommand( - "Pause", + "pause", "hass:play-pause", "start_pause", (stateObj) => @@ -76,17 +76,17 @@ const VACUUM_COMMANDS: VacuumCommand[] = [ !supportsFeature(stateObj, VACUUM_SUPPORT_START) && supportsFeature(stateObj, VACUUM_SUPPORT_PAUSE) ), - new VacuumCommand("Stop", "hass:stop", "stop", (stateObj) => + new VacuumCommand("stop", "hass:stop", "stop", (stateObj) => supportsFeature(stateObj, VACUUM_SUPPORT_STOP) ), - new VacuumCommand("Clean spot", "hass:broom", "clean_spot", (stateObj) => + new VacuumCommand("clean_spot", "hass:broom", "clean_spot", (stateObj) => supportsFeature(stateObj, VACUUM_SUPPORT_CLEAN_SPOT) ), - new VacuumCommand("Locate", "hass:map-marker", "locate", (stateObj) => + new VacuumCommand("locate", "hass:map-marker", "locate", (stateObj) => supportsFeature(stateObj, VACUUM_SUPPORT_LOCATE) ), new VacuumCommand( - "Return home", + "return_home", "hass:home-map-marker", "return_to_base", (stateObj) => supportsFeature(stateObj, VACUUM_SUPPORT_RETURN_HOME) @@ -142,7 +142,11 @@ class MoreInfoVacuum extends LitElement { ${supportsStatus ? html`
- Status: + ${this.hass!.localize( + "ui.dialogs.more_info_control.vacuum.status" + )}: + ${stateObj.attributes.status}
` @@ -151,7 +155,7 @@ class MoreInfoVacuum extends LitElement { ? html` - + ${stateObj.attributes.battery_level} % ` @@ -162,7 +166,11 @@ class MoreInfoVacuum extends LitElement { ? html`

-
Vacuum cleaner commands:
+
+ ${this.hass!.localize( + "ui.dialogs.more_info_control.vacuum.commands" + )} +
${VACUUM_COMMANDS.filter((item) => item.shouldVisible(stateObj) @@ -170,10 +178,12 @@ class MoreInfoVacuum extends LitElement { (item) => html`
` @@ -187,13 +197,13 @@ class MoreInfoVacuum extends LitElement {
@@ -221,8 +231,8 @@ class MoreInfoVacuum extends LitElement { : ""} `; } diff --git a/src/translations/en.json b/src/translations/en.json index 74af9fff7e70..073e87684fa2 100755 --- a/src/translations/en.json +++ b/src/translations/en.json @@ -618,6 +618,17 @@ "remove_action": "Remove entity", "confirm_remove_title": "Remove entity?", "confirm_remove_text": "Are you sure you want to remove this entity?" + }, + "vacuum": { + "status": "Status", + "commands": "Vacuum cleaner commands:", + "fan_speed": "Fan speed", + "start": "Start", + "pause": "Pause", + "stop": "Stop", + "clean_spot": "Clean spot", + "locate": "Locate", + "return_home": "Return home" } }, "entity_registry": { From 00b7ee8cf76113cf72d714c37eacb089456dee03 Mon Sep 17 00:00:00 2001 From: Robert Resch Date: Sat, 8 Feb 2020 10:06:56 +0100 Subject: [PATCH 4/8] Inline supportFeature instead of creating a const. --- .../more-info/controls/more-info-vacuum.ts | 37 +++++-------------- 1 file changed, 9 insertions(+), 28 deletions(-) diff --git a/src/dialogs/more-info/controls/more-info-vacuum.ts b/src/dialogs/more-info/controls/more-info-vacuum.ts index ac238b66d341..fd687a699c38 100644 --- a/src/dialogs/more-info/controls/more-info-vacuum.ts +++ b/src/dialogs/more-info/controls/more-info-vacuum.ts @@ -107,39 +107,20 @@ class MoreInfoVacuum extends LitElement { const stateObj = this.stateObj; - const supportsPause = supportsFeature(stateObj, VACUUM_SUPPORT_PAUSE); - const supportsStop = supportsFeature(stateObj, VACUUM_SUPPORT_STOP); - const supportsReturnHome = supportsFeature( - stateObj, - VACUUM_SUPPORT_RETURN_HOME - ); - const supportsFanSpeed = supportsFeature( - stateObj, - VACUUM_SUPPORT_FAN_SPEED - ); - const supportsBattery = supportsFeature(stateObj, VACUUM_SUPPORT_BATTERY); - const supportsStatus = supportsFeature(stateObj, VACUUM_SUPPORT_STATUS); - const supportsLocate = supportsFeature(stateObj, VACUUM_SUPPORT_LOCATE); - const supportsCleanSpot = supportsFeature( - stateObj, - VACUUM_SUPPORT_CLEAN_SPOT - ); - const supportsStart = supportsFeature(stateObj, VACUUM_SUPPORT_START); - const filterExtraAtrributes = "fan_speed,fan_speed_list,status,battery_level,battery_icon"; const supportsCommandBar = - supportsPause || - supportsStop || - supportsReturnHome || - supportsLocate || - supportsCleanSpot || - supportsStart; + supportsFeature(stateObj, VACUUM_SUPPORT_PAUSE) || + supportsFeature(stateObj, VACUUM_SUPPORT_STOP) || + supportsFeature(stateObj, VACUUM_SUPPORT_RETURN_HOME) || + supportsFeature(stateObj, VACUUM_SUPPORT_LOCATE) || + supportsFeature(stateObj, VACUUM_SUPPORT_CLEAN_SPOT) || + supportsFeature(stateObj, VACUUM_SUPPORT_START); return html`
- ${supportsStatus + ${supportsFeature(stateObj, VACUUM_SUPPORT_STATUS) ? html`
` : ""} - ${supportsBattery + ${supportsFeature(stateObj, VACUUM_SUPPORT_BATTERY) ? html` @@ -192,7 +173,7 @@ class MoreInfoVacuum extends LitElement {
` : ""} - ${supportsFanSpeed + ${supportsFeature(stateObj, VACUUM_SUPPORT_FAN_SPEED) ? html`
From bdaaa5bf15029f8dc9511c9712352c7736f2a333 Mon Sep 17 00:00:00 2001 From: Robert Resch Date: Sat, 8 Feb 2020 10:38:10 +0100 Subject: [PATCH 5/8] - Use interface instead of class for VacuumCommand - Add different translation for start_pause and pause as they are not the same --- .../more-info/controls/more-info-vacuum.ts | 109 +++++++++--------- src/translations/en.json | 3 +- 2 files changed, 55 insertions(+), 57 deletions(-) diff --git a/src/dialogs/more-info/controls/more-info-vacuum.ts b/src/dialogs/more-info/controls/more-info-vacuum.ts index fd687a699c38..3b6701d93772 100644 --- a/src/dialogs/more-info/controls/more-info-vacuum.ts +++ b/src/dialogs/more-info/controls/more-info-vacuum.ts @@ -31,69 +31,66 @@ import { VacuumEntity, } from "../../../data/vacuum"; -class VacuumCommand { - public translationKey: string; - public icon: string; - public serviceName: string; - private funcIsVisible: (stateObj: VacuumEntity) => boolean; - - constructor( - translationKey: string, - icon: string, - serviceName: string, - funcIsVisible: (stateObj: VacuumEntity) => boolean - ) { - this.translationKey = translationKey; - this.icon = icon; - this.serviceName = serviceName; - this.funcIsVisible = funcIsVisible; - } - - public shouldVisible(stateObj: VacuumEntity): boolean { - return this.funcIsVisible(stateObj); - } +interface VacuumCommand { + translationKey: string; + icon: string; + serviceName: string; + isVisible: (stateObj: VacuumEntity) => boolean; } const VACUUM_COMMANDS: VacuumCommand[] = [ - new VacuumCommand("start", "hass:play", "start", (stateObj) => - supportsFeature(stateObj, VACUUM_SUPPORT_START) - ), - new VacuumCommand( - "pause", - "hass:pause", - "pause", - (stateObj) => + { + translationKey: "start", + icon: "hass:play", + serviceName: "start", + isVisible: (stateObj) => supportsFeature(stateObj, VACUUM_SUPPORT_START), + }, + { + translationKey: "pause", + icon: "hass:pause", + serviceName: "pause", + isVisible: (stateObj) => // We need also to check if Start is supported because if not we show play-pause supportsFeature(stateObj, VACUUM_SUPPORT_START) && - supportsFeature(stateObj, VACUUM_SUPPORT_PAUSE) - ), - new VacuumCommand( - "pause", - "hass:play-pause", - "start_pause", - (stateObj) => + supportsFeature(stateObj, VACUUM_SUPPORT_PAUSE), + }, + { + translationKey: "start_pause", + icon: "hass:play-pause", + serviceName: "start_pause", + isVisible: (stateObj) => // If start is supoorted, we don't show this button !supportsFeature(stateObj, VACUUM_SUPPORT_START) && - supportsFeature(stateObj, VACUUM_SUPPORT_PAUSE) - ), - new VacuumCommand("stop", "hass:stop", "stop", (stateObj) => - supportsFeature(stateObj, VACUUM_SUPPORT_STOP) - ), - new VacuumCommand("clean_spot", "hass:broom", "clean_spot", (stateObj) => - supportsFeature(stateObj, VACUUM_SUPPORT_CLEAN_SPOT) - ), - new VacuumCommand("locate", "hass:map-marker", "locate", (stateObj) => - supportsFeature(stateObj, VACUUM_SUPPORT_LOCATE) - ), - new VacuumCommand( - "return_home", - "hass:home-map-marker", - "return_to_base", - (stateObj) => supportsFeature(stateObj, VACUUM_SUPPORT_RETURN_HOME) - ), + supportsFeature(stateObj, VACUUM_SUPPORT_PAUSE), + }, + { + translationKey: "stop", + icon: "hass:stop", + serviceName: "stop", + isVisible: (stateObj) => supportsFeature(stateObj, VACUUM_SUPPORT_STOP), + }, + { + translationKey: "clean_spot", + icon: "hass:broom", + serviceName: "clean_spot", + isVisible: (stateObj) => + supportsFeature(stateObj, VACUUM_SUPPORT_CLEAN_SPOT), + }, + { + translationKey: "locate", + icon: "hass:map-marker", + serviceName: "locate", + isVisible: (stateObj) => supportsFeature(stateObj, VACUUM_SUPPORT_LOCATE), + }, + { + translationKey: "return_home", + icon: "hass:home-map-marker", + serviceName: "return_to_base", + isVisible: (stateObj) => + supportsFeature(stateObj, VACUUM_SUPPORT_RETURN_HOME), + }, ]; -// tslint:disable-next-line:max-classes-per-file @customElement("more-info-vacuum") class MoreInfoVacuum extends LitElement { @property() public hass!: HomeAssistant; @@ -154,13 +151,13 @@ class MoreInfoVacuum extends LitElement {
${VACUUM_COMMANDS.filter((item) => - item.shouldVisible(stateObj) + item.isVisible(stateObj) ).map( (item) => html`
Date: Sat, 8 Feb 2020 10:48:08 +0100 Subject: [PATCH 6/8] fix typo --- src/dialogs/more-info/controls/more-info-vacuum.ts | 4 ++-- 1 file changed, 2 insertions(+), 2 deletions(-) diff --git a/src/dialogs/more-info/controls/more-info-vacuum.ts b/src/dialogs/more-info/controls/more-info-vacuum.ts index 3b6701d93772..d6355daeb858 100644 --- a/src/dialogs/more-info/controls/more-info-vacuum.ts +++ b/src/dialogs/more-info/controls/more-info-vacuum.ts @@ -104,7 +104,7 @@ class MoreInfoVacuum extends LitElement { const stateObj = this.stateObj; - const filterExtraAtrributes = + const filterExtraAttributes = "fan_speed,fan_speed_list,status,battery_level,battery_icon"; const supportsCommandBar = @@ -210,7 +210,7 @@ class MoreInfoVacuum extends LitElement { `; } From 016ed5d1c8fb86c85bfa582e101cd08edb4b8f06 Mon Sep 17 00:00:00 2001 From: Robert Resch Date: Mon, 10 Feb 2020 19:00:50 +0100 Subject: [PATCH 7/8] Use VACUUM_COMMANDS.some instead of writing duplicate code --- src/dialogs/more-info/controls/more-info-vacuum.ts | 10 +--------- 1 file changed, 1 insertion(+), 9 deletions(-) diff --git a/src/dialogs/more-info/controls/more-info-vacuum.ts b/src/dialogs/more-info/controls/more-info-vacuum.ts index d6355daeb858..d4ef6c7f3916 100644 --- a/src/dialogs/more-info/controls/more-info-vacuum.ts +++ b/src/dialogs/more-info/controls/more-info-vacuum.ts @@ -107,14 +107,6 @@ class MoreInfoVacuum extends LitElement { const filterExtraAttributes = "fan_speed,fan_speed_list,status,battery_level,battery_icon"; - const supportsCommandBar = - supportsFeature(stateObj, VACUUM_SUPPORT_PAUSE) || - supportsFeature(stateObj, VACUUM_SUPPORT_STOP) || - supportsFeature(stateObj, VACUUM_SUPPORT_RETURN_HOME) || - supportsFeature(stateObj, VACUUM_SUPPORT_LOCATE) || - supportsFeature(stateObj, VACUUM_SUPPORT_CLEAN_SPOT) || - supportsFeature(stateObj, VACUUM_SUPPORT_START); - return html`
${supportsFeature(stateObj, VACUUM_SUPPORT_STATUS) @@ -140,7 +132,7 @@ class MoreInfoVacuum extends LitElement { : ""}
- ${supportsCommandBar + ${VACUUM_COMMANDS.some((item) => item.isVisible(stateObj)) ? html`

From 8e2eabee9801905c873c6a2365f149a20b592f39 Mon Sep 17 00:00:00 2001 From: Robert Resch Date: Mon, 10 Feb 2020 20:45:10 +0100 Subject: [PATCH 8/8] add @bramkragten suggestions --- src/dialogs/more-info/controls/more-info-vacuum.ts | 14 +++++++------- 1 file changed, 7 insertions(+), 7 deletions(-) diff --git a/src/dialogs/more-info/controls/more-info-vacuum.ts b/src/dialogs/more-info/controls/more-info-vacuum.ts index d4ef6c7f3916..4d6d1c362f68 100644 --- a/src/dialogs/more-info/controls/more-info-vacuum.ts +++ b/src/dialogs/more-info/controls/more-info-vacuum.ts @@ -59,7 +59,7 @@ const VACUUM_COMMANDS: VacuumCommand[] = [ icon: "hass:play-pause", serviceName: "start_pause", isVisible: (stateObj) => - // If start is supoorted, we don't show this button + // If start is supported, we don't show this button !supportsFeature(stateObj, VACUUM_SUPPORT_START) && supportsFeature(stateObj, VACUUM_SUPPORT_PAUSE), }, @@ -125,7 +125,7 @@ class MoreInfoVacuum extends LitElement { ? html` - + ${stateObj.attributes.battery_level} %
` @@ -148,10 +148,10 @@ class MoreInfoVacuum extends LitElement { (item) => html`
@@ -167,7 +167,7 @@ class MoreInfoVacuum extends LitElement {
@@ -179,7 +179,7 @@ class MoreInfoVacuum extends LitElement { > ${stateObj.attributes.fan_speed_list!.map( (mode) => html` - + ${mode} ` @@ -216,7 +216,7 @@ class MoreInfoVacuum extends LitElement { private handleFanSpeedChanged(ev: CustomEvent) { const oldVal = this.stateObj!.attributes.fan_speed; - const newVal = ev.detail.item.getAttribute("item-name"); + const newVal = ev.detail.item.itemName; if (!newVal || oldVal === newVal) { return;