Don't use autoplay logic for snapshots.

src/components/live.ts

@@ -682,7 +682,7 @@ export class FrigateCardLiveWebRTC extends LitElement {
    * Play the video.
    */
   public play(): void {
-    this._getPlayer()?.play().catch((_) => {
+    this._getPlayer()?.play().catch(() => {
       // WebRTC appears to generate additional spurious load events, which may
       // result in loads after a play() call, which causes the browser to spam
       // the logs unless the promise rejection is handled here.

src/components/media-carousel.ts

@@ -29,9 +29,10 @@ export class FrigateCardMediaCarousel extends FrigateCardCarousel {
   protected _previousControlRef: Ref<FrigateCardNextPreviousControl> = createRef();
 
   /**
-   * Play the media on the selected slide.
+   * Play the media on the selected slide. May be overridden to control when
+   * autoplay should happen.
    */
-  protected _playSelectedMediaHandler(): void {
+  protected _autoplayHandler(): void {
     (this._plugins['MediaAutoPlayPause'] as MediaAutoPlayPauseType | undefined)?.play();
   }
 
@@ -40,7 +41,7 @@ export class FrigateCardMediaCarousel extends FrigateCardCarousel {
    */
   connectedCallback(): void {
     super.connectedCallback();
-    this.addEventListener('frigate-card:media-show', this._playSelectedMediaHandler);
+    this.addEventListener('frigate-card:media-show', this._autoplayHandler);
   }
 
   /**
@@ -48,7 +49,7 @@ export class FrigateCardMediaCarousel extends FrigateCardCarousel {
    */
   disconnectedCallback(): void {
     super.disconnectedCallback();
-    this.removeEventListener('frigate-card:media-show', this._playSelectedMediaHandler);
+    this.removeEventListener('frigate-card:media-show', this._autoplayHandler);
   }
 
   protected _destroyCarousel(): void {

src/components/viewer.ts

@@ -265,6 +265,16 @@ export class FrigateCardViewerCarousel extends FrigateCardMediaCarousel {
     super.updated(changedProperties);
   }
 
+  /**
+   * Play the media on the selected slide. May be overridden to control when
+   * autoplay should happen.
+   */
+  protected _autoplayHandler(): void {
+    if (this.viewerConfig?.autoplay_clip) {
+      super._autoplayHandler();
+    }
+  }
+
   protected _destroyCarousel(): void {
     super._destroyCarousel();
 
@@ -308,9 +318,15 @@ export class FrigateCardViewerCarousel extends FrigateCardMediaCarousel {
             }),
           ]
         : []),
-      MediaAutoPlayPause({
-        playerSelector: 'frigate-card-ha-hls-player',
-      }),
+
+      // Don't need autoplay/pause for snapshots.
+      ...(this.view?.is('clip')
+        ? [
+            MediaAutoPlayPause({
+              playerSelector: 'frigate-card-ha-hls-player',
+            }),
+          ]
+        : []),
     ];
   }
 
@@ -699,7 +715,9 @@ export class FrigateCardViewerCarousel extends FrigateCardMediaCarousel {
                   // images in media-carousel.ts). Here we need to only call the
                   // media load handler on a 'real' load.
                   !lazyLoad ||
-                  (this._plugins['Lazyload'] as LazyloadType | undefined)?.hasLazyloaded(slideIndex)
+                  (this._plugins['Lazyload'] as LazyloadType | undefined)?.hasLazyloaded(
+                    slideIndex,
+                  )
                 ) {
                   this._mediaLoadedHandler(slideIndex, createMediaShowInfo(e));
                 }