|
|
@@ -1,4 +1,12 @@
|
|
|
-import React, { Suspense, useCallback, useContext, useMemo } from 'react';
|
|
|
+import React, {
|
|
|
+ Suspense,
|
|
|
+ useCallback,
|
|
|
+ useContext,
|
|
|
+ useEffect,
|
|
|
+ useMemo,
|
|
|
+ useRef,
|
|
|
+ useState,
|
|
|
+} from 'react';
|
|
|
import { useMediaQuery } from 'react-responsive';
|
|
|
import { StateInspector } from 'reinspect';
|
|
|
|
|
|
@@ -7,7 +15,7 @@ import { DispatchContext, StateContext } from '../context/state';
|
|
|
import { usePlayQueue } from '../hooks/queue';
|
|
|
import { useKeepalive } from '../hooks/socket';
|
|
|
import { useCurrentlyPlayingSongInfo } from '../hooks/status';
|
|
|
-import { isMaster } from '../selectors';
|
|
|
+import { isActiveClient, isMaster } from '../selectors';
|
|
|
import { getSongUrl } from '../utils/url';
|
|
|
import { LoadingWrapper } from './identify';
|
|
|
import { Interact, Props as InteractProps } from './interact';
|
|
|
@@ -50,13 +58,29 @@ export const App: React.FC<Props> = ({
|
|
|
isDesktop,
|
|
|
]);
|
|
|
|
|
|
+ const shouldPlay = isActiveClient(state) && !!state.player.songId;
|
|
|
+ const wasPlaying = useRef<boolean>(false);
|
|
|
+ const [seekTime, setSeekTime] = useState<number>(-1);
|
|
|
+ useEffect(() => {
|
|
|
+ if (shouldPlay && !wasPlaying.current) {
|
|
|
+ wasPlaying.current = true;
|
|
|
+ setSeekTime(state.player.seekTime === -1 ? state.player.currentTime : state.player.seekTime);
|
|
|
+ } else if (state.player.seekTime !== -1) {
|
|
|
+ setSeekTime(state.player.seekTime);
|
|
|
+ }
|
|
|
+
|
|
|
+ if (!shouldPlay && wasPlaying.current) {
|
|
|
+ wasPlaying.current = false;
|
|
|
+ }
|
|
|
+ }, [shouldPlay, state.player.currentTime, state.player.seekTime]);
|
|
|
+
|
|
|
return (
|
|
|
<>
|
|
|
- {isMaster(state) && !!state.player.songId && (
|
|
|
+ {shouldPlay && (
|
|
|
<Player
|
|
|
- src={getSongUrl(state.player.songId)}
|
|
|
+ src={getSongUrl(state.player.songId as number)}
|
|
|
playing={state.player.playing}
|
|
|
- seekTime={state.player.seekTime}
|
|
|
+ seekTime={seekTime}
|
|
|
onTimeUpdate={onTimeUpdate}
|
|
|
timeUpdateFPS={1}
|
|
|
onEnded={onNext}
|