diff --git a/src/components/player/AndroidVideoPlayer.tsx b/src/components/player/AndroidVideoPlayer.tsx index b64379cd..a73386a9 100644 --- a/src/components/player/AndroidVideoPlayer.tsx +++ b/src/components/player/AndroidVideoPlayer.tsx @@ -233,6 +233,33 @@ const AndroidVideoPlayer: React.FC = () => { }).start(); }, [playerState.showControls]); + // Auto-hide controls after 3 seconds of inactivity + useEffect(() => { + // Clear any existing timeout + if (controlsTimeout.current) { + clearTimeout(controlsTimeout.current); + controlsTimeout.current = null; + } + + // Only set timeout if controls are visible and video is playing + if (playerState.showControls && !playerState.paused) { + controlsTimeout.current = setTimeout(() => { + // Don't hide if user is dragging the seek bar + if (!playerState.isDragging.current) { + playerState.setShowControls(false); + } + }, 3000); // 3 seconds delay + } + + // Cleanup on unmount or when dependencies change + return () => { + if (controlsTimeout.current) { + clearTimeout(controlsTimeout.current); + controlsTimeout.current = null; + } + }; + }, [playerState.showControls, playerState.paused, playerState.isDragging]); + useEffect(() => { openingAnimation.startOpeningAnimation(); }, []); @@ -458,7 +485,10 @@ const AndroidVideoPlayer: React.FC = () => { }, [playerState.currentTime, useCustomSubtitles, customSubtitles]); const toggleControls = useCallback(() => { - playerState.setShowControls(prev => !prev); + playerState.setShowControls(prev => { + // If we're showing controls, the useEffect will handle the auto-hide timer + return !prev; + }); }, []); const hideControls = useCallback(() => { @@ -880,6 +910,7 @@ const AndroidVideoPlayer: React.FC = () => { visible={speedControl.showSpeedActivatedOverlay} opacity={speedControl.speedActivatedOverlayOpacity} speed={speedControl.holdToSpeedValue} + screenDimensions={playerState.screenDimensions} />