diff --git a/src/components/VideoCard.tsx b/src/components/VideoCard.tsx index 3038b63..d8423f4 100644 --- a/src/components/VideoCard.tsx +++ b/src/components/VideoCard.tsx @@ -21,7 +21,6 @@ import { saveFavorite, subscribeToDataUpdates, } from '@/lib/db.client'; -import { isMobileDevice, isTouchDevice } from '@/lib/device'; import { processImageUrl } from '@/lib/utils'; import { useLongPress } from '@/hooks/useLongPress'; @@ -80,8 +79,6 @@ const VideoCard = forwardRef(function VideoCard const router = useRouter(); const [favorited, setFavorited] = useState(false); const [isLoading, setIsLoading] = useState(false); - const [isMobile, setIsMobile] = useState(false); - const [isTouch, setIsTouch] = useState(false); const [showMobileActions, setShowMobileActions] = useState(false); const [searchFavorited, setSearchFavorited] = useState(null); // 搜索结果的收藏状态 @@ -101,12 +98,6 @@ const VideoCard = forwardRef(function VideoCard setDynamicSourceNames(source_names); }, [source_names]); - // 检测设备类型 - useEffect(() => { - setIsMobile(isMobileDevice()); - setIsTouch(isTouchDevice()); - }, []); - useImperativeHandle(ref, () => ({ setEpisodes: (eps?: number) => setDynamicEpisodes(eps), setSourceNames: (names?: string[]) => setDynamicSourceNames(names), @@ -259,9 +250,9 @@ const VideoCard = forwardRef(function VideoCard } }, [from, isAggregate, actualSource, actualId, searchFavorited]); - // 移动端长按操作 + // 长按操作 const handleLongPress = useCallback(() => { - if (isMobile && !showMobileActions) { // 防止重复触发 + if (!showMobileActions) { // 防止重复触发 // 立即显示菜单,避免等待数据加载导致动画卡顿 setShowMobileActions(true); @@ -270,7 +261,7 @@ const VideoCard = forwardRef(function VideoCard checkSearchFavoriteStatus(); } } - }, [isMobile, showMobileActions, from, isAggregate, actualSource, actualId, searchFavorited, checkSearchFavoriteStatus]); + }, [showMobileActions, from, isAggregate, actualSource, actualId, searchFavorited, checkSearchFavoriteStatus]); // 长按手势hook const longPressProps = useLongPress({ @@ -444,10 +435,9 @@ const VideoCard = forwardRef(function VideoCard return ( <>
(function VideoCard {/* 悬浮遮罩 */}
(function VideoCard }} /> - {/* 播放按钮 - Touch设备隐藏,非Touch设备显示 */} - {config.showPlayButton && !isTouch && ( + {/* 播放按钮 */} + {config.showPlayButton && (
(function VideoCard
)} - - - {/* 操作按钮 - Touch设备隐藏,非Touch设备显示 */} - {(config.showHeart || config.showCheckCircle) && !isTouch && ( + {/* 操作按钮 */} + {(config.showHeart || config.showCheckCircle) && (
(function VideoCard
)} - {/* 豆瓣链接 - Touch设备隐藏,非Touch设备显示 */} - {config.showDoubanLink && actualDoubanId && actualDoubanId !== 0 && !isTouch && ( + {/* 豆瓣链接 */} + {config.showDoubanLink && actualDoubanId && actualDoubanId !== 0 && ( { - if (typeof window === 'undefined') return false; - - // 检测触摸屏支持 - const hasTouchScreen = 'ontouchstart' in window || navigator.maxTouchPoints > 0; - - // 检测用户代理 - const userAgent = navigator.userAgent.toLowerCase(); - const mobileKeywords = ['mobile', 'android', 'iphone', 'ipad', 'tablet']; - const isMobileUA = mobileKeywords.some(keyword => userAgent.includes(keyword)); - - // 检测屏幕尺寸(小于768px认为是移动设备) - const isSmallScreen = window.innerWidth < 768; - - return hasTouchScreen && (isMobileUA || isSmallScreen); -}; - -// 检测是否为触摸设备 -export const isTouchDevice = (): boolean => { - if (typeof window === 'undefined') return false; - return 'ontouchstart' in window || navigator.maxTouchPoints > 0; -}; - -// 获取设备类型 -export const getDeviceType = (): 'mobile' | 'tablet' | 'desktop' => { - if (typeof window === 'undefined') return 'desktop'; - - const width = window.innerWidth; - const userAgent = navigator.userAgent.toLowerCase(); - - if (width < 768 || userAgent.includes('mobile') || userAgent.includes('iphone')) { - return 'mobile'; - } else if (width < 1024 || userAgent.includes('tablet') || userAgent.includes('ipad')) { - return 'tablet'; - } else { - return 'desktop'; - } -};