diff --git a/src/app/play/page.tsx b/src/app/play/page.tsx index 8841c51..0fbc760 100644 --- a/src/app/play/page.tsx +++ b/src/app/play/page.tsx @@ -91,6 +91,13 @@ function PlayPageClient() { const [showOrientationTip, setShowOrientationTip] = useState(false); const orientationTipTimeoutRef = useRef(null); + // 长按三倍速相关状态 + const [isLongPressing, setIsLongPressing] = useState(false); + const [showSpeedTip, setShowSpeedTip] = useState(false); + const longPressTimeoutRef = useRef(null); + const originalPlaybackRateRef = useRef(1); + const speedTipTimeoutRef = useRef(null); + // 用于记录是否需要在播放器 ready 后跳转到指定进度 const resumeTimeRef = useRef(null); @@ -601,6 +608,12 @@ function PlayPageClient() { if (saveIntervalRef.current) { clearInterval(saveIntervalRef.current); } + if (longPressTimeoutRef.current) { + clearTimeout(longPressTimeoutRef.current); + } + if (speedTipTimeoutRef.current) { + clearTimeout(speedTipTimeoutRef.current); + } // 清理视频事件监听器 if (videoEventListenersRef.current) { @@ -1122,6 +1135,87 @@ function PlayPageClient() { }; }, []); + // 长按三倍速处理函数 + const handleTouchStart = (e: TouchEvent) => { + // 防止在控制栏区域触发 + const target = e.target as HTMLElement; + if (target.closest('.art-controls') || target.closest('.art-contextmenu')) { + return; + } + + // 清除之前的定时器 + if (longPressTimeoutRef.current) { + clearTimeout(longPressTimeoutRef.current); + } + + // 设置长按检测定时器(500ms) + longPressTimeoutRef.current = setTimeout(() => { + if (artPlayerRef.current && artPlayerRef.current.video) { + // 保存原始播放速度 + originalPlaybackRateRef.current = + artPlayerRef.current.video.playbackRate; + + // 设置三倍速 + artPlayerRef.current.video.playbackRate = 3; + + // 更新状态 + setIsLongPressing(true); + setShowSpeedTip(true); + + // 触发震动反馈(如果支持) + if (navigator.vibrate) { + navigator.vibrate(50); + } + + // 3秒后自动隐藏提示 + if (speedTipTimeoutRef.current) { + clearTimeout(speedTipTimeoutRef.current); + } + speedTipTimeoutRef.current = setTimeout(() => { + setShowSpeedTip(false); + }, 3000); + } + }, 500); + }; + + const handleTouchEnd = () => { + // 清除长按检测定时器 + if (longPressTimeoutRef.current) { + clearTimeout(longPressTimeoutRef.current); + longPressTimeoutRef.current = null; + } + + // 如果正在长按,恢复原始播放速度 + if (isLongPressing && artPlayerRef.current && artPlayerRef.current.video) { + artPlayerRef.current.video.playbackRate = originalPlaybackRateRef.current; + setIsLongPressing(false); + setShowSpeedTip(false); + + // 清除提示定时器 + if (speedTipTimeoutRef.current) { + clearTimeout(speedTipTimeoutRef.current); + speedTipTimeoutRef.current = null; + } + } + }; + + // 添加触摸事件监听器 + useEffect(() => { + if (!artRef.current) return; + + const element = artRef.current; + + element.addEventListener('touchstart', handleTouchStart, { passive: true }); + element.addEventListener('touchend', handleTouchEnd, { passive: true }); + element.addEventListener('touchcancel', handleTouchEnd, { passive: true }); + + return () => { + element.removeEventListener('touchstart', handleTouchStart); + element.removeEventListener('touchend', handleTouchEnd); + element.removeEventListener('touchcancel', handleTouchEnd); + }; + }, [artRef.current, isLongPressing]); + if (loading) { return (
@@ -1325,6 +1419,30 @@ function PlayPageClient() {
+ {/* 三倍速提示 */} +
+
+ + + + 3x 倍速 +
+
+ {/* 选集侧拉面板 */} {totalEpisodes > 1 && ( <>