diff --git a/client/src/components/bunny-video-modal.tsx b/client/src/components/bunny-video-modal.tsx index 037034f..2fa88b5 100644 --- a/client/src/components/bunny-video-modal.tsx +++ b/client/src/components/bunny-video-modal.tsx @@ -1,5 +1,5 @@ import { useEffect, useState } from "react"; -import { X, Share2, Edit3, ChevronLeft, ChevronRight } from "lucide-react"; +import { X, Share2, Edit3, ChevronLeft, ChevronRight, Play } from "lucide-react"; import { type Video } from "@shared/schema"; import { Button } from "@/components/ui/button"; import { apiRequest } from "@/lib/queryClient"; @@ -55,6 +55,7 @@ export default function BunnyVideoModal({ video, isOpen, onClose, onEdit, videos const [showShareMenu, setShowShareMenu] = useState(false); const [showControls, setShowControls] = useState(false); const [controlsTimeout, setControlsTimeout] = useState(null); + const [showPlayButton, setShowPlayButton] = useState(true); // Navigation functions const getCurrentVideoIndex = () => { @@ -94,6 +95,17 @@ export default function BunnyVideoModal({ video, isOpen, onClose, onEdit, videos const handleVideoClick = (e: React.MouseEvent) => { e.stopPropagation(); showControlsTemporarily(); + setShowPlayButton(false); // Hide play button when clicked + }; + + const handlePlayButtonClick = (e: React.MouseEvent) => { + e.stopPropagation(); + setShowPlayButton(false); + // Try to trigger video play via postMessage to iframe + const iframe = document.querySelector('iframe'); + if (iframe && iframe.contentWindow) { + iframe.contentWindow.postMessage('{"method":"play"}', '*'); + } }; useEffect(() => { @@ -295,6 +307,17 @@ export default function BunnyVideoModal({ video, isOpen, onClose, onEdit, videos )} + {/* Central play button */} + {showPlayButton && ( + + )} + {/* Invisible overlay for controls interaction */}
setShowControls(false), 1500); setControlsTimeout(timeout); }} - style={{ pointerEvents: showControls ? 'none' : 'auto' }} + style={{ pointerEvents: (showControls || showPlayButton) ? 'none' : 'auto' }} >
{/* Navigation buttons - show/hide with controls */}