[251118] fix: hideModalVideo(),showModalVideo()

🕐 커밋 시간: 2025. 11. 18. 09:44:39 📊 변경 통계: • 총 파일: 7개 • 추가: +23줄 • 삭제: -23줄 📝 수정된 파일: ~ com.twin.app.shoptime/src/actions/playActions.js ~ com.twin.app.shoptime/src/components/VideoPlayer/VideoPlayer.v3.js ~ com.twin.app.shoptime/src/hooks/useVideoTransition/useVideoMove.bak.js ~ com.twin.app.shoptime/src/hooks/useVideoTransition/useVideoMove.original.js ~ com.twin.app.shoptime/src/views/HomePanel/HomeBanner/RandomUnit.jsx ~ com.twin.app.shoptime/src/views/HomePanel/HomePanel.jsx ~ com.twin.app.shoptime/src/views/PlayerPanel/PlayerPanel.jsx 🔧 주요 변경 내용: • 핵심 비즈니스 로직 개선 • UI 컴포넌트 아키텍처 개선 • 소규모 기능 개선 • 코드 정리 및 최적화 • 모듈 구조 개선
2025-11-18 09:44:40 +09:00
parent 7c073165bb
commit f8acaa2c3b
7 changed files with 23 additions and 23 deletions
--- a/com.twin.app.shoptime/src/actions/playActions.js
+++ b/com.twin.app.shoptime/src/actions/playActions.js
@@ -79,7 +79,6 @@ export const startVideoPlayer =
    const topPanel = panels[panels.length - 1];
    let panelWorkingAction = pushPanel;
    
-    // const panelName = useNewPlayer ? panel_names.PLAYER_PANEL_NEW : panel_names.PLAYER_PANEL;
    const panelName = panel_names.PLAYER_PANEL;

    if (topPanel && topPanel.name === panelName) {
@@ -389,7 +388,7 @@ export const hideModalVideo = () => (dispatch, getState) => {
      },
    };

-    // console.log('[HomePanel] shrinkVideoTo1px: saving shrinkInfo', {
+    // console.log('[HomePanel] hideModalVideo: saving shrinkInfo', {
    //   shrinkInfo: updatedPlayerState.shrinkInfo,
    //   modalStyle: panelInfo.modalStyle,
    // });
@@ -405,7 +404,7 @@ export const hideModalVideo = () => (dispatch, getState) => {
      })
    );
  } else {
-    console.log('[HomePanel] shrinkVideoTo1px: No modal PlayerPanel found', {
+    console.log('[HomePanel] hideModalVideo: No modal PlayerPanel found', {
      panels: panels.map((p) => ({
        name: p.name,
        modal: p.panelInfo?.modal,
@@ -431,7 +430,7 @@ export const showModalVideo = () => (dispatch, getState) => {
    const panelInfo = shrunkModalPlayerPanel.panelInfo;
    const shrinkInfo = panelInfo.playerState?.shrinkInfo;

-    // console.log('[HomePanel] expandVideoFrom1px: expanding video', {
+    // console.log('[HomePanel] showModalVideo: expanding video', {
    //   hasShrinkInfo: !!shrinkInfo,
    //   hasModalStyle: !!shrinkInfo?.modalStyle,
    //   hasModalContainerId: !!shrinkInfo?.modalContainerId,
@@ -450,7 +449,7 @@ export const showModalVideo = () => (dispatch, getState) => {
      }),
    };

-    // console.log('[HomePanel] expandVideoFrom1px: updated panelInfo shouldShrinkTo1px=false, modalStyle restored, skipModalStyleRecalculation=true');
+    // console.log('[HomePanel] showModalVideo: updated panelInfo shouldShrinkTo1px=false, modalStyle restored, skipModalStyleRecalculation=true');

    dispatch(
      updatePanel({
@@ -459,7 +458,7 @@ export const showModalVideo = () => (dispatch, getState) => {
      })
    );
  } else {
-    console.log('[HomePanel] expandVideoFrom1px: No shrunk modal PlayerPanel found', {
+    console.log('[HomePanel] showModalVideo: No shrunk modal PlayerPanel found', {
      panels: panels.map((p) => ({
        name: p.name,
        modal: p.panelInfo?.modal,
--- a/com.twin.app.shoptime/src/hooks/useVideoTransition/useVideoMove.bak.js
+++ b/com.twin.app.shoptime/src/hooks/useVideoTransition/useVideoMove.bak.js
@@ -44,8 +44,8 @@ const useVideoMove = (options = {}) => {
    } else if (q[0] === 'icons') {
      log('icons 케이스: 비디오 숨김 (소리 유지)');

-      if (window.shrinkVideoTo1px) {
-        window.shrinkVideoTo1px();
+      if (window.hideModalVideo) {
+        window.hideModalVideo();
      }
      return Promise.resolve(true);
    }
--- a/com.twin.app.shoptime/src/hooks/useVideoTransition/useVideoMove.original.js
+++ b/com.twin.app.shoptime/src/hooks/useVideoTransition/useVideoMove.original.js
@@ -44,8 +44,8 @@ const useVideoMove = (options = {}) => {
    } else if (q[0] === 'icons') {
      log('icons 케이스: 비디오 숨김 (소리 유지)');

-      if (window.shrinkVideoTo1px) {
-        window.shrinkVideoTo1px();
+      if (window.hideModalVideo) {
+        window.hideModalVideo();
      }
      return Promise.resolve(true);
    }
--- a/com.twin.app.shoptime/src/views/HomePanel/HomeBanner/RandomUnit.jsx
+++ b/com.twin.app.shoptime/src/views/HomePanel/HomeBanner/RandomUnit.jsx
@@ -22,7 +22,7 @@ import {
  finishVideoPreview,
  startVideoPlayer,
  startVideoPlayerNew,
-  shrinkVideoTo1px,
+  hideModalVideo,
 } from '../../../actions/playActions';
 import CustomImage from '../../../components/CustomImage/CustomImage';
 import usePriceInfo from '../../../hooks/usePriceInfo';
@@ -324,7 +324,7 @@ export default function RandomUnit({
        videoPlayerable,
        currentVideoBannerId,
      });
-      dispatch(shrinkVideoTo1px());
+      dispatch(hideModalVideo());
    }

    if (handleItemFocus) {
@@ -346,7 +346,7 @@ export default function RandomUnit({
    // 현재 비디오가 재생 중이면 1px로 축소 (주석: HomePanel 스크롤로 처리)
    // if (currentVideoBannerId && videoPlayerable) {
    //   console.log('[RandomUnit] onBlur: shrinking video to 1px');
-    //   dispatch(shrinkVideoTo1px());
+    //   dispatch(hideModalVideo());
    // }

    // dispatch(finishVideoPreview());
--- a/com.twin.app.shoptime/src/views/HomePanel/HomePanel.jsx
+++ b/com.twin.app.shoptime/src/views/HomePanel/HomePanel.jsx
@@ -29,9 +29,9 @@ import { getSubCategory, getTop20Show } from '../../actions/mainActions';
 import { getHomeOnSaleInfo } from '../../actions/onSaleActions';
 import { updatePanel } from '../../actions/panelActions';
 import {
-  expandVideoFrom1px,
+  showModalVideo,
  finishVideoPreview,
-  shrinkVideoTo1px,
+  hideModalVideo,
  startVideoPlayerNew,
 } from '../../actions/playActions';
 import { getBestSeller } from '../../actions/productActions';
@@ -497,7 +497,7 @@ const HomePanel = ({ isOnTop }) => {
            }

            // console.log('[HomePanel] Expansion attempt', expandAttemptRef.current + 1);
-            dispatch(expandVideoFrom1px());
+            dispatch(showModalVideo());
            expandAttemptRef.current++;
          }, 200);
        }
@@ -514,7 +514,7 @@ const HomePanel = ({ isOnTop }) => {
        // 아래로 스크롤: 비디오를 1px로 축소
        // console.log('[HomePanel] Scrolling down - shrinking video');
        if (!isVideoTransitionLocked) {
-          dispatch(shrinkVideoTo1px());
+          dispatch(hideModalVideo());
        }
        // 기존 타이머 취소
        if (scrollExpandTimerRef.current) {
@@ -533,7 +533,7 @@ const HomePanel = ({ isOnTop }) => {
        // 1초 후 자동으로 크기 조정
        scrollExpandTimerRef.current = setTimeout(() => {
          // console.log('[HomePanel] 1s passed - auto expanding video');
-          dispatch(expandVideoFrom1px());
+          dispatch(showModalVideo());
          scrollExpandTimerRef.current = null;
        }, 1000);
      }
--- a/com.twin.app.shoptime/src/views/PlayerPanel/PlayerPanel.jsx
+++ b/com.twin.app.shoptime/src/views/PlayerPanel/PlayerPanel.jsx
@@ -340,9 +340,10 @@ const PlayerPanel = ({ isTabActivated, panelInfo, isOnTop, spotlightId, ...props

  // PlayerPanel.jsx의 라인 313-327 useEffect 수정
  useEffect(() => {
-    console.log('[PlayerPanel] isOnTop:', {
+    console.log('[PlayerPanel] isOnTop useEffect:', {
      isOnTop,
-      panelInfo,
+      modal: panelInfo?.modal,
+      isPaused: panelInfo?.isPaused,
    });

    if (panelInfo && panelInfo.modal) {
@@ -350,7 +351,7 @@ const PlayerPanel = ({ isTabActivated, panelInfo, isOnTop, spotlightId, ...props
        console.log('[PlayerPanel] Not on top - pausing video');
        dispatch(pauseModalVideo());
      } else if (isOnTop && panelInfo.isPaused) {
-        console.log('[PlayerPanel] Back on top - resuming video');
+        console.log('[PlayerPanel] Back on top - resuming video ← 이곳에서 resumeModalVideo 호출!');
        dispatch(resumeModalVideo());
      }
    }