test(player): fix binge watching (5)

This commit is contained in:
Timothy Z. 2025-05-02 00:22:39 +03:00
parent 9aed64d998
commit 9b405c53d8

View file

@ -103,7 +103,6 @@ const Player = ({ urlParams, queryParams }) => {
}, [settings.subtitlesSize, settings.subtitlesOffset, settings.subtitlesTextColor, settings.subtitlesBackgroundColor, settings.subtitlesOutlineColor]); }, [settings.subtitlesSize, settings.subtitlesOffset, settings.subtitlesTextColor, settings.subtitlesBackgroundColor, settings.subtitlesOutlineColor]);
const onEnded = React.useCallback(() => { const onEnded = React.useCallback(() => {
console.log('Player in on ended callback', player.nextVideo); // eslint-disable-line no-console
ended(); ended();
if (player.nextVideo !== null) { if (player.nextVideo !== null) {
onNextVideoRequested(); onNextVideoRequested();
@ -216,22 +215,36 @@ const Player = ({ urlParams, queryParams }) => {
}, []); }, []);
const onNextVideoRequested = React.useCallback(() => { const onNextVideoRequested = React.useCallback(() => {
if (player.nextVideo !== null && !nextVideoHandledRef.current) { if (player.nextVideo !== null) {
nextVideoHandledRef.current = true; // Call nextVideo only for analytics
nextVideo();
const navigationData = { // Capture navigation data
playerLink: player.nextVideo.deepLinks.player, const navigationLink = player.nextVideo.deepLinks.player ||
metaDetailsLink: player.nextVideo.deepLinks.metaDetailsStreams player.nextVideo.deepLinks.metaDetailsStreams;
};
const targetLink = navigationData.playerLink || navigationData.metaDetailsLink; if (navigationLink) {
// Force immediate navigation with no chance of React re-renders affecting it
// This bypasses the React lifecycle entirely
const navigateImmediately = () => {
const form = document.createElement('form');
form.style.display = 'none';
form.method = 'GET';
form.action = navigationLink;
if (targetLink) { const input = document.createElement('input');
nextVideo(); input.type = 'hidden';
input.name = 'navigationFromPlayer';
input.value = 'true';
form.appendChild(input);
window.location.replace(targetLink); // Force immediate navigation
} else { document.body.appendChild(form);
nextVideo(); form.submit();
};
// Execute immediately
navigateImmediately();
} }
} }
}, [player.nextVideo]); }, [player.nextVideo]);
@ -511,10 +524,7 @@ const Player = ({ urlParams, queryParams }) => {
video.events.off('extraSubtitlesTrackAdded', onExtraSubtitlesTrackAdded); video.events.off('extraSubtitlesTrackAdded', onExtraSubtitlesTrackAdded);
video.events.off('implementationChanged', onImplementationChanged); video.events.off('implementationChanged', onImplementationChanged);
}; };
}, [ }, [onEnded]);
onEnded,
onImplementationChanged
]);
React.useLayoutEffect(() => { React.useLayoutEffect(() => {
const onKeyDown = (event) => { const onKeyDown = (event) => {
@ -647,6 +657,22 @@ const Player = ({ urlParams, queryParams }) => {
}; };
}, []); }, []);
React.useEffect(() => {
const urlParams = new URLSearchParams(window.location.search);
// eslint-disable-next-line
const cameFromPlayer = urlParams.get('navigationFromPlayer');
if (cameFromPlayer === 'true') {
// eslint-disable-next-line
urlParams.delete('navigationFromPlayer');
const newUrl = window.location.pathname +
(urlParams.toString() ? '?' + urlParams.toString() : '') +
window.location.hash;
window.history.replaceState({}, '', newUrl);
}
}, []);
return ( return (
<div className={classnames(styles['player-container'], { [styles['overlayHidden']]: overlayHidden })} <div className={classnames(styles['player-container'], { [styles['overlayHidden']]: overlayHidden })}
onMouseDown={onContainerMouseDown} onMouseDown={onContainerMouseDown}