From 61f67708a9735729d643aa47cbfbf88fa86bc442 Mon Sep 17 00:00:00 2001 From: optrader Date: Tue, 16 Dec 2025 16:07:19 +0900 Subject: [PATCH] =?UTF-8?q?[251216]=20fix:=20=EB=A1=9C=EA=B7=B8=EC=A0=95?= =?UTF-8?q?=EB=A6=AC,PlayerPanel=20ShopNowContents?= MIME-Version: 1.0 Content-Type: text/plain; charset=UTF-8 Content-Transfer-Encoding: 8bit 🕐 커밋 시간: 2025. 12. 16. 16:07:17 📊 변경 통계: • 총 파일: 11개 • 추가: +94줄 • 삭제: -90줄 📝 수정된 파일: ~ com.twin.app.shoptime/src/actions/mediaActions.js ~ com.twin.app.shoptime/src/actions/panelActions.js ~ com.twin.app.shoptime/src/actions/playActions.js ~ com.twin.app.shoptime/src/middleware/panelHistoryMiddleware.js ~ com.twin.app.shoptime/src/reducers/panelReducer.js ~ com.twin.app.shoptime/src/utils/lodashFpEx.js ~ com.twin.app.shoptime/src/views/DetailPanel/DetailPanel.jsx ~ com.twin.app.shoptime/src/views/MediaPanel/MediaPanel.jsx ~ com.twin.app.shoptime/src/views/MediaPanel/MediaPanel.module.less ~ com.twin.app.shoptime/src/views/MediaPanel/MediaPanel.v3.jsx ~ com.twin.app.shoptime/src/views/PlayerPanel/PlayerPanel.jsx 🔧 주요 변경 내용: • 핵심 비즈니스 로직 개선 • 공통 유틸리티 함수 최적화 • 소규모 기능 개선 • 코드 정리 및 최적화 • 모듈 구조 개선 --- .../src/actions/mediaActions.js | 12 ++-- .../src/actions/panelActions.js | 12 ++-- .../src/actions/playActions.js | 60 +++++++++---------- .../src/middleware/panelHistoryMiddleware.js | 6 +- .../src/reducers/panelReducer.js | 22 +++---- com.twin.app.shoptime/src/utils/lodashFpEx.js | 2 +- .../src/views/DetailPanel/DetailPanel.jsx | 50 ++++++++-------- .../src/views/MediaPanel/MediaPanel.jsx | 4 +- .../views/MediaPanel/MediaPanel.module.less | 2 +- .../src/views/MediaPanel/MediaPanel.v3.jsx | 10 ++-- .../src/views/PlayerPanel/PlayerPanel.jsx | 4 ++ 11 files changed, 94 insertions(+), 90 deletions(-) diff --git a/com.twin.app.shoptime/src/actions/mediaActions.js b/com.twin.app.shoptime/src/actions/mediaActions.js index 2bb49f52..6e04a738 100644 --- a/com.twin.app.shoptime/src/actions/mediaActions.js +++ b/com.twin.app.shoptime/src/actions/mediaActions.js @@ -99,10 +99,10 @@ export const finishMediaPreview = () => (dispatch, getState) => { export const finishModalMediaForce = () => (dispatch, getState) => { const panels = getState().panels.panels; - console.log('[🟡UNIQUE_DETAIL_CLEANUP🟡] finishModalMediaForce called', { - panelCount: panels.length, - panelNames: panels.map((p) => p.name), - }); + // console.log('[🟡UNIQUE_DETAIL_CLEANUP🟡] finishModalMediaForce called', { + // panelCount: panels.length, + // panelNames: panels.map((p) => p.name), + // }); const hasProductVideoPanel = panels.some( (panel) => @@ -110,14 +110,14 @@ export const finishModalMediaForce = () => (dispatch, getState) => { (panel.panelInfo?.modal || panel.panelInfo?.modalContainerId === 'product-video-player') ); - console.log('[🟡UNIQUE_DETAIL_CLEANUP🟡] hasProductVideoPanel:', hasProductVideoPanel); + // console.log('[🟡UNIQUE_DETAIL_CLEANUP🟡] hasProductVideoPanel:', hasProductVideoPanel); if (hasProductVideoPanel) { if (startMediaFocusTimer) { clearTimeout(startMediaFocusTimer); startMediaFocusTimer = null; } - console.log('[🟡UNIQUE_DETAIL_CLEANUP🟡] Calling popPanel(panel_names.MEDIA_PANEL)'); + // console.log('[🟡UNIQUE_DETAIL_CLEANUP🟡] Calling popPanel(panel_names.MEDIA_PANEL)'); dispatch(popPanel(panel_names.MEDIA_PANEL)); } }; diff --git a/com.twin.app.shoptime/src/actions/panelActions.js b/com.twin.app.shoptime/src/actions/panelActions.js index 00663efb..052f1dcd 100644 --- a/com.twin.app.shoptime/src/actions/panelActions.js +++ b/com.twin.app.shoptime/src/actions/panelActions.js @@ -6,7 +6,7 @@ import { updateHomeInfo } from './homeActions'; import { createDebugHelpers } from '../utils/debug'; // 디버그 헬퍼 설정 -const DEBUG_MODE = true; +const DEBUG_MODE = false; const { dlog, dwarn, derror } = createDebugHelpers(DEBUG_MODE); // 시작 메뉴 추적을 위한 상수 @@ -43,11 +43,11 @@ export const popPanel = (panelName) => { const stack = new Error().stack; const stackLines = stack?.split('\n') || []; - console.log('[💜UNIQUE_PANEL_STACK💜] popPanel action dispatcher - REMOVING PANEL:', { - panelName, - timestamp: Date.now(), - fullStack: stackLines.slice(1, 6).map((line) => line.trim()), - }); + // console.log('[💜UNIQUE_PANEL_STACK💜] popPanel action dispatcher - REMOVING PANEL:', { + // panelName, + // timestamp: Date.now(), + // fullStack: stackLines.slice(1, 6).map((line) => line.trim()), + // }); if (DEBUG_MODE) { console.log('[💜UNIQUE_PANEL_STACK💜] popPanel action creator stack:', { diff --git a/com.twin.app.shoptime/src/actions/playActions.js b/com.twin.app.shoptime/src/actions/playActions.js index 23f2b176..3ee72ea0 100644 --- a/com.twin.app.shoptime/src/actions/playActions.js +++ b/com.twin.app.shoptime/src/actions/playActions.js @@ -74,7 +74,7 @@ export const startVideoPlayer = }) => (dispatch, getState) => { const caller = new Error().stack?.split('\n')[2]?.trim(); - console.log('[PTRACE-SP] startVideoPlayer call', { + dlog('[PTRACE-SP] startVideoPlayer call', { modal, modalContainerId, modalClassName, @@ -115,7 +115,7 @@ export const startVideoPlayer = // 기존 PlayerPanel이 어디든 있으면 완전히 초기화: 타이머 정리 후 pop → 새로 push if (existingPlayerPanel) { - console.log('[PTRACE-SP] startVideoPlayer: popping existing player before push', { + dlog('[PTRACE-SP] startVideoPlayer: popping existing player before push', { stack: panels.map((p) => p.name), }); dlog('[startVideoPlayer] 🔄 Resetting existing PLAYER_PANEL before start'); @@ -148,14 +148,14 @@ export const startVideoPlayer = // [COMMENTED OUT] 비디오 재생 시 강제 포커스 이동 비활성화 // if (modal && modalContainerId && !spotlightDisable) { - // console.log('[startVideoPlayer] 🎯 Setting Spotlight focus - containerId:', modalContainerId); + // dlog('[startVideoPlayer] 🎯 Setting Spotlight focus - containerId:', modalContainerId); // Spotlight.setPointerMode(false); // startVideoFocusTimer = setTimeout(() => { - // console.log('[startVideoPlayer] 🔍 Spotlight.focus called'); + // dlog('[startVideoPlayer] 🔍 Spotlight.focus called'); // Spotlight.focus(modalContainerId); // }, 0); // } else { - // console.log('[startVideoPlayer] ⏭️ Spotlight focus skipped - modal:', modal, ', modalContainerId:', !!modalContainerId, ', spotlightDisable:', spotlightDisable); + // dlog('[startVideoPlayer] ⏭️ Spotlight focus skipped - modal:', modal, ', modalContainerId:', !!modalContainerId, ', spotlightDisable:', spotlightDisable); // } dlog('[startVideoPlayer] ✅ END'); @@ -196,7 +196,7 @@ export const startVideoPlayerNew = }) => (dispatch, getState) => { const caller = new Error().stack?.split('\n')[2]?.trim(); - console.log('[PTRACE-SPN] startVideoPlayerNew call', { + dlog('[PTRACE-SPN] startVideoPlayerNew call', { bannerId, modal, modalContainerId, @@ -239,7 +239,7 @@ export const startVideoPlayerNew = // 기존 PlayerPanel이 있으면 완전히 초기화: 타이머 정리 후 pop → 새로 push if (existingPlayerPanel) { - console.log('[PTRACE-SPN] popping existing player before push', { + dlog('[PTRACE-SPN] popping existing player before push', { stack: panels.map((p) => p.name), }); dlog('[startVideoPlayerNew] *** 🔄 Resetting existing PLAYER_PANEL before start'); @@ -332,14 +332,14 @@ export const startVideoPlayerNew = // [COMMENTED OUT] 비디오 재생 시 강제 포커스 이동 비활성화 // if (modal && modalContainerId && !spotlightDisable) { - // console.log('[startVideoPlayerNew] *** 🎯 Setting Spotlight focus - containerId:', modalContainerId); + // dlog('[startVideoPlayerNew] *** 🎯 Setting Spotlight focus - containerId:', modalContainerId); // Spotlight.setPointerMode(false); // startVideoFocusTimer = setTimeout(() => { - // console.log('[startVideoPlayerNew] *** 🔍 Spotlight.focus called'); + // dlog('[startVideoPlayerNew] *** 🔍 Spotlight.focus called'); // Spotlight.focus(modalContainerId); // }, 0); // } else { - // console.log('[startVideoPlayerNew] *** ⏭️ Spotlight focus skipped - modal:', modal, ', modalContainerId:', !!modalContainerId, ', spotlightDisable:', spotlightDisable); + // dlog('[startVideoPlayerNew] *** ⏭️ Spotlight focus skipped - modal:', modal, ', modalContainerId:', !!modalContainerId, ', spotlightDisable:', spotlightDisable); // } dlog('[startVideoPlayerNew] *** ✅ END'); @@ -352,7 +352,7 @@ export const finishVideoPreview = () => (dispatch, getState) => { const panels = getState().panels.panels; const topPanel = panels[panels.length - 1]; if (topPanel && topPanel.name === panel_names.PLAYER_PANEL && topPanel.panelInfo.modal) { - console.log('[PANEL-TRACE] finishVideoPreview: popping modal player', { + dlog('[PANEL-TRACE] finishVideoPreview: popping modal player', { topPanelName: topPanel.name, modal: topPanel.panelInfo.modal, stack: panels.map((p) => p.name), @@ -417,7 +417,7 @@ export const pauseModalVideo = () => (dispatch, getState) => { (panel) => panel.name === panel_names.PLAYER_PANEL && panel.panelInfo?.modal ); - console.log('[Detail-BG] ⏸️ pauseModalVideo - Pausing modal video', { + dlog('[Detail-BG] ⏸️ pauseModalVideo - Pausing modal video', { found: !!modalPlayerPanel, playerPanelModal: modalPlayerPanel?.panelInfo?.modal, currentIsPaused: modalPlayerPanel?.panelInfo?.isPaused, @@ -438,11 +438,11 @@ export const pauseModalVideo = () => (dispatch, getState) => { }) ); - console.log('[Detail-BG] ✅ pauseModalVideo - Modal video paused successfully', { + dlog('[Detail-BG] ✅ pauseModalVideo - Modal video paused successfully', { timestamp: Date.now(), }); } else { - console.log('[Detail-BG] ⚠️ pauseModalVideo - No modal PlayerPanel found', { + dlog('[Detail-BG] ⚠️ pauseModalVideo - No modal PlayerPanel found', { timestamp: Date.now(), }); } @@ -457,7 +457,7 @@ export const resumeModalVideo = () => (dispatch, getState) => { (panel) => panel.name === panel_names.PLAYER_PANEL && panel.panelInfo?.modal ); - console.log('[Detail-BG] ▶️ resumeModalVideo - Resuming modal video', { + dlog('[Detail-BG] ▶️ resumeModalVideo - Resuming modal video', { found: !!modalPlayerPanel, playerPanelModal: modalPlayerPanel?.panelInfo?.modal, currentIsPaused: modalPlayerPanel?.panelInfo?.isPaused, @@ -478,11 +478,11 @@ export const resumeModalVideo = () => (dispatch, getState) => { }) ); - console.log('[Detail-BG] ✅ resumeModalVideo - Modal video resumed successfully', { + dlog('[Detail-BG] ✅ resumeModalVideo - Modal video resumed successfully', { timestamp: Date.now(), }); } else { - console.log('[Detail-BG] ⚠️ resumeModalVideo - Modal video not paused or panel not found', { + dlog('[Detail-BG] ⚠️ resumeModalVideo - Modal video not paused or panel not found', { found: !!modalPlayerPanel, isPaused: modalPlayerPanel?.panelInfo?.isPaused, timestamp: Date.now(), @@ -499,7 +499,7 @@ export const pauseFullscreenVideo = () => (dispatch, getState) => { (panel) => panel.name === panel_names.PLAYER_PANEL && !panel.panelInfo?.modal ); - console.log('[Detail-BG] ⏸️ pauseFullscreenVideo - Pausing fullscreen video', { + dlog('[Detail-BG] ⏸️ pauseFullscreenVideo - Pausing fullscreen video', { found: !!fullscreenPlayerPanel, playerPanelModal: fullscreenPlayerPanel?.panelInfo?.modal, currentIsPaused: fullscreenPlayerPanel?.panelInfo?.isPaused, @@ -517,11 +517,11 @@ export const pauseFullscreenVideo = () => (dispatch, getState) => { }) ); - console.log('[Detail-BG] ✅ pauseFullscreenVideo - Fullscreen video paused successfully', { + dlog('[Detail-BG] ✅ pauseFullscreenVideo - Fullscreen video paused successfully', { timestamp: Date.now(), }); } else { - console.log('[Detail-BG] ⚠️ pauseFullscreenVideo - No fullscreen PlayerPanel found', { + dlog('[Detail-BG] ⚠️ pauseFullscreenVideo - No fullscreen PlayerPanel found', { timestamp: Date.now(), }); } @@ -536,7 +536,7 @@ export const resumeFullscreenVideo = () => (dispatch, getState) => { (panel) => panel.name === panel_names.PLAYER_PANEL && !panel.panelInfo?.modal ); - console.log('[Detail-BG] ▶️ resumeFullscreenVideo - Resuming fullscreen video', { + dlog('[Detail-BG] ▶️ resumeFullscreenVideo - Resuming fullscreen video', { found: !!fullscreenPlayerPanel, playerPanelModal: fullscreenPlayerPanel?.panelInfo?.modal, currentIsPaused: fullscreenPlayerPanel?.panelInfo?.isPaused, @@ -554,11 +554,11 @@ export const resumeFullscreenVideo = () => (dispatch, getState) => { }) ); - console.log('[Detail-BG] ✅ resumeFullscreenVideo - Fullscreen video resumed successfully', { + dlog('[Detail-BG] ✅ resumeFullscreenVideo - Fullscreen video resumed successfully', { timestamp: Date.now(), }); } else { - console.log('[Detail-BG] ⚠️ resumeFullscreenVideo - Fullscreen video not paused or panel not found', { + dlog('[Detail-BG] ⚠️ resumeFullscreenVideo - Fullscreen video not paused or panel not found', { found: !!fullscreenPlayerPanel, isPaused: fullscreenPlayerPanel?.panelInfo?.isPaused, timestamp: Date.now(), @@ -601,7 +601,7 @@ export const hideModalVideo = () => (dispatch, getState) => { }, }; - // console.log('[HomePanel] hideModalVideo: saving shrinkInfo', { + // dlog('[HomePanel] hideModalVideo: saving shrinkInfo', { // shrinkInfo: updatedPlayerState.shrinkInfo, // modalStyle: panelInfo.modalStyle, // }); @@ -1038,7 +1038,7 @@ export const resumePlayerControl = (ownerId) => (dispatch, getState) => { * 이 액션은 어떤 배너에서든 클릭 시 호출됩니다. */ export const goToFullScreen = () => (dispatch, getState) => { - console.log('[Detail-BG] 🎬 goToFullScreen - Setting PlayerPanel to fullscreen mode', { + dlog('[Detail-BG] 🎬 goToFullScreen - Setting PlayerPanel to fullscreen mode', { targetModal: false, action: 'updatePanel', timestamp: Date.now(), @@ -1055,7 +1055,7 @@ export const goToFullScreen = () => (dispatch, getState) => { }) ); - console.log('[Detail-BG] ✅ goToFullScreen - PlayerPanel modal set to false (fullscreen)', { + dlog('[Detail-BG] ✅ goToFullScreen - PlayerPanel modal set to false (fullscreen)', { timestamp: Date.now(), }); }; @@ -1268,7 +1268,7 @@ export const startBannerVideo = (videoInfo) => (dispatch, getState) => { ...rest } = videoInfo; - console.log('[Detail-BG] 🎥 startBannerVideo - Starting banner video', { + dlog('[Detail-BG] 🎥 startBannerVideo - Starting banner video', { modalStatus: modal, bannerId, displayMode: modal ? 'VISIBLE (modal=true)' : 'FULLSCREEN (modal=false)', @@ -1295,7 +1295,7 @@ export const startBannerVideo = (videoInfo) => (dispatch, getState) => { // 기존 PlayerPanel이 있으면 초기화 if (existingPlayerPanel) { dlog('[startBannerVideo] 🔄 Resetting existing PLAYER_PANEL before start'); - console.log('[Detail-BG] 🔄 startBannerVideo - Clearing existing PlayerPanel', { + dlog('[Detail-BG] 🔄 startBannerVideo - Clearing existing PlayerPanel', { existingModalStatus: existingPlayerPanel.panelInfo?.modal, timestamp: Date.now(), }); @@ -1304,7 +1304,7 @@ export const startBannerVideo = (videoInfo) => (dispatch, getState) => { } // 새로운 PlayerPanel push - console.log('[Detail-BG] ➕ startBannerVideo - Pushing new PlayerPanel with modal status', { + dlog('[Detail-BG] ➕ startBannerVideo - Pushing new PlayerPanel with modal status', { modal, modalContainerId, timestamp: Date.now(), @@ -1331,7 +1331,7 @@ export const startBannerVideo = (videoInfo) => (dispatch, getState) => { ) ); - console.log('[Detail-BG] ✅ startBannerVideo - PlayerPanel pushed with modal=' + modal, { + dlog('[Detail-BG] ✅ startBannerVideo - PlayerPanel pushed with modal=' + modal, { timestamp: Date.now(), }); diff --git a/com.twin.app.shoptime/src/middleware/panelHistoryMiddleware.js b/com.twin.app.shoptime/src/middleware/panelHistoryMiddleware.js index 1dbf210c..d7a067cd 100644 --- a/com.twin.app.shoptime/src/middleware/panelHistoryMiddleware.js +++ b/com.twin.app.shoptime/src/middleware/panelHistoryMiddleware.js @@ -16,7 +16,7 @@ import { calculateIsPanelOnTop } from '../utils/panelUtils'; // 🎯 isOnTop 유 // DEBUG_MODE - true인 경우에만 로그 출력 // ⚠️ [251122] panelHistory 로그 비활성화 - 로그 생성 차단 -const DEBUG_MODE = true; +const DEBUG_MODE = false; /** * Panel history middleware @@ -33,8 +33,8 @@ export const panelHistoryMiddleware = (store) => (next) => (action) => { (action.type.includes('PANEL') || action.type === 'CLEAR_PANEL_HISTORY') ) { const caller = new Error().stack.split('\n')[1]?.trim(); - console.log(`[PANEL DEBUG] ${action.type} from: ${caller}`); - console.log(' Payload:', action.payload); + // console.log(`[PANEL DEBUG] ${action.type} from: ${caller}`); + // console.log(' Payload:', action.payload); } // GNB 호출 식별을 위한 helper 함수 diff --git a/com.twin.app.shoptime/src/reducers/panelReducer.js b/com.twin.app.shoptime/src/reducers/panelReducer.js index 1276843a..62f313f1 100644 --- a/com.twin.app.shoptime/src/reducers/panelReducer.js +++ b/com.twin.app.shoptime/src/reducers/panelReducer.js @@ -94,11 +94,11 @@ export const panelsReducer = (state = initialState, action) => { } case types.POP_PANEL: { - console.log('[💜UNIQUE_PANEL_STACK💜] POP_PANEL reducer START', { - targetPanel: action.payload || 'last_panel', - currentPanels: state.panels.map((p) => p.name), - timestamp: Date.now(), - }); + // console.log('[💜UNIQUE_PANEL_STACK💜] POP_PANEL reducer START', { + // targetPanel: action.payload || 'last_panel', + // currentPanels: state.panels.map((p) => p.name), + // timestamp: Date.now(), + // }); dlog('[panelReducer] 🔴 POP_PANEL START', { targetPanel: action.payload || 'last_panel', @@ -124,12 +124,12 @@ export const panelsReducer = (state = initialState, action) => { resultPanels = state.panels.slice(0, state.panels.length - 1); } - console.log('[💜UNIQUE_PANEL_STACK💜] POP_PANEL reducer END', { - resultPanels: resultPanels.map((p) => p.name), - panelCount: resultPanels.length, - lastAction, - timestamp: Date.now(), - }); + // console.log('[💜UNIQUE_PANEL_STACK💜] POP_PANEL reducer END', { + // resultPanels: resultPanels.map((p) => p.name), + // panelCount: resultPanels.length, + // lastAction, + // timestamp: Date.now(), + // }); dlog('[panelReducer] 🔴 POP_PANEL END', { resultPanels: resultPanels.map((p) => p.name), diff --git a/com.twin.app.shoptime/src/utils/lodashFpEx.js b/com.twin.app.shoptime/src/utils/lodashFpEx.js index 82d4c97a..95683986 100644 --- a/com.twin.app.shoptime/src/utils/lodashFpEx.js +++ b/com.twin.app.shoptime/src/utils/lodashFpEx.js @@ -458,7 +458,7 @@ const tap = fp.curry((fn, value) => { * @param {*} value 대상 값 */ const trace = fp.curry((label, value) => { - console.log(label, value); + // console.log(label, value); return value; }); diff --git a/com.twin.app.shoptime/src/views/DetailPanel/DetailPanel.jsx b/com.twin.app.shoptime/src/views/DetailPanel/DetailPanel.jsx index 9a657e9d..7847a215 100644 --- a/com.twin.app.shoptime/src/views/DetailPanel/DetailPanel.jsx +++ b/com.twin.app.shoptime/src/views/DetailPanel/DetailPanel.jsx @@ -280,7 +280,7 @@ export default function DetailPanel({ panelInfo, isOnTop, spotlightId }) { useEffect(() => { return () => { - console.log('[🟡UNIQUE_DETAIL_CLEANUP🟡] DetailPanel cleanup - calling finishModalMediaForce'); + // console.log('[🟡UNIQUE_DETAIL_CLEANUP🟡] DetailPanel cleanup - calling finishModalMediaForce'); dispatch(finishModalMediaForce()); }; }, [dispatch]); @@ -304,19 +304,19 @@ export default function DetailPanel({ panelInfo, isOnTop, spotlightId }) { const sourcePanel = panelInfo?.sourcePanel; const sourceMenu = panelInfo?.sourceMenu; - console.log('[🔴UNIQUE_DETAIL_UNMOUNT🔴] DetailPanel cleanup/unmount triggered', { - sourcePanel, - sourceMenu, - panelsSnapshot: panels.map((p) => p.name), - timestamp: Date.now(), - }); + // console.log('[🔴UNIQUE_DETAIL_UNMOUNT🔴] DetailPanel cleanup/unmount triggered', { + // sourcePanel, + // sourceMenu, + // panelsSnapshot: panels.map((p) => p.name), + // timestamp: Date.now(), + // }); // DetailPanel이 unmount되는 시점 - console.log('[🔴UNIQUE_DETAIL_UNMOUNT🔴] DetailPanel unmount details:', { - sourcePanel, - sourceMenu, - timestamp: Date.now(), - }); + // console.log('[🔴UNIQUE_DETAIL_UNMOUNT🔴] DetailPanel unmount details:', { + // sourcePanel, + // sourceMenu, + // timestamp: Date.now(), + // }); // sourcePanel에 따른 상태 업데이트 switch (sourcePanel) { @@ -385,13 +385,13 @@ export default function DetailPanel({ panelInfo, isOnTop, spotlightId }) { const sourcePanel = panelInfo?.sourcePanel; const sourceMenu = panelInfo?.sourceMenu; - console.log('[🟠UNIQUE_DETAIL_BACK🟠] onBackClick triggered', { - sourcePanel, - sourceMenu, - isCancelClick, - currentPanels: panels.map((p) => p.name), - timestamp: Date.now(), - }); + // console.log('[🟠UNIQUE_DETAIL_BACK🟠] onBackClick triggered', { + // sourcePanel, + // sourceMenu, + // isCancelClick, + // currentPanels: panels.map((p) => p.name), + // timestamp: Date.now(), + // }); fp.pipe( () => { @@ -410,18 +410,18 @@ export default function DetailPanel({ panelInfo, isOnTop, spotlightId }) { case panel_names.SEARCH_PANEL: default: // HomePanel, SearchPanel 등에서 온 경우: 백그라운드 비디오 일시 중지 - console.log( - '[🟠UNIQUE_DETAIL_BACK🟠] source panel:', - sourcePanel, - '백그라운드 비디오 일시 중지' - ); + // console.log( + // '[🟠UNIQUE_DETAIL_BACK🟠] source panel:', + // sourcePanel, + // '백그라운드 비디오 일시 중지' + // ); dispatch(pauseFullscreenVideo()); // PLAYER_PANEL 비디오 중지 dispatch(finishModalMediaForce()); // MEDIA_PANEL(ProductVideo) 강제 종료 dispatch(finishVideoPreview()); break; } - console.log('[🟠UNIQUE_DETAIL_BACK🟠] Calling popPanel(DETAIL_PANEL)'); + // console.log('[🟠UNIQUE_DETAIL_BACK🟠] Calling popPanel(DETAIL_PANEL)'); dispatch(popPanel(panel_names.DETAIL_PANEL)); }, () => { diff --git a/com.twin.app.shoptime/src/views/MediaPanel/MediaPanel.jsx b/com.twin.app.shoptime/src/views/MediaPanel/MediaPanel.jsx index 63f526ff..97fe597e 100644 --- a/com.twin.app.shoptime/src/views/MediaPanel/MediaPanel.jsx +++ b/com.twin.app.shoptime/src/views/MediaPanel/MediaPanel.jsx @@ -391,7 +391,7 @@ const MediaPanel = React.forwardRef( const onEnded = useCallback( (e) => { debugLog('[MediaPanel] Video ended'); - console.log('[🔥UNIQUE_MEDIA_ENDED🔥] MediaPanel onEnded triggered - will pop after 1500ms'); + // console.log('[🔥UNIQUE_MEDIA_ENDED🔥] MediaPanel onEnded triggered - will pop after 1500ms'); // continuousPlay는 MediaPlayer(VideoPlayer) 컴포넌트 내부에서 loop 속성으로 처리 // onEnded가 호출되면 loop=false 인 경우이므로 패널을 닫음 Spotlight.pause(); @@ -403,7 +403,7 @@ const MediaPanel = React.forwardRef( // ✅ 새로운 타이머 저장 (cleanup 시 정리용) onEndedTimerRef.current = setTimeout(() => { - console.log('[🔥UNIQUE_MEDIA_ENDED🔥] Executing popPanel(MEDIA_PANEL) after 1500ms'); + // console.log('[🔥UNIQUE_MEDIA_ENDED🔥] Executing popPanel(MEDIA_PANEL) after 1500ms'); Spotlight.resume(); dispatch(PanelActions.popPanel(panel_names.MEDIA_PANEL)); onEndedTimerRef.current = null; diff --git a/com.twin.app.shoptime/src/views/MediaPanel/MediaPanel.module.less b/com.twin.app.shoptime/src/views/MediaPanel/MediaPanel.module.less index f392f425..91f18199 100644 --- a/com.twin.app.shoptime/src/views/MediaPanel/MediaPanel.module.less +++ b/com.twin.app.shoptime/src/views/MediaPanel/MediaPanel.module.less @@ -26,7 +26,7 @@ video { max-width: 100%; max-height: 100%; - object-fit: contain; /* 비율 유지하면서 컨테이너 안에 맞춤 */ + object-fit: contain; /* 높이 기준으로 맞추고 좌우는 잘림 */ } } diff --git a/com.twin.app.shoptime/src/views/MediaPanel/MediaPanel.v3.jsx b/com.twin.app.shoptime/src/views/MediaPanel/MediaPanel.v3.jsx index 7bf1f086..e91b7566 100644 --- a/com.twin.app.shoptime/src/views/MediaPanel/MediaPanel.v3.jsx +++ b/com.twin.app.shoptime/src/views/MediaPanel/MediaPanel.v3.jsx @@ -2043,14 +2043,14 @@ const MediaPanel = React.forwardRef( (e) => { const currentInfo = panelInfoRef.current; - console.log('[🔥UNIQUE_MEDIA_ENDED🔥] onEnded triggered - shptmBanrTpNm:', currentInfo?.shptmBanrTpNm); + // console.log('[🔥UNIQUE_MEDIA_ENDED🔥] onEnded triggered - shptmBanrTpNm:', currentInfo?.shptmBanrTpNm); // MEDIA: 기존 동작 유지 (배경 복원 없이 즉시 pop) if (currentInfo.shptmBanrTpNm === 'MEDIA') { - console.log('[🔥UNIQUE_MEDIA_ENDED🔥] MEDIA type - popPanel will be called'); + // console.log('[🔥UNIQUE_MEDIA_ENDED🔥] MEDIA type - popPanel will be called'); Spotlight.pause(); setTimeout(() => { - console.log('[🔥UNIQUE_MEDIA_ENDED🔥] setTimeout fired - dispatching popPanel(MEDIA_PANEL)'); + // console.log('[🔥UNIQUE_MEDIA_ENDED🔥] setTimeout fired - dispatching popPanel(MEDIA_PANEL)'); Spotlight.resume(); dispatch(PanelActions.popPanel(panel_names.MEDIA_PANEL)); }, VIDEO_END_ACTION_DELAY); @@ -2061,7 +2061,7 @@ const MediaPanel = React.forwardRef( // VOD: modal 여부에 따라 동작 분리 if (currentInfo.shptmBanrTpNm === 'VOD') { - console.log('[🔥UNIQUE_MEDIA_ENDED🔥] VOD type - popPanel will be called'); + // console.log('[🔥UNIQUE_MEDIA_ENDED🔥] VOD type - popPanel will be called'); Spotlight.pause(); setTimeout(() => { stopExternalPlayer(); @@ -2081,7 +2081,7 @@ const MediaPanel = React.forwardRef( return; } - console.log('[🔥UNIQUE_MEDIA_ENDED🔥] Unknown shptmBanrTpNm - no action taken'); + // console.log('[🔥UNIQUE_MEDIA_ENDED🔥] Unknown shptmBanrTpNm - no action taken'); }, [dispatch, focusBackButtonOrFallback, stopExternalPlayer] ); diff --git a/com.twin.app.shoptime/src/views/PlayerPanel/PlayerPanel.jsx b/com.twin.app.shoptime/src/views/PlayerPanel/PlayerPanel.jsx index 22f9cf9a..8577c61e 100644 --- a/com.twin.app.shoptime/src/views/PlayerPanel/PlayerPanel.jsx +++ b/com.twin.app.shoptime/src/views/PlayerPanel/PlayerPanel.jsx @@ -407,6 +407,10 @@ const PlayerPanel = ({ isTabActivated, panelInfo, isOnTop, spotlightId, ...props lastFocusedTargetId: panelInfo.lastFocusedTargetId, }); + // TabContainerV2의 tabIndex를 ShopNowContents(0)로 리셋 + dlog('[PlayerPanel] 📑 TabContainerV2 tabIndex를 ShopNowContents(0)로 리셋'); + setTabIndexV2(0); + // 포커스 복원 로직 추가 (1000ms 지연) if (panelInfo.lastFocusedTargetId) { dlog(