Skip to content

Commit

Permalink
fix(player): Do not hide controls when seeking
Browse files Browse the repository at this point in the history
  • Loading branch information
matvp91 committed Sep 8, 2024
1 parent 465c48d commit 8048e14
Show file tree
Hide file tree
Showing 2 changed files with 17 additions and 10 deletions.
7 changes: 6 additions & 1 deletion packages/hlsjs/lib/ui/components/Controls.tsx
Original file line number Diff line number Diff line change
Expand Up @@ -12,6 +12,7 @@ import { useSettings } from "../hooks/useSettings";
import { TimeStat } from "./TimeStat";
import { useTime } from "../hooks/useTime";
import type { HlsState, HlsFacade } from "../../main";
import { useEffect, useState } from "react";

type ControlsProps = {
facade: HlsFacade;
Expand All @@ -25,9 +26,10 @@ export function Controls({ facade, state }: ControlsProps) {
nudge();
},
});
const [progressSeeking, setProgressSeeking] = useState(false);

let controlsVisible = visible;
if (settingsMode) {
if (settingsMode || progressSeeking) {
controlsVisible = true;
}

Expand All @@ -48,7 +50,10 @@ export function Controls({ facade, state }: ControlsProps) {
<Progress
time={time}
state={state}
seeking={progressSeeking}
setSeeking={setProgressSeeking}
onSeeked={(time) => {
nudge();
setTargetTime(time);
facade.seekTo(time);
}}
Expand Down
20 changes: 11 additions & 9 deletions packages/hlsjs/lib/ui/components/Progress.tsx
Original file line number Diff line number Diff line change
@@ -1,23 +1,25 @@
import {
PointerEventHandler,
useRef,
useState,
useEffect,
useCallback,
} from "react";
import { useRef, useState, useEffect, useCallback } from "react";
import { toHMS } from "../utils";
import cn from "clsx";
import type { HlsState } from "../../main";
import type { Dispatch, PointerEventHandler } from "react";

type ProgressProps = {
time: number;
state: HlsState;
seeking: boolean;
setSeeking: Dispatch<boolean>;
onSeeked(value: number): void;
};

export function Progress({ time, state, onSeeked }: ProgressProps) {
export function Progress({
time,
state,
seeking,
setSeeking,
onSeeked,
}: ProgressProps) {
const ref = useRef<HTMLDivElement>(null);
const [seeking, setSeeking] = useState(false);
const [hover, setHover] = useState(false);
const [value, setValue] = useState(0);

Expand Down

0 comments on commit 8048e14

Please sign in to comment.