Mirrors/lossless-cut
1
0
Fork 0
mirror of https://github.com/mifi/lossless-cut.git synced 2024-11-25 03:33:14 +01:00
Code Issues Releases Activity

reduce flickering

Browse Source 
https://github.com/mifi/lossless-cut/issues/2083#issuecomment-2325291719
This commit is contained in:
Mikael Finstad 2024-09-03 23:02:03 +02:00
parent a2d7961903
commit 67cecb3bb1
No known key found for this signature in database
GPG Key ID: 25AB36E3E81CBC26
1 changed files with 12 additions and 2 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

14
src/renderer/src/MediaSourcePlayer.tsx
View File

@ -296,7 +296,15 @@ function MediaSourcePlayer({ rotate, filePath, playerTime, videoStream, audioStr
return () => undefined; return () => undefined;
} }
const onCanPlay = () => setLoading(false); const clearCanvas = () => {
if (canvasRef.current == null) return;
canvasRef.current.getContext('2d')?.clearRect(0, 0, canvasRef.current.width, canvasRef.current.height);
};
const onCanPlay = () => {
clearCanvas();
setLoading(false);
};
const getTargetTime = () => masterVideoRef.current!.currentTime - debouncedState.startTime; const getTargetTime = () => masterVideoRef.current!.currentTime - debouncedState.startTime;
const abortController = new AbortController(); const abortController = new AbortController();
@ -347,9 +355,11 @@ function MediaSourcePlayer({ rotate, filePath, playerTime, videoStream, audioStr
const { videoStyle, canvasStyle } = useMemo(() => { const { videoStyle, canvasStyle } = useMemo(() => {
const sharedStyle: CSSProperties = { position: 'absolute', left: 0, right: 0, top: 0, bottom: 0, display: 'block', width: '100%', height: '100%', objectFit: 'contain', transform: rotate ? `rotate(${rotate}deg)` : undefined }; const sharedStyle: CSSProperties = { position: 'absolute', left: 0, right: 0, top: 0, bottom: 0, display: 'block', width: '100%', height: '100%', objectFit: 'contain', transform: rotate ? `rotate(${rotate}deg)` : undefined };
const shouldShowCanvas = !debouncedState.playing;
return { return {
videoStyle: { ...sharedStyle, visibility: loading || !debouncedState.playing ? 'hidden' : undefined }, videoStyle: { ...sharedStyle, visibility: loading || !debouncedState.playing ? 'hidden' : undefined },
canvasStyle: { ...sharedStyle, visibility: loading || debouncedState.playing ? 'hidden' : undefined }, canvasStyle: { ...sharedStyle, visibility: shouldShowCanvas ? undefined : 'hidden' },
} as { videoStyle: CSSProperties, canvasStyle: CSSProperties }; } as { videoStyle: CSSProperties, canvasStyle: CSSProperties };
}, [loading, debouncedState.playing, rotate]); }, [loading, debouncedState.playing, rotate]);