Migrate more events to EventBus

This commit is contained in:
redphx
2024-12-09 07:01:13 +07:00
parent 5fb0dec9f2
commit 7206c9e8bc
12 changed files with 59 additions and 64 deletions

View File

@@ -1,4 +1,4 @@
import { BxEvent } from "@/utils/bx-event";
import { BxEventBus } from "@/utils/bx-event-bus";
export abstract class BaseGameBarAction {
abstract $content: HTMLElement;
@@ -7,7 +7,7 @@ export abstract class BaseGameBarAction {
reset() {}
onClick(e: Event) {
BxEvent.dispatch(window, BxEvent.GAME_BAR_ACTION_ACTIVATED);
BxEventBus.Stream.emit('gameBar.activated', {});
};
render(): HTMLElement {

View File

@@ -13,6 +13,7 @@ import { SpeakerAction } from "./speaker-action";
import { RendererAction } from "./renderer-action";
import { BxLogger } from "@/utils/bx-logger";
import { GameBarPosition, TouchControllerMode } from "@/enums/pref-values";
import { BxEventBus } from "@/utils/bx-event-bus";
export class GameBar {
@@ -81,7 +82,7 @@ export class GameBar {
});
// Hide game bar after clicking on an action
window.addEventListener(BxEvent.GAME_BAR_ACTION_ACTIVATED, this.hideBar);
BxEventBus.Stream.on('gameBar.activated', this.hideBar);
$container.addEventListener('pointerover', this.clearHideTimeout);
$container.addEventListener('pointerout', this.beginHideTimeout);

View File

@@ -1,8 +1,8 @@
import { BxEvent } from "@utils/bx-event";
import { BxIcon } from "@utils/bx-icon";
import { createButton, ButtonStyle, CE } from "@utils/html";
import { BaseGameBarAction } from "./base-action";
import { MicrophoneShortcut, MicrophoneState } from "../shortcuts/microphone-shortcut";
import { BxEventBus } from "@/utils/bx-event-bus";
export class MicrophoneAction extends BaseGameBarAction {
@@ -26,9 +26,8 @@ export class MicrophoneAction extends BaseGameBarAction {
this.$content = CE('div', {}, $btnMuted, $btnDefault);
window.addEventListener(BxEvent.MICROPHONE_STATE_CHANGED, e => {
const microphoneState = (e as any).microphoneState;
const enabled = microphoneState === MicrophoneState.ENABLED;
BxEventBus.Stream.on('microphone.state.changed', payload => {
const enabled = payload.state === MicrophoneState.ENABLED;
this.$content.dataset.activated = enabled.toString();
// Show the button in Game Bar if the mic is enabled

View File

@@ -2,7 +2,7 @@ import { BxIcon } from "@utils/bx-icon";
import { createButton, ButtonStyle, CE } from "@utils/html";
import { BaseGameBarAction } from "./base-action";
import { RendererShortcut } from "../shortcuts/renderer-shortcut";
import { BxEvent } from "@/utils/bx-event";
import { BxEventBus } from "@/utils/bx-event-bus";
export class RendererAction extends BaseGameBarAction {
@@ -26,9 +26,8 @@ export class RendererAction extends BaseGameBarAction {
this.$content = CE('div', {}, $btnDefault, $btnActivated);
window.addEventListener(BxEvent.VIDEO_VISIBILITY_CHANGED, e => {
const isShowing = (e as any).isShowing;
this.$content.dataset.activated = (!isShowing).toString();
BxEventBus.Stream.on('video.visibility.changed', payload => {
this.$content.dataset.activated = (!payload.isVisible).toString();
});
}

View File

@@ -1,8 +1,8 @@
import { BxEvent } from "@utils/bx-event";
import { BxIcon } from "@utils/bx-icon";
import { createButton, ButtonStyle, CE } from "@utils/html";
import { BaseGameBarAction } from "./base-action";
import { SoundShortcut, SpeakerState } from "../shortcuts/sound-shortcut";
import { BxEventBus } from "@/utils/bx-event-bus";
export class SpeakerAction extends BaseGameBarAction {
@@ -26,10 +26,8 @@ export class SpeakerAction extends BaseGameBarAction {
this.$content = CE('div', {}, $btnEnable, $btnMuted);
window.addEventListener(BxEvent.SPEAKER_STATE_CHANGED, e => {
const speakerState = (e as any).speakerState;
const enabled = speakerState === SpeakerState.ENABLED;
BxEventBus.Stream.on('speaker.state.changed', payload => {
const enabled = payload.state === SpeakerState.ENABLED;
this.$content.dataset.activated = (!enabled).toString();
});
}

View File

@@ -3,11 +3,7 @@ window.BX_EXPOSED.streamSession = this;
const orgSetMicrophoneState = this.setMicrophoneState.bind(this);
this.setMicrophoneState = state => {
orgSetMicrophoneState(state);
const evt = new Event(BxEvent.MICROPHONE_STATE_CHANGED);
evt.microphoneState = state;
window.dispatchEvent(evt);
window.BxEventBus.Stream.emit('microphone.state.changed', { state });
};
window.dispatchEvent(new Event(BxEvent.STREAM_SESSION_READY));

View File

@@ -1,21 +1,21 @@
import { PrefKey } from "@/enums/pref-keys";
import { getPref } from "@/utils/settings-storages/global-settings-storage";
import { limitVideoPlayerFps } from "../stream/stream-settings-utils";
import { BxEvent } from "@/utils/bx-event";
import { BxEventBus } from "@/utils/bx-event-bus";
export class RendererShortcut {
static toggleVisibility() {
const $mediaContainer = document.querySelector('#game-stream div[data-testid="media-container"]');
if (!$mediaContainer) {
BxEvent.dispatch(window, BxEvent.VIDEO_VISIBILITY_CHANGED, { isShowing: true });
BxEventBus.Stream.emit('video.visibility.changed', { isVisible: true });
return;
}
$mediaContainer.classList.toggle('bx-gone');
const isShowing = !$mediaContainer.classList.contains('bx-gone');
const isVisible = !$mediaContainer.classList.contains('bx-gone');
// Switch FPS
limitVideoPlayerFps(isShowing ? getPref(PrefKey.VIDEO_MAX_FPS) : 0);
BxEvent.dispatch(window, BxEvent.VIDEO_VISIBILITY_CHANGED, { isShowing });
limitVideoPlayerFps(isVisible ? getPref(PrefKey.VIDEO_MAX_FPS) : 0);
BxEventBus.Stream.emit('video.visibility.changed', { isVisible });
}
}

View File

@@ -4,7 +4,7 @@ import { Toast } from "@utils/toast";
import { ceilToNearest, floorToNearest } from "@/utils/utils";
import { PrefKey } from "@/enums/pref-keys";
import { getPref, setPref } from "@/utils/settings-storages/global-settings-storage";
import { BxEvent } from "@/utils/bx-event";
import { BxEventBus } from "@/utils/bx-event-bus";
export enum SpeakerState {
ENABLED,
@@ -71,8 +71,8 @@ export class SoundShortcut {
SoundShortcut.setGainNodeVolume(targetValue);
Toast.show(`${t('stream')} ${t('volume')}`, status, { instant: true });
BxEvent.dispatch(window, BxEvent.SPEAKER_STATE_CHANGED, {
speakerState: targetValue === 0 ? SpeakerState.MUTED : SpeakerState.ENABLED,
BxEventBus.Stream.emit('speaker.state.changed', {
state: targetValue === 0 ? SpeakerState.MUTED : SpeakerState.ENABLED,
});
return;
}
@@ -84,9 +84,9 @@ export class SoundShortcut {
const status = $media.muted ? t('muted') : t('unmuted');
Toast.show(`${t('stream')} ${t('volume')}`, status, { instant: true });
BxEvent.dispatch(window, BxEvent.SPEAKER_STATE_CHANGED, {
speakerState: $media.muted ? SpeakerState.MUTED : SpeakerState.ENABLED,
})
BxEventBus.Stream.emit('speaker.state.changed', {
state: $media.muted ? SpeakerState.MUTED : SpeakerState.ENABLED,
});
}
}
}

View File

@@ -2,6 +2,8 @@ import type { PrefKey, StorageKey } from "@/enums/pref-keys";
import { BX_FLAGS } from "./bx-flags";
import { BxLogger } from "./bx-logger";
import { AppInterface } from "./global";
import type { MicrophoneState } from "@/modules/shortcuts/microphone-shortcut";
import type { SpeakerState } from "@/modules/shortcuts/sound-shortcut";
type EventCallback<T = any> = (payload: T) => void;
@@ -38,6 +40,12 @@ type StreamEvents = {
'state.stopped': {};
'state.error': {};
'gameBar.activated': {},
'speaker.state.changed': { state: SpeakerState },
'video.visibility.changed': { isVisible: boolean },
// Inside patch
'microphone.state.changed': { state: MicrophoneState },
dataChannelCreated: { dataChannel: RTCDataChannel };
};

View File

@@ -4,28 +4,26 @@ import { BX_FLAGS } from "./bx-flags";
export namespace BxEvent {
export const JUMP_BACK_IN_READY = 'bx-jump-back-in-ready';
export const POPSTATE = 'bx-popstate';
// export const STREAM_EVENT_TARGET_READY = 'bx-stream-event-target-ready';
// Inside patch
export const STREAM_SESSION_READY = 'bx-stream-session-ready';
export const CUSTOM_TOUCH_LAYOUTS_LOADED = 'bx-custom-touch-layouts-loaded';
export const TOUCH_LAYOUT_MANAGER_READY = 'bx-touch-layout-manager-ready';
// Inside app
export const REMOTE_PLAY_READY = 'bx-remote-play-ready';
export const REMOTE_PLAY_FAILED = 'bx-remote-play-failed';
export const GAME_BAR_ACTION_ACTIVATED = 'bx-game-bar-action-activated';
export const MICROPHONE_STATE_CHANGED = 'bx-microphone-state-changed';
export const SPEAKER_STATE_CHANGED = 'bx-speaker-state-changed';
export const VIDEO_VISIBILITY_CHANGED = 'bx-video-visibility-changed';
// Inside patch
export const CAPTURE_SCREENSHOT = 'bx-capture-screenshot';
export const POINTER_LOCK_REQUESTED = 'bx-pointer-lock-requested';
export const POINTER_LOCK_EXITED = 'bx-pointer-lock-exited';
// Inside patch
export const NAVIGATION_FOCUS_CHANGED = 'bx-nav-focus-changed';
export const XCLOUD_GUIDE_MENU_SHOWN = 'bx-xcloud-guide-menu-shown';
@@ -47,7 +45,6 @@ export namespace BxEvent {
}
const event = new Event(eventName);
if (data) {
for (const key in data) {
(event as any)[key] = data[key];