feat(video_player): add loop button

This commit is contained in:
Elian Doran 2026-03-10 20:05:40 +02:00
parent 7107fec1a4
commit 8af35da279
No known key found for this signature in database

View File

@ -51,6 +51,7 @@ export default function VideoPreview({ note }: { note: FNote }) {
<div className="left">
<PlaybackSpeed videoRef={videoRef} />
<RotateButton videoRef={videoRef} />
<LoopButton videoRef={videoRef} />
</div>
<div className="center">
<SkipButton videoRef={videoRef} seconds={-10} icon="bx bx-rewind" text="Back 10s" />
@ -254,6 +255,26 @@ function PlaybackSpeed({ videoRef }: { videoRef: RefObject<HTMLVideoElement> })
);
}
function LoopButton({ videoRef }: { videoRef: RefObject<HTMLVideoElement> }) {
const [loop, setLoop] = useState(false);
const toggle = () => {
const video = videoRef.current;
if (!video) return;
video.loop = !video.loop;
setLoop(video.loop);
};
return (
<ActionButton
className={loop ? "active" : ""}
icon="bx bx-repeat"
text={loop ? "Disable loop" : "Loop"}
onClick={toggle}
/>
);
}
function RotateButton({ videoRef }: { videoRef: RefObject<HTMLVideoElement> }) {
const [rotation, setRotation] = useState(0);