feat(player): use state-specific debouncer, not global

This commit is contained in:
Jip Fr 2023-04-20 21:07:44 +02:00
parent a0a51c898a
commit 7007f030e1
3 changed files with 5 additions and 5 deletions

View File

@ -33,6 +33,7 @@ function initPlayer(): VideoPlayerState {
leftControlHovering: false, leftControlHovering: false,
popoutBounds: null, popoutBounds: null,
volumeChangedWithKeybind: false, volumeChangedWithKeybind: false,
volumeChangedWithKeybindDebounce: null,
}, },
mediaPlaying: { mediaPlaying: {

View File

@ -5,8 +5,6 @@ import { VideoPlayerMeta } from "@/video/state/types";
import { getPlayerState } from "../cache"; import { getPlayerState } from "../cache";
import { VideoPlayerStateController } from "../providers/providerTypes"; import { VideoPlayerStateController } from "../providers/providerTypes";
let volumeChangedWithKeybindDebounce: NodeJS.Timeout | null = null;
export type ControlMethods = { export type ControlMethods = {
openPopout(id: string): void; openPopout(id: string): void;
closePopout(): void; closePopout(): void;
@ -52,13 +50,13 @@ export function useControls(
}, },
setVolume(volume, isKeyboardEvent = false) { setVolume(volume, isKeyboardEvent = false) {
if (isKeyboardEvent) { if (isKeyboardEvent) {
if (volumeChangedWithKeybindDebounce) if (state.interface.volumeChangedWithKeybindDebounce)
clearTimeout(volumeChangedWithKeybindDebounce); clearTimeout(state.interface.volumeChangedWithKeybindDebounce);
state.interface.volumeChangedWithKeybind = true; state.interface.volumeChangedWithKeybind = true;
updateInterface(descriptor, state); updateInterface(descriptor, state);
volumeChangedWithKeybindDebounce = setTimeout(() => { state.interface.volumeChangedWithKeybindDebounce = setTimeout(() => {
state.interface.volumeChangedWithKeybind = false; state.interface.volumeChangedWithKeybind = false;
updateInterface(descriptor, state); updateInterface(descriptor, state);
}, 3e3); }, 3e3);

View File

@ -29,6 +29,7 @@ export type VideoPlayerState = {
popout: string | null; // id of current popout (eg source select, episode select) popout: string | null; // id of current popout (eg source select, episode select)
isFocused: boolean; // is the video player the users focus? (shortcuts only works when its focused) isFocused: boolean; // is the video player the users focus? (shortcuts only works when its focused)
volumeChangedWithKeybind: boolean; // has the volume recently been adjusted with the up/down arrows recently? volumeChangedWithKeybind: boolean; // has the volume recently been adjusted with the up/down arrows recently?
volumeChangedWithKeybindDebounce: NodeJS.Timeout | null; // debounce for the duration of the "volume changed thingamajig"
leftControlHovering: boolean; // is the cursor hovered over the left side of player controls leftControlHovering: boolean; // is the cursor hovered over the left side of player controls
popoutBounds: null | DOMRect; // bounding box of current popout popoutBounds: null | DOMRect; // bounding box of current popout
}; };