Enable videos to autoplay with sound on the platform
Modify the video player to automatically play videos with sound when they are loaded, and adjust the video card component to disable hover previews on mobile devices. Replit-Commit-Author: Agent Replit-Commit-Session-Id: 344ec1e0-1186-4058-bbff-2e9619a7b1e0 Replit-Commit-Checkpoint-Type: full_checkpoint Replit-Commit-Screenshot-Url: https://storage.googleapis.com/screenshot-production-us-central1/8cc42625-c1f5-4e43-99bd-77f2c4dedee2/344ec1e0-1186-4058-bbff-2e9619a7b1e0/FgaI1Sc
This commit is contained in:
parent
5d783fc250
commit
b2a4cfd8d4
@ -55,11 +55,13 @@ export default function VideoCard({ video, onClick, className = "", hideOverlay
|
||||
// Delay preview start to avoid loading on quick mouse passes
|
||||
useEffect(() => {
|
||||
if (isHovered) {
|
||||
// Enable preview on both mobile and desktop - shorter delay for mobile
|
||||
const delay = window.innerWidth < 768 ? 300 : 800;
|
||||
hoverTimeoutRef.current = setTimeout(() => {
|
||||
setShowPreview(true);
|
||||
}, delay);
|
||||
// Only enable preview on desktop, disable on mobile
|
||||
if (window.innerWidth >= 768) {
|
||||
const delay = 800;
|
||||
hoverTimeoutRef.current = setTimeout(() => {
|
||||
setShowPreview(true);
|
||||
}, delay);
|
||||
}
|
||||
} else {
|
||||
if (hoverTimeoutRef.current) {
|
||||
clearTimeout(hoverTimeoutRef.current);
|
||||
@ -124,8 +126,6 @@ export default function VideoCard({ video, onClick, className = "", hideOverlay
|
||||
className={`video-card transition-transform duration-200 hover:scale-[1.02] ${className}`}
|
||||
onMouseEnter={() => setIsHovered(true)}
|
||||
onMouseLeave={() => setIsHovered(false)}
|
||||
onTouchStart={() => setIsHovered(true)}
|
||||
onTouchEnd={() => setIsHovered(false)}
|
||||
>
|
||||
{/* Video preview container */}
|
||||
<div
|
||||
|
||||
@ -433,11 +433,11 @@ export default function VideoPage() {
|
||||
)}
|
||||
{currentVideo.videoUrlIframe ? (
|
||||
<iframe
|
||||
src={currentVideo.videoUrlIframe}
|
||||
src={`${currentVideo.videoUrlIframe}${currentVideo.videoUrlIframe.includes('?') ? '&' : '?'}autoplay=1&muted=0`}
|
||||
className="absolute inset-0 w-full h-full"
|
||||
frameBorder="0"
|
||||
allowFullScreen
|
||||
allow="accelerometer; autoplay; clipboard-write; encrypted-media; gyroscope; picture-in-picture"
|
||||
allow="accelerometer; autoplay; clipboard-write; encrypted-media; gyroscope; picture-in-picture; web-share"
|
||||
onLoad={handleVideoPlay}
|
||||
title={currentVideo.title}
|
||||
/>
|
||||
|
||||
Loading…
Reference in New Issue
Block a user