add actions to picture-glance entities (#3807)

* add actions to picture-glance

* remove unnecessary entity property

* Update hui-picture-glance-card.ts
This commit is contained in:
Ian Richardson 2019-10-02 04:22:33 -05:00 committed by Bram Kragten
parent ea50d486da
commit fa74295c0b

View File

@ -22,14 +22,11 @@ import "../components/hui-warning-element";
import { computeStateDisplay } from "../../../common/entity/compute_state_display"; import { computeStateDisplay } from "../../../common/entity/compute_state_display";
import { DOMAINS_TOGGLE } from "../../../common/const"; import { DOMAINS_TOGGLE } from "../../../common/const";
import { LovelaceCard, LovelaceCardEditor } from "../types"; import { LovelaceCard, LovelaceCardEditor } from "../types";
import { EntityConfig } from "../entity-rows/types";
import { HomeAssistant } from "../../../types"; import { HomeAssistant } from "../../../types";
import { longPress } from "../common/directives/long-press-directive"; import { longPress } from "../common/directives/long-press-directive";
import { processConfigEntities } from "../common/process-config-entities"; import { processConfigEntities } from "../common/process-config-entities";
import { handleClick } from "../common/handle-click"; import { handleClick } from "../common/handle-click";
import { fireEvent } from "../../../common/dom/fire_event"; import { PictureGlanceCardConfig, ConfigEntity } from "./types";
import { toggleEntity } from "../common/entity/toggle-entity";
import { PictureGlanceCardConfig } from "./types";
const STATES_OFF = new Set(["closed", "locked", "not_home", "off"]); const STATES_OFF = new Set(["closed", "locked", "not_home", "off"]);
@ -51,9 +48,9 @@ class HuiPictureGlanceCard extends LitElement implements LovelaceCard {
@property() private _config?: PictureGlanceCardConfig; @property() private _config?: PictureGlanceCardConfig;
private _entitiesDialog?: EntityConfig[]; private _entitiesDialog?: ConfigEntity[];
private _entitiesToggle?: EntityConfig[]; private _entitiesToggle?: ConfigEntity[];
public getCardSize(): number { public getCardSize(): number {
return 3; return 3;
@ -129,16 +126,17 @@ class HuiPictureGlanceCard extends LitElement implements LovelaceCard {
return html` return html`
<ha-card> <ha-card>
<hui-image <hui-image
class="${classMap({ class=${classMap({
clickable: Boolean( clickable: Boolean(
this._config.tap_action || this._config.tap_action ||
this._config.hold_action || this._config.hold_action ||
this._config.camera_image this._config.camera_image
), ),
})}" })}
@ha-click=${this._handleTap} @ha-click=${this._handleTap}
@ha-hold=${this._handleHold} @ha-hold=${this._handleHold}
.longPress=${longPress()} .longPress=${longPress()}
.config=${this._config}
.hass=${this.hass} .hass=${this.hass}
.image=${this._config.image} .image=${this._config.image}
.stateImage=${this._config.state_image} .stateImage=${this._config.state_image}
@ -170,11 +168,16 @@ class HuiPictureGlanceCard extends LitElement implements LovelaceCard {
} }
private renderEntity( private renderEntity(
entityConf: EntityConfig, entityConf: ConfigEntity,
dialog: boolean dialog: boolean
): TemplateResult { ): TemplateResult {
const stateObj = this.hass!.states[entityConf.entity]; const stateObj = this.hass!.states[entityConf.entity];
entityConf = {
tap_action: { action: dialog ? "more-info" : "toggle" },
...entityConf,
};
if (!stateObj) { if (!stateObj) {
return html` return html`
<hui-warning-element <hui-warning-element
@ -189,8 +192,10 @@ class HuiPictureGlanceCard extends LitElement implements LovelaceCard {
return html` return html`
<ha-icon <ha-icon
.entity="${stateObj.entity_id}" @ha-click=${this._handleTap}
@click="${dialog ? this._openDialog : this._callService}" @ha-hold=${this._handleHold}
.longPress=${longPress()}
.config=${entityConf}
class="${classMap({ class="${classMap({
"state-on": !STATES_OFF.has(stateObj.state), "state-on": !STATES_OFF.has(stateObj.state),
})}" })}"
@ -206,20 +211,14 @@ class HuiPictureGlanceCard extends LitElement implements LovelaceCard {
`; `;
} }
private _handleTap() { private _handleTap(ev: MouseEvent): void {
handleClick(this, this.hass!, this._config!, false); const config = (ev.currentTarget as any).config as any;
handleClick(this, this.hass!, config, false);
} }
private _handleHold() { private _handleHold(ev: MouseEvent): void {
handleClick(this, this.hass!, this._config!, true); const config = (ev.currentTarget as any).config as any;
} handleClick(this, this.hass!, config, true);
private _openDialog(ev: MouseEvent): void {
fireEvent(this, "hass-more-info", { entityId: (ev.target as any).entity });
}
private _callService(ev: MouseEvent): void {
toggleEntity(this.hass!, (ev.target as any).entity);
} }
static get styles(): CSSResult { static get styles(): CSSResult {