From c7c91e1ebc8b3d9e5530ac169dce09881d7b481d Mon Sep 17 00:00:00 2001
From: Nicolas Mowen <nickmowen213@gmail.com>
Date: Thu, 7 Mar 2024 15:17:43 -0700
Subject: [PATCH] Always clear existing listener

---
 .../components/player/DynamicVideoPlayer.tsx   | 18 +++++++++---------
 web/src/views/events/RecordingView.tsx         |  1 +
 2 files changed, 10 insertions(+), 9 deletions(-)

diff --git a/web/src/components/player/DynamicVideoPlayer.tsx b/web/src/components/player/DynamicVideoPlayer.tsx
index 417ae784c..e090c208c 100644
--- a/web/src/components/player/DynamicVideoPlayer.tsx
+++ b/web/src/components/player/DynamicVideoPlayer.tsx
@@ -471,25 +471,25 @@ export class DynamicVideoController {
   }
 
   onPlayerTimeUpdate(listener: ((timestamp: number) => void) | undefined) {
+    if (this.playerProgressListener) {
+      this.playerRef.off("timeupdate", this.playerProgressListener);
+    }
+
     if (listener) {
       this.playerProgressListener = () =>
         listener(this.getProgress(this.playerRef.currentTime() || 0));
       this.playerRef.on("timeupdate", this.playerProgressListener);
-    } else {
-      if (this.playerProgressListener) {
-        this.playerRef.off("timeupdate", this.playerProgressListener);
-      }
     }
   }
 
-  onClipChangedEvent(listener: (dir: "forward") => void) {
+  onClipChangedEvent(listener: ((dir: "forward") => void) | undefined) {
+    if (this.playerEndedListener) {
+      this.playerRef.off("ended", this.playerEndedListener);
+    }
+
     if (listener) {
       this.playerEndedListener = () => listener("forward");
       this.playerRef.on("ended", this.playerEndedListener);
-    } else {
-      if (this.playerEndedListener) {
-        this.playerRef.off("ended", this.playerEndedListener);
-      }
     }
   }
 
diff --git a/web/src/views/events/RecordingView.tsx b/web/src/views/events/RecordingView.tsx
index ca7ef92e5..3eb7f776c 100644
--- a/web/src/views/events/RecordingView.tsx
+++ b/web/src/views/events/RecordingView.tsx
@@ -117,6 +117,7 @@ export function DesktopRecordingView({
       const lastController = videoPlayersRef.current[mainCamera];
       const newController = videoPlayersRef.current[newCam];
       lastController.onPlayerTimeUpdate(undefined);
+      lastController.onClipChangedEvent(undefined);
       lastController.scrubToTimestamp(currentTime);
       newController.onCanPlay(() => {
         newController.seekToTimestamp(currentTime, true);