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

[251126] fix: Log Migration - PlayerPanel.jsx

Browse Source 
🕐 커밋 시간: 2025. 11. 26. 10:08:34

📊 변경 통계:
  • 총 파일: 2개

📝 수정된 파일:
  ~ com.twin.app.shoptime/src/components/VideoPlayer/VideoPlayer.js
  ~ com.twin.app.shoptime/src/views/PlayerPanel/PlayerPanel.jsx

🔧 주요 변경 내용:
  • UI 컴포넌트 아키텍처 개선
This commit is contained in:
hyeon soo noh
2025-11-26 10:08:35 +09:00
parent f47c1ecdf7
commit d795182d4c
2 changed files with 39 additions and 12 deletions
Download Patch File Download Diff File Expand all files Collapse all files

45
com.twin.app.shoptime/src/views/PlayerPanel/PlayerPanel.jsx
View File

@@ -282,6 +282,7 @@ const PlayerPanel = ({ isTabActivated, panelInfo, isOnTop, spotlightId, ...props
const watchIntervalLive = useRef(null);
const watchIntervalVod = useRef(null);
const watchIntervalMedia = useRef(null);
const timeoutRef = useRef(null);
// useEffect(() => {
// console.log("###videoLoaded", videoLoaded);
// if (nowMenu) {
@@ -291,8 +292,15 @@ const PlayerPanel = ({ isTabActivated, panelInfo, isOnTop, spotlightId, ...props
if (liveShowInfos && liveShowInfos.length > 0) {
const panelInfoChanId = panelInfo?.chanId;
const isLive = panelInfo?.shptmBanrTpNm === 'LIVE';
const isModal = panelInfo?.modal;
if (isLive) {
// live full 화면에서 modal 전환시 로그 전송 추가
if (isModal) {
dispatch(sendLogGNB(Config.LOG_MENU.FULL));
prevNowMenuRef.current = nowMenuRef.current;
return () => dispatch(sendLogGNB(prevNowMenuRef.current));
}
const liveShowInfo = liveShowInfos //
.find(({ chanId }) => panelInfoChanId === chanId);
@@ -303,7 +311,7 @@ const PlayerPanel = ({ isTabActivated, panelInfo, isOnTop, spotlightId, ...props
}
return {};
}, [liveShowInfos, panelInfo?.chanId, panelInfo?.shptmBanrTpNm]);
}, [liveShowInfos, panelInfo?.chanId, panelInfo?.shptmBanrTpNm, panelInfo?.modal]);
const currentVODShowInfo = useMemo(() => {
if (showDetailInfo && showDetailInfo.length > 0) {
@@ -327,7 +335,7 @@ const PlayerPanel = ({ isTabActivated, panelInfo, isOnTop, spotlightId, ...props
prevNowMenuRef.current = nowMenuRef.current;
return () => dispatch(sendLogGNB(prevNowMenuRef.current));
} else if (panelInfo?.modal) {
} else if (panelInfo?.modal && panelInfo?.shptmBanrTpNm !== 'LIVE') {
dispatch(sendLogGNB(entryMenu));
}
}, [panelInfo?.modal, panelInfo?.shptmBanrTpNm]);
@@ -619,7 +627,7 @@ const PlayerPanel = ({ isTabActivated, panelInfo, isOnTop, spotlightId, ...props
if (lastFocusedTargetId) {
// ShopNowContents가 렌더링될 때까지 대기 후 포커스 복원
setTimeout(() => {
timeoutRef.current = setTimeout(() => {
dlog('[PlayerPanel] 🔍 800ms 후 포커스 복원 시도:', lastFocusedTargetId);
Spotlight.focus(lastFocusedTargetId);
}, 800);
@@ -1147,7 +1155,7 @@ const PlayerPanel = ({ isTabActivated, panelInfo, isOnTop, spotlightId, ...props
//딮링크로 플레이어 진입 후 이전버튼 클릭시
if (panels.length === 1) {
setTimeout(() => {
timeoutRef.current = setTimeout(() => {
Spotlight.focus(SpotlightIds.HOME_TBODY);
});
}
@@ -1685,7 +1693,7 @@ const PlayerPanel = ({ isTabActivated, panelInfo, isOnTop, spotlightId, ...props
useEffect(() => {
if (currentLiveTimeSeconds > liveTotalTime) {
setTimeout(() => {
timeoutRef.current = setTimeout(() => {
dispatch(getMainLiveShow());
setShopNowInfo('');
dispatch(
@@ -1694,8 +1702,21 @@ const PlayerPanel = ({ isTabActivated, panelInfo, isOnTop, spotlightId, ...props
})
);
}, 3000);
return () => {
if (timeoutRef.current) clearTimeout(timeoutRef.current);
};
}
}, [currentLiveTimeSeconds, liveTotalTime]);
}, [currentLiveTimeSeconds, liveTotalTime, dispatch, playListInfo, selectedIndex]);
useEffect(() => {
return () => {
if (timeoutRef.current) clearTimeout(timeoutRef.current);
if (watchIntervalLive.current) clearInterval(watchIntervalLive.current);
if (watchIntervalVod.current) clearInterval(watchIntervalVod.current);
if (watchIntervalMedia.current) clearInterval(watchIntervalMedia.current);
};
}, []);
const mediainfoHandler = useCallback(
(ev) => {
@@ -1994,7 +2015,7 @@ const PlayerPanel = ({ isTabActivated, panelInfo, isOnTop, spotlightId, ...props
const handlePopupClose = useCallback(() => {
dispatch(setHidePopup());
setTimeout(() => Spotlight.focus(SpotlightIds.PLAYER_SUBTITLE_BUTTON));
timeoutRef.current = setTimeout(() => Spotlight.focus(SpotlightIds.PLAYER_SUBTITLE_BUTTON));
}, [dispatch]);
const reactPlayerSubtitleConfig = useMemo(() => {
if (isSubtitleActive && currentSubtitleBlob) {
@@ -2324,7 +2345,7 @@ const PlayerPanel = ({ isTabActivated, panelInfo, isOnTop, spotlightId, ...props
})
);
Spotlight.pause();
setTimeout(() => {
timeoutRef.current = setTimeout(() => {
Spotlight.resume();
dispatch(PanelActions.popPanel());
}, VIDEO_END_ACTION_DELAY);
@@ -2332,7 +2353,7 @@ const PlayerPanel = ({ isTabActivated, panelInfo, isOnTop, spotlightId, ...props
}
if (panelInfoRef.current.shptmBanrTpNm === 'VOD') {
Spotlight.pause();
setTimeout(() => {
timeoutRef.current = setTimeout(() => {
stopExternalPlayer();
if (panelInfoRef.current.modal) {
// 모달 모드에서는 종료 후 화면을 유지하고 Back 아이콘으로 포커스 이동
@@ -2582,7 +2603,7 @@ const PlayerPanel = ({ isTabActivated, panelInfo, isOnTop, spotlightId, ...props
if (lastFocusedTargetId) {
// ShopNowContents가 렌더링될 때까지 잠시 대기 후 포커스 복원
setTimeout(() => {
timeoutRef.current = setTimeout(() => {
dlog('[PlayerPanel] 🔍 500ms 후 포커스 복원 시도:', lastFocusedTargetId);
Spotlight.focus(lastFocusedTargetId);
}, 500);
@@ -2591,6 +2612,10 @@ const PlayerPanel = ({ isTabActivated, panelInfo, isOnTop, spotlightId, ...props
// 한 번 처리한 복귀 플래그는 즉시 해제해 중복 영향을 막는다.
prevIsTopPanelDetailFromPlayerRef.current = false;
}
return () => {
if (timeoutRef.current) clearTimeout(timeoutRef.current);
};
}
}, [
isOnTop,