-
Notifications
You must be signed in to change notification settings - Fork 15
Commit
This commit does not belong to any branch on this repository, and may belong to a fork outside of the repository.
v1.15: Fix layout on new HA: use local hui-generic-entity-row
- Loading branch information
Showing
7 changed files
with
158 additions
and
14 deletions.
There are no files selected for viewing
This file contains bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
This file contains bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
This file contains bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
| Original file line number | Diff line number | Diff line change |
|---|---|---|
| @@ -0,0 +1,58 @@ | ||
| /* Minimum code from Home Assistant to create the action handler used in hui-generic-entity-row. */ | ||
|
|
||
| import { noChange } from "lit"; | ||
| import { | ||
| AttributePart, | ||
| directive, | ||
| Directive, | ||
| DirectiveParameters, | ||
| } from "lit/directive.js"; | ||
|
|
||
| interface ActionHandler extends HTMLElement { | ||
| holdTime: number; | ||
| bind(element: Element, options?: ActionHandlerOptions): void; | ||
| } | ||
| interface ActionHandlerElement extends HTMLElement { | ||
| actionHandler?: { | ||
| options: ActionHandlerOptions; | ||
| start?: (ev: Event) => void; | ||
| end?: (ev: Event) => void; | ||
| handleEnter?: (ev: KeyboardEvent) => void; | ||
| }; | ||
| } | ||
|
|
||
| type ActionHandlerOptions = any; | ||
|
|
||
| const getActionHandler = (): ActionHandler => { | ||
| const body = document.body; | ||
| if (body.querySelector("action-handler")) { | ||
| return body.querySelector("action-handler") as ActionHandler; | ||
| } | ||
|
|
||
| const actionhandler = document.createElement("action-handler"); | ||
| body.appendChild(actionhandler); | ||
|
|
||
| return actionhandler as ActionHandler; | ||
| }; | ||
|
|
||
| export const actionHandlerBind = ( | ||
| element: ActionHandlerElement, | ||
| options?: ActionHandlerOptions | ||
| ) => { | ||
| const actionhandler: ActionHandler = getActionHandler(); | ||
| if (!actionhandler) { | ||
| return; | ||
| } | ||
| actionhandler.bind(element, options); | ||
| }; | ||
|
|
||
| export const actionHandler = directive( | ||
| class extends Directive { | ||
| update(part: AttributePart, [options]: DirectiveParameters<this>) { | ||
| actionHandlerBind(part.element as ActionHandlerElement, options); | ||
| return noChange; | ||
| } | ||
|
|
||
| render(_options?: ActionHandlerOptions) {} | ||
| } | ||
| ); |
This file contains bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
| Original file line number | Diff line number | Diff line change |
|---|---|---|
| @@ -0,0 +1,79 @@ | ||
| /* Simplified version of the hui-generic-entity-row. | ||
| * This element acts as a stable base to create the timer entity row. | ||
| */ | ||
|
|
||
| import { css, html, TemplateResult } from "lit"; | ||
| import { ActionHandlerEvent, HomeAssistant, handleAction, hasAction } from "custom-card-helpers"; | ||
| import { actionHandler } from "./ha-action-handler-directive"; | ||
| import { TimerBarEntityConfig } from "./types"; | ||
|
|
||
| const computeObjectId = (entityId: string): string => | ||
| entityId.substr(entityId.indexOf(".") + 1); | ||
|
|
||
| const computeStateName = (stateObj: any): string => | ||
| stateObj.attributes.friendly_name === undefined | ||
| ? computeObjectId(stateObj.entity_id).replace(/_/g, " ") | ||
| : stateObj.attributes.friendly_name || ""; | ||
|
|
||
| export function genericEntityRow(children: TemplateResult, hass?: HomeAssistant, config?: TimerBarEntityConfig): TemplateResult { | ||
| if (!hass || !config) return html``; | ||
| const stateObj = config.entity ? hass.states[config.entity] : undefined; | ||
| if (!stateObj) return html`<hui-warning>Entity ${config.entity} not found</hui-warning>`; | ||
|
|
||
| const name = config.name || computeStateName(stateObj); | ||
|
|
||
| const _handleAction = (ev: ActionHandlerEvent) => { | ||
| handleAction(ev.target as any, hass!, config!, ev.detail.action!); | ||
| } | ||
|
|
||
| return html`<div class="generic-entity-row"> | ||
| <state-badge | ||
| class="pointer" | ||
| .hass=${hass} | ||
| .stateObj=${stateObj} | ||
| .overrideIcon=${config.icon} | ||
| .overrideImage=${config.image} | ||
| .stateColor=${config.state_color} | ||
| @action=${_handleAction} | ||
| .actionHandler=${actionHandler({ | ||
| hasHold: hasAction(config!.hold_action), | ||
| hasDoubleClick: hasAction(config!.double_tap_action), | ||
| })} | ||
| tabindex="0" | ||
| ></state-badge> | ||
| <div | ||
| class="info pointer" | ||
| @action=${_handleAction} | ||
| .actionHandler=${actionHandler({ | ||
| hasHold: hasAction(config!.hold_action), | ||
| hasDoubleClick: hasAction(config!.double_tap_action), | ||
| })} | ||
| .title=${name} | ||
| > | ||
| ${name} | ||
| </div> | ||
| ${children} | ||
| </div>`; | ||
| } | ||
|
|
||
| export const genericEntityRowStyles = css` | ||
| .generic-entity-row { | ||
| display: flex; | ||
| align-items: center; | ||
| flex-direction: row; | ||
| } | ||
| .info { | ||
| margin-left: 16px; | ||
| margin-right: 8px; | ||
| flex: 1 1 30%; | ||
| } | ||
| .info, | ||
| .info > * { | ||
| white-space: nowrap; | ||
| overflow: hidden; | ||
| text-overflow: ellipsis; | ||
| } | ||
| state-badge { | ||
| flex: 0 0 40px; | ||
| } | ||
| `; |
This file contains bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
This file contains bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
This file contains bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters