43 lines
20 KiB
JavaScript
43 lines
20 KiB
JavaScript
import{dC as t,dD as e,i,d6 as n,_ as a,n as s,b as o,t as r,a as c,dE as d,x as l,dF as h,e as _,r as u,dG as p,dH as m,dI as v,k as g,l as b,dJ as f,dK as z,dL as y}from"./card-b98d578d.js";class C{constructor(){this._options=null,this._viewportIntersecting=null,this._microphoneMuteTimer=new t,this._root=null,this._eventListeners=new Map,this._children=[],this._target=null,this._mutationObserver=new MutationObserver(this._mutationHandler.bind(this)),this._intersectionObserver=new IntersectionObserver(this._intersectionHandler.bind(this)),this._mediaLoadedHandler=async t=>{this._target?.index===t&&(await this._unmuteTargetIfConfigured(this._target.selected?"selected":"visible"),await this._playTargetIfConfigured(this._target.selected?"selected":"visible"))},this._visibilityHandler=async()=>{await this._changeVisibility("visible"===document.visibilityState)},this._changeVisibility=async t=>{t?(await this._unmuteTargetIfConfigured("visible"),await this._playTargetIfConfigured("visible")):(await this._pauseAllIfConfigured("hidden"),await this._muteAllIfConfigured("hidden"))},document.addEventListener("visibilitychange",this._visibilityHandler)}setOptions(t){this._options?.microphoneState!==t.microphoneState&&this._microphoneStateChangeHandler(this._options?.microphoneState,t.microphoneState),this._options=t}hasRoot(){return!!this._root}destroy(){this._viewportIntersecting=null,this._microphoneMuteTimer.stop(),this._root=null,this._removeChildHandlers(),this._children=[],this._target=null,this._mutationObserver.disconnect(),this._intersectionObserver.disconnect(),document.removeEventListener("visibilitychange",this._visibilityHandler)}async setTarget(t,e){this._target?.index===t&&this._target?.selected===e||(this._target?.selected&&(await this._pauseTargetIfConfigured("unselected"),await this._muteTargetIfConfigured("unselected"),this._microphoneMuteTimer.stop()),this._target={selected:e,index:t},e?(await this._unmuteTargetIfConfigured("selected"),await this._playTargetIfConfigured("selected")):(await this._unmuteTargetIfConfigured("visible"),await this._playTargetIfConfigured("visible")))}unsetTarget(){this._target=null}async _playTargetIfConfigured(t){null!==this._target&&this._options?.autoPlayConditions?.includes(t)&&await this._play(this._target.index)}async _play(t){await((await(this._children[t]?.getMediaPlayerController()))?.play())}async _unmuteTargetIfConfigured(t){null!==this._target&&this._options?.autoUnmuteConditions?.includes(t)&&await this._unmute(this._target.index)}async _unmute(t){await((await(this._children[t]?.getMediaPlayerController()))?.unmute())}async _pauseAllIfConfigured(t){if(this._options?.autoPauseConditions?.includes(t))for(const t of this._children.keys())await this._pause(t)}async _pauseTargetIfConfigured(t){null!==this._target&&this._options?.autoPauseConditions?.includes(t)&&await this._pause(this._target.index)}async _pause(t){await((await(this._children[t]?.getMediaPlayerController()))?.pause())}async _muteAllIfConfigured(t){if(this._options?.autoMuteConditions?.includes(t))for(const t of this._children.keys())await this._mute(t)}async _muteTargetIfConfigured(t){null!==this._target&&this._options?.autoMuteConditions?.includes(t)&&await this._mute(this._target.index)}async _mute(t){await((await(this._children[t]?.getMediaPlayerController()))?.mute())}_mutationHandler(t,e){this._initializeRoot()}_removeChildHandlers(){for(const[t,e]of this._eventListeners.entries())t.removeEventListener("advanced-camera-card:media:loaded",e);this._eventListeners.clear()}setRoot(t){return t!==this._root&&(this._target=null,this._root=t,this._initializeRoot(),this._intersectionObserver.disconnect(),this._intersectionObserver.observe(this._root),this._mutationObserver.disconnect(),this._mutationObserver.observe(this._root,{childList:!0,subtree:!0}),!0)}_initializeRoot(){if(this._options&&this._root){this._removeChildHandlers(),this._children=[...this._root.querySelectorAll(this._options.playerSelector)];for(const[t,e]of this._children.entries()){const i=()=>this._mediaLoadedHandler(t);this._eventListeners.set(e,i),e.addEventListener("advanced-camera-card:media:loaded",i)}}}async _intersectionHandler(t){const e=this._viewportIntersecting;this._viewportIntersecting=t.some((t=>t.isIntersecting)),null!==e&&e!==this._viewportIntersecting&&await this._changeVisibility(this._viewportIntersecting)}async _microphoneStateChangeHandler(t,e){t&&e&&(t.muted&&!e.muted?await this._unmuteTargetIfConfigured("microphone"):!t.muted&&e.muted&&this._options?.autoMuteConditions?.includes("microphone")&&this._microphoneMuteTimer.start(this._options.microphoneMuteSeconds??60,(async()=>{await this._muteTargetIfConfigured("microphone")})))}}class w{constructor(t,i){this._root=null,this._children=[],this._selectedChild=null,this._mutationObserver=new MutationObserver((()=>this._initializeRoot())),this._resizeObserver=new ResizeObserver((()=>this._debouncedSetHeight())),this._debouncedSetHeight=e((()=>this._setHeight()),300,{trailing:!0,leading:!1}),this._host=t,this._selector=i}setRoot(t){t!==this._root&&(this._root=t,this._mutationObserver.disconnect(),this._mutationObserver.observe(this._root,{childList:!0}),this._initializeRoot())}setSelected(t){const e=this._children[t];e&&e!==this._selectedChild&&(this._selectedChild=e,this._resizeObserver.disconnect(),this._resizeObserver.observe(e),this._debouncedSetHeight())}destroy(){this._mutationObserver.disconnect(),this._resizeObserver.disconnect(),this._root=null,this._children=[],this._selectedChild=null}_setHeight(){if(!this._selectedChild)return;const t=this._host.style.maxHeight;this._host.style.maxHeight="";const e=this._selectedChild.getBoundingClientRect().height;this._host.style.maxHeight=t,this._selectedChild.getBoundingClientRect(),e&&!isNaN(e)&&e>0&&(this._host.style.maxHeight=`${e}px`)}_initializeRoot(){const t=[...this._root?.querySelectorAll(this._selector)??
|
|
/* istanbul ignore next: this path cannot be reached as root will always
|
|
exist by the time the mutation observer is observing -- @preserve */
|
|
[]];i(t,this._children)||(this._children=t,this._selectedChild=null)}}function x(){let t,e=[];const i=[];function a(n){const a=n.composedPath();for(const[s,o]of[...e.entries()].reverse())if(a.includes(o)){i[s]=n.detail,s!==t.selectedScrollSnap()&&n.stopPropagation();break}}function s(n){const a=n.composedPath();for(const[s,o]of e.entries())if(a.includes(o)){delete i[s],s!==t.selectedScrollSnap()&&n.stopPropagation();break}}function o(){const a=t.selectedScrollSnap(),s=i[a];s&&n(e[a],s)}return{name:"autoMediaLoadedInfo",options:{},init:function(i){t=i,e=t.slideNodes();for(const t of e)t.addEventListener("advanced-camera-card:media:loaded",a),t.addEventListener("advanced-camera-card:media:unloaded",s);t.on("init",o),t.containerNode().addEventListener("advanced-camera-card:carousel:force-select",o)},destroy:function(){for(const t of e)t.removeEventListener("advanced-camera-card:media:loaded",a),t.removeEventListener("advanced-camera-card:media:unloaded",s);t.off("init",o),t.containerNode().removeEventListener("advanced-camera-card:carousel:force-select",o)}}}let I=class extends c{constructor(){super(...arguments),this.disabled=!1,this.label="",this._embedThumbnailTask=d(this,(()=>this.hass),(()=>this.thumbnail))}set controlConfig(t){t?.size&&this.style.setProperty("--advanced-camera-card-next-prev-size",`${t.size}px`),this._controlConfig=t}render(){if(this.disabled||!this._controlConfig||"none"==this._controlConfig.style)return l``;const t=!this.thumbnail||["chevrons","icons"].includes(this._controlConfig.style),e={controls:!0,left:"left"===this.side,right:"right"===this.side},i=()=>{const t=this.icon&&"chevrons"!==this._controlConfig?.style?this.icon:"left"===this.side?{icon:"mdi:chevron-left"}:{icon:"mdi:chevron-right"},i={...e,icons:!0};return l` <ha-icon-button class="${_(i)}" .label=${this.label}>
|
|
<advanced-camera-card-icon
|
|
.hass=${this.hass}
|
|
.icon=${t}
|
|
></advanced-camera-card-icon>
|
|
</ha-icon-button>`};if(t)return i();const n={...e,thumbnails:!0};return h(this._embedThumbnailTask,(t=>t?l`<img
|
|
src="${t}"
|
|
class="${_(n)}"
|
|
title="${this.label}"
|
|
aria-label="${this.label}"
|
|
/>`:l``),{inProgressFunc:()=>l`<div class=${_(n)}></div>`,errorFunc:t=>i()})}static get styles(){return u("ha-icon-button {\n color: var(--advanced-camera-card-button-color);\n background-color: var(--advanced-camera-card-button-background);\n border-radius: var(--advanced-camera-card-button-border-radius);\n padding: 0px;\n margin: 3px;\n --ha-icon-display: block;\n /* Buttons can always be clicked */\n pointer-events: auto;\n}\n\n:host {\n --advanced-camera-card-next-prev-size: 48px;\n --advanced-camera-card-next-prev-size-hover: calc(\n var(--advanced-camera-card-next-prev-size) * 2\n );\n --advanced-camera-card-left-position: 45px;\n --advanced-camera-card-right-position: 45px;\n --mdc-icon-button-size: var(--advanced-camera-card-next-prev-size);\n --mdc-icon-size: calc(var(--mdc-icon-button-size) / 2);\n}\n\n.controls {\n position: absolute;\n z-index: 1;\n overflow: hidden;\n}\n\n.controls.left {\n left: var(--advanced-camera-card-left-position);\n}\n\n.controls.right {\n right: var(--advanced-camera-card-right-position);\n}\n\n.controls.icons {\n top: calc(50% - var(--advanced-camera-card-next-prev-size) / 2);\n}\n\n.controls.thumbnails {\n border-radius: 50%;\n height: var(--advanced-camera-card-next-prev-size);\n top: calc(50% - var(--advanced-camera-card-next-prev-size) / 2);\n box-shadow: var(--advanced-camera-card-box-shadow-override, 0px 0px 20px 5px black);\n transition: all 0.2s ease-out;\n opacity: 0.8;\n aspect-ratio: 1/1;\n}\n\n.controls.thumbnails:hover {\n opacity: 1 !important;\n height: var(--advanced-camera-card-next-prev-size-hover);\n top: calc(50% - var(--advanced-camera-card-next-prev-size-hover) / 2);\n}\n\n.controls.left.thumbnails:hover {\n left: calc(var(--advanced-camera-card-left-position) - (var(--advanced-camera-card-next-prev-size-hover) - var(--advanced-camera-card-next-prev-size)) / 2);\n}\n\n.controls.right.thumbnails:hover {\n right: calc(var(--advanced-camera-card-right-position) - (var(--advanced-camera-card-next-prev-size-hover) - var(--advanced-camera-card-next-prev-size)) / 2);\n}")}};a([s({attribute:!1})],I.prototype,"side",void 0),a([s({attribute:!1})],I.prototype,"hass",void 0),a([o()],I.prototype,"_controlConfig",void 0),a([s({attribute:!1})],I.prototype,"thumbnail",void 0),a([s({attribute:!1})],I.prototype,"icon",void 0),a([s({attribute:!0,type:Boolean})],I.prototype,"disabled",void 0),a([s()],I.prototype,"label",void 0),I=a([r("advanced-camera-card-next-previous-control")],I);class H{constructor(t){this._config=null,this._hass=null,this._cameraManager=null,this._cameraID=null,this._host=t}setConfig(t){this._config=t??null,this._host.setAttribute("data-orientation",t?.orientation??"horizontal"),this._host.setAttribute("data-position",t?.position??"bottom-right"),this._host.setAttribute("style",Object.entries(t?.style??{}).map((([t,e])=>`${t}:${e}`)).join(";"))}getConfig(){return this._config}setCamera(t,e){this._cameraManager=t??null,this._cameraID=e??null}setForceVisibility(t){this._forceVisibility=t}handleAction(t,e){const i=e??t.detail.item??null;t.stopPropagation();const n=t.detail.action,a=p(n,i);a&&m(this._host,{actions:a,...i&&{config:i}})}shouldDisplay(){return void 0!==this._forceVisibility?this._forceVisibility:"auto"===this._config?.mode?!!this._cameraID&&!!this._cameraManager?.getCameraCapabilities(this._cameraID)?.hasPTZCapability():"on"===this._config?.mode}getPTZActions(){const t=this._cameraID?this._cameraManager?.getCameraCapabilities(this._cameraID):null,e=t&&t.hasPTZCapability(),i=t?.getPTZCapabilities(),n=t=>({start_tap_action:v({ptzAction:t?.ptzAction,ptzPhase:"start",ptzPreset:t?.preset}),end_tap_action:v({ptzAction:t?.ptzAction,ptzPhase:"stop",ptzPreset:t?.preset})}),a=t=>({tap_action:v({ptzAction:t?.ptzAction,ptzPreset:t?.preset})}),s={};e&&!i?.up||(s.up=n({ptzAction:"up"})),e&&!i?.down||(s.down=n({ptzAction:"down"})),e&&!i?.left||(s.left=n({ptzAction:"left"})),e&&!i?.right||(s.right=n({ptzAction:"right"})),e&&!i?.zoomIn||(s.zoom_in=n({ptzAction:"zoom_in"})),e&&!i?.zoomOut||(s.zoom_out=n({ptzAction:"zoom_out"})),e&&!i?.presets?.length||(s.home=a());for(const t of i?.presets??[])s.presets??=[],s.presets.push({preset:t,actions:a({preset:t,ptzAction:"preset"})});return s}}let L=class extends c{constructor(){super(...arguments),this._controller=new H(this),this._actions=null}willUpdate(t){t.has("config")&&this._controller.setConfig(this.config),(t.has("cameraManager")||t.has("cameraID"))&&this._controller.setCamera(this.cameraManager,this.cameraID),t.has("forceVisibility")&&this._controller.setForceVisibility(this.forceVisibility),(t.has("cameraID")||t.has("cameraManager"))&&(this._actions=this._controller.getPTZActions())}render(){if(!this._controller.shouldDisplay())return;const t=(t,e,i)=>{const n={[t]:!0,disabled:!i?.actions&&!i?.renderWithoutAction};return i?.actions||i?.renderWithoutAction?l`<advanced-camera-card-icon
|
|
class=${_(n)}
|
|
.icon=${{icon:e}}
|
|
.title=${b(`elements.ptz.${t}`)}
|
|
.actionHandler=${i.actions?f({hasHold:z(i.actions?.hold_action),hasDoubleClick:z(i.actions?.double_tap_action)}):void 0}
|
|
@action=${t=>i.actions&&this._controller.handleAction(t,i.actions)}
|
|
></advanced-camera-card-icon>`:l``},e=this._actions?.presets?.length?this._actions.presets.map((t=>({title:g(t.preset),icon:"mdi:cctv",...t.actions,hold_action:{action:"perform-action",perform_action:"camera.preset_recall"}}))):null,i=this._controller.getConfig();return l` <div class="ptz">
|
|
${!i?.hide_pan_tilt&&(this._actions?.left||this._actions?.right||this._actions?.up||this._actions?.down)?l`<div class="ptz-move">
|
|
${t("right","mdi:arrow-right",{actions:this._actions?.right})}
|
|
${t("left","mdi:arrow-left",{actions:this._actions?.left})}
|
|
${t("up","mdi:arrow-up",{actions:this._actions?.up})}
|
|
${t("down","mdi:arrow-down",{actions:this._actions?.down})}
|
|
</div>`:""}
|
|
${i?.hide_zoom||!this._actions?.zoom_in&&!this._actions?.zoom_out?l``:l` <div class="ptz-zoom">
|
|
${t("zoom_in","mdi:plus",{actions:this._actions.zoom_in})}
|
|
${t("zoom_out","mdi:minus",{actions:this._actions.zoom_out})}
|
|
</div>`}
|
|
${i?.hide_home||!this._actions?.home&&!e?.length?"":l`<div class="ptz-presets">
|
|
${t("home","mdi:home",{actions:this._actions?.home})}
|
|
${e?.length?l`<advanced-camera-card-submenu
|
|
class="presets"
|
|
.hass=${this.hass}
|
|
.items=${e}
|
|
@action=${t=>this._controller.handleAction(t)}
|
|
>
|
|
${t("presets","vertical"===i?.orientation?"mdi:dots-vertical":"mdi:dots-horizontal",{renderWithoutAction:!0})}
|
|
</advanced-camera-card-submenu>`:""}
|
|
</div>`}
|
|
</div>`}static get styles(){return u(":host {\n position: absolute;\n width: fit-content;\n height: fit-content;\n --advanced-camera-card-ptz-icon-size: 24px;\n}\n\n:host([data-position$=-left]) {\n left: 5%;\n}\n\n:host([data-position$=-right]) {\n right: 5%;\n}\n\n:host([data-position^=top-]) {\n top: 5%;\n}\n\n:host([data-position^=bottom-]) {\n bottom: 5%;\n}\n\n/*****************\n * Main Containers\n *****************/\n.ptz {\n display: flex;\n gap: 10px;\n}\n\n:host([data-orientation=vertical]) .ptz {\n flex-direction: column;\n}\n\n:host([data-orientation=horizontal]) .ptz {\n flex-direction: row;\n}\n\n:host([data-orientation=vertical]) .ptz div {\n width: calc(var(--advanced-camera-card-ptz-icon-size) * 3);\n}\n\n:host([data-orientation=horizontal]) .ptz div {\n height: calc(var(--advanced-camera-card-ptz-icon-size) * 3);\n}\n\n.ptz-move,\n.ptz-zoom,\n.ptz-presets {\n position: relative;\n transition: color 0.3s ease-in-out, background-color 0.3s ease-in-out;\n color: var(--advanced-camera-card-ptz-color-inactive);\n background-color: var(--advanced-camera-card-ptz-background-inactive);\n}\n.ptz-move:hover,\n.ptz-zoom:hover,\n.ptz-presets:hover {\n color: var(--advanced-camera-card-ptz-color-active);\n background-color: var(--advanced-camera-card-ptz-background-active);\n}\n\n.ptz-move {\n height: calc(var(--advanced-camera-card-ptz-icon-size) * 3);\n width: calc(var(--advanced-camera-card-ptz-icon-size) * 3);\n border-radius: 50%;\n}\n\n:host([data-orientation=horizontal]) .ptz .ptz-zoom,\n:host([data-orientation=horizontal]) .ptz .ptz-presets {\n width: calc(var(--advanced-camera-card-ptz-icon-size) * 1.5);\n}\n\n:host([data-orientation=vertical]) .ptz .ptz-zoom,\n:host([data-orientation=vertical]) .ptz .ptz-presets {\n height: calc(var(--advanced-camera-card-ptz-icon-size) * 1.5);\n}\n\n.ptz-zoom,\n.ptz-presets {\n border-radius: var(--advanced-camera-card-border-radius-final);\n}\n\n/***********\n * PTZ Icons\n ***********/\n.ptz-move advanced-camera-card-icon {\n position: absolute;\n --mdc-icon-size: var(--advanced-camera-card-ptz-icon-size);\n}\n\nadvanced-camera-card-icon:not(.disabled),\nadvanced-camera-card-submenu:not(.disabled) {\n cursor: pointer;\n}\n\n.disabled {\n color: var(--disabled-text-color);\n}\n\n.up {\n top: 5px;\n left: 50%;\n transform: translateX(-50%);\n}\n\n.down {\n bottom: 5px;\n left: 50%;\n transform: translateX(-50%);\n}\n\n.left {\n left: 5px;\n top: 50%;\n transform: translateY(-50%);\n}\n\n.right {\n right: 5px;\n top: 50%;\n transform: translateY(-50%);\n}\n\n.ptz-presets,\n.ptz-zoom {\n display: flex;\n align-items: center;\n justify-content: space-evenly;\n}\n\n:host([data-orientation=vertical]) .ptz-presets,\n:host([data-orientation=vertical]) .ptz-zoom {\n flex-direction: row;\n}\n\n:host([data-orientation=horizontal]) .ptz-presets,\n:host([data-orientation=horizontal]) .ptz-zoom {\n flex-direction: column;\n}")}};a([s({attribute:!1})],L.prototype,"config",void 0),a([s({attribute:!1})],L.prototype,"cameraManager",void 0),a([s({attribute:!1})],L.prototype,"cameraID",void 0),a([s({attribute:!1})],L.prototype,"forceVisibility",void 0),L=a([r("advanced-camera-card-ptz")],L);class ${constructor(t){this._documentVisible=!0,this._intersects=!1,this._loaded=!1,this._unloadConditions=null,this._intersectionObserver=new IntersectionObserver(this._intersectionHandler.bind(this)),this._listeners=[],this._visibilityHandler=()=>{this._documentVisible="visible"===document.visibilityState,this._lazyLoadOrUnloadIfNecessary()},this._host=t,this._host.addController(this)}setConfiguration(t,e){t||this._loaded||this._setLoaded(!0),this._unloadConditions=e??null}destroy(){this._removeEventHandlers(),this._listeners=[]}isLoaded(){return this._loaded}addListener(t){this._listeners.push(t)}removeListener(t){this._listeners=this._listeners.filter((e=>e!==t))}removeController(){this._host.removeController(this)}hostConnected(){this._addEventHandlers()}hostDisconnected(){this._removeEventHandlers(),this._setLoaded(!1)}_addEventHandlers(){document.addEventListener("visibilitychange",this._visibilityHandler),this._intersectionObserver.observe(this._host)}_removeEventHandlers(){document.removeEventListener("visibilitychange",this._visibilityHandler),this._intersectionObserver.disconnect()}_lazyLoadOrUnloadIfNecessary(){const t=!this._loaded&&this._documentVisible&&this._intersects,e=this._loaded&&(this._unloadConditions?.includes("hidden")&&!this._documentVisible||this._unloadConditions?.includes("unselected")&&!this._intersects);t?this._setLoaded(!0):e&&this._setLoaded(!1)}_setLoaded(t){this._loaded=t,this._notifyListeners(),this._host.requestUpdate()}_notifyListeners(){this._listeners.forEach((t=>t(this._loaded)))}_intersectionHandler(t){this._intersects=t.some((t=>t.isIntersecting)),this._lazyLoadOrUnloadIfNecessary()}}function T(t){y(t,"live:error")}export{x as A,$ as L,C as M,w as a,T as d};
|