[251026] feat: modal 모드에서 비디오 1px 축소/복구 기능 구현

- PlayerPanel useEffect에서 shouldShrinkTo1px 플래그로 인라인 스타일 제거
- shrinkVideoTo1px/expandVideoFrom1px 액션 추가 (배너 정보 playerState에 저장)
- PlayerPanel.module.less에 .shrinkTo1px 클래스 추가
- HomePanel onScroll에서 스크롤 방향 감지하여 축소/확대 제어
- RandomUnit onBlur에서의 축소 로직은 주석 처리 (스크롤로 제어)
This commit is contained in:
2025-10-26 21:44:13 +09:00
parent a7e9f4f0a0
commit 9f3cd62549
5 changed files with 143 additions and 5 deletions

View File

@@ -1426,6 +1426,7 @@ const PlayerPanel = ({ isTabActivated, panelInfo, isOnTop, spotlightId, ...props
useEffect(() => {
if (
panelInfo.modal &&
!panelInfo.shouldShrinkTo1px &&
panelInfo.modalContainerId &&
(lastPanelAction === 'previewPush' || lastPanelAction === 'previewUpdate')
) {
@@ -1457,6 +1458,10 @@ const PlayerPanel = ({ isTabActivated, panelInfo, isOnTop, spotlightId, ...props
setModalScale(panelInfo.modalScale);
console.error('PlayerPanel modalContainerId node not found', panelInfo.modalContainerId);
}
} else if (panelInfo.shouldShrinkTo1px) {
// 축소 상태: 인라인 스타일 제거 (CSS만 적용)
setModalStyle({});
setModalScale(1);
} else if (isOnTop && !panelInfo.modal && videoPlayer.current) {
if (videoPlayer.current?.getMediaState()?.paused) {
videoPlayer.current.play();
@@ -2166,6 +2171,7 @@ const PlayerPanel = ({ isTabActivated, panelInfo, isOnTop, spotlightId, ...props
className={classNames(
css.videoContainer,
panelInfo.modal && css.modal,
panelInfo.shouldShrinkTo1px && css.shrinkTo1px,
// PlayerPanel이 최상단 아니고, 최상단이 DetailPanel(from Player)이면 비디오 보이도록
!isOnTop && isTopPanelDetailFromPlayer && css['background-visible'],
// PlayerPanel이 최상단 아니고, 위 조건 아니면 1px로 숨김