From 70ee05168f066e6082ea23f53a4dd7bb2063dc91 Mon Sep 17 00:00:00 2001 From: Dermot Duffy Date: Thu, 17 Feb 2022 19:34:12 -0800 Subject: [PATCH 1/3] Create a means of re-rendering the card based on external state. --- README.md | 1 + src/card.ts | 27 ++++++++++++++++++++++----- src/common.ts | 5 +---- src/components/elements.ts | 17 ++++------------- src/types.ts | 1 + 5 files changed, 29 insertions(+), 22 deletions(-) diff --git a/README.md b/README.md index 56cd4134..299a5ade 100644 --- a/README.md +++ b/README.md @@ -155,6 +155,7 @@ view: | `update_seconds` | `0` | :heavy_multiplication_x: | A number of seconds after which to automatically update/refresh the default view. See [card updates](#card-updates) below for behavior and usecases. If the default view occurs sooner (e.g. manually) the timer will start over. `0` disables this functionality.| | `update_force` | `false` | :heavy_multiplication_x: | Whether automated card updates/refreshes should ignore user interaction. See [card updates](#card-updates) below for behavior and usecases.| | `update_entities` | | :heavy_multiplication_x: | **YAML only**: A list of entity ids that should cause the view to reset to the default. See [card updates](#card-updates) below for behavior and usecases.| +| `render_entities` | | :heavy_multiplication_x: | **YAML only**: A list of entity ids that should cause the card to re-render 'in-place'. The view/camera is not changed. This should **very** rarely be needed, but could be useful if the card is both setting and changing HA state of the same object as could be the case for some complex `card_mod` scenarios ([example](https://github.com/dermotduffy/frigate-hass-card/issues/343)). | | `update_cycle_camera` | `false` | :heavy_multiplication_x: | When set to `true` the selected camera is cycled on each default view change. | | `actions` | | :heavy_multiplication_x: | Actions to use for all views, individual actions may be overriden by view-specific actions. See [actions](#actions) below.| ### Menu Options diff --git a/src/card.ts b/src/card.ts index 2f6e3919..73d133a8 100644 --- a/src/card.ts +++ b/src/card.ts @@ -436,7 +436,10 @@ export class FrigateCard extends LitElement { } const id = - config.id || config.camera_entity || config.webrtc_card?.entity || config.camera_name; + config.id || + config.camera_entity || + config.webrtc_card?.entity || + config.camera_name; if (!id) { this._setMessageAndUpdate({ @@ -674,16 +677,17 @@ export class FrigateCard extends LitElement { this._changeView({ view: e.detail }); } + protected updated(changedProps: PropertyValues): void { + super.updated(changedProps); + console.info('master updated'); + } + /** * Determine whether the card should be updated. * @param changedProps The changed properties if any. * @returns True if the card should be updated. */ protected shouldUpdate(changedProps: PropertyValues): boolean { - if (changedProps.size > 1) { - return true; - } - const oldHass = changedProps.get('_hass') as HomeAssistant | undefined; if (oldHass) { // Home Assistant pumps a lot of updates through. Re-rendering the card is @@ -705,6 +709,14 @@ export class FrigateCard extends LitElement { // itself will not trigger an *additional* re-render here. this._changeView(); return true; + } else if ( + shouldUpdateBasedOnHass( + this._hass, + oldHass, + this._getConfig().view.render_entities || [], + ) + ) { + return true; } return false; } @@ -1121,6 +1133,10 @@ export class FrigateCard extends LitElement { * Master render method for the card. */ protected render(): TemplateResult | void { + if (!this._hass) { + return; + } + const padding = this._getAspectRatioPadding(); const outerStyle = {}; @@ -1146,6 +1162,7 @@ export class FrigateCard extends LitElement { @frigate-card:message=${this._messageHandler} @frigate-card:change-view=${this._changeViewHandler} @frigate-card:media-show=${this._mediaShowHandler} + @frigate-card:render=${() => this.requestUpdate()} > ${this._getConfig().menu.mode == 'above' ? this._renderMenu() : ''}
diff --git a/src/common.ts b/src/common.ts index 35efece0..0908c362 100644 --- a/src/common.ts +++ b/src/common.ts @@ -222,10 +222,7 @@ export function shouldUpdateBasedOnHass( oldHass: HomeAssistant | undefined | null, entities: string[] | null, ): boolean { - if (!newHass || !entities) { - return false; - } - if (!entities.length) { + if (!newHass || !entities || !entities.length) { return false; } diff --git a/src/components/elements.ts b/src/components/elements.ts index 7d336989..9915a931 100644 --- a/src/components/elements.ts +++ b/src/components/elements.ts @@ -136,27 +136,18 @@ class FrigateCardElementsCore extends LitElement { */ @customElement('frigate-card-elements') export class FrigateCardElements extends LitElement { + @property({ attribute: false }) + public hass?: HomeAssistant & ExtendedHomeAssistant; + @property({ attribute: false }) protected elements: PictureElements; @property({ attribute: false }) protected conditionState?: ConditionState; - protected _hass?: HomeAssistant & ExtendedHomeAssistant; - @query('frigate-card-elements-core') _core!: FrigateCardElementsCore; - /** - * Set the Home Assistant object. - */ - set hass(hass: HomeAssistant & ExtendedHomeAssistant) { - if (this._core) { - this._core.hass = hass; - } - this._hass = hass; - } - /** * Handle a picture element to be removed from the menu. * @param ev The event. @@ -221,7 +212,7 @@ export class FrigateCardElements extends LitElement { */ protected render(): TemplateResult { return html` diff --git a/src/types.ts b/src/types.ts index 1aea91e3..f37a03f9 100644 --- a/src/types.ts +++ b/src/types.ts @@ -396,6 +396,7 @@ const viewConfigSchema = z update_force: z.boolean().default(viewConfigDefault.update_force), update_cycle_camera: z.boolean().default(viewConfigDefault.update_cycle_camera), update_entities: z.string().array().optional(), + render_entities: z.string().array().optional(), }) .merge(actionsSchema) .default(viewConfigDefault); From 50a9c43c06482b902dda3e7c41e8a11aac9ee1b4 Mon Sep 17 00:00:00 2001 From: Dermot Duffy Date: Thu, 17 Feb 2022 19:43:26 -0800 Subject: [PATCH 2/3] README clarification. --- README.md | 2 +- 1 file changed, 1 insertion(+), 1 deletion(-) diff --git a/README.md b/README.md index 299a5ade..c3061ca9 100644 --- a/README.md +++ b/README.md @@ -155,8 +155,8 @@ view: | `update_seconds` | `0` | :heavy_multiplication_x: | A number of seconds after which to automatically update/refresh the default view. See [card updates](#card-updates) below for behavior and usecases. If the default view occurs sooner (e.g. manually) the timer will start over. `0` disables this functionality.| | `update_force` | `false` | :heavy_multiplication_x: | Whether automated card updates/refreshes should ignore user interaction. See [card updates](#card-updates) below for behavior and usecases.| | `update_entities` | | :heavy_multiplication_x: | **YAML only**: A list of entity ids that should cause the view to reset to the default. See [card updates](#card-updates) below for behavior and usecases.| -| `render_entities` | | :heavy_multiplication_x: | **YAML only**: A list of entity ids that should cause the card to re-render 'in-place'. The view/camera is not changed. This should **very** rarely be needed, but could be useful if the card is both setting and changing HA state of the same object as could be the case for some complex `card_mod` scenarios ([example](https://github.com/dermotduffy/frigate-hass-card/issues/343)). | | `update_cycle_camera` | `false` | :heavy_multiplication_x: | When set to `true` the selected camera is cycled on each default view change. | +| `render_entities` | | :heavy_multiplication_x: | **YAML only**: A list of entity ids that should cause the card to re-render 'in-place'. The view/camera is not changed. `update_*` flags to not pertain/relate to the behavior of this flag. This should **very** rarely be needed, but could be useful if the card is both setting and changing HA state of the same object as could be the case for some complex `card_mod` scenarios ([example](https://github.com/dermotduffy/frigate-hass-card/issues/343)). | | `actions` | | :heavy_multiplication_x: | Actions to use for all views, individual actions may be overriden by view-specific actions. See [actions](#actions) below.| ### Menu Options From 34172f834a614551ac27b8e5215855d50116b771 Mon Sep 17 00:00:00 2001 From: Dermot Duffy Date: Sat, 19 Feb 2022 11:09:26 -0800 Subject: [PATCH 3/3] Remove unnecessary code --- src/card.ts | 5 ----- 1 file changed, 5 deletions(-) diff --git a/src/card.ts b/src/card.ts index 73d133a8..251a01ff 100644 --- a/src/card.ts +++ b/src/card.ts @@ -677,11 +677,6 @@ export class FrigateCard extends LitElement { this._changeView({ view: e.detail }); } - protected updated(changedProps: PropertyValues): void { - super.updated(changedProps); - console.info('master updated'); - } - /** * Determine whether the card should be updated. * @param changedProps The changed properties if any.