Merge pull request #1015 from dermotduffy/auto-play-fix

Fix autoplay in media viewer
This commit is contained in:
Dermot Duffy
2023-03-18 15:36:50 -07:00
committed by GitHub
2 changed files with 15 additions and 11 deletions
+7 -5
View File
@@ -69,6 +69,8 @@ declare module 'view' {
}
}
const FRIGATE_CARD_LIVE_PROVIDER = 'frigate-card-live-provider';
/**
* Get the state object or dispatch an error. Used in `ha` and `image` live
* providers.
@@ -398,7 +400,7 @@ export class FrigateCardLiveCarousel extends LitElement {
this._lazyloadOrUnloadSlide('unload', index, slide),
}),
AutoMediaPlugin({
playerSelector: 'frigate-card-live-provider',
playerSelector: FRIGATE_CARD_LIVE_PROVIDER,
...(this.liveConfig?.auto_play && {
autoPlayCondition: this.liveConfig.auto_play,
}),
@@ -501,7 +503,7 @@ export class FrigateCardLiveCarousel extends LitElement {
}
const liveProvider = slide?.querySelector(
'frigate-card-live-provider',
FRIGATE_CARD_LIVE_PROVIDER,
) as FrigateCardLiveProvider | null;
if (liveProvider) {
liveProvider.disabled = action !== 'load';
@@ -686,7 +688,7 @@ export class FrigateCardLiveCarousel extends LitElement {
}
}
@customElement('frigate-card-live-provider')
@customElement(FRIGATE_CARD_LIVE_PROVIDER)
export class FrigateCardLiveProvider
extends LitElement
implements FrigateCardMediaPlayer
@@ -721,7 +723,7 @@ export class FrigateCardLiveProvider
protected _refProvider: Ref<Element & FrigateCardMediaPlayer> = createRef();
public async play(): Promise<void> {
playMediaMutingIfNecessary(this._refProvider.value)
playMediaMutingIfNecessary(this._refProvider.value);
}
public pause(): void {
@@ -922,7 +924,7 @@ export class FrigateCardLiveProvider
declare global {
interface HTMLElementTagNameMap {
'frigate-card-live-provider': FrigateCardLiveProvider;
FRIGATE_CARD_LIVE_PROVIDER: FrigateCardLiveProvider;
'frigate-card-live-carousel': FrigateCardLiveCarousel;
'frigate-card-live': FrigateCardLive;
}
+8 -6
View File
@@ -166,7 +166,7 @@ export class FrigateCardViewer extends LitElement {
}
}
const FRIGATE_CARD_HLS_SELECTOR = 'frigate-card-ha-hls-player';
const FRIGATE_CARD_VIEWER_PROVIDER = 'frigate-card-viewer-provider';
@customElement('frigate-card-viewer-carousel')
export class FrigateCardViewerCarousel extends LitElement {
@@ -237,7 +237,9 @@ export class FrigateCardViewerCarousel extends LitElement {
}
return (
(slide?.querySelector(FRIGATE_CARD_HLS_SELECTOR) as FrigateCardMediaPlayer) ?? null
(slide?.querySelector(
FRIGATE_CARD_VIEWER_PROVIDER,
) as unknown as FrigateCardMediaPlayer) ?? null
);
}
@@ -263,7 +265,7 @@ export class FrigateCardViewerCarousel extends LitElement {
}),
}),
AutoMediaPlugin({
playerSelector: FRIGATE_CARD_HLS_SELECTOR,
playerSelector: FRIGATE_CARD_VIEWER_PROVIDER,
...(this.viewerConfig?.auto_play && {
autoPlayCondition: this.viewerConfig.auto_play,
}),
@@ -511,7 +513,7 @@ export class FrigateCardViewerCarousel extends LitElement {
}
}
@customElement('frigate-card-viewer-provider')
@customElement(FRIGATE_CARD_VIEWER_PROVIDER)
export class FrigateCardViewerProvider
extends LitElement
implements FrigateCardMediaPlayer
@@ -545,7 +547,7 @@ export class FrigateCardViewerProvider
protected _refVideoProvider: Ref<Element & FrigateCardMediaPlayer> = createRef();
public async play(): Promise<void> {
playMediaMutingIfNecessary(this._refVideoProvider.value)
playMediaMutingIfNecessary(this._refVideoProvider.value);
}
public pause(): void {
@@ -701,6 +703,6 @@ declare global {
interface HTMLElementTagNameMap {
'frigate-card-viewer-carousel': FrigateCardViewerCarousel;
'frigate-card-viewer': FrigateCardViewer;
'frigate-card-viewer-provider': FrigateCardViewerProvider;
FRIGATE_CARD_VIEWER_PROVIDER: FrigateCardViewerProvider;
}
}