diff --git a/src/panels/lovelace/cards/hui-entities-card.ts b/src/panels/lovelace/cards/hui-entities-card.ts index ce5a2df85b12..3b7d1de39ee3 100644 --- a/src/panels/lovelace/cards/hui-entities-card.ts +++ b/src/panels/lovelace/cards/hui-entities-card.ts @@ -12,16 +12,12 @@ import { import "../../../components/ha-card"; import "../components/hui-entities-toggle"; -import { fireEvent } from "../../../common/dom/fire_event"; -import { DOMAINS_HIDE_MORE_INFO } from "../../../common/const"; import { HomeAssistant } from "../../../types"; import { EntityRow } from "../entity-rows/types"; import { LovelaceCard, LovelaceCardEditor } from "../types"; import { processConfigEntities } from "../common/process-config-entities"; import { createRowElement } from "../common/create-row-element"; import { EntitiesCardConfig, EntitiesCardEntityConfig } from "./types"; - -import { computeDomain } from "../../../common/entity/compute_domain"; import { applyThemesOnElement } from "../../../common/dom/apply_themes_on_element"; @customElement("hui-entities-card") @@ -161,10 +157,6 @@ class HuiEntitiesCard extends LitElement implements LovelaceCard { overflow: hidden; } - .state-card-dialog { - cursor: pointer; - } - .icon { padding: 0px 18px 0px 8px; } @@ -176,23 +168,11 @@ class HuiEntitiesCard extends LitElement implements LovelaceCard { if (this._hass) { element.hass = this._hass; } - if ( - entityConf.entity && - !DOMAINS_HIDE_MORE_INFO.includes(computeDomain(entityConf.entity)) - ) { - element.classList.add("state-card-dialog"); - element.addEventListener("click", () => this._handleClick(entityConf)); - } return html`
${element}
`; } - - private _handleClick(entityConf: EntitiesCardEntityConfig): void { - const entityId = entityConf.entity; - fireEvent(this, "hass-more-info", { entityId }); - } } declare global { diff --git a/src/panels/lovelace/cards/types.ts b/src/panels/lovelace/cards/types.ts index 7b0d74c5e5f0..95f84d030e23 100644 --- a/src/panels/lovelace/cards/types.ts +++ b/src/panels/lovelace/cards/types.ts @@ -28,6 +28,9 @@ export interface EntitiesCardEntityConfig extends EntityConfig { service?: string; service_data?: object; url?: string; + tap_action?: ActionConfig; + hold_action?: ActionConfig; + double_tap_action?: ActionConfig; } export interface EntitiesCardConfig extends LovelaceCardConfig { diff --git a/src/panels/lovelace/common/directives/long-press-directive.ts b/src/panels/lovelace/common/directives/long-press-directive.ts index b4402add08a0..832721068b56 100644 --- a/src/panels/lovelace/common/directives/long-press-directive.ts +++ b/src/panels/lovelace/common/directives/long-press-directive.ts @@ -138,9 +138,16 @@ class LongPress extends HTMLElement implements LongPress { window.setTimeout(() => (this.cooldownEnd = false), 100); }; + const handleEnter = (ev: Event) => { + if ((ev as KeyboardEvent).keyCode === 13) { + return clickEnd(ev); + } + }; + element.addEventListener("touchstart", clickStart, { passive: true }); element.addEventListener("touchend", clickEnd); element.addEventListener("touchcancel", clickEnd); + element.addEventListener("keyup", handleEnter); // iOS 13 sends a complete normal touchstart-touchend series of events followed by a mousedown-click series. // That might be a bug, but until it's fixed, this should make long-press work. diff --git a/src/panels/lovelace/components/hui-generic-entity-row.ts b/src/panels/lovelace/components/hui-generic-entity-row.ts index 9ec024dc0f07..c710b1acb3c9 100644 --- a/src/panels/lovelace/components/hui-generic-entity-row.ts +++ b/src/panels/lovelace/components/hui-generic-entity-row.ts @@ -16,8 +16,14 @@ import "../components/hui-warning"; import { HomeAssistant } from "../../../types"; import { computeRTL } from "../../../common/util/compute_rtl"; -import { EntitiesCardEntityConfig } from "../cards/types"; import { toggleAttribute } from "../../../common/dom/toggle_attribute"; +import { longPress } from "../common/directives/long-press-directive"; +import { hasDoubleClick } from "../common/has-double-click"; +import { handleClick } from "../common/handle-click"; +import { DOMAINS_HIDE_MORE_INFO } from "../../../common/const"; +import { computeDomain } from "../../../common/entity/compute_domain"; +import { classMap } from "lit-html/directives/class-map"; +import { EntitiesCardEntityConfig } from "../cards/types"; class HuiGenericEntityRow extends LitElement { @property() public hass?: HomeAssistant; @@ -46,15 +52,45 @@ class HuiGenericEntityRow extends LitElement { `; } + const pointer = + (this.config.tap_action && this.config.tap_action.action !== "none") || + (this.config.entity && + !DOMAINS_HIDE_MORE_INFO.includes(computeDomain(this.config.entity))); + return html`
-
+
${this.config.name || computeStateName(stateObj)}
${!this.showSecondary @@ -86,6 +122,18 @@ class HuiGenericEntityRow extends LitElement { } } + private _handleClick(): void { + handleClick(this, this.hass!, this.config!, false, false); + } + + private _handleHold(): void { + handleClick(this, this.hass!, this.config!, true, false); + } + + private _handleDblClick(): void { + handleClick(this, this.hass!, this.config!, false, true); + } + static get styles(): CSSResult { return css` :host { @@ -132,6 +180,15 @@ class HuiGenericEntityRow extends LitElement { margin-left: 0; margin-right: 8px; } + .pointer { + cursor: pointer; + } + .padName { + padding: 12px 0px; + } + .padSecondary { + padding: 4px 0px; + } `; } } diff --git a/src/panels/lovelace/entity-rows/hui-input-select-entity-row.ts b/src/panels/lovelace/entity-rows/hui-input-select-entity-row.ts index 12abfa60ad0f..e116c6e0d530 100644 --- a/src/panels/lovelace/entity-rows/hui-input-select-entity-row.ts +++ b/src/panels/lovelace/entity-rows/hui-input-select-entity-row.ts @@ -18,19 +18,26 @@ import "../components/hui-warning"; import { computeStateName } from "../../../common/entity/compute_state_name"; import { HomeAssistant, InputSelectEntity } from "../../../types"; -import { EntityRow, EntityConfig } from "./types"; +import { EntityRow } from "./types"; import { setInputSelectOption } from "../../../data/input-select"; import { hasConfigOrEntityChanged } from "../common/has-changed"; import { forwardHaptic } from "../../../data/haptics"; import { stopPropagation } from "../../../common/dom/stop_propagation"; +import { longPress } from "../common/directives/long-press-directive"; +import { hasDoubleClick } from "../common/has-double-click"; +import { handleClick } from "../common/handle-click"; +import { classMap } from "lit-html/directives/class-map"; +import { DOMAINS_HIDE_MORE_INFO } from "../../../common/const"; +import { computeDomain } from "../../../common/entity/compute_domain"; +import { EntitiesCardEntityConfig } from "../cards/types"; @customElement("hui-input-select-entity-row") class HuiInputSelectEntityRow extends LitElement implements EntityRow { @property() public hass?: HomeAssistant; - @property() private _config?: EntityConfig; + @property() private _config?: EntitiesCardEntityConfig; - public setConfig(config: EntityConfig): void { + public setConfig(config: EntitiesCardEntityConfig): void { if (!config || !config.entity) { throw new Error("Invalid Configuration: 'entity' required"); } @@ -63,8 +70,25 @@ class HuiInputSelectEntityRow extends LitElement implements EntityRow { `; } + const pointer = + (this._config.tap_action && this._config.tap_action.action !== "none") || + (this._config.entity && + !DOMAINS_HIDE_MORE_INFO.includes(computeDomain(this._config.entity))); + return html` - +