[251012] fix: PlayerPanel,TabContainerV2 focus - 1

🕐 커밋 시간: 2025. 10. 12. 18:13:40

📊 변경 통계:
  • 총 파일: 7개
  • 추가: +169줄
  • 삭제: -25줄

📝 수정된 파일:
  ~ com.twin.app.shoptime/src/components/VideoPlayer/VideoPlayer.js
  ~ com.twin.app.shoptime/src/views/PlayerPanel/PlayerOverlay/PlayerOverlayContents.jsx
  ~ com.twin.app.shoptime/src/views/PlayerPanel/PlayerPanel.jsx
  ~ com.twin.app.shoptime/src/views/PlayerPanel/PlayerTabContents/TabContents/LiveChannelContents.jsx
  ~ com.twin.app.shoptime/src/views/PlayerPanel/PlayerTabContents/TabContents/ShopNowContents.jsx
  ~ com.twin.app.shoptime/src/views/PlayerPanel/PlayerTabContents/v2/ShopNowButton.jsx
  ~ com.twin.app.shoptime/src/views/PlayerPanel/PlayerTabContents/v2/TabContainer.v2.jsx

🔧 함수 변경 내용:
  📄 com.twin.app.shoptime/src/views/PlayerPanel/PlayerOverlay/PlayerOverlayContents.jsx (javascript):
     Added: onSpotlightMoveBelowTab()
  📄 com.twin.app.shoptime/src/views/PlayerPanel/PlayerTabContents/TabContents/ShopNowContents.jsx (javascript):
    🔄 Modified: SpotlightContainerDecorator()

🔧 주요 변경 내용:
  • UI 컴포넌트 아키텍처 개선
This commit is contained in:
2025-10-12 18:13:42 +09:00
parent 05a1629fc9
commit aa811980dd
7 changed files with 243 additions and 129 deletions

View File

@@ -971,7 +971,11 @@ const PlayerPanel = ({ isTabActivated, panelInfo, isOnTop, spotlightId, ...props
}
if (!panelInfo.modal && !videoVerticalVisible && !hasProperSpot) {
Spotlight.focus(SpotlightIds.PLAYER_TAB_BUTTON);
if (tabContainerVersion === 1) {
Spotlight.focus(SpotlightIds.PLAYER_TAB_BUTTON);
} else if (tabContainerVersion === 2) {
Spotlight.focus('below-tab-live-channel-button');
}
return;
}
//비디오 진입시 포커스
@@ -986,8 +990,8 @@ const PlayerPanel = ({ isTabActivated, panelInfo, isOnTop, spotlightId, ...props
panelInfo.modal,
panelInfo.isUpdatedByClick,
panelInfo.isIndicatorByClick,
panelInfo.shptmBanrTpNm,
tabContainerVersion,
]);
// 최상단 패널 정보 (여러 useMemo에서 공통으로 사용)
@@ -1943,10 +1947,7 @@ const PlayerPanel = ({ isTabActivated, panelInfo, isOnTop, spotlightId, ...props
console.log('[PlayerPanel] isOnTop true - 오버레이 표시');
setSideContentsVisible(true);
setBelowContentsVisible(true);
if (videoPlayer.current?.showControls) {
videoPlayer.current.showControls();
}
// VideoPlayer가 belowContentsVisible prop을 감지해서 자동으로 controls 표시함
}
}, [isOnTop, panelInfo.modal, videoVerticalVisible]);
@@ -2165,12 +2166,7 @@ const PlayerPanel = ({ isTabActivated, panelInfo, isOnTop, spotlightId, ...props
noAutoPlay={cannotPlay}
autoCloseTimeout={3000}
onBackButton={onClickBack}
spotlightDisabled={
(!videoVerticalVisible &&
panelInfo?.shptmBanrTpNm !== 'MEDIA' &&
sideContentsVisible) ||
panelInfo.modal
}
spotlightDisabled={panelInfo.modal}
isYoutube={isYoutube}
src={currentPlayingUrl}
style={panelInfo.modal ? modalStyle : {}}
@@ -2211,6 +2207,8 @@ const PlayerPanel = ({ isTabActivated, panelInfo, isOnTop, spotlightId, ...props
setCurrentTime={setCurrentTime}
setIsVODPaused={setIsVODPaused}
broadcast={broadcast}
tabContainerVersion={tabContainerVersion}
tabIndexV2={tabIndexV2}
>
{typeof window === 'object' && window.PalmSystem && (
<source src={currentPlayingUrl} type={videoType} />