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

feat(video_player): indicate unsupported file formats

Browse Source
This commit is contained in:
Elian Doran 2026-03-10 20:33:47 +02:00
parent 0ca665fb85
commit 5528701744
No known key found for this signature in database
2 changed files with 12 additions and 1 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

3
apps/client/src/translations/en/translation.json
View File

@ -1050,7 +1050,8 @@
"picture-in-picture": "Picture-in-picture",
"exit-picture-in-picture": "Exit picture-in-picture",
"fullscreen": "Fullscreen (F)",
"exit-fullscreen": "Exit fullscreen"
"exit-fullscreen": "Exit fullscreen",
"unsupported-format": "Video preview is not available for this file format."
},
"protected_session": {
"enter_password_instruction": "Showing protected note requires entering your password:",

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

@ -9,6 +9,7 @@ import { getUrlForDownload } from "../../../services/open";
import ActionButton from "../../react/ActionButton";
import Dropdown from "../../react/Dropdown";
import Icon from "../../react/Icon";
import NoItems from "../../react/NoItems";
function formatTime(seconds: number): string {
const mins = Math.floor(seconds / 60);
@ -22,8 +23,12 @@ export default function VideoPreview({ note }: { note: FNote }) {
const wrapperRef = useRef<HTMLDivElement>(null);
const videoRef = useRef<HTMLVideoElement>(null);
const [playing, setPlaying] = useState(false);
const [error, setError] = useState(false);
const { visible: controlsVisible, onMouseMove, flash: flashControls } = useAutoHideControls(videoRef, playing);
useEffect(() => setError(false), [note.noteId]);
const onError = useCallback(() => setError(true), []);
const togglePlayback = useCallback(() => {
const video = videoRef.current;
if (!video) return;
@ -97,6 +102,10 @@ export default function VideoPreview({ note }: { note: FNote }) {
}
}, [togglePlayback, flashControls]);
if (error) {
return <NoItems icon="bx bx-video-off" text={t("video.unsupported-format")} />;
}
return (
<div ref={wrapperRef} className={`video-preview-wrapper ${controlsVisible ? "" : "controls-hidden"}`} tabIndex={0} onClick={onVideoClick} onKeyDown={onKeyDown} onMouseMove={onMouseMove}>
<video
@ -106,6 +115,7 @@ export default function VideoPreview({ note }: { note: FNote }) {
datatype={note?.mime}
onPlay={() => setPlaying(true)}
onPause={() => setPlaying(false)}
onError={onError}
/>
<div className="video-preview-controls">