Add screenshot support.

src/patches/ha-camera-stream.ts

@@ -81,6 +81,10 @@ customElements.whenDefined('ha-camera-stream').then(() => {
       return this._player?.isPaused() ?? true;
     }
     
+    public async getScreenshotURL(): Promise<string | null> {
+      return this._player ? await this._player.getScreenshotURL() : null;
+    }
+
     /**
      * Master render method.
      * @returns A rendered template.

src/patches/ha-hls-player.ts

@@ -9,9 +9,10 @@
 // available as compilation time.
 // ====================================================================
 
-import { CSSResultGroup, TemplateResult, css, html, unsafeCSS } from 'lit';
+import { css, CSSResultGroup, html, TemplateResult, unsafeCSS } from 'lit';
 import { customElement } from 'lit/decorators.js';
 import { query } from 'lit/decorators/query.js';
+import { screenshotMedia } from '../utils/screenshot.js';
 import { dispatchErrorMessageEvent } from '../components/message.js';
 import liveHAComponentsStyle from '../scss/live-ha-components.scss';
 import { FrigateCardMediaPlayer } from '../types.js';
@@ -20,12 +21,10 @@ import {
   dispatchMediaLoadedEvent,
   dispatchMediaPauseEvent,
   dispatchMediaPlayEvent,
-  dispatchMediaVolumeChangeEvent,
+  dispatchMediaVolumeChangeEvent
 } from '../utils/media-info.js';
 import {
-  MEDIA_LOAD_CONTROLS_HIDE_SECONDS,
-  hideMediaControlsTemporarily,
-  setControlsOnVideo,
+  hideMediaControlsTemporarily, MEDIA_LOAD_CONTROLS_HIDE_SECONDS, setControlsOnVideo
 } from '../utils/media.js';
 
 customElements.whenDefined('ha-hls-player').then(() => {
@@ -84,6 +83,10 @@ customElements.whenDefined('ha-hls-player').then(() => {
       return this._video?.paused ?? true;
     }
 
+    public async getScreenshotURL(): Promise<string | null> {
+      return this._video ? screenshotMedia(this._video) : null;
+    }
+
     // =====================================================================================
     // Minor modifications from:
     // - https://github.com/home-assistant/frontend/blob/dev/src/components/ha-hls-player.ts

src/patches/ha-web-rtc-player.ts

@@ -12,6 +12,7 @@
 import { css, CSSResultGroup, html, TemplateResult, unsafeCSS } from 'lit';
 import { customElement } from 'lit/decorators.js';
 import { query } from 'lit/decorators/query.js';
+import { screenshotMedia } from '../utils/screenshot.js';
 import { dispatchErrorMessageEvent } from '../components/message.js';
 import liveHAComponentsStyle from '../scss/live-ha-components.scss';
 import { FrigateCardMediaPlayer } from '../types.js';
@@ -20,12 +21,12 @@ import {
   dispatchMediaLoadedEvent,
   dispatchMediaPauseEvent,
   dispatchMediaPlayEvent,
-  dispatchMediaVolumeChangeEvent,
+  dispatchMediaVolumeChangeEvent
 } from '../utils/media-info.js';
 import {
   hideMediaControlsTemporarily,
   MEDIA_LOAD_CONTROLS_HIDE_SECONDS,
-  setControlsOnVideo,
+  setControlsOnVideo
 } from '../utils/media.js';
 
 customElements.whenDefined('ha-web-rtc-player').then(() => {
@@ -83,6 +84,10 @@ customElements.whenDefined('ha-web-rtc-player').then(() => {
       return this._video?.paused ?? true;
     }
 
+    public async getScreenshotURL(): Promise<string | null> {
+      return this._video ? screenshotMedia(this._video) : null;
+    }
+
     // =====================================================================================
     // Minor modifications from:
     // - https://github.com/home-assistant/frontend/blob/dev/src/components/ha-web-rtc-player.ts