diff --git a/src/dialogs/more-info/controls/more-info-camera.ts b/src/dialogs/more-info/controls/more-info-camera.ts
index 64d07826a2..27275280e9 100644
--- a/src/dialogs/more-info/controls/more-info-camera.ts
+++ b/src/dialogs/more-info/controls/more-info-camera.ts
@@ -1,35 +1,14 @@
-import {
- css,
- CSSResultGroup,
- html,
- LitElement,
- PropertyValues,
- TemplateResult,
-} from "lit";
+import { css, CSSResultGroup, html, LitElement, TemplateResult } from "lit";
import { property, state } from "lit/decorators";
-import { isComponentLoaded } from "../../../common/config/is_component_loaded";
-import { supportsFeature } from "../../../common/entity/supports-feature";
import "../../../components/ha-camera-stream";
-import type { HaCheckbox } from "../../../components/ha-checkbox";
-import "../../../components/ha-checkbox";
-import {
- CameraEntity,
- CameraPreferences,
- CAMERA_SUPPORT_STREAM,
- fetchCameraPrefs,
- STREAM_TYPE_HLS,
- updateCameraPrefs,
-} from "../../../data/camera";
+import { CameraEntity } from "../../../data/camera";
import type { HomeAssistant } from "../../../types";
-import "../../../components/ha-formfield";
class MoreInfoCamera extends LitElement {
@property({ attribute: false }) public hass?: HomeAssistant;
@property({ attribute: false }) public stateObj?: CameraEntity;
- @state() private _cameraPrefs?: CameraPreferences;
-
@state() private _attached = false;
public connectedCallback() {
@@ -54,83 +33,13 @@ class MoreInfoCamera extends LitElement {
allow-exoplayer
controls
>
- ${this._cameraPrefs
- ? html`
-
-
-
-
- `
- : undefined}
`;
}
- protected updated(changedProps: PropertyValues) {
- if (!changedProps.has("stateObj")) {
- return;
- }
-
- const oldState = changedProps.get("stateObj") as this["stateObj"];
- const oldEntityId = oldState ? oldState.entity_id : undefined;
- const curEntityId = this.stateObj ? this.stateObj.entity_id : undefined;
-
- // Same entity, ignore.
- if (curEntityId === oldEntityId) {
- return;
- }
-
- if (
- curEntityId &&
- isComponentLoaded(this.hass!, "stream") &&
- supportsFeature(this.stateObj!, CAMERA_SUPPORT_STREAM) &&
- // The stream component for HLS streams supports a server-side pre-load
- // option that client initiated WebRTC streams do not
- this.stateObj!.attributes.frontend_stream_type === STREAM_TYPE_HLS
- ) {
- // Fetch in background while we set up the video.
- this._fetchCameraPrefs();
- }
- }
-
- private async _fetchCameraPrefs() {
- this._cameraPrefs = await fetchCameraPrefs(
- this.hass!,
- this.stateObj!.entity_id
- );
- }
-
- private async _handleCheckboxChanged(ev) {
- const checkbox = ev.currentTarget as HaCheckbox;
- try {
- this._cameraPrefs = await updateCameraPrefs(
- this.hass!,
- this.stateObj!.entity_id,
- {
- preload_stream: checkbox.checked!,
- }
- );
- } catch (err: any) {
- alert(err.message);
- checkbox.checked = !checkbox.checked;
- }
- }
-
static get styles(): CSSResultGroup {
return css`
:host {
display: block;
- position: relative;
- }
- ha-formfield {
- position: absolute;
- top: 0;
- right: 0;
- background-color: var(--secondary-background-color);
- padding-right: 16px;
- border-bottom-left-radius: 4px;
}
`;
}
diff --git a/src/panels/config/entities/entity-registry-settings.ts b/src/panels/config/entities/entity-registry-settings.ts
index 0c6ff704df..e8125074d9 100644
--- a/src/panels/config/entities/entity-registry-settings.ts
+++ b/src/panels/config/entities/entity-registry-settings.ts
@@ -12,10 +12,12 @@ import {
} from "lit";
import { customElement, property, state } from "lit/decorators";
import memoizeOne from "memoize-one";
+import { isComponentLoaded } from "../../../common/config/is_component_loaded";
import { fireEvent } from "../../../common/dom/fire_event";
import { stopPropagation } from "../../../common/dom/stop_propagation";
import { computeDomain } from "../../../common/entity/compute_domain";
import { domainIcon } from "../../../common/entity/domain_icon";
+import { supportsFeature } from "../../../common/entity/supports-feature";
import { stringCompare } from "../../../common/string/compare";
import { LocalizeFunc } from "../../../common/translations/localize";
import "../../../components/ha-alert";
@@ -24,8 +26,17 @@ import "../../../components/ha-expansion-panel";
import "../../../components/ha-icon-picker";
import "../../../components/ha-radio";
import "../../../components/ha-select";
+import "../../../components/ha-settings-row";
import "../../../components/ha-switch";
+import type { HaSwitch } from "../../../components/ha-switch";
import "../../../components/ha-textfield";
+import {
+ CameraPreferences,
+ CAMERA_SUPPORT_STREAM,
+ fetchCameraPrefs,
+ STREAM_TYPE_HLS,
+ updateCameraPrefs,
+} from "../../../data/camera";
import {
ConfigEntry,
deleteConfigEntry,
@@ -133,6 +144,8 @@ export class EntityRegistrySettings extends SubscribeMixin(LitElement) {
@state() private _submitting?: boolean;
+ @state() private _cameraPrefs?: CameraPreferences;
+
private _origEntityId!: string;
private _deviceLookup?: Record;
@@ -190,6 +203,20 @@ export class EntityRegistrySettings extends SubscribeMixin(LitElement) {
const domain = computeDomain(this.entry.entity_id);
+ if (domain === "camera" && isComponentLoaded(this.hass, "stream")) {
+ const stateObj: HassEntity | undefined =
+ this.hass.states[this.entry.entity_id];
+ if (
+ stateObj &&
+ supportsFeature(stateObj, CAMERA_SUPPORT_STREAM) &&
+ // The stream component for HLS streams supports a server-side pre-load
+ // option that client initiated WebRTC streams do not
+ stateObj.attributes.frontend_stream_type === STREAM_TYPE_HLS
+ ) {
+ this._fetchCameraPrefs();
+ }
+ }
+
if (domain === "sensor") {
const stateObj: HassEntity | undefined =
this.hass.states[this.entry.entity_id];
@@ -392,7 +419,27 @@ export class EntityRegistrySettings extends SubscribeMixin(LitElement) {
@value-changed=${this._areaPicked}
>`
: ""}
-
+ ${this._cameraPrefs
+ ? html`
+
+ ${this.hass.localize(
+ "ui.dialogs.entity_registry.editor.preload_stream"
+ )}
+ ${this.hass.localize(
+ "ui.dialogs.entity_registry.editor.preload_stream_description"
+ )}
+
+
+
+ `
+ : ""}