Added camera functionality

custom_components/browser_mod/browser_mod.js

@@ -732,19 +732,28 @@ const ConnectionMixin = (SuperClass) => {
                 }
             })();
         }
+        async _reregister(newData = {}) {
+            await this.connection.sendMessage({
+                type: "browser_mod/reregister",
+                deviceID: this.deviceID,
+                data: Object.assign(Object.assign({}, this.devices[this.deviceID]), newData),
+            });
+        }
         get meta() {
             if (!this.registered)
                 return null;
             return this.devices[this.deviceID].meta;
         }
         set meta(value) {
-            (async () => {
-                await this.connection.sendMessage({
-                    type: "browser_mod/reregister",
-                    deviceID: this.deviceID,
-                    data: Object.assign(Object.assign({}, this.devices[this.deviceID]), { meta: value })
-                });
-            })();
+            this._reregister({ meta: value });
+        }
+        get cameraEnabled() {
+            if (!this.registered)
+                return null;
+            return this.devices[this.deviceID].camera;
+        }
+        set cameraEnabled(value) {
+            this._reregister({ camera: value });
         }
         sendUpdate(data) {
             if (!this.connected || !this.registered)
@@ -923,6 +932,65 @@ const MediaPlayerMixin = (SuperClass) => {
     };
 };
 
+const CameraMixin = (SuperClass) => {
+    return class CameraMixinClass extends SuperClass {
+        constructor() {
+            super();
+            this._framerate = 2;
+            window.addEventListener("pointerdown", () => {
+                this._setup_camera();
+            }, { once: true });
+        }
+        async _setup_camera() {
+            if (this._video)
+                return;
+            await this.connectionPromise;
+            if (!this.cameraEnabled)
+                return;
+            const video = (this._video = document.createElement("video"));
+            video.autoplay = true;
+            video.playsInline = true;
+            video.style.display = "none";
+            const canvas = (this._canvas = document.createElement("canvas"));
+            canvas.style.display = "none";
+            document.body.appendChild(video);
+            document.body.appendChild(canvas);
+            if (!navigator.mediaDevices)
+                return;
+            const stream = await navigator.mediaDevices.getUserMedia({
+                video: true,
+                audio: false,
+            });
+            video.srcObject = stream;
+            video.play();
+            this.update_camera();
+        }
+        async update_camera() {
+            var _a;
+            if (!this.cameraEnabled) {
+                const stream = (_a = this._video) === null || _a === void 0 ? void 0 : _a.srcObject;
+                if (stream) {
+                    stream.getTracks().forEach((t) => t.stop());
+                    this._video.scrObject = undefined;
+                }
+                return;
+            }
+            const video = this._video;
+            const width = video.videoWidth;
+            const height = video.videoHeight;
+            this._canvas.width = width;
+            this._canvas.height = height;
+            const context = this._canvas.getContext("2d");
+            context.drawImage(video, 0, 0, width, height);
+            this.sendUpdate({
+                camera: this._canvas.toDataURL("image/jpeg"),
+            });
+            const interval = Math.round(1000 / this._framerate);
+            setTimeout(() => this.update_camera(), interval);
+        }
+    };
+};
+
 var name = "browser_mod";
 var version = "2.0.0b0";
 var description = "";
@@ -970,7 +1038,7 @@ var pjson = {
 //   FullyKioskMixin,
 //   BrowserModMediaPlayerMixin,
 // ]) {
-class BrowserMod extends MediaPlayerMixin(ScreenSaverMixin(ConnectionMixin(EventTarget))) {
+class BrowserMod extends CameraMixin(MediaPlayerMixin(ScreenSaverMixin(ConnectionMixin(EventTarget)))) {
     constructor() {
         super();
         this.entity_id = deviceID.replace("-", "_");