[251118] fix: HomePanel isOnTop에서 항상 비디오 재생조건-1

🕐 커밋 시간: 2025. 11. 18. 12:27:13

📊 변경 통계:
  • 총 파일: 2개
  • 추가: +86줄
  • 삭제: -23줄

📝 수정된 파일:
  ~ com.twin.app.shoptime/src/actions/playActions.js
  ~ com.twin.app.shoptime/src/views/HomePanel/HomePanel.jsx

🔧 주요 변경 내용:
  • 핵심 비즈니스 로직 개선
  • 소규모 기능 개선

com.twin.app.shoptime/src/actions/playActions.js

@@ -112,16 +112,17 @@ export const startVideoPlayer =
     );
     console.log('[startVideoPlayer] ✨ Panel action dispatched');
 
-    if (modal && modalContainerId && !spotlightDisable) {
+    // [COMMENTED OUT] 비디오 재생 시 강제 포커스 이동 비활성화
-      console.log('[startVideoPlayer] 🎯 Setting Spotlight focus - containerId:', modalContainerId);
+    // if (modal && modalContainerId && !spotlightDisable) {
-      Spotlight.setPointerMode(false);
+    //   console.log('[startVideoPlayer] 🎯 Setting Spotlight focus - containerId:', modalContainerId);
-      startVideoFocusTimer = setTimeout(() => {
+    //   Spotlight.setPointerMode(false);
-        console.log('[startVideoPlayer] 🔍 Spotlight.focus called');
+    //   startVideoFocusTimer = setTimeout(() => {
-        Spotlight.focus(modalContainerId);
+    //     console.log('[startVideoPlayer] 🔍 Spotlight.focus called');
-      }, 0);
+    //     Spotlight.focus(modalContainerId);
-    } else {
+    //   }, 0);
-      console.log('[startVideoPlayer] ⏭️ Spotlight focus skipped - modal:', modal, ', modalContainerId:', !!modalContainerId, ', spotlightDisable:', spotlightDisable);
+    // } else {
-    }
+    //   console.log('[startVideoPlayer] ⏭️ Spotlight focus skipped - modal:', modal, ', modalContainerId:', !!modalContainerId, ', spotlightDisable:', spotlightDisable);
+    // }
 
     console.log('[startVideoPlayer] ✅ END');
   };
@@ -229,16 +230,17 @@ export const startVideoPlayerNew =
     );
     console.log('[startVideoPlayerNew] *** ✨ Panel action dispatched - action:', panelWorkingAction === updatePanel ? 'updatePanel' : 'pushPanel');
 
-    if (modal && modalContainerId && !spotlightDisable) {
+    // [COMMENTED OUT] 비디오 재생 시 강제 포커스 이동 비활성화
-      console.log('[startVideoPlayerNew] *** 🎯 Setting Spotlight focus - containerId:', modalContainerId);
+    // if (modal && modalContainerId && !spotlightDisable) {
-      Spotlight.setPointerMode(false);
+    //   console.log('[startVideoPlayerNew] *** 🎯 Setting Spotlight focus - containerId:', modalContainerId);
-      startVideoFocusTimer = setTimeout(() => {
+    //   Spotlight.setPointerMode(false);
-        console.log('[startVideoPlayerNew] *** 🔍 Spotlight.focus called');
+    //   startVideoFocusTimer = setTimeout(() => {
-        Spotlight.focus(modalContainerId);
+    //     console.log('[startVideoPlayerNew] *** 🔍 Spotlight.focus called');
-      }, 0);
+    //     Spotlight.focus(modalContainerId);
-    } else {
+    //   }, 0);
-      console.log('[startVideoPlayerNew] *** ⏭️ Spotlight focus skipped - modal:', modal, ', modalContainerId:', !!modalContainerId, ', spotlightDisable:', spotlightDisable);
+    // } else {
-    }
+    //   console.log('[startVideoPlayerNew] *** ⏭️ Spotlight focus skipped - modal:', modal, ', modalContainerId:', !!modalContainerId, ', spotlightDisable:', spotlightDisable);
+    // }
 
     console.log('[startVideoPlayerNew] *** ✅ END');
   };

com.twin.app.shoptime/src/views/HomePanel/HomePanel.jsx

@@ -108,6 +108,7 @@ const HomePanel = ({ isOnTop }) => {
   const webOSVersion = useSelector((state) => state.common.appStatus?.webOSVersion);
   const enterThroughGNB = useSelector((state) => state.home.enterThroughGNB);
   const defaultFocus = useSelector((state) => state.home.defaultFocus);
+  const bannerDataList = useSelector((state) => state.home.bannerData?.bannerInfos);
 
   // ✅ PlayerPanel의 shouldShrinkTo1px 상태 추적
   const playerPanelShouldShrink = useSelector((state) => {
@@ -763,7 +764,67 @@ const HomePanel = ({ isOnTop }) => {
       console.log('[HomePanel] *** videoPlayIntentRef.current:', videoPlayIntentRef.current);
       console.log('[HomePanel] *** lastPlayedBannerIdRef.current:', lastPlayedBannerIdRef.current);
 
-      // [TODO] DetailPanel 닫힘 후 비디오 자동 재생 복구
+      // 🔽 videoPlayIntentRef가 null인 경우: 비디오 재생 가능한 첫 번째 배너 찾기
+      if (!videoPlayIntentRef.current && bannerDataList) {
+        console.log('[HomePanel] *** videoPlayIntentRef가 null - 첫 번째 비디오 배너 검색');
+
+        // HomeBanner.jsx의 defaultFocus 계산 로직과 동일
+        let targetIndex = 0;
+        let targetBannerData = null;
+        let videoData = null;
+
+        for (let i = 0; i < bannerDataList.length; i++) {
+          const data = bannerDataList[i];
+          const bannerDetailInfos = data.bannerDetailInfos;
+
+          if (data.shptmDspyTpNm === 'Random') {
+            if (
+              bannerDetailInfos[data.randomIndex].shptmBanrTpNm === 'LIVE' ||
+              bannerDetailInfos[data.randomIndex].shptmBanrTpNm === 'VOD'
+            ) {
+              targetIndex = i;
+              targetBannerData = data;
+              videoData = bannerDetailInfos[data.randomIndex];
+              break;
+            }
+          } else if (
+            bannerDetailInfos.find((el) => el.shptmBanrTpNm === 'LIVE' || el.shptmBanrTpNm === 'VOD')
+          ) {
+            targetIndex = i;
+            targetBannerData = data;
+            videoData = bannerDetailInfos[0];
+            break;
+          }
+        }
+
+        if (targetBannerData && videoData) {
+          const bannerId = 'banner' + targetIndex;
+          console.log('[HomePanel] *** 찾은 비디오 배너:', bannerId, videoData);
+
+          // videoPlayIntentRef에 값 할당 (HomeBanner.jsx의 초기 재생 로직과 동일)
+          videoPlayIntentRef.current = {
+            bannerId: bannerId,
+            videoProps: {
+              bannerId: bannerId,
+              showUrl: videoData.showUrl,
+              patnrId: videoData.patnrId,
+              showId: videoData.showId,
+              shptmBanrTpNm: videoData.shptmBanrTpNm,
+              lgCatCd: videoData.lgCatCd,
+              chanId: videoData.brdcChnlId,
+              modal: true,
+              modalContainerId: bannerId,
+            },
+          };
+
+          lastPlayedBannerIdRef.current = bannerId;
+          console.log('[HomePanel] *** videoPlayIntentRef 설정 완료:', videoPlayIntentRef.current);
+        } else {
+          console.log('[HomePanel] *** ⚠️ 비디오 재생 가능한 배너를 찾지 못함');
+        }
+      }
+
+      // DetailPanel 닫힘 후 비디오 자동 재생 복구
       if (videoPlayIntentRef.current && lastPlayedBannerIdRef.current) {
         // 🔽 videoPlayIntentRef는 videoProps에 비디오 정보를 담고 있으므로 풀어서 전달
         //     혹시 videoProps에 없는 필드는 상위 레벨을 fallback으로 사용
@@ -772,7 +833,7 @@ const HomePanel = ({ isOnTop }) => {
 
         // 🔽 [251118] 현재 스크롤 위치 확인하여 비디오 크기 결정
         const currentScrollTop = prevScrollTopRef.current;
-        const shouldShrink = currentScrollTop > 1;
+        const shouldShrink = currentScrollTop > 0;
         console.log('[HomePanel] *** 비디오 복구 - currentScrollTop:', currentScrollTop, ', shouldShrink:', shouldShrink);
 
         dispatch(
@@ -812,7 +873,7 @@ const HomePanel = ({ isOnTop }) => {
         lastPlayedBannerIdRef.current = null;
       }
     }
-  }, [detailPanelClosedTime, isOnTop]);
+  }, [detailPanelClosedTime, isOnTop, bannerDataList, dispatch]);
 
   useEffect(() => {
     return () => {