From d9ccce17266fbc492d4b2353c13f8f7756bb2f8d Mon Sep 17 00:00:00 2001
From: Jelle van Snik <jellevs@gmail.com>
Date: Tue, 7 Feb 2023 23:38:39 +0100
Subject: [PATCH] fix drag seeking inteference with real seeking

---
 src/video/components/actions/TimeAction.tsx     | 2 +-
 src/video/state/init.ts                         | 2 ++
 src/video/state/logic/mediaplaying.ts           | 2 ++
 src/video/state/providers/videoStateProvider.ts | 1 +
 src/video/state/types.ts                        | 1 +
 5 files changed, 7 insertions(+), 1 deletion(-)

diff --git a/src/video/components/actions/TimeAction.tsx b/src/video/components/actions/TimeAction.tsx
index e9969224..493f6d26 100644
--- a/src/video/components/actions/TimeAction.tsx
+++ b/src/video/components/actions/TimeAction.tsx
@@ -40,7 +40,7 @@ export function TimeAction(props: Props) {
 
   const hasHours = durationExceedsHour(videoTime.duration);
   const time = formatSeconds(
-    mediaPlaying.isSeeking ? videoTime.draggingTime : videoTime.time,
+    mediaPlaying.isDragSeeking ? videoTime.draggingTime : videoTime.time,
     hasHours
   );
   const duration = formatSeconds(videoTime.duration, hasHours);
diff --git a/src/video/state/init.ts b/src/video/state/init.ts
index 2d040774..6914befa 100644
--- a/src/video/state/init.ts
+++ b/src/video/state/init.ts
@@ -9,6 +9,7 @@ function initPlayer(): VideoPlayerState {
       isFullscreen: false,
       isFocused: false,
       leftControlHovering: false,
+      popoutBounds: null,
     },
 
     mediaPlaying: {
@@ -16,6 +17,7 @@ function initPlayer(): VideoPlayerState {
       isPaused: true,
       isLoading: false,
       isSeeking: false,
+      isDragSeeking: false,
       isFirstLoading: true,
       hasPlayedOnce: false,
       volume: 0,
diff --git a/src/video/state/logic/mediaplaying.ts b/src/video/state/logic/mediaplaying.ts
index 354c0c09..ebe89875 100644
--- a/src/video/state/logic/mediaplaying.ts
+++ b/src/video/state/logic/mediaplaying.ts
@@ -8,6 +8,7 @@ export type VideoMediaPlayingEvent = {
   isPaused: boolean;
   isLoading: boolean;
   isSeeking: boolean;
+  isDragSeeking: boolean;
   hasPlayedOnce: boolean;
   isFirstLoading: boolean;
   volume: number;
@@ -22,6 +23,7 @@ function getMediaPlayingFromState(
     isPaused: state.mediaPlaying.isPaused,
     isPlaying: state.mediaPlaying.isPlaying,
     isSeeking: state.mediaPlaying.isSeeking,
+    isDragSeeking: state.mediaPlaying.isDragSeeking,
     isFirstLoading: state.mediaPlaying.isFirstLoading,
     volume: state.mediaPlaying.volume,
   };
diff --git a/src/video/state/providers/videoStateProvider.ts b/src/video/state/providers/videoStateProvider.ts
index 1562945c..2ad29151 100644
--- a/src/video/state/providers/videoStateProvider.ts
+++ b/src/video/state/providers/videoStateProvider.ts
@@ -99,6 +99,7 @@ export function createVideoStateProvider(
     },
     setSeeking(active) {
       state.mediaPlaying.isSeeking = active;
+      state.mediaPlaying.isDragSeeking = active;
       updateMediaPlaying(descriptor, state);
 
       // if it was playing when starting to seek, play again
diff --git a/src/video/state/types.ts b/src/video/state/types.ts
index 19ba6c1e..a0454ff0 100644
--- a/src/video/state/types.ts
+++ b/src/video/state/types.ts
@@ -31,6 +31,7 @@ export type VideoPlayerState = {
     isPlaying: boolean;
     isPaused: boolean;
     isSeeking: boolean; // seeking with progress bar
+    isDragSeeking: boolean; // is seeking for our custom progress bar
     isLoading: boolean; // buffering or not
     isFirstLoading: boolean; // first buffering of the video, when set to false the video can start playing
     hasPlayedOnce: boolean; // has the video played at all?