jeans/frontend
jeans/frontend
1
0
Fork 0
mirror of https://github.com/home-assistant/frontend.git synced 2025-07-24 09:46:36 +00:00
Code Issues Packages Projects Releases Wiki Activity

Improve cover entity definition (#13750)

Browse Source
This commit is contained in:
Paul Bottein 2022-09-15 12:31:36 +02:00 committed by GitHub
parent ea319d55ef
commit 81b21f874b
No known key found for this signature in database
GPG Key ID: 4AEE18F83AFDEB23
6 changed files with 124 additions and 123 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

121
gallery/src/pages/more-info/cover.ts
View File

@ -1,16 +1,7 @@
import { html, LitElement, PropertyValues, TemplateResult } from "lit";
import { customElement, property, query } from "lit/decorators";
import "../../../../src/components/ha-card";
import {
SUPPORT_OPEN,
SUPPORT_STOP,
SUPPORT_CLOSE,
SUPPORT_SET_POSITION,
SUPPORT_OPEN_TILT,
SUPPORT_STOP_TILT,
SUPPORT_CLOSE_TILT,
SUPPORT_SET_TILT_POSITION,
} from "../../../../src/data/cover";
import { CoverEntityFeature } from "../../../../src/data/cover";
import "../../../../src/dialogs/more-info/more-info-content";
import { getEntity } from "../../../../src/fake_data/entity";
import {
@ -22,113 +13,127 @@ import "../../components/demo-more-infos";
const ENTITIES = [
getEntity("cover", "position_buttons", "on", {
friendly_name: "Position Buttons",
supported_features: SUPPORT_OPEN + SUPPORT_STOP + SUPPORT_CLOSE,
supported_features:
CoverEntityFeature.OPEN +
CoverEntityFeature.STOP +
CoverEntityFeature.CLOSE,
}),
getEntity("cover", "position_slider_half", "on", {
friendly_name: "Position Half-Open",
supported_features:
SUPPORT_OPEN + SUPPORT_STOP + SUPPORT_CLOSE + SUPPORT_SET_POSITION,
CoverEntityFeature.OPEN +
CoverEntityFeature.STOP +
CoverEntityFeature.CLOSE +
CoverEntityFeature.SET_POSITION,
current_position: 50,
}),
getEntity("cover", "position_slider_open", "on", {
friendly_name: "Position Open",
supported_features:
SUPPORT_OPEN + SUPPORT_STOP + SUPPORT_CLOSE + SUPPORT_SET_POSITION,
CoverEntityFeature.OPEN +
CoverEntityFeature.STOP +
CoverEntityFeature.CLOSE +
CoverEntityFeature.SET_POSITION,
current_position: 100,
}),
getEntity("cover", "position_slider_closed", "on", {
friendly_name: "Position Closed",
supported_features:
SUPPORT_OPEN + SUPPORT_STOP + SUPPORT_CLOSE + SUPPORT_SET_POSITION,
CoverEntityFeature.OPEN +
CoverEntityFeature.STOP +
CoverEntityFeature.CLOSE +
CoverEntityFeature.SET_POSITION,
current_position: 0,
}),
getEntity("cover", "tilt_buttons", "on", {
friendly_name: "Tilt Buttons",
supported_features:
SUPPORT_OPEN_TILT + SUPPORT_STOP_TILT + SUPPORT_CLOSE_TILT,
CoverEntityFeature.OPEN_TILT +
CoverEntityFeature.STOP_TILT +
CoverEntityFeature.CLOSE_TILT,
}),
getEntity("cover", "tilt_slider_half", "on", {
friendly_name: "Tilt Half-Open",
supported_features:
SUPPORT_OPEN_TILT +
SUPPORT_STOP_TILT +
SUPPORT_CLOSE_TILT +
SUPPORT_SET_TILT_POSITION,
CoverEntityFeature.OPEN_TILT +
CoverEntityFeature.STOP_TILT +
CoverEntityFeature.CLOSE_TILT +
CoverEntityFeature.SET_TILT_POSITION,
current_tilt_position: 50,
}),
getEntity("cover", "tilt_slider_open", "on", {
friendly_name: "Tilt Open",
supported_features:
SUPPORT_OPEN_TILT +
SUPPORT_STOP_TILT +
SUPPORT_CLOSE_TILT +
SUPPORT_SET_TILT_POSITION,
CoverEntityFeature.OPEN_TILT +
CoverEntityFeature.STOP_TILT +
CoverEntityFeature.CLOSE_TILT +
CoverEntityFeature.SET_TILT_POSITION,
current_tilt_position: 100,
}),
getEntity("cover", "tilt_slider_closed", "on", {
friendly_name: "Tilt Closed",
supported_features:
SUPPORT_OPEN_TILT +
SUPPORT_STOP_TILT +
SUPPORT_CLOSE_TILT +
SUPPORT_SET_TILT_POSITION,
CoverEntityFeature.OPEN_TILT +
CoverEntityFeature.STOP_TILT +
CoverEntityFeature.CLOSE_TILT +
CoverEntityFeature.SET_TILT_POSITION,
current_tilt_position: 0,
}),
getEntity("cover", "position_slider_tilt_slider", "on", {
friendly_name: "Both Sliders",
supported_features:
SUPPORT_OPEN +
SUPPORT_STOP +
SUPPORT_CLOSE +
SUPPORT_SET_POSITION +
SUPPORT_OPEN_TILT +
SUPPORT_STOP_TILT +
SUPPORT_CLOSE_TILT +
SUPPORT_SET_TILT_POSITION,
CoverEntityFeature.OPEN +
CoverEntityFeature.STOP +
CoverEntityFeature.CLOSE +
CoverEntityFeature.SET_POSITION +
CoverEntityFeature.OPEN_TILT +
CoverEntityFeature.STOP_TILT +
CoverEntityFeature.CLOSE_TILT +
CoverEntityFeature.SET_TILT_POSITION,
current_position: 30,
current_tilt_position: 70,
}),
getEntity("cover", "position_tilt_slider", "on", {
friendly_name: "Position & Tilt Slider",
supported_features:
SUPPORT_OPEN +
SUPPORT_STOP +
SUPPORT_CLOSE +
SUPPORT_OPEN_TILT +
SUPPORT_STOP_TILT +
SUPPORT_CLOSE_TILT +
SUPPORT_SET_TILT_POSITION,
CoverEntityFeature.OPEN +
CoverEntityFeature.STOP +
CoverEntityFeature.CLOSE +
CoverEntityFeature.OPEN_TILT +
CoverEntityFeature.STOP_TILT +
CoverEntityFeature.CLOSE_TILT +
CoverEntityFeature.SET_TILT_POSITION,
current_tilt_position: 70,
}),
getEntity("cover", "position_slider_tilt", "on", {
friendly_name: "Position Slider & Tilt",
supported_features:
SUPPORT_OPEN +
SUPPORT_STOP +
SUPPORT_CLOSE +
SUPPORT_SET_POSITION +
SUPPORT_OPEN_TILT +
SUPPORT_STOP_TILT +
SUPPORT_CLOSE_TILT,
CoverEntityFeature.OPEN +
CoverEntityFeature.STOP +
CoverEntityFeature.CLOSE +
CoverEntityFeature.SET_POSITION +
CoverEntityFeature.OPEN_TILT +
CoverEntityFeature.STOP_TILT +
CoverEntityFeature.CLOSE_TILT,
current_position: 30,
}),
getEntity("cover", "position_slider_only_tilt_slider", "on", {
friendly_name: "Position Slider Only & Tilt Buttons",
supported_features:
SUPPORT_SET_POSITION +
SUPPORT_OPEN_TILT +
SUPPORT_STOP_TILT +
SUPPORT_CLOSE_TILT,
CoverEntityFeature.SET_POSITION +
CoverEntityFeature.OPEN_TILT +
CoverEntityFeature.STOP_TILT +
CoverEntityFeature.CLOSE_TILT,
current_position: 30,
}),
getEntity("cover", "position_slider_only_tilt", "on", {
friendly_name: "Position Slider Only & Tilt",
supported_features:
SUPPORT_SET_POSITION +
SUPPORT_OPEN_TILT +
SUPPORT_STOP_TILT +
SUPPORT_CLOSE_TILT +
SUPPORT_SET_TILT_POSITION,
CoverEntityFeature.SET_POSITION +
CoverEntityFeature.OPEN_TILT +
CoverEntityFeature.STOP_TILT +
CoverEntityFeature.CLOSE_TILT +
CoverEntityFeature.SET_TILT_POSITION,
current_position: 30,
current_tilt_position: 70,
}),

6
src/common/entity/feature_class_names.ts
View File

@ -1,10 +1,14 @@
import { HassEntity } from "home-assistant-js-websocket";
import { supportsFeature } from "./supports-feature";
export type FeatureClassNames<T extends number = number> = Partial<
Record<T, string>
>;
// Expects classNames to be an object mapping feature-bit -> className
export const featureClassNames = (
stateObj: HassEntity,
classNames: { [feature: number]: string }
classNames: FeatureClassNames
) => {
if (!stateObj || !stateObj.attributes.supported_features) {
return "";

11
src/components/ha-cover-controls.ts
View File

@ -3,15 +3,14 @@ import { css, CSSResultGroup, html, LitElement, TemplateResult } from "lit";
import { customElement, property } from "lit/decorators";
import { classMap } from "lit/directives/class-map";
import { computeCloseIcon, computeOpenIcon } from "../common/entity/cover_icon";
import { supportsFeature } from "../common/entity/supports-feature";
import {
CoverEntity,
CoverEntityFeature,
isClosing,
isFullyClosed,
isFullyOpen,
isOpening,
supportsClose,
supportsOpen,
supportsStop,
} from "../data/cover";
import { UNAVAILABLE } from "../data/entity";
import type { HomeAssistant } from "../types";
@ -32,7 +31,7 @@ class HaCoverControls extends LitElement {
<div class="state">
<ha-icon-button
class=${classMap({
hidden: !supportsOpen(this.stateObj),
hidden: !supportsFeature(this.stateObj, CoverEntityFeature.OPEN),
})}
.label=${this.hass.localize(
"ui.dialogs.more_info_control.cover.open_cover"
@ -44,7 +43,7 @@ class HaCoverControls extends LitElement {
</ha-icon-button>
<ha-icon-button
class=${classMap({
hidden: !supportsStop(this.stateObj),
hidden: !supportsFeature(this.stateObj, CoverEntityFeature.STOP),
})}
.label=${this.hass.localize(
"ui.dialogs.more_info_control.cover.stop_cover"
@ -55,7 +54,7 @@ class HaCoverControls extends LitElement {
></ha-icon-button>
<ha-icon-button
class=${classMap({
hidden: !supportsClose(this.stateObj),
hidden: !supportsFeature(this.stateObj, CoverEntityFeature.CLOSE),
})}
.label=${this.hass.localize(
"ui.dialogs.more_info_control.cover.close_cover"

20
src/components/ha-cover-tilt-controls.ts
View File

@ -2,13 +2,12 @@ import { mdiArrowBottomLeft, mdiArrowTopRight, mdiStop } from "@mdi/js";
import { css, CSSResultGroup, html, LitElement, TemplateResult } from "lit";
import { customElement, property } from "lit/decorators";
import { classMap } from "lit/directives/class-map";
import { supportsFeature } from "../common/entity/supports-feature";
import {
CoverEntity,
CoverEntityFeature,
isFullyClosedTilt,
isFullyOpenTilt,
supportsCloseTilt,
supportsOpenTilt,
supportsStopTilt,
} from "../data/cover";
import { UNAVAILABLE } from "../data/entity";
import { HomeAssistant } from "../types";
@ -27,7 +26,10 @@ class HaCoverTiltControls extends LitElement {
return html` <ha-icon-button
class=${classMap({
invisible: !supportsOpenTilt(this.stateObj),
invisible: !supportsFeature(
this.stateObj,
CoverEntityFeature.OPEN_TILT
),
})}
.label=${this.hass.localize(
"ui.dialogs.more_info_control.cover.open_tilt_cover"
@ -38,7 +40,10 @@ class HaCoverTiltControls extends LitElement {
></ha-icon-button>
<ha-icon-button
class=${classMap({
invisible: !supportsStopTilt(this.stateObj),
invisible: !supportsFeature(
this.stateObj,
CoverEntityFeature.STOP_TILT
),
})}
.label=${this.hass.localize(
"ui.dialogs.more_info_control.cover.stop_cover"
@ -49,7 +54,10 @@ class HaCoverTiltControls extends LitElement {
></ha-icon-button>
<ha-icon-button
class=${classMap({
invisible: !supportsCloseTilt(this.stateObj),
invisible: !supportsFeature(
this.stateObj,
CoverEntityFeature.CLOSE_TILT
),
})}
.label=${this.hass.localize(
"ui.dialogs.more_info_control.cover.close_tilt_cover"

64
src/data/cover.ts
View File

@ -4,46 +4,16 @@ import {
} from "home-assistant-js-websocket";
import { supportsFeature } from "../common/entity/supports-feature";
export const SUPPORT_OPEN = 1;
export const SUPPORT_CLOSE = 2;
export const SUPPORT_SET_POSITION = 4;
export const SUPPORT_STOP = 8;
export const SUPPORT_OPEN_TILT = 16;
export const SUPPORT_CLOSE_TILT = 32;
export const SUPPORT_STOP_TILT = 64;
export const SUPPORT_SET_TILT_POSITION = 128;
export const FEATURE_CLASS_NAMES = {
4: "has-set_position",
16: "has-open_tilt",
32: "has-close_tilt",
64: "has-stop_tilt",
128: "has-set_tilt_position",
};
export const supportsOpen = (stateObj) =>
supportsFeature(stateObj, SUPPORT_OPEN);
export const supportsClose = (stateObj) =>
supportsFeature(stateObj, SUPPORT_CLOSE);
export const supportsSetPosition = (stateObj) =>
supportsFeature(stateObj, SUPPORT_SET_POSITION);
export const supportsStop = (stateObj) =>
supportsFeature(stateObj, SUPPORT_STOP);
export const supportsOpenTilt = (stateObj) =>
supportsFeature(stateObj, SUPPORT_OPEN_TILT);
export const supportsCloseTilt = (stateObj) =>
supportsFeature(stateObj, SUPPORT_CLOSE_TILT);
export const supportsStopTilt = (stateObj) =>
supportsFeature(stateObj, SUPPORT_STOP_TILT);
export const supportsSetTiltPosition = (stateObj) =>
supportsFeature(stateObj, SUPPORT_SET_TILT_POSITION);
export const enum CoverEntityFeature {
OPEN = 1,
CLOSE = 2,
SET_POSITION = 4,
STOP = 8,
OPEN_TILT = 16,
CLOSE_TILT = 32,
STOP_TILT = 64,
SET_TILT_POSITION = 128,
}
export function isFullyOpen(stateObj: CoverEntity) {
if (stateObj.attributes.current_position !== undefined) {
@ -77,17 +47,19 @@ export function isClosing(stateObj: CoverEntity) {
export function isTiltOnly(stateObj: CoverEntity) {
const supportsCover =
supportsOpen(stateObj) || supportsClose(stateObj) || supportsStop(stateObj);
supportsFeature(stateObj, CoverEntityFeature.OPEN) ||
supportsFeature(stateObj, CoverEntityFeature.CLOSE) ||
supportsFeature(stateObj, CoverEntityFeature.STOP);
const supportsTilt =
supportsOpenTilt(stateObj) ||
supportsCloseTilt(stateObj) ||
supportsStopTilt(stateObj);
supportsFeature(stateObj, CoverEntityFeature.OPEN_TILT) ||
supportsFeature(stateObj, CoverEntityFeature.CLOSE_TILT) ||
supportsFeature(stateObj, CoverEntityFeature.STOP_TILT);
return supportsTilt && !supportsCover;
}
interface CoverEntityAttributes extends HassEntityAttributeBase {
current_position: number;
current_tilt_position: number;
current_position?: number;
current_tilt_position?: number;
}
export interface CoverEntity extends HassEntityBase {

25
src/dialogs/more-info/controls/more-info-cover.ts
View File

@ -1,19 +1,29 @@
import { css, CSSResult, html, LitElement, TemplateResult } from "lit";
import { customElement, property } from "lit/decorators";
import { attributeClassNames } from "../../../common/entity/attribute_class_names";
import { featureClassNames } from "../../../common/entity/feature_class_names";
import {
FeatureClassNames,
featureClassNames,
} from "../../../common/entity/feature_class_names";
import { supportsFeature } from "../../../common/entity/supports-feature";
import "../../../components/ha-attributes";
import "../../../components/ha-cover-tilt-controls";
import "../../../components/ha-labeled-slider";
import {
CoverEntity,
FEATURE_CLASS_NAMES,
CoverEntityFeature,
isTiltOnly,
supportsSetPosition,
supportsSetTiltPosition,
} from "../../../data/cover";
import { HomeAssistant } from "../../../types";
export const FEATURE_CLASS_NAMES: FeatureClassNames<CoverEntityFeature> = {
[CoverEntityFeature.SET_POSITION]: "has-set_position",
[CoverEntityFeature.OPEN_TILT]: "has-open_tilt",
[CoverEntityFeature.CLOSE_TILT]: "has-close_tilt",
[CoverEntityFeature.STOP_TILT]: "has-stop_tilt",
[CoverEntityFeature.SET_TILT_POSITION]: "has-set_tilt_position",
};
@customElement("more-info-cover")
class MoreInfoCover extends LitElement {
@property({ attribute: false }) public hass!: HomeAssistant;
@ -34,13 +44,16 @@ class MoreInfoCover extends LitElement {
.caption=${this.hass.localize("ui.card.cover.position")}
pin=""
.value=${this.stateObj.attributes.current_position}
.disabled=${!supportsSetPosition(this.stateObj)}
.disabled=${!supportsFeature(
this.stateObj,
CoverEntityFeature.SET_POSITION
)}
@change=${this._coverPositionSliderChanged}
></ha-labeled-slider>
</div>
<div class="tilt">
${supportsSetTiltPosition(this.stateObj)
${supportsFeature(this.stateObj, CoverEntityFeature.SET_TILT_POSITION)
? // Either render the labeled slider and put the tilt buttons into its slot
// or (if tilt position is not supported and therefore no slider is shown)
// render a title <div> (same style as for a labeled slider) and directly put