Stop media playback when navigating between views

Subscribe to view changes in UI store and pause all video/audio
elements inside <main> when the view switches. Prevents double
audio when opening a thread from a note with playing video.
Podcast player audio is outside <main> and unaffected.
This commit is contained in:
Jure
2026-04-04 19:07:49 +02:00
parent 4a7f616c4b
commit b155505828

View File

@@ -127,3 +127,16 @@ export const useUIStore = create<UIState>((set, _get) => ({
toggleHelp: () => set((s) => ({ showHelp: !s.showHelp })),
toggleDebugPanel: () => set((s) => ({ showDebugPanel: !s.showDebugPanel })),
}));
// Pause all in-page media (video/audio) when navigating between views
// This prevents background playback when opening thread from feed, etc.
// Note: the podcast player <audio> has a ref and is managed separately.
let prevView = useUIStore.getState().currentView;
useUIStore.subscribe((s) => {
if (s.currentView !== prevView) {
prevView = s.currentView;
document.querySelectorAll<HTMLMediaElement>("main video, main audio").forEach((el) => {
if (!el.paused) el.pause();
});
}
});