add show_icon to glance-card (#2903)

*  add `show_icon` to glance-card

* lint/error
This commit is contained in:
Ian Richardson 2019-03-11 14:09:32 -05:00 committed by Paulus Schoutsen
parent 86548052e5
commit ec04c80413
3 changed files with 42 additions and 17 deletions

View File

@ -32,9 +32,10 @@ export interface ConfigEntity extends EntityConfig {
hold_action?: ActionConfig;
}
export interface Config extends LovelaceCardConfig {
export interface GlanceCardConfig extends LovelaceCardConfig {
show_name?: boolean;
show_state?: boolean;
show_icon?: boolean;
title?: string;
theme?: string;
entities: ConfigEntity[];
@ -47,13 +48,14 @@ export class HuiGlanceCard extends LitElement implements LovelaceCard {
await import(/* webpackChunkName: "hui-glance-card-editor" */ "../editor/config-elements/hui-glance-card-editor");
return document.createElement("hui-glance-card-editor");
}
public static getStubConfig(): object {
return { entities: [] };
}
@property() public hass?: HomeAssistant;
@property() private _config?: Config;
@property() private _config?: GlanceCardConfig;
private _configEntities?: ConfigEntity[];
@ -64,7 +66,7 @@ export class HuiGlanceCard extends LitElement implements LovelaceCard {
);
}
public setConfig(config: Config): void {
public setConfig(config: GlanceCardConfig): void {
this._config = { theme: "default", ...config };
const entities = processConfigEntities<ConfigEntity>(config.entities);
@ -209,10 +211,14 @@ export class HuiGlanceCard extends LitElement implements LovelaceCard {
</div>
`
: ""}
<state-badge
.stateObj="${stateObj}"
.overrideIcon="${entityConf.icon}"
></state-badge>
${this._config!.show_icon !== false
? html`
<state-badge
.stateObj="${stateObj}"
.overrideIcon="${entityConf.icon}"
></state-badge>
`
: ""}
${this._config!.show_state !== false
? html`
<div>
@ -228,12 +234,12 @@ export class HuiGlanceCard extends LitElement implements LovelaceCard {
`;
}
private _handleTap(ev: MouseEvent) {
private _handleTap(ev: MouseEvent): void {
const config = (ev.currentTarget as any).entityConf as ConfigEntity;
handleClick(this, this.hass!, config, false);
}
private _handleHold(ev: MouseEvent) {
private _handleHold(ev: MouseEvent): void {
const config = (ev.currentTarget as any).entityConf as ConfigEntity;
handleClick(this, this.hass!, config, true);
}

View File

@ -16,7 +16,7 @@ import { EntitiesEditorEvent, EditorTarget } from "../types";
import { HomeAssistant } from "../../../../types";
import { LovelaceCardEditor } from "../../types";
import { fireEvent } from "../../../../common/dom/fire_event";
import { Config, ConfigEntity } from "../../cards/hui-glance-card";
import { GlanceCardConfig, ConfigEntity } from "../../cards/hui-glance-card";
import { configElementStyle } from "./config-elements-style";
import "../../../../components/entity/state-badge";
@ -41,6 +41,7 @@ const cardConfigStruct = struct({
columns: "number?",
show_name: "boolean?",
show_state: "boolean?",
show_icon: "boolean?",
entities: [entitiesConfigStruct],
});
@ -49,11 +50,11 @@ export class HuiGlanceCardEditor extends LitElement
implements LovelaceCardEditor {
@property() public hass?: HomeAssistant;
@property() private _config?: Config;
@property() private _config?: GlanceCardConfig;
@property() private _configEntities?: ConfigEntity[];
public setConfig(config: Config): void {
public setConfig(config: GlanceCardConfig): void {
config = cardConfigStruct(config);
this._config = config;
this._configEntities = processEditorEntities(config.entities);
@ -71,6 +72,18 @@ export class HuiGlanceCardEditor extends LitElement
return this._config!.columns || NaN;
}
get _show_name(): boolean {
return this._config!.show_name || true;
}
get _show_icon(): boolean {
return this._config!.show_icon || true;
}
get _show_state(): boolean {
return this._config!.show_state || true;
}
protected render(): TemplateResult | void {
if (!this.hass) {
return html``;
@ -102,16 +115,22 @@ export class HuiGlanceCardEditor extends LitElement
</div>
<div class="side-by-side">
<paper-toggle-button
?checked="${this._config!.show_name !== false}"
?checked="${this._show_name !== false}"
.configValue="${"show_name"}"
@change="${this._valueChanged}"
>Show Entity's Name?</paper-toggle-button
>Show Name?</paper-toggle-button
>
<paper-toggle-button
?checked="${this._config!.show_state !== false}"
?checked="${this._show_icon !== false}"
.configValue="${"show_icon"}"
@change="${this._valueChanged}"
>Show Icon?</paper-toggle-button
>
<paper-toggle-button
?checked="${this._show_state !== false}"
.configValue="${"show_state"}"
@change="${this._valueChanged}"
>Show Entity's State Text?</paper-toggle-button
>Show State?</paper-toggle-button
>
</div>
</div>

View File

@ -13,7 +13,7 @@ import { EntitiesEditorEvent, EditorTarget } from "../types";
import { HomeAssistant } from "../../../../types";
import { LovelaceCardEditor } from "../../types";
import { fireEvent } from "../../../../common/dom/fire_event";
import { Config } from "../../cards/hui-glance-card";
import { Config } from "../../cards/hui-markdown-card";
import { configElementStyle } from "./config-elements-style";
const cardConfigStruct = struct({