optrader/shoptime
1
0
Fork 0
Code Issues Pull Requests Actions Packages Projects Releases Wiki Activity

[251116] feat: HomePanel return form DetailPanel video playing

Browse Source 
🕐 커밋 시간: 2025. 11. 16. 23:27:35

📊 변경 통계:
  • 총 파일: 4개
  • 추가: +71줄
  • 삭제: -27줄

📝 수정된 파일:
  ~ com.twin.app.shoptime/src/actions/playActions.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/MainView/MainView.jsx

🔧 함수 변경 내용:
  📄 com.twin.app.shoptime/src/views/HomePanel/HomeBanner/RandomUnit.jsx (javascript):
    🔄 Modified: SpotlightContainerDecorator()

🔧 주요 변경 내용:
  • 핵심 비즈니스 로직 개선
This commit is contained in:
hyeon soo noh
2025-11-16 23:27:35 +09:00
parent a18c61380c
commit b1640cab2f
4 changed files with 71 additions and 25 deletions
Download Patch File Download Diff File Expand all files Collapse all files

89
com.twin.app.shoptime/src/views/HomePanel/HomePanel.jsx
View File

@@ -32,6 +32,7 @@ import {
expandVideoFrom1px,
finishVideoPreview,
shrinkVideoTo1px,
startVideoPlayerNew,
} from '../../actions/playActions';
import { getBestSeller } from '../../actions/productActions';
import TBody from '../../components/TBody/TBody';
@@ -91,6 +92,8 @@ const HomePanel = ({ isOnTop }) => {
});
// 🔽 비디오 재생 의도 공유 ref
const videoPlayIntentRef = useRef(null);
// ✅ [251116] 비디오 중복 재생 방지 ref
const lastPlayedBannerIdRef = useRef(null);
// 🔽 useVideoMove - 포커스 전환 기반 동영상 제어
// [COMMENTED OUT] useVideoMove 미사용 - cleanup() 호출되지 않음
@@ -562,9 +565,9 @@ const HomePanel = ({ isOnTop }) => {
const isVideoShrunk = panels.some(
(panel) => panel.name === panel_names.PLAYER_PANEL && panel.panelInfo?.shouldShrinkTo1px
);
if (Spotlight.getPointerMode() && !isVideoShrunk) {
dispatch(finishVideoPreview());
}
// if (Spotlight.getPointerMode() && !isVideoShrunk) {
// dispatch(finishVideoPreview());
// }
if (panelInfo.currentCatCd) {
Spotlight.focus('spotlightId-' + panelInfo.currentCatCd);
}
@@ -600,11 +603,11 @@ const HomePanel = ({ isOnTop }) => {
isInitialRender.current = false;
// ✅ 마운트 시 banner0 자동 재생 설정
console.log('[HomePanel] 마운트 - banner0 재생 시도', videoPlay);
// console.log('[HomePanel] 마운트 - banner0 재생 시도', videoPlay);
videoPlayIntentRef.current = { bannerId: 'banner0' };
console.log('[HomePanel] videoPlayIntentRef 설정:', videoPlayIntentRef.current);
videoPlay.playVideo('banner0', { reason: 'mount-init' });
console.log('[HomePanel] playVideo 호출 완료');
// console.log('[HomePanel] videoPlayIntentRef 설정:', videoPlayIntentRef.current);
// videoPlay.playVideo('banner0', { reason: 'mount-init' });
// console.log('[HomePanel] playVideo 호출 완료');
if (isDeepLink || (!panels.length && !panelInfo.focusedContainerId)) {
dispatch(changeAppStatus({ showLoadingPanel: { show: true, type: 'wait' } }));
@@ -693,25 +696,67 @@ const HomePanel = ({ isOnTop }) => {
// ✅ HomePanel 활성화 조건: 최상단 패널 또는 PlayerPanel 아래의 두 번째 패널
// 비디오가 재생이 아니면 videoPlayIntentRef의 bannerId로 비디오 재생
// [251116] isHomeOnTop인 경우에는 비디오가 항상 재생되어야 함
useEffect(() => {
const isHomePanelActive =
panels[0]?.name === panel_names.HOME_PANEL ||
(panels.length >= 2 &&
panels[0]?.name === panel_names.PLAYER_PANEL &&
panels[1]?.name === panel_names.HOME_PANEL);
console.log('[HomeActive] useEffect 실행 - isOnTop:', isOnTop);
console.log('[HomeActive] videoPlayIntentRef.current:', videoPlayIntentRef.current);
console.log(
'[HomeActive] panels 상태:',
panels.map((p) => ({ name: p.name, modal: p.panelInfo?.modal }))
);
if (isHomePanelActive && videoPlayIntentRef.current?.bannerId) {
const bannerId = videoPlayIntentRef.current.bannerId;
const currentPlaying = videoPlay.getCurrentPlayingBanner();
const isHomePanelActive = isOnTop;
console.log('[HomeActive] isHomePanelActive:', isHomePanelActive);
// 이미 재생 중인 배너가 다르면 새로 재생
if (currentPlaying !== bannerId) {
videoPlay.playVideo(bannerId, {
reason: 'homePanel-active',
});
}
if (!isHomePanelActive) {
console.log('[HomeActive] 조건 실패: isHomePanelActive가 false');
return;
}
}, [panels]);
if (!videoPlayIntentRef.current?.bannerId) {
console.log('[HomeActive] 조건 실패: videoPlayIntentRef.current?.bannerId가 없음', {
hasRef: !!videoPlayIntentRef.current,
hasBannerId: !!videoPlayIntentRef.current?.bannerId,
});
return;
}
const bannerId = videoPlayIntentRef.current.bannerId;
console.log('[HomeActive] 비디오 재생 시도 - bannerId:', bannerId);
console.log('[HomeActive] 마지막 재생한 배너:', lastPlayedBannerIdRef.current);
// ✅ [251116] 중복 재생 방지: 같은 배너면 스킵
if (lastPlayedBannerIdRef.current === bannerId) {
console.log('[HomeActive] 중복 호출 감지 - 스킵 (이미 재생 중)');
return;
}
// const currentPlaying = videoPlay.getCurrentPlayingBanner();
// 이미 재생 중인 배너가 다르면 새로 재생
// if (currentPlaying !== bannerId) {
// videoPlay.playVideo(bannerId, {
// reason: 'homePanel-active',
// });
// }
// ✅ [251116] startVideoPlayerNew로 비디오 자동 재생
console.log('[HomeActive] dispatch(startVideoPlayerNew) 호출 직전:', { bannerId, modal: true });
// Spotlight.focus(bannerId);
// dispatch(
// startVideoPlayerNew({
// bannerId: bannerId,
// modal: true,
// modalContainerId: 'banner-modal-' + bannerId,
// })
// );
console.log('[HomeActive] dispatch(startVideoPlayerNew) 호출 완료');
// 재생 기록 업데이트
lastPlayedBannerIdRef.current = bannerId;
console.log('[HomeActive] 재생 기록 업데이트:', bannerId);
}, [isOnTop, dispatch]);
useEffect(() => {
return () => {