gaschz/trilium
1
0
Fork 0
mirror of https://github.com/zadam/trilium.git synced 2026-03-13 11:53:38 +01:00
Code Issues Actions 25 Packages Projects Releases Wiki Activity

feat(video_player): space to toggle play/pause

Browse Source
This commit is contained in:
Elian Doran 2026-03-10 20:10:40 +02:00
parent 2cb54d7021
commit 755872277b
No known key found for this signature in database
1 changed files with 14 additions and 3 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

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

@ -23,8 +23,7 @@ export default function VideoPreview({ note }: { note: FNote }) {
const [playing, setPlaying] = useState(false);
const { visible: controlsVisible, onMouseMove } = useAutoHideControls(videoRef, playing);
const onVideoClick = useCallback((e: MouseEvent) => {
if ((e.target as HTMLElement).closest(".video-preview-controls")) return;
const togglePlayback = useCallback(() => {
const video = videoRef.current;
if (!video) return;
if (video.paused) {
@ -34,8 +33,20 @@ export default function VideoPreview({ note }: { note: FNote }) {
}
}, []);
const onVideoClick = useCallback((e: MouseEvent) => {
if ((e.target as HTMLElement).closest(".video-preview-controls")) return;
togglePlayback();
}, [togglePlayback]);
const onKeyDown = useCallback((e: KeyboardEvent) => {
if (e.key === " ") {
e.preventDefault();
togglePlayback();
}
}, [togglePlayback]);
return (
<div ref={wrapperRef} className={`video-preview-wrapper ${controlsVisible ? "" : "controls-hidden"}`} onClick={onVideoClick} onMouseMove={onMouseMove}>
<div ref={wrapperRef} className={`video-preview-wrapper ${controlsVisible ? "" : "controls-hidden"}`} tabIndex={0} onClick={onVideoClick} onKeyDown={onKeyDown} onMouseMove={onMouseMove}>
<video
ref={videoRef}
class="video-preview"