diff --git a/com.twin.app.shoptime/src/views/HomePanel/HomeBanner/HomeBanner.jsx b/com.twin.app.shoptime/src/views/HomePanel/HomeBanner/HomeBanner.jsx index df14d1a6..886e2e42 100644 --- a/com.twin.app.shoptime/src/views/HomePanel/HomeBanner/HomeBanner.jsx +++ b/com.twin.app.shoptime/src/views/HomePanel/HomeBanner/HomeBanner.jsx @@ -11,7 +11,6 @@ import { setDefaultFocus, // setShowPopup, fetchCurrentUserHomeTerms, - collectAndSaveBannerPositions, } from "../../../actions/homeActions"; import { changeAppStatus, @@ -25,6 +24,7 @@ import { setMyPageTermsAgree } from "../../../actions/myPageActions"; import { pushPanel, popPanel } from "../../../actions/panelActions"; import { panel_names } from "../../../utils/Config"; import { + startVideoPlayer, requestPlayControl, releasePlayControl, } from "../../../actions/playActions"; @@ -79,32 +79,49 @@ export default function HomeBanner({ } }, [handleItemFocus]); - // π½ [μμ ] μ€μ μ μ΄ μμ€ν μ μ¬μ©νλ μλ‘μ΄ μꡬμ¬μ λ‘μ§ - useEffect(() => { - // DSP00201 ν νλ¦Ώμ΄κ³ λ°°λ λ°μ΄ν°κ° μμ λλ§ μ€ν - if ( - bannerDataList && - bannerDataList.length > 0 && - selectTemplate === "DSP00201" - ) { - const banner0Data = bannerDataList[0]?.bannerDetailInfos?.[0]; + // π½ [μΆκ°] 0λ²μ§Έ λ°°λμ λν μꡬ λΉλμ€ μ¬μμ μ²λ¦¬νλ useEffect + // useEffect(() => { + // if ( + // bannerDataList && + // bannerDataList.length > 0 && + // selectTemplate === "DSP00201" + // ) { + // const banner0Data = bannerDataList[0]?.bannerDetailInfos?.[0]; - if (banner0Data && banner0Data.showUrl) { - const videoInfo = { - showUrl: banner0Data.showUrl, - patnrId: banner0Data.patnrId, - showId: banner0Data.showId, - shptmBanrTpNm: "MEDIA", - modal: true, - modalContainerId: "banner0", - spotlightDisable: true, // μꡬμ¬μ λΉλμ€λ ν¬μ»€μ€λ₯Ό λ°μ§ μμ - }; - // μ€μ μ μ΄ μμ€ν μ μꡬμ¬μ μμμ μμ² - dispatch(requestPlayControl("banner0_persistent", videoInfo)); - } - } - // eslint-disable-next-line react-hooks/exhaustive-deps - }, [dispatch, selectTemplate, JSON.stringify(bannerDataList)]); // bannerDataListμ λ΄μ©μ΄ λ°λ λλ§ μ€ν + // if (banner0Data && banner0Data.showUrl) { + // // DOM μμκ° μ‘΄μ¬νλμ§ νμΈ ν μ€ν + // console.log("[HomeBanner] banner0Data", banner0Data); + // const checkAndPlay = () => { + // const targetElement = document.querySelector( + // '[data-spotlight-id="banner0"]', + // ); + // console.log("[HomeBanner] targetElement", targetElement); + // if (targetElement) { + // console.log("[HomeBanner] targetElement μ‘΄μ¬"); + // dispatch( + // startVideoPlayer({ + // showUrl: banner0Data.showUrl, + // patnrId: banner0Data.patnrId, + // showId: banner0Data.showId, + // shptmBanrTpNm: "MEDIA", + // modal: true, + // modalContainerId: "banner0", + // spotlightDisable: true, + // }), + // ); + // console.log("[HomeBanner] startVideoPlayer νΈμΆ"); + // } else { + // // μμκ° μμΌλ©΄ μ μ ν μ¬μλ + // console.log("[HomeBanner] targetElement μμ"); + // setTimeout(checkAndPlay, 100); + // } + // }; + + // // λ€μ tickμμ μ€ννμ¬ λ λλ§ μλ£ λ³΄μ₯ + // setTimeout(checkAndPlay, 0); + // } + // } + // }, [dispatch, bannerDataList, selectTemplate]); // π½ [μμ ] μλ‘μ΄ 1λ² λ°°λ ν¬μ»€μ€/λΈλ¬ νΈλ€λ¬ const handleSecondBannerFocus = useCallback(() => { @@ -122,7 +139,7 @@ export default function HomeBanner({ modal: true, modalContainerId: "banner1", modalClassName: css.videoModal, - isVerticalModal: true, + isVerticalModal: true, // Assuming second banner is horizontal, so modal is vertical }; // μ€μ μ μ΄ μμ€ν μ '미리보기' μ¬μμ μμ² @@ -395,29 +412,80 @@ export default function HomeBanner({ } }, [shouldShowOptionalTermsPopup, termsLoading, isOptionalConfirmVisible, dispatch]); + // const renderItem = useCallback( + // (index, isHorizontal) => { + // const data = bannerDataList?.[index] ?? {}; + + // if (index === 1) { + // return ( + //