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

[PlayerPanel] overlayLoading 삭제

Browse Source
This commit is contained in:
고동영
2024-06-28 15:49:58 +09:00
parent 86b077e1b8
commit 209ddcc0a6
6 changed files with 117 additions and 169 deletions
Download Patch File Download Diff File Expand all files Collapse all files

8
com.twin.app.shoptime/src/components/VideoPlayer/TReactPlayer.jsx
View File

@@ -22,8 +22,6 @@ export default function TReactPlayer({
mediaEventsMap = handledMediaEventsMap,
videoRef,
url,
overlayLoading,
setOverlayLoading,
...rest
}) {
const playerRef = useRef(null);
@@ -32,10 +30,6 @@ export default function TReactPlayer({
(type) => (ev) => {
if (type === "onReady") {
if (videoRef) {
if (!overlayLoading) {
setOverlayLoading(true);
}
const videoNode = playerRef.current.getInternalPlayer();
videoRef(videoNode);
if (
@@ -122,7 +116,7 @@ export default function TReactPlayer({
}
handle.forward("onUpdate", { type, ev }, rest);
},
[videoRef, overlayLoading]
[videoRef]
);
const handledMediaEvents = useMemo(() => {

22
com.twin.app.shoptime/src/components/VideoPlayer/VideoPlayer.js
View File

@@ -2109,8 +2109,6 @@ const VideoPlayerBase = class extends React.Component {
handleIndicatorUpClick,
orderPhnNo,
captionEnable,
overlayLoading,
setOverlayLoading,
...mediaProps
} = this.props;
@@ -2223,11 +2221,7 @@ const VideoPlayerBase = class extends React.Component {
(VideoComponent &&
(((typeof VideoComponent === "function" ||
typeof VideoComponent === "string") && (
<VideoComponent
{...mediaProps}
overlayLoading={overlayLoading}
setOverlayLoading={setOverlayLoading}
/>
<VideoComponent {...mediaProps} />
)) ||
(React.isValidElement(VideoComponent) &&
React.cloneElement(VideoComponent, mediaProps)))) ||
@@ -2258,7 +2252,6 @@ const VideoPlayerBase = class extends React.Component {
(this.state.infoVisible ? " " + css.lift : "")
}
>
{overlayLoading && (
<PlayerOverlayContents
playListInfo={playListInfo && playListInfo}
selectedIndex={selectedIndex}
@@ -2275,7 +2268,6 @@ const VideoPlayerBase = class extends React.Component {
disclaimer={disclaimer}
type={type}
/>
)}
</div>
)}
</Overlay>
@@ -2322,22 +2314,21 @@ const VideoPlayerBase = class extends React.Component {
videoVerticalVisible && css.videoVertical
)}
>
{this.state.mediaSliderVisible && overlayLoading ? (
{this.state.mediaSliderVisible ? (
<Times
noCurrentTime
total={this.state.duration}
formatter={durFmt}
/>
) : null}
{this.state.mediaSliderVisible && overlayLoading ? (
{this.state.mediaSliderVisible ? (
<Times
noTotalTime
current={this.state.currentTime}
formatter={durFmt}
/>
) : null}
{overlayLoading && (
<MediaSlider
//노브
backgroundProgress={this.state.proportionLoaded}
@@ -2369,9 +2360,7 @@ const VideoPlayerBase = class extends React.Component {
!this.state.feedbackVisible ||
this.state.sourceUnavailable
}
playbackRate={this.selectPlaybackRate(
this.speedIndex
)}
playbackRate={this.selectPlaybackRate(this.speedIndex)}
playbackState={this.prevCommand}
thumbnailComponent={thumbnailComponent}
thumbnailDeactivated={this.props.thumbnailUnavailable}
@@ -2379,7 +2368,6 @@ const VideoPlayerBase = class extends React.Component {
/>
}
</MediaSlider>
)}
</div>
)}
<ComponentOverride

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

@@ -135,7 +135,6 @@ const PlayerPanel = ({
const [shopNowInfo, setShopNowInfo] = useState();
const [modalStyle, setModalStyle] = useState({});
const [mediaId, setMediaId] = useState(null);
const [overlayLoading, setOverlayLoading] = useState(false);
const [sideContentsVisible, setSideContentsVisible] = useState(true);
const [currentTime, setCurrentTime] = useState(0);
@@ -707,12 +706,7 @@ const PlayerPanel = ({
}, [isInitialFocusOccurred, panelInfo]);
useEffect(() => {
if (
!panelInfo.modal &&
!videoVerticalVisible &&
playListInfo &&
overlayLoading
) {
if (!panelInfo.modal && !videoVerticalVisible && playListInfo) {
Spotlight.focus("player-tab-arrow");
}
}, [
@@ -720,7 +714,6 @@ const PlayerPanel = ({
sideContentsVisible,
playListInfo,
videoVerticalVisible,
overlayLoading,
]);
useEffect(() => {
@@ -837,8 +830,7 @@ const PlayerPanel = ({
}
}, [liveShowInfos, selectedIndex, videoPlayer, panelInfo]);
const mediainfoHandler = useCallback(
(ev) => {
const mediainfoHandler = useCallback((ev) => {
const type = ev.type;
if (type !== "timeupdate" && type !== "durationchange") {
console.log(
@@ -863,14 +855,9 @@ const PlayerPanel = ({
switch (type) {
case "timeupdate": {
if (!overlayLoading) {
setOverlayLoading(true);
}
setCurrentTime(videoPlayer.current?.getMediaState()?.currentTime);
if (
videoPlayer.current?.getMediaState().currentTime >= liveTotalTime
) {
if (videoPlayer.current?.getMediaState().currentTime >= liveTotalTime) {
dispatch(getMainLiveShow());
}
@@ -890,9 +877,7 @@ const PlayerPanel = ({
setMediaId(mediaId);
}
}
},
[overlayLoading]
);
}, []);
useEffect(() => {
if (panelInfo.modal && panelInfo.modalContainerId) {
@@ -996,13 +981,12 @@ const PlayerPanel = ({
chatData &&
!panelInfo.modal &&
isOnTop &&
panelInfo?.shptmBanrTpNm !== "MEDIA" &&
overlayLoading
panelInfo?.shptmBanrTpNm !== "MEDIA"
) {
return true;
}
return false;
}, [playListInfo, chatData, panelInfo.modal, overlayLoading, isOnTop]);
}, [playListInfo, chatData, panelInfo.modal, isOnTop]);
const isQRCodeVisible = useMemo(() => {
if (playListInfo && shopNowInfo && !panelInfo.modal) {
@@ -1129,7 +1113,6 @@ const PlayerPanel = ({
);
setSideContentsVisible(true);
setOverlayLoading(false);
}, [dispatch, playListInfo, selectedIndex]);
const handleIndicatorUpClick = useCallback(() => {
@@ -1160,7 +1143,6 @@ const PlayerPanel = ({
}
setSideContentsVisible(true);
setOverlayLoading(false);
}, [dispatch, playListInfo, selectedIndex]);
useEffect(() => {
@@ -1293,8 +1275,6 @@ const PlayerPanel = ({
sideContentsVisible={sideContentsVisible}
videoVerticalVisible={videoVerticalVisible}
isSubtitleActive={isSubtitleActive}
overlayLoading={overlayLoading}
setOverlayLoading={setOverlayLoading}
>
{typeof window === "object" && window.PalmSystem && (
<source src={currentPlayingUrl} type="application/mpegurl" />
@@ -1310,9 +1290,7 @@ const PlayerPanel = ({
)}
{/* Overlay Area */}
{playListInfo &&
playListInfo[orderPhnNoIndex]?.orderPhnNo &&
overlayLoading && (
{playListInfo && playListInfo[orderPhnNoIndex]?.orderPhnNo && (
<VideoOverlayWithPhoneNumber
className={css.videoOverlayWithPhoneNumber}
orderPhnNo={playListInfo[orderPhnNoIndex]?.orderPhnNo}
@@ -1335,10 +1313,7 @@ const PlayerPanel = ({
/>
)}
{currentSideButtonStatus &&
!videoVerticalVisible &&
playListInfo &&
overlayLoading && (
{currentSideButtonStatus && !videoVerticalVisible && playListInfo && (
<PlayerTabButton
setSideContentsVisible={setSideContentsVisible}
sideContentsVisible={sideContentsVisible}
@@ -1349,8 +1324,7 @@ const PlayerPanel = ({
playListInfo &&
panelInfo?.shptmBanrTpNm !== "MEDIA" &&
!panelInfo?.modal &&
isOnTop &&
overlayLoading && (
isOnTop && (
<TabContainer
panelInfo={panelInfo}
shopNowInfo={shopNowInfo}
@@ -1361,7 +1335,6 @@ const PlayerPanel = ({
videoVerticalVisible={videoVerticalVisible}
handleItemFocus={handleItemFocus}
featuredShowsInfos={featuredShowsInfos}
setOverlayLoading={setOverlayLoading}
/>
)}
</Container>

3
com.twin.app.shoptime/src/views/PlayerPanel/PlayerTabContents/TabContaienr.jsx
View File

@@ -32,7 +32,6 @@ export default function TabContainer({
videoVerticalVisible,
featuredShowsInfos,
handleItemFocus,
setOverlayLoading,
}) {
const [tab, setTab] = useState(0);
@@ -135,7 +134,6 @@ export default function TabContainer({
setSelectedIndex={setSelectedIndex}
videoVerticalVisible={videoVerticalVisible}
currentVideoShowId={playListInfo[selectedIndex]?.showId}
setOverlayLoading={setOverlayLoading}
tabIndex={tab}
handleItemFocus={_handleItemFocus}
/>
@@ -145,7 +143,6 @@ export default function TabContainer({
selectedIndex={selectedIndex}
setSelectedIndex={setSelectedIndex}
videoVerticalVisible={videoVerticalVisible}
setOverlayLoading={setOverlayLoading}
liveInfos={playListInfo}
tabIndex={tab}
handleItemFocus={_handleItemFocus}

2
com.twin.app.shoptime/src/views/PlayerPanel/PlayerTabContents/TabContents/FeaturedShowContents.jsx
View File

@@ -18,7 +18,6 @@ export default function FeaturedShowContents({
videoVerticalVisible,
currentVideoInfo,
setSelectedIndex,
setOverlayLoading,
tabIndex,
handleItemFocus,
}) {
@@ -36,7 +35,6 @@ export default function FeaturedShowContents({
const handleItemClick = useCallback(
(index, patnrId, showId) => () => {
setSelectedIndex(index + 1);
setOverlayLoading(false);
dispatch(
updatePanel({
name: panel_names.PLAYER_PANEL,

2
com.twin.app.shoptime/src/views/PlayerPanel/PlayerTabContents/TabContents/LiveChannelContents.jsx
View File

@@ -16,7 +16,6 @@ export default function LiveChannelContents({
liveInfos,
setSelectedIndex,
videoVerticalVisible,
setOverlayLoading,
tabIndex,
handleItemFocus,
}) {
@@ -52,7 +51,6 @@ export default function LiveChannelContents({
if (!showId) return;
setSelectedIndex(index);
setOverlayLoading(false);
dispatch(
updatePanel({
name: panel_names.PLAYER_PANEL,