From f8acaa2c3beb27b284af665d5d421f7e7e26d8d5 Mon Sep 17 00:00:00 2001 From: optrader Date: Tue, 18 Nov 2025 09:44:40 +0900 Subject: [PATCH] [251118] fix: hideModalVideo(),showModalVideo() MIME-Version: 1.0 Content-Type: text/plain; charset=UTF-8 Content-Transfer-Encoding: 8bit ๐Ÿ• ์ปค๋ฐ‹ ์‹œ๊ฐ„: 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 ์ปดํฌ๋„ŒํŠธ ์•„ํ‚คํ…์ฒ˜ ๊ฐœ์„  โ€ข ์†Œ๊ทœ๋ชจ ๊ธฐ๋Šฅ ๊ฐœ์„  โ€ข ์ฝ”๋“œ ์ •๋ฆฌ ๋ฐ ์ตœ์ ํ™” โ€ข ๋ชจ๋“ˆ ๊ตฌ์กฐ ๊ฐœ์„  --- com.twin.app.shoptime/src/actions/playActions.js | 13 ++++++------- .../src/components/VideoPlayer/VideoPlayer.v3.js | 2 +- .../hooks/useVideoTransition/useVideoMove.bak.js | 4 ++-- .../useVideoTransition/useVideoMove.original.js | 4 ++-- .../src/views/HomePanel/HomeBanner/RandomUnit.jsx | 6 +++--- .../src/views/HomePanel/HomePanel.jsx | 10 +++++----- .../src/views/PlayerPanel/PlayerPanel.jsx | 7 ++++--- 7 files changed, 23 insertions(+), 23 deletions(-) diff --git a/com.twin.app.shoptime/src/actions/playActions.js b/com.twin.app.shoptime/src/actions/playActions.js index 37cbb0e6..bf364be0 100644 --- a/com.twin.app.shoptime/src/actions/playActions.js +++ b/com.twin.app.shoptime/src/actions/playActions.js @@ -78,8 +78,7 @@ export const startVideoPlayer = const panels = getState().panels.panels; 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, 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 6951f74d..4c2c2ca5 100644 --- a/com.twin.app.shoptime/src/components/VideoPlayer/VideoPlayer.v3.js +++ b/com.twin.app.shoptime/src/components/VideoPlayer/VideoPlayer.v3.js @@ -561,7 +561,7 @@ const VideoPlayerBase = class extends React.Component { /** * Disables seek function. * - * Note that jump by arrow keys will also be disabled when `true`. + * Note that jump by arrow keys will also be disabled when `true`. * * @type {Boolean} * @public diff --git a/com.twin.app.shoptime/src/hooks/useVideoTransition/useVideoMove.bak.js b/com.twin.app.shoptime/src/hooks/useVideoTransition/useVideoMove.bak.js index 56611e4e..b908a3bc 100644 --- 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); } diff --git a/com.twin.app.shoptime/src/hooks/useVideoTransition/useVideoMove.original.js b/com.twin.app.shoptime/src/hooks/useVideoTransition/useVideoMove.original.js index 56611e4e..b908a3bc 100644 --- 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); } diff --git a/com.twin.app.shoptime/src/views/HomePanel/HomeBanner/RandomUnit.jsx b/com.twin.app.shoptime/src/views/HomePanel/HomeBanner/RandomUnit.jsx index 1730e736..aeedba62 100644 --- 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()); diff --git a/com.twin.app.shoptime/src/views/HomePanel/HomePanel.jsx b/com.twin.app.shoptime/src/views/HomePanel/HomePanel.jsx index be432816..0b11ee29 100644 --- 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); } diff --git a/com.twin.app.shoptime/src/views/PlayerPanel/PlayerPanel.jsx b/com.twin.app.shoptime/src/views/PlayerPanel/PlayerPanel.jsx index 8f005e92..261c446e 100644 --- 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()); } }