diff --git a/components/player/CustomVideoPlayer.tsx b/components/player/CustomVideoPlayer.tsx index 1186133..2b91ff5 100644 --- a/components/player/CustomVideoPlayer.tsx +++ b/components/player/CustomVideoPlayer.tsx @@ -35,6 +35,7 @@ export function CustomVideoPlayer({ const [showSpeedMenu, setShowSpeedMenu] = useState(false); const controlsTimeoutRef = useRef(null); + const speedMenuTimeoutRef = useRef(null); const isDraggingProgressRef = useRef(false); const isDraggingVolumeRef = useRef(false); @@ -255,8 +256,38 @@ export function CustomVideoPlayer({ videoRef.current.playbackRate = speed; setPlaybackRate(speed); setShowSpeedMenu(false); + // Clear timeout when manually closing + if (speedMenuTimeoutRef.current) { + clearTimeout(speedMenuTimeoutRef.current); + } }; + // Auto-hide speed menu after 1.5s of inactivity + const startSpeedMenuTimeout = () => { + if (speedMenuTimeoutRef.current) { + clearTimeout(speedMenuTimeoutRef.current); + } + speedMenuTimeoutRef.current = setTimeout(() => { + setShowSpeedMenu(false); + }, 1500); + }; + + const clearSpeedMenuTimeout = () => { + if (speedMenuTimeoutRef.current) { + clearTimeout(speedMenuTimeoutRef.current); + } + }; + + // Start timeout when menu opens + useEffect(() => { + if (showSpeedMenu) { + startSpeedMenuTimeout(); + } else { + clearSpeedMenuTimeout(); + } + return () => clearSpeedMenuTimeout(); + }, [showSpeedMenu]); + // Format time helper const formatTime = (seconds: number) => { if (isNaN(seconds)) return '0:00'; @@ -400,6 +431,8 @@ export function CustomVideoPlayer({