diff --git a/com.twin.app.shoptime/src/components/VideoPlayer/VideoPlayer.v3.js b/com.twin.app.shoptime/src/components/VideoPlayer/VideoPlayer.v3.js index c52529d3..e5f6cc23 100644 --- a/com.twin.app.shoptime/src/components/VideoPlayer/VideoPlayer.v3.js +++ b/com.twin.app.shoptime/src/components/VideoPlayer/VideoPlayer.v3.js @@ -2559,19 +2559,21 @@ const VideoPlayerBase = class extends React.Component { ) : null} - + {!panelInfo.modal && ( + + )} ); diff --git a/com.twin.app.shoptime/src/views/DetailPanel/ProductContentSection/ProductVideo/ProductVideo.v3.jsx b/com.twin.app.shoptime/src/views/DetailPanel/ProductContentSection/ProductVideo/ProductVideo.v3.jsx index 32095f2e..8f56868e 100644 --- a/com.twin.app.shoptime/src/views/DetailPanel/ProductContentSection/ProductVideo/ProductVideo.v3.jsx +++ b/com.twin.app.shoptime/src/views/DetailPanel/ProductContentSection/ProductVideo/ProductVideo.v3.jsx @@ -35,6 +35,7 @@ export default function ProductVideo({ const [modalState, setModalState] = useState(true); // 모달 상태 관리 추가 const [hasAutoPlayed, setHasAutoPlayed] = useState(false); // 자동 재생 완료 여부 const [isVideoPlaying, setIsVideoPlaying] = useState(false); // 비디오 재생 여부 flag + const [isVideoLoading, setIsVideoLoading] = useState(false); // 비디오 로딩 중 flag const prevModalStateRef = useRef(null); // 이전 modal 상태 추적 const topPanel = panels[panels.length - 1]; @@ -97,6 +98,7 @@ export default function ProductVideo({ // prdtMediaUrl: productInfo?.prdtMediaUrl?.substring(0, 50), // }); setHasAutoPlayed(true); + setIsVideoLoading(true); // 로딩 시작 // 짧은 딜레이 후 재생 시작 (컴포넌트 마운트 완료 후) setTimeout(() => { @@ -129,6 +131,7 @@ export default function ProductVideo({ continuousPlay, // 반복 재생 옵션 전달 }) ); + setIsVideoLoading(false); // 로딩 완료 }, 100); } }, [ @@ -199,9 +202,16 @@ export default function ProductVideo({ const handleVideoClick = useCallback(() => { // console.log('[ProductVideo] ========== handleVideoClick 호출 =========='); // console.log('[ProductVideo] canPlayVideo:', canPlayVideo); + // console.log('[ProductVideo] isVideoLoading:', isVideoLoading); // console.log('[ProductVideo] panels.length:', panels.length); // console.log('[ProductVideo] All panels:', JSON.stringify(panels, null, 2)); + // 비디오 로딩 중이면 클릭 무시 + if (isVideoLoading) { + console.log('[ProductVideo] ⚠️ 비디오 로딩 중 - 클릭 무시'); + return; + } + if (canPlayVideo) { const currentTopPanel = panels[panels.length - 1]; @@ -280,6 +290,7 @@ export default function ProductVideo({ modalClassNameChange, panels, modalState, + isVideoLoading, ]); if (!canPlayVideo) return null;