From 941c653eb25b518ef8efbf257b0e183905488b44 Mon Sep 17 00:00:00 2001
From: Devolian <devondoyle@outlook.com>
Date: Wed, 20 Mar 2024 01:10:49 -0400
Subject: [PATCH 1/2] Fix mjpg stream accumulation in network

---
 .../src/components/app/photon-camera-stream.vue | 17 +++++++++++++++--
 1 file changed, 15 insertions(+), 2 deletions(-)

diff --git a/photon-client/src/components/app/photon-camera-stream.vue b/photon-client/src/components/app/photon-camera-stream.vue
index a836e4b362..607648ea8d 100644
--- a/photon-client/src/components/app/photon-camera-stream.vue
+++ b/photon-client/src/components/app/photon-camera-stream.vue
@@ -1,5 +1,5 @@
 <script setup lang="ts">
-import { computed, inject } from "vue";
+import { computed, inject, ref, onBeforeUnmount } from "vue";
 import { useCameraSettingsStore } from "@/stores/settings/CameraSettingsStore";
 import { useStateStore } from "@/stores/StateStore";
 import loadingImage from "@/assets/images/loading.svg";
@@ -53,11 +53,24 @@ const handleFullscreenRequest = () => {
   if (!stream) return;
   stream.requestFullscreen();
 };
+
+const mjpgStream: any = ref(null);
+onBeforeUnmount(() => {
+  if (!mjpgStream.value) return
+  mjpgStream.value["src"] = null;
+});
 </script>
 
 <template>
   <div class="stream-container">
-    <img :id="id" crossorigin="anonymous" :src="streamSrc" :alt="streamDesc" :style="streamStyle" />
+    <img
+      :id="id"
+      crossorigin="anonymous"
+      :src="streamSrc"
+      :alt="streamDesc"
+      :style="streamStyle"
+      ref="mjpgStream"
+    />
     <div class="stream-overlay" :style="overlayStyle">
       <pv-icon
         icon-name="mdi-camera-image"

From 951661db92417da20c670f06d3a2a99a0edb7e87 Mon Sep 17 00:00:00 2001
From: Devolian <devondoyle@outlook.com>
Date: Wed, 20 Mar 2024 17:27:08 -0400
Subject: [PATCH 2/2] update styling

---
 .../src/components/app/photon-camera-stream.vue       | 11 ++---------
 1 file changed, 2 insertions(+), 9 deletions(-)

diff --git a/photon-client/src/components/app/photon-camera-stream.vue b/photon-client/src/components/app/photon-camera-stream.vue
index 607648ea8d..34465e9389 100644
--- a/photon-client/src/components/app/photon-camera-stream.vue
+++ b/photon-client/src/components/app/photon-camera-stream.vue
@@ -56,21 +56,14 @@ const handleFullscreenRequest = () => {
 
 const mjpgStream: any = ref(null);
 onBeforeUnmount(() => {
-  if (!mjpgStream.value) return
+  if (!mjpgStream.value) return;
   mjpgStream.value["src"] = null;
 });
 </script>
 
 <template>
   <div class="stream-container">
-    <img
-      :id="id"
-      crossorigin="anonymous"
-      :src="streamSrc"
-      :alt="streamDesc"
-      :style="streamStyle"
-      ref="mjpgStream"
-    />
+    <img :id="id" crossorigin="anonymous" :src="streamSrc" :alt="streamDesc" :style="streamStyle" ref="mjpgStream" />
     <div class="stream-overlay" :style="overlayStyle">
       <pv-icon
         icon-name="mdi-camera-image"