Browse Source

fix drag seeking inteference with real seeking

pull/138/head
Jelle van Snik 3 years ago
parent
commit
d9ccce1726
  1. 2
      src/video/components/actions/TimeAction.tsx
  2. 2
      src/video/state/init.ts
  3. 2
      src/video/state/logic/mediaplaying.ts
  4. 1
      src/video/state/providers/videoStateProvider.ts
  5. 1
      src/video/state/types.ts

2
src/video/components/actions/TimeAction.tsx

@ -40,7 +40,7 @@ export function TimeAction(props: Props) {
const hasHours = durationExceedsHour(videoTime.duration); const hasHours = durationExceedsHour(videoTime.duration);
const time = formatSeconds( const time = formatSeconds(
mediaPlaying.isSeeking ? videoTime.draggingTime : videoTime.time, mediaPlaying.isDragSeeking ? videoTime.draggingTime : videoTime.time,
hasHours hasHours
); );
const duration = formatSeconds(videoTime.duration, hasHours); const duration = formatSeconds(videoTime.duration, hasHours);

2
src/video/state/init.ts

@ -9,6 +9,7 @@ function initPlayer(): VideoPlayerState {
isFullscreen: false, isFullscreen: false,
isFocused: false, isFocused: false,
leftControlHovering: false, leftControlHovering: false,
popoutBounds: null,
}, },
mediaPlaying: { mediaPlaying: {
@ -16,6 +17,7 @@ function initPlayer(): VideoPlayerState {
isPaused: true, isPaused: true,
isLoading: false, isLoading: false,
isSeeking: false, isSeeking: false,
isDragSeeking: false,
isFirstLoading: true, isFirstLoading: true,
hasPlayedOnce: false, hasPlayedOnce: false,
volume: 0, volume: 0,

2
src/video/state/logic/mediaplaying.ts

@ -8,6 +8,7 @@ export type VideoMediaPlayingEvent = {
isPaused: boolean; isPaused: boolean;
isLoading: boolean; isLoading: boolean;
isSeeking: boolean; isSeeking: boolean;
isDragSeeking: boolean;
hasPlayedOnce: boolean; hasPlayedOnce: boolean;
isFirstLoading: boolean; isFirstLoading: boolean;
volume: number; volume: number;
@ -22,6 +23,7 @@ function getMediaPlayingFromState(
isPaused: state.mediaPlaying.isPaused, isPaused: state.mediaPlaying.isPaused,
isPlaying: state.mediaPlaying.isPlaying, isPlaying: state.mediaPlaying.isPlaying,
isSeeking: state.mediaPlaying.isSeeking, isSeeking: state.mediaPlaying.isSeeking,
isDragSeeking: state.mediaPlaying.isDragSeeking,
isFirstLoading: state.mediaPlaying.isFirstLoading, isFirstLoading: state.mediaPlaying.isFirstLoading,
volume: state.mediaPlaying.volume, volume: state.mediaPlaying.volume,
}; };

1
src/video/state/providers/videoStateProvider.ts

@ -99,6 +99,7 @@ export function createVideoStateProvider(
}, },
setSeeking(active) { setSeeking(active) {
state.mediaPlaying.isSeeking = active; state.mediaPlaying.isSeeking = active;
state.mediaPlaying.isDragSeeking = active;
updateMediaPlaying(descriptor, state); updateMediaPlaying(descriptor, state);
// if it was playing when starting to seek, play again // if it was playing when starting to seek, play again

1
src/video/state/types.ts

@ -31,6 +31,7 @@ export type VideoPlayerState = {
isPlaying: boolean; isPlaying: boolean;
isPaused: boolean; isPaused: boolean;
isSeeking: boolean; // seeking with progress bar isSeeking: boolean; // seeking with progress bar
isDragSeeking: boolean; // is seeking for our custom progress bar
isLoading: boolean; // buffering or not isLoading: boolean; // buffering or not
isFirstLoading: boolean; // first buffering of the video, when set to false the video can start playing isFirstLoading: boolean; // first buffering of the video, when set to false the video can start playing
hasPlayedOnce: boolean; // has the video played at all? hasPlayedOnce: boolean; // has the video played at all?

Loading…
Cancel
Save