Update entities

This commit is contained in:
Zack Arnett 2018-10-19 21:45:47 -04:00
parent 3882a5aa89
commit 772153e58a
2 changed files with 48 additions and 20 deletions

View File

@ -1,5 +1,4 @@
import { html, LitElement, PropertyDeclarations } from "@polymer/lit-element"; import { html, LitElement, PropertyDeclarations } from "@polymer/lit-element";
import { repeat } from "lit-html/directives/repeat";
import "../../../components/ha-card.js"; import "../../../components/ha-card.js";
import "../components/hui-entities-toggle.js"; import "../components/hui-entities-toggle.js";
@ -7,11 +6,11 @@ import "../components/hui-entities-toggle.js";
import { fireEvent } from "../../../common/dom/fire_event.js"; import { fireEvent } from "../../../common/dom/fire_event.js";
import { DOMAINS_HIDE_MORE_INFO } from "../../../common/const.js"; import { DOMAINS_HIDE_MORE_INFO } from "../../../common/const.js";
import { HassLocalizeLitMixin } from "../../../mixins/lit-localize-mixin"; import { HassLocalizeLitMixin } from "../../../mixins/lit-localize-mixin";
import { LovelaceCard, LovelaceConfig } from "../types.js"; import { LovelaceCard, LovelaceConfig, EntityRow } from "../types.js";
import { HomeAssistant } from "../../../types.js";
import createRowElement from "../common/create-row-element.js"; import createRowElement from "../common/create-row-element.js";
import computeDomain from "../../../common/entity/compute_domain.js"; import computeDomain from "../../../common/entity/compute_domain.js";
import processConfigEntities from "../common/process-config-entities"; import processConfigEntities from "../common/process-config-entities";
import { HomeAssistant } from "../../../types.js";
interface EntityConfig { interface EntityConfig {
name?: string; name?: string;
@ -37,6 +36,28 @@ class HuiEntitiesCard extends HassLocalizeLitMixin(LitElement)
protected config?: Config; protected config?: Config;
protected configEntities?: EntityConfig[]; protected configEntities?: EntityConfig[];
// set hass(hass) {
// console.log("here");
// this._hass = hass;
// console.log(this.shadowRoot);
// console.log(
// this.shadowRoot && this.shadowRoot.querySelector("ha-card")
// ? this.shadowRoot
// .querySelector("ha-card")!
// .querySelectorAll("#states > div > *")
// : ""
// );
// if (this.shadowRoot && this.shadowRoot.querySelector("ha-card")) {
// this.shadowRoot
// .querySelector("ha-card")!
// .querySelectorAll("#states > div > *")
// .forEach((element: any) => {
// element.hass = hass;
// });
// }
// }
static get properties(): PropertyDeclarations { static get properties(): PropertyDeclarations {
return { return {
hass: {}, hass: {},
@ -45,14 +66,16 @@ class HuiEntitiesCard extends HassLocalizeLitMixin(LitElement)
} }
public getCardSize() { public getCardSize() {
// +1 for the header
if (!this.config) { if (!this.config) {
return 0; return 0;
} }
return this.config.title ? 1 : 0 + this.config.entities.length; // +1 for the header
return (this.config.title ? 1 : 0) + this.config.entities.length;
} }
public setConfig(config: Config) { public setConfig(config: Config) {
console.log(config);
const entities = processConfigEntities(config.entities); const entities = processConfigEntities(config.entities);
for (const entity of entities) { for (const entity of entities) {
if ( if (
@ -74,10 +97,6 @@ class HuiEntitiesCard extends HassLocalizeLitMixin(LitElement)
this.config = config; this.config = config;
this.configEntities = entities; this.configEntities = entities;
if (this.hass) {
this.requestUpdate();
}
} }
protected render() { protected render() {
@ -86,8 +105,6 @@ class HuiEntitiesCard extends HassLocalizeLitMixin(LitElement)
} }
const { show_header_toggle, title } = this.config; const { show_header_toggle, title } = this.config;
const entities = this.configEntities!.map((conf) => conf.entity);
return html` return html`
${this.renderStyle()} ${this.renderStyle()}
<ha-card> <ha-card>
@ -96,24 +113,24 @@ class HuiEntitiesCard extends HassLocalizeLitMixin(LitElement)
? html`` ? html``
: html` : html`
<div class='header'> <div class='header'>
${!title ? html`` : html`<div class="name">${title}</div>`} <div class="name">${title}</div>
${ ${
show_header_toggle === false show_header_toggle === false
? html`` ? html``
: html` : html`
<hui-entities-toggle <hui-entities-toggle
.hass="${this.hass}" .hass="${this.hass}"
.entities="${entities}" .entities="${this.configEntities!.map(
(conf) => conf.entity
)}"
> >
</hui-entities-toggle>` </hui-entities-toggle>`
} }
</div>` </div>`
} }
<div id="states"> <div id="states">
${repeat<EntityConfig>( ${this.configEntities!.map((entityConf) =>
this.configEntities!, this.renderEntity(entityConf)
(entityConf) => entityConf.entity,
(entityConf) => this.renderEntity(entityConf)
)} )}
</div> </div>
</ha-card> </ha-card>

View File

@ -1,4 +1,4 @@
import { HomeAssistant } from "../../types.js"; import { HomeAssistant } from "../../types";
export interface LovelaceConfig { export interface LovelaceConfig {
type: string; type: string;
@ -9,3 +9,14 @@ export interface LovelaceCard extends HTMLElement {
getCardSize(): number; getCardSize(): number;
setConfig(config: LovelaceConfig): void; setConfig(config: LovelaceConfig): void;
} }
export interface EntityConfig {
entity: string;
name: string;
icon: string;
}
export interface EntityRow {
hass: HomeAssistant;
config: EntityConfig;
}