-
+ React.useEffect(() => {
+ video.setProp('subtitlesSize', settings.subtitlesSize);
+ video.setProp('extraSubtitlesSize', settings.subtitlesSize);
+ }, [settings.subtitlesSize]);
+
+ React.useEffect(() => {
+ video.setProp('subtitlesOffset', settings.subtitlesOffset);
+ video.setProp('extraSubtitlesOffset', settings.subtitlesOffset);
+ }, [settings.subtitlesOffset]);
+
+ React.useEffect(() => {
+ video.setProp('subtitlesTextColor', settings.subtitlesTextColor);
+ video.setProp('extraSubtitlesTextColor', settings.subtitlesTextColor);
+ }, [settings.subtitlesTextColor]);
+
+ React.useEffect(() => {
+ video.setProp('subtitlesBackgroundColor', settings.subtitlesBackgroundColor);
+ video.setProp('extraSubtitlesBackgroundColor', settings.subtitlesBackgroundColor);
+ }, [settings.subtitlesBackgroundColor]);
+
+ React.useEffect(() => {
+ video.setProp('subtitlesOutlineColor', settings.subtitlesOutlineColor);
+ video.setProp('extraSubtitlesOutlineColor', settings.subtitlesOutlineColor);
+ }, [settings.subtitlesOutlineColor]);
+
+ React.useEffect(() => {
+ if (video.state.time !== null && !isNaN(video.state.time) &&
+ video.state.duration !== null && !isNaN(video.state.duration) &&
+ video.state.manifest !== null && typeof video.state.manifest.name === 'string') {
+ timeChanged(video.state.time, video.state.duration, video.state.manifest.name);
+ }
+ }, [video.state.time, video.state.duration, video.state.manifest]);
+
+ React.useEffect(() => {
+ if (video.state.paused !== null) {
+ pausedChanged(video.state.paused);
+ }
+ }, [video.state.paused]);
+
+ React.useEffect(() => {
+ videoParamsChanged(video.state.videoParams);
+ }, [video.state.videoParams]);
+
+ React.useEffect(() => {
+ if (!!settings.bingeWatching && player.nextVideo !== null && !nextVideoPopupDismissed.current) {
+ if (video.state.time !== null && video.state.duration !== null && video.state.time < video.state.duration && (video.state.duration - video.state.time) <= settings.nextVideoNotificationDuration) {
+ openNextVideoPopup();
+ } else {
+ closeNextVideoPopup();
+ }
+ }
+ }, [player.nextVideo, video.state.time, video.state.duration]);
+
+ React.useEffect(() => {
+ if (!defaultSubtitlesSelected.current) {
+ const findTrackByLang = (tracks, lang) => tracks.find((track) => track.lang === lang || langs.where('1', track.lang)?.[2] === lang);
+
+ const subtitlesTrack = findTrackByLang(video.state.subtitlesTracks, settings.subtitlesLanguage);
+ const extraSubtitlesTrack = findTrackByLang(video.state.extraSubtitlesTracks, settings.subtitlesLanguage);
+
+ if (subtitlesTrack && subtitlesTrack.id) {
+ onSubtitlesTrackSelected(subtitlesTrack.id);
+ defaultSubtitlesSelected.current = true;
+ } else if (extraSubtitlesTrack && extraSubtitlesTrack.id) {
+ onExtraSubtitlesTrackSelected(extraSubtitlesTrack.id);
+ defaultSubtitlesSelected.current = true;
+ }
+ }
+ }, [video.state.subtitlesTracks, video.state.extraSubtitlesTracks]);
+
+ React.useEffect(() => {
+ if (!defaultAudioTrackSelected.current) {
+ const findTrackByLang = (tracks, lang) => tracks.find((track) => track.lang === lang || langs.where('1', track.lang)?.[2] === lang);
+ const audioTrack = findTrackByLang(video.state.audioTracks, settings.audioLanguage);
+
+ if (audioTrack && audioTrack.id) {
+ onAudioTrackSelected(audioTrack.id);
+ defaultAudioTrackSelected.current = true;
+ }
+ }
+ }, [video.state.audioTracks]);
+
+ React.useEffect(() => {
+ defaultSubtitlesSelected.current = false;
+ defaultAudioTrackSelected.current = false;
+ nextVideoPopupDismissed.current = false;
+ }, [video.state.stream]);
+
+ React.useEffect(() => {
+ if ((!Array.isArray(video.state.subtitlesTracks) || video.state.subtitlesTracks.length === 0) &&
+ (!Array.isArray(video.state.extraSubtitlesTracks) || video.state.extraSubtitlesTracks.length === 0) &&
+ (!Array.isArray(video.state.audioTracks) || video.state.audioTracks.length === 0)) {
+ closeSubtitlesMenu();
+ }
+ }, [video.state.audioTracks, video.state.subtitlesTracks, video.state.extraSubtitlesTracks]);
+
+ React.useEffect(() => {
+ if (player.metaItem === null || player.metaItem.type !== 'Ready') {
+ closeInfoMenu();
+ closeVideosMenu();
+ }
+ }, [player.metaItem]);
+
+ React.useEffect(() => {
+ if (video.state.playbackSpeed === null) {
+ closeSpeedMenu();
+ }
+ }, [video.state.playbackSpeed]);
+
+ React.useEffect(() => {
+ const toastFilter = (item) => item?.dataset?.type === 'CoreEvent';
+ toast.addFilter(toastFilter);
+ const onCastStateChange = () => {
+ setCasting(chromecast.active && chromecast.transport.getCastState() === cast.framework.CastState.CONNECTED);
+ };
+ const onChromecastServiceStateChange = () => {
+ onCastStateChange();
+ if (chromecast.active) {
+ chromecast.transport.on(
+ cast.framework.CastContextEventType.CAST_STATE_CHANGED,
+ onCastStateChange
+ );
+ }
+ };
+ const onCoreEvent = ({ event }) => {
+ if (event === 'PlayingOnDevice') {
+ onPauseRequested();
+ }
+ };
+ chromecast.on('stateChanged', onChromecastServiceStateChange);
+ core.transport.on('CoreEvent', onCoreEvent);
+ onChromecastServiceStateChange();
+ return () => {
+ toast.removeFilter(toastFilter);
+ chromecast.off('stateChanged', onChromecastServiceStateChange);
+ core.transport.off('CoreEvent', onCoreEvent);
+ if (chromecast.active) {
+ chromecast.transport.off(
+ cast.framework.CastContextEventType.CAST_STATE_CHANGED,
+ onCastStateChange
+ );
+ }
+ };
+ }, []);
+
+ React.useLayoutEffect(() => {
+ const onKeyDown = (event) => {
+ switch (event.code) {
+ case 'Space': {
+ if (!menusOpen && !nextVideoPopupOpen && video.state.paused !== null) {
+ if (video.state.paused) {
+ onPlayRequested();
+ } else {
+ onPauseRequested();
+ }
+ }
+
+ break;
+ }
+ case 'ArrowRight': {
+ if (!menusOpen && !nextVideoPopupOpen && video.state.time !== null) {
+ const seekDuration = event.shiftKey ? settings.seekShortTimeDuration : settings.seekTimeDuration;
+ onSeekRequested(video.state.time + seekDuration);
+ }
+
+ break;
+ }
+ case 'ArrowLeft': {
+ if (!menusOpen && !nextVideoPopupOpen && video.state.time !== null) {
+ const seekDuration = event.shiftKey ? settings.seekShortTimeDuration : settings.seekTimeDuration;
+ onSeekRequested(video.state.time - seekDuration);
+ }
+
+ break;
+ }
+ case 'ArrowUp': {
+ if (!menusOpen && !nextVideoPopupOpen && video.state.volume !== null) {
+ onVolumeChangeRequested(video.state.volume + 5);
+ }
+
+ break;
+ }
+ case 'ArrowDown': {
+ if (!menusOpen && !nextVideoPopupOpen && video.state.volume !== null) {
+ onVolumeChangeRequested(video.state.volume - 5);
+ }
+
+ break;
+ }
+ case 'KeyS': {
+ closeMenus();
+ if ((Array.isArray(video.state.subtitlesTracks) && video.state.subtitlesTracks.length > 0) ||
+ (Array.isArray(video.state.extraSubtitlesTracks) && video.state.extraSubtitlesTracks.length > 0) ||
+ (Array.isArray(video.state.audioTracks) && video.state.audioTracks.length > 0)) {
+ toggleSubtitlesMenu();
+ }
+
+ break;
+ }
+ case 'KeyC': {
+ if (!menusOpen && !nextVideoPopupOpen) {
+ if (video.state.selectedSubtitlesTrackId !== null) {
+ onSubtitlesTrackSelected(null);
+ } else if (previousSubtitlesTrackId !== null) {
+ onSubtitlesTrackSelected(previousSubtitlesTrackId);
+ } else if (video.state.subtitlesTracks.length > 0) {
+ onSubtitlesTrackSelected(video.state.subtitlesTracks[0].id);
+ } else if (video.state.extraSubtitlesTracks.length > 0) {
+ onExtraSubtitlesTrackSelected(video.state.extraSubtitlesTracks[0].id);
+ }
+ }
+ break;
+ }
+ case 'KeyI': {
+ closeMenus();
+ if (player.metaItem !== null && player.metaItem.type === 'Ready') {
+ toggleInfoMenu();
+ }
+
+ break;
+ }
+ case 'KeyR': {
+ closeMenus();
+ if (video.state.playbackSpeed !== null) {
+ toggleSpeedMenu();
+ }
+
+ break;
+ }
+ case 'KeyV': {
+ closeMenus();
+ if (player.metaItem !== null && player.metaItem.type === 'Ready' && player.metaItem?.content?.videos?.length > 0) {
+ toggleVideosMenu();
+ }
+
+ break;
+ }
+ case 'KeyD': {
+ closeMenus();
+ if (streamingServer.statistics !== null && streamingServer.statistics.type !== 'Err' && player.selected && typeof player.selected.stream.infoHash === 'string' && typeof player.selected.stream.fileIdx === 'number') {
+ toggleStatisticsMenu();
+ }
+
+ break;
+ }
+ case 'Escape': {
+ closeMenus();
+ break;
+ }
+ }
+ };
+ const onWheel = ({ deltaY }) => {
+ if (deltaY > 0) {
+ if (!menusOpen && video.state.volume !== null) {
+ onVolumeChangeRequested(video.state.volume - 5);
+ }
+ } else {
+ if (!menusOpen && video.state.volume !== null) {
+ onVolumeChangeRequested(video.state.volume + 5);
+ }
+ }
+ };
+ if (routeFocused) {
+ window.addEventListener('keydown', onKeyDown);
+ window.addEventListener('wheel', onWheel);
+ }
+ return () => {
+ window.removeEventListener('keydown', onKeyDown);
+ window.removeEventListener('wheel', onWheel);
+ };
+ }, [player.metaItem, player.selected, streamingServer.statistics, settings.seekTimeDuration, settings.seekShortTimeDuration, routeFocused, menusOpen, nextVideoPopupOpen, video.state.paused, video.state.time, video.state.volume, video.state.audioTracks, video.state.subtitlesTracks, video.state.extraSubtitlesTracks, video.state.playbackSpeed, toggleSubtitlesMenu, toggleInfoMenu, toggleVideosMenu, toggleStatisticsMenu]);
+
+ React.useEffect(() => {
+ video.events.on('error', onError);
+ video.events.on('ended', onEnded);
+ video.events.on('subtitlesTrackLoaded', onSubtitlesTrackLoaded);
+ video.events.on('extraSubtitlesTrackLoaded', onExtraSubtitlesTrackLoaded);
+ video.events.on('implementationChanged', onImplementationChanged);
+
+ return () => {
+ video.events.off('error', onError);
+ video.events.off('ended', onEnded);
+ video.events.off('subtitlesTrackLoaded', onSubtitlesTrackLoaded);
+ video.events.off('extraSubtitlesTrackLoaded', onExtraSubtitlesTrackLoaded);
+ video.events.off('implementationChanged', onImplementationChanged);
+ };
+ }, []);
+
+ React.useLayoutEffect(() => {
+ return () => {
+ setImmersedDebounced.cancel();
+ onPlayRequestedDebounced.cancel();
+ onPauseRequestedDebounced.cancel();
+ };
+ }, []);
+
+ return (
+
+
+ {
+ !video.state.loaded ?
+
+
+
+ :
+ null
+ }
+ {
+ (video.state.buffering || !video.state.loaded) && !error ?
+
+ :
+ null
+ }
+ {
+ error !== null ?
+
+ :
+ null
+ }
+ {
+ menusOpen ?
+
+ :
+ null
+ }
+ {
+ video.state.volume !== null && overlayHidden ?
+
+ :
+ null
+ }
+
+
+ {
+ nextVideoPopupOpen ?
+
+ :
+ null
+ }
+ {
+ statisticsMenuOpen ?
+
+ :
+ null
+ }
+ {
+ subtitlesMenuOpen ?
+
+ :
+ null
+ }
+ {
+ infoMenuOpen ?
+
+ :
+ null
+ }
+ {
+ speedMenuOpen ?
+
+ :
+ null
+ }
+ {
+ videosMenuOpen ?
+
+ :
+ null
+ }
+ {
+ optionsMenuOpen ?
+
+ :
+ null
+ }
- ) : null}
- {(video.state.buffering || !video.state.loaded) && !error ? (
-
- ) : null}
- {error !== null ? (
-
- ) : null}
- {menusOpen ?
: null}
- {video.state.volume !== null && overlayHidden ? (
-
- ) : null}
-
-
- {nextVideoPopupOpen ? (
-
- ) : null}
- {statisticsMenuOpen ? (
-
- ) : null}
- {subtitlesMenuOpen ? (
-
- ) : null}
- {infoMenuOpen ? (
-
- ) : null}
- {speedMenuOpen ? (
-
- ) : null}
- {videosMenuOpen ? (
-
- ) : null}
- {optionsMenuOpen ? (
-
- ) : null}
-
- );
+ );
};
Player.propTypes = {
- urlParams: PropTypes.shape({
- stream: PropTypes.string,
- streamTransportUrl: PropTypes.string,
- metaTransportUrl: PropTypes.string,
- type: PropTypes.string,
- id: PropTypes.string,
- videoId: PropTypes.string,
- }),
- queryParams: PropTypes.instanceOf(URLSearchParams),
+ urlParams: PropTypes.shape({
+ stream: PropTypes.string,
+ streamTransportUrl: PropTypes.string,
+ metaTransportUrl: PropTypes.string,
+ type: PropTypes.string,
+ id: PropTypes.string,
+ videoId: PropTypes.string
+ }),
+ queryParams: PropTypes.instanceOf(URLSearchParams)
};
const PlayerFallback = () => (
-
);
module.exports = withCoreSuspender(Player, PlayerFallback);
From 5ab324f12541c9803f49148ae71dd49f7defccae Mon Sep 17 00:00:00 2001
From: ArtificialSloth