From 976fcab1462a870d9c4bee526fee57f676ab61eb Mon Sep 17 00:00:00 2001 From: karwosts <32912880+karwosts@users.noreply.github.com> Date: Mon, 26 Jun 2023 01:02:41 -0700 Subject: [PATCH] Don't apply brightness filter to plant icons (#17029) --- src/common/entity/state_color.ts | 12 ++++++++++++ src/components/entity/state-badge.ts | 8 +++++--- src/panels/lovelace/cards/hui-button-card.ts | 18 +++++------------- src/panels/lovelace/cards/hui-entity-card.ts | 16 +++++----------- src/panels/lovelace/cards/hui-light-card.ts | 4 ++-- 5 files changed, 29 insertions(+), 29 deletions(-) diff --git a/src/common/entity/state_color.ts b/src/common/entity/state_color.ts index efcac098f2..5223076767 100644 --- a/src/common/entity/state_color.ts +++ b/src/common/entity/state_color.ts @@ -110,3 +110,15 @@ export const stateColorProperties = ( return undefined; }; + +export const stateColorBrightness = (stateObj: HassEntity): string => { + if ( + stateObj.attributes.brightness && + computeDomain(stateObj.entity_id) !== "plant" + ) { + // lowest brightness will be around 50% (that's pretty dark) + const brightness = stateObj.attributes.brightness; + return `brightness(${(brightness + 245) / 5}%)`; + } + return ""; +}; diff --git a/src/components/entity/state-badge.ts b/src/components/entity/state-badge.ts index 4fbfcaf853..2b6f936497 100644 --- a/src/components/entity/state-badge.ts +++ b/src/components/entity/state-badge.ts @@ -13,7 +13,10 @@ import { ifDefined } from "lit/directives/if-defined"; import { styleMap } from "lit/directives/style-map"; import { computeDomain } from "../../common/entity/compute_domain"; import { computeStateDomain } from "../../common/entity/compute_state_domain"; -import { stateColorCss } from "../../common/entity/state_color"; +import { + stateColorCss, + stateColorBrightness, +} from "../../common/entity/state_color"; import { iconColorCSS } from "../../common/style/icon_color_css"; import { cameraUrlWithWidthHeight } from "../../data/camera"; import { HVAC_ACTION_TO_MODE } from "../../data/climate"; @@ -153,8 +156,7 @@ export class StateBadge extends LitElement { // eslint-disable-next-line console.warn(errorMessage); } - // lowest brightness will be around 50% (that's pretty dark) - iconStyle.filter = `brightness(${(brightness + 245) / 5}%)`; + iconStyle.filter = stateColorBrightness(stateObj); } if (stateObj.attributes.hvac_action) { const hvacAction = stateObj.attributes.hvac_action; diff --git a/src/panels/lovelace/cards/hui-button-card.ts b/src/panels/lovelace/cards/hui-button-card.ts index b98607fcc2..670e69b0e9 100644 --- a/src/panels/lovelace/cards/hui-button-card.ts +++ b/src/panels/lovelace/cards/hui-button-card.ts @@ -26,7 +26,10 @@ import { computeDomain } from "../../../common/entity/compute_domain"; import { computeStateDisplaySingleEntity } from "../../../common/entity/compute_state_display"; import { computeStateDomain } from "../../../common/entity/compute_state_domain"; import { computeStateName } from "../../../common/entity/compute_state_name"; -import { stateColorCss } from "../../../common/entity/state_color"; +import { + stateColorCss, + stateColorBrightness, +} from "../../../common/entity/state_color"; import { isValidEntityId } from "../../../common/entity/valid_entity_id"; import { iconColorCSS } from "../../../common/style/icon_color_css"; import { LocalizeFunc } from "../../../common/translations/localize"; @@ -41,7 +44,6 @@ import { themesContext, } from "../../../data/context"; import { EntityRegistryDisplayEntry } from "../../../data/entity_registry"; -import { LightEntity } from "../../../data/light"; import { ActionHandlerEvent } from "../../../data/lovelace"; import { FrontendLocaleData } from "../../../data/translation"; import { Themes } from "../../../data/ws-themes"; @@ -213,9 +215,7 @@ export class HuiButtonCard extends LitElement implements LovelaceCard { .state=${stateObj} style=${styleMap({ color: colored ? this._computeColor(stateObj) : undefined, - filter: colored - ? this._computeBrightness(stateObj) - : undefined, + filter: colored ? stateColorBrightness(stateObj) : undefined, height: this._config.icon_height ? this._config.icon_height : "", @@ -337,14 +337,6 @@ export class HuiButtonCard extends LitElement implements LovelaceCard { ]; } - private _computeBrightness(stateObj: HassEntity | LightEntity): string { - if (stateObj.attributes.brightness) { - const brightness = stateObj.attributes.brightness; - return `brightness(${(brightness + 245) / 5}%)`; - } - return ""; - } - private _computeColor(stateObj: HassEntity): string | undefined { if (stateObj.attributes.rgb_color) { return `rgb(${stateObj.attributes.rgb_color.join(",")})`; diff --git a/src/panels/lovelace/cards/hui-entity-card.ts b/src/panels/lovelace/cards/hui-entity-card.ts index 7424877f52..201c4b9dd6 100644 --- a/src/panels/lovelace/cards/hui-entity-card.ts +++ b/src/panels/lovelace/cards/hui-entity-card.ts @@ -16,7 +16,10 @@ import { computeAttributeValueDisplay } from "../../../common/entity/compute_att import { computeStateDisplay } from "../../../common/entity/compute_state_display"; import { computeStateDomain } from "../../../common/entity/compute_state_domain"; import { computeStateName } from "../../../common/entity/compute_state_name"; -import { stateColorCss } from "../../../common/entity/state_color"; +import { + stateColorCss, + stateColorBrightness, +} from "../../../common/entity/state_color"; import { isValidEntityId } from "../../../common/entity/valid_entity_id"; import { formatNumber, @@ -28,7 +31,6 @@ import "../../../components/ha-card"; import "../../../components/ha-icon"; import { HVAC_ACTION_TO_MODE } from "../../../data/climate"; import { isUnavailableState } from "../../../data/entity"; -import { LightEntity } from "../../../data/light"; import { HomeAssistant } from "../../../types"; import { computeCardSize } from "../common/compute-card-size"; import { findEntities } from "../common/find-entities"; @@ -143,7 +145,7 @@ export class HuiEntityCard extends LitElement implements LovelaceCard { data-state=${stateObj.state} style=${styleMap({ color: colored ? this._computeColor(stateObj) : undefined, - filter: colored ? this._computeBrightness(stateObj) : undefined, + filter: colored ? stateColorBrightness(stateObj) : undefined, height: this._config.icon_height ? this._config.icon_height : "", @@ -214,14 +216,6 @@ export class HuiEntityCard extends LitElement implements LovelaceCard { return undefined; } - private _computeBrightness(stateObj: HassEntity | LightEntity): string { - if (stateObj.attributes.brightness) { - const brightness = stateObj.attributes.brightness; - return `brightness(${(brightness + 245) / 5}%)`; - } - return ""; - } - protected shouldUpdate(changedProps: PropertyValues): boolean { // Side Effect used to update footer hass while keeping optimizations if (this._footerElement) { diff --git a/src/panels/lovelace/cards/hui-light-card.ts b/src/panels/lovelace/cards/hui-light-card.ts index 9c2041c7ba..c2715b8007 100644 --- a/src/panels/lovelace/cards/hui-light-card.ts +++ b/src/panels/lovelace/cards/hui-light-card.ts @@ -30,6 +30,7 @@ import { hasConfigOrEntityChanged } from "../common/has-changed"; import { createEntityNotFoundWarning } from "../components/hui-warning"; import { LovelaceCard, LovelaceCardEditor } from "../types"; import { LightCardConfig } from "./types"; +import { stateColorBrightness } from "../../../common/entity/state_color"; @customElement("hui-light-card") export class HuiLightCard extends LitElement implements LovelaceCard { @@ -239,8 +240,7 @@ export class HuiLightCard extends LitElement implements LovelaceCard { if (stateObj.state === "off" || !stateObj.attributes.brightness) { return ""; } - const brightness = stateObj.attributes.brightness; - return `brightness(${(brightness + 245) / 5}%)`; + return stateColorBrightness(stateObj); } private _computeColor(stateObj: LightEntity): string {