pstream is dead; long live pstream
taciturnaxolotl.github.io/pstream-ng/
disable controls if watchparty guest
+37
-25
+2
-2
src/components/player/atoms/Episodes.tsx
+2
-2
src/components/player/atoms/Episodes.tsx
···
476
476
return <EpisodesOverlay onChange={props.onChange} id="episodes" />;
477
477
}
478
478
479
-
export function Episodes() {
479
+
export function Episodes(props: { inControl: boolean }) {
480
480
const { t } = useTranslation();
481
481
const router = useOverlayRouter("episodes");
482
482
const setHasOpenOverlay = usePlayerStore((s) => s.setHasOpenOverlay);
···
485
485
useEffect(() => {
486
486
setHasOpenOverlay(router.isRouterActive);
487
487
}, [setHasOpenOverlay, router.isRouterActive]);
488
-
if (type !== "show") return null;
488
+
if (type !== "show" || !props.inControl) return null;
489
489
490
490
return (
491
491
<OverlayAnchor id={router.id}>
+2
src/components/player/atoms/NextEpisodeButton.tsx
+2
src/components/player/atoms/NextEpisodeButton.tsx
···
93
93
export function NextEpisodeButton(props: {
94
94
controlsShowing: boolean;
95
95
onChange?: (meta: PlayerMeta) => void;
96
+
inControl: boolean;
96
97
}) {
97
98
const { t } = useTranslation();
98
99
const duration = usePlayerStore((s) => s.progress.duration);
···
208
209
time,
209
210
]);
210
211
212
+
if (!props.inControl) return null;
211
213
if (!meta?.episode || !nextEp) return null;
212
214
if (metaType !== "show") return null;
213
215
+7
-8
src/components/player/atoms/SkipIntroButton.tsx
+7
-8
src/components/player/atoms/SkipIntroButton.tsx
···
42
42
export function SkipIntroButton(props: {
43
43
controlsShowing: boolean;
44
44
skipTime?: number | null;
45
+
inControl: boolean;
45
46
}) {
46
47
const time = usePlayerStore((s) => s.progress.time);
47
48
const status = usePlayerStore((s) => s.status);
48
49
const display = usePlayerStore((s) => s.display);
49
-
50
50
const showingState = shouldShowSkipButton(time, props.skipTime);
51
-
52
-
let show = false;
53
-
if (showingState === "always") show = true;
54
-
else if (showingState === "hover" && props.controlsShowing) show = true;
55
-
if (status !== "playing") show = false;
56
-
57
51
const animation = showingState === "hover" ? "slide-up" : "fade";
58
52
let bottom = "bottom-[calc(6rem+env(safe-area-inset-bottom))]";
59
53
if (showingState === "always") {
···
61
55
? bottom
62
56
: "bottom-[calc(3rem+env(safe-area-inset-bottom))]";
63
57
}
64
-
65
58
const handleSkip = useCallback(() => {
66
59
if (typeof props.skipTime === "number" && display) {
67
60
display.setTime(props.skipTime);
68
61
}
69
62
}, [props.skipTime, display]);
63
+
if (!props.inControl) return null;
64
+
65
+
let show = false;
66
+
if (showingState === "always") show = true;
67
+
else if (showingState === "hover" && props.controlsShowing) show = true;
68
+
if (status !== "playing") show = false;
70
69
71
70
return (
72
71
<Transition
+10
-6
src/components/player/atoms/Skips.tsx
+10
-6
src/components/player/atoms/Skips.tsx
···
4
4
import { VideoPlayerButton } from "@/components/player/internals/Button";
5
5
import { usePlayerStore } from "@/stores/player/store";
6
6
7
-
export function SkipForward(props: { iconSizeClass?: string }) {
7
+
export function SkipForward(props: {
8
+
iconSizeClass?: string;
9
+
inControl: boolean;
10
+
}) {
8
11
const display = usePlayerStore((s) => s.display);
9
12
const time = usePlayerStore((s) => s.progress.time);
10
-
11
13
const commit = useCallback(() => {
12
14
display?.setTime(time + 10);
13
15
}, [display, time]);
14
-
16
+
if (!props.inControl) return null;
15
17
return (
16
18
<VideoPlayerButton
17
19
iconSizeClass={props.iconSizeClass}
···
21
23
);
22
24
}
23
25
24
-
export function SkipBackward(props: { iconSizeClass?: string }) {
26
+
export function SkipBackward(props: {
27
+
iconSizeClass?: string;
28
+
inControl: boolean;
29
+
}) {
25
30
const display = usePlayerStore((s) => s.display);
26
31
const time = usePlayerStore((s) => s.progress.time);
27
-
28
32
const commit = useCallback(() => {
29
33
display?.setTime(time - 10);
30
34
}, [display, time]);
31
-
35
+
if (!props.inControl) return null;
32
36
return (
33
37
<VideoPlayerButton
34
38
iconSizeClass={props.iconSizeClass}
+16
-9
src/pages/parts/player/PlayerPart.tsx
+16
-9
src/pages/parts/player/PlayerPart.tsx
···
9
9
import { useShouldShowControls } from "@/components/player/hooks/useShouldShowControls";
10
10
import { useSkipTime } from "@/components/player/hooks/useSkipTime";
11
11
import { useIsMobile } from "@/hooks/useIsMobile";
12
-
import { useOverlayRouter } from "@/hooks/useOverlayRouter";
13
12
import { PlayerMeta, playerStatus } from "@/stores/player/slices/source";
14
13
import { usePlayerStore } from "@/stores/player/store";
14
+
import { useWatchPartyStore } from "@/stores/watchParty";
15
15
16
16
import { ScrapingPartInterruptButton, Tips } from "./ScrapingPart";
17
17
···
27
27
const status = usePlayerStore((s) => s.status);
28
28
const { isMobile } = useIsMobile();
29
29
const isLoading = usePlayerStore((s) => s.mediaPlaying.isLoading);
30
-
const router = useOverlayRouter("settings");
30
+
const { isHost, enabled } = useWatchPartyStore();
31
+
32
+
const inControl = !enabled || isHost;
31
33
32
34
const isIOS = /iPad|iPhone|iPod/.test(navigator.userAgent);
33
35
const isIOSPWA =
···
95
97
className="text-white"
96
98
show={showTouchTargets && status === playerStatus.PLAYING}
97
99
>
98
-
<Player.SkipBackward iconSizeClass="text-3xl" />
100
+
<Player.SkipBackward iconSizeClass="text-3xl" inControl={inControl} />
99
101
<Player.Pause
100
102
iconSizeClass="text-5xl"
101
103
className={isLoading ? "opacity-0" : "opacity-100"}
102
104
/>
103
-
<Player.SkipForward iconSizeClass="text-3xl" />
105
+
<Player.SkipForward iconSizeClass="text-3xl" inControl={inControl} />
104
106
</Player.CenterMobileControls>
105
107
106
108
<Player.TopControls show={showTargets}>
···
149
151
{status === playerStatus.PLAYING ? (
150
152
<>
151
153
<Player.Pause />
152
-
<Player.SkipBackward />
153
-
<Player.SkipForward />
154
+
<Player.SkipBackward inControl={inControl} />
155
+
<Player.SkipForward inControl={inControl} />
154
156
<Player.Volume />
155
157
<Player.Time />
156
158
</>
157
159
) : null}
158
160
</Player.LeftSideControls>
159
161
<div className="flex items-center space-x-3">
160
-
<Player.Episodes />
162
+
<Player.Episodes inControl={inControl} />
161
163
{status === playerStatus.PLAYING ? (
162
164
<>
163
165
<Player.Pip />
···
186
188
<div className="flex justify-center space-x-3">
187
189
{/* Disable PiP for iOS PWA */}
188
190
{!isIOSPWA && status === playerStatus.PLAYING && <Player.Pip />}
189
-
<Player.Episodes />
191
+
<Player.Episodes inControl={inControl} />
190
192
{status === playerStatus.PLAYING ? (
191
193
<div className="hidden ssm:block">
192
194
<Player.Captions />
···
219
221
<Player.NextEpisodeButton
220
222
controlsShowing={showTargets}
221
223
onChange={props.onMetaChange}
224
+
inControl={inControl}
222
225
/>
223
226
224
-
<SkipIntroButton controlsShowing={showTargets} skipTime={skiptime} />
227
+
<SkipIntroButton
228
+
controlsShowing={showTargets}
229
+
skipTime={skiptime}
230
+
inControl={inControl}
231
+
/>
225
232
</Player.Container>
226
233
);
227
234
}