gaschz/trilium
1
0
Fork 0
mirror of https://github.com/zadam/trilium.git synced 2026-03-22 16:23:50 +01:00
Code Issues Actions 19 Packages Projects Releases Wiki Activity

fix(video): playing button not working

Browse Source
This commit is contained in:
Elian Doran 2026-03-11 20:49:57 +02:00
parent f8b4c6cb15
commit 1c628fba4c
No known key found for this signature in database
3 changed files with 7 additions and 15 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

2
apps/client/src/widgets/type_widgets/file/Audio.tsx
View File

@ -54,7 +54,7 @@ export default function AudioPreview({ note }: { note: FNote }) {
<div className="center">
<div className="spacer" />
<SkipButton mediaRef={audioRef} seconds={-10} icon="bx bx-rewind" text={t("media.back-10s")} />
<PlayPauseButton mediaRef={audioRef} playing={playing} />
<PlayPauseButton playing={playing} togglePlayback={togglePlayback} />
<SkipButton mediaRef={audioRef} seconds={30} icon="bx bx-fast-forward" text={t("media.forward-30s")} />
<LoopButton mediaRef={audioRef} />
</div>

16
apps/client/src/widgets/type_widgets/file/MediaPlayer.tsx
View File

@ -56,18 +56,10 @@ function formatTime(seconds: number): string {
return `${mins}:${secs.toString().padStart(2, "0")}`;
}
export function PlayPauseButton({ mediaRef, playing }: { mediaRef: RefObject<HTMLVideoElement | HTMLAudioElement>, playing: boolean }) {
const togglePlayback = () => {
const media = mediaRef.current;
if (!media) return;
if (media.paused) {
media.play();
} else {
media.pause();
}
};
export function PlayPauseButton({ playing, togglePlayback }: {
playing: boolean,
togglePlayback: () => void
}) {
return (
<ActionButton
className="play-button"

4
apps/client/src/widgets/type_widgets/file/Video.tsx
View File

@ -33,7 +33,7 @@ export default function VideoPreview({ note }: { note: FNote }) {
}, []);
const onVideoClick = useCallback((e: MouseEvent) => {
if ((e.target as HTMLElement).closest(".video-preview-controls")) return;
if ((e.target as HTMLElement).closest(".media-preview-controls")) return;
togglePlayback();
}, [togglePlayback]);
@ -65,7 +65,7 @@ export default function VideoPreview({ note }: { note: FNote }) {
<div className="center">
<div className="spacer" />
<SkipButton mediaRef={videoRef} seconds={-10} icon="bx bx-rewind" text={t("media.back-10s")} />
<PlayPauseButton mediaRef={videoRef} playing={playing} />
<PlayPauseButton playing={playing} togglePlayback={togglePlayback} />
<SkipButton mediaRef={videoRef} seconds={30} icon="bx bx-fast-forward" text={t("media.forward-30s")} />
<LoopButton mediaRef={videoRef} />
</div>