diff --git a/dist/better-xcloud.user.js b/dist/better-xcloud.user.js index 7692935..395139d 100644 --- a/dist/better-xcloud.user.js +++ b/dist/better-xcloud.user.js @@ -7340,21 +7340,24 @@ function patchPointerLockApi() { class BaseGameBarAction { constructor() {} reset() {} + onClick(e) { + BxEvent.dispatch(window, BxEvent.GAME_BAR_ACTION_ACTIVATED); + } } class ScreenshotAction extends BaseGameBarAction { $content; constructor() { super(); - const onClick = (e) => { - BxEvent.dispatch(window, BxEvent.GAME_BAR_ACTION_ACTIVATED), Screenshot.takeScreenshot(); - }; this.$content = createButton({ style: 4, icon: BxIcon.SCREENSHOT, title: t("take-screenshot"), - onClick + onClick: this.onClick.bind(this) }); } + onClick(e) { + super.onClick(e), Screenshot.takeScreenshot(); + } render() { return this.$content; } @@ -7363,24 +7366,25 @@ class TouchControlAction extends BaseGameBarAction { $content; constructor() { super(); - const onClick = (e) => { - BxEvent.dispatch(window, BxEvent.GAME_BAR_ACTION_ACTIVATED); - const $parent = e.target.closest("div[data-activated]"), isVisible = TouchController.toggleVisibility(); - $parent.dataset.activated = (!isVisible).toString(); - }, $btnEnable = createButton({ + const $btnEnable = createButton({ style: 4, icon: BxIcon.TOUCH_CONTROL_ENABLE, title: t("show-touch-controller"), - onClick + onClick: this.onClick.bind(this) }), $btnDisable = createButton({ style: 4, icon: BxIcon.TOUCH_CONTROL_DISABLE, title: t("hide-touch-controller"), - onClick, + onClick: this.onClick.bind(this), classes: ["bx-activated"] }); this.$content = CE("div", {}, $btnEnable, $btnDisable), this.reset(); } + onClick(e) { + super.onClick(e); + const isVisible = TouchController.toggleVisibility(); + this.$content.dataset.activated = (!isVisible).toString(); + } render() { return this.$content; } @@ -7393,25 +7397,26 @@ class MicrophoneAction extends BaseGameBarAction { visible = !1; constructor() { super(); - const onClick = (e) => { - BxEvent.dispatch(window, BxEvent.GAME_BAR_ACTION_ACTIVATED); - const enabled = MicrophoneShortcut.toggle(!1); - this.$content.dataset.activated = enabled.toString(); - }, $btnDefault = createButton({ + const $btnDefault = createButton({ style: 4, icon: BxIcon.MICROPHONE, - onClick, + onClick: this.onClick.bind(this), classes: ["bx-activated"] }), $btnMuted = createButton({ style: 4, icon: BxIcon.MICROPHONE_MUTED, - onClick + onClick: this.onClick.bind(this) }); this.$content = CE("div", {}, $btnMuted, $btnDefault), this.reset(), window.addEventListener(BxEvent.MICROPHONE_STATE_CHANGED, (e) => { const enabled = e.microphoneState === "Enabled"; this.$content.dataset.activated = enabled.toString(), this.$content.classList.remove("bx-gone"); }); } + onClick(e) { + super.onClick(e); + const enabled = MicrophoneShortcut.toggle(!1); + this.$content.dataset.activated = enabled.toString(); + } render() { return this.$content; } @@ -7423,16 +7428,16 @@ class TrueAchievementsAction extends BaseGameBarAction { $content; constructor() { super(); - const onClick = (e) => { - BxEvent.dispatch(window, BxEvent.GAME_BAR_ACTION_ACTIVATED), TrueAchievements.open(!1); - }; this.$content = createButton({ style: 4, icon: BxIcon.TRUE_ACHIEVEMENTS, title: t("true-achievements"), - onClick + onClick: this.onClick.bind(this) }); } + onClick(e) { + super.onClick(e), TrueAchievements.open(!1); + } render() { return this.$content; } @@ -7441,16 +7446,14 @@ class SpeakerAction extends BaseGameBarAction { $content; constructor() { super(); - const onClick = (e) => { - BxEvent.dispatch(window, BxEvent.GAME_BAR_ACTION_ACTIVATED), SoundShortcut.muteUnmute(); - }, $btnEnable = createButton({ + const $btnEnable = createButton({ style: 4, icon: BxIcon.AUDIO, - onClick + onClick: this.onClick.bind(this) }), $btnMuted = createButton({ style: 4, icon: BxIcon.SPEAKER_MUTED, - onClick, + onClick: this.onClick.bind(this), classes: ["bx-activated"] }); this.$content = CE("div", {}, $btnEnable, $btnMuted), this.reset(), window.addEventListener(BxEvent.SPEAKER_STATE_CHANGED, (e) => { @@ -7458,6 +7461,9 @@ class SpeakerAction extends BaseGameBarAction { this.$content.dataset.activated = (!enabled).toString(); }); } + onClick(e) { + super.onClick(e), SoundShortcut.muteUnmute(); + } render() { return this.$content; } @@ -7476,22 +7482,23 @@ class RendererAction extends BaseGameBarAction { $content; constructor() { super(); - const onClick = (e) => { - BxEvent.dispatch(window, BxEvent.GAME_BAR_ACTION_ACTIVATED); - const isVisible = RendererShortcut.toggleVisibility(); - this.$content.dataset.activated = (!isVisible).toString(); - }, $btnDefault = createButton({ + const $btnDefault = createButton({ style: 4, icon: BxIcon.EYE, - onClick + onClick: this.onClick.bind(this) }), $btnActivated = createButton({ style: 4, icon: BxIcon.EYE_SLASH, - onClick, + onClick: this.onClick.bind(this), classes: ["bx-activated"] }); this.$content = CE("div", {}, $btnDefault, $btnActivated), this.reset(); } + onClick(e) { + super.onClick(e); + const isVisible = RendererShortcut.toggleVisibility(); + this.$content.dataset.activated = (!isVisible).toString(); + } render() { return this.$content; } diff --git a/src/modules/game-bar/action-base.ts b/src/modules/game-bar/action-base.ts index ecd678e..52137e2 100644 --- a/src/modules/game-bar/action-base.ts +++ b/src/modules/game-bar/action-base.ts @@ -1,6 +1,12 @@ +import { BxEvent } from "@/utils/bx-event"; + export abstract class BaseGameBarAction { constructor() {} reset() {} + onClick(e: Event) { + BxEvent.dispatch(window, BxEvent.GAME_BAR_ACTION_ACTIVATED); + }; + abstract render(): HTMLElement; } diff --git a/src/modules/game-bar/action-microphone.ts b/src/modules/game-bar/action-microphone.ts index 24a678a..ca52b5b 100644 --- a/src/modules/game-bar/action-microphone.ts +++ b/src/modules/game-bar/action-microphone.ts @@ -13,24 +13,17 @@ export class MicrophoneAction extends BaseGameBarAction { constructor() { super(); - const onClick = (e: Event) => { - BxEvent.dispatch(window, BxEvent.GAME_BAR_ACTION_ACTIVATED); - - const enabled = MicrophoneShortcut.toggle(false); - this.$content.dataset.activated = enabled.toString(); - }; - const $btnDefault = createButton({ style: ButtonStyle.GHOST, icon: BxIcon.MICROPHONE, - onClick: onClick, + onClick: this.onClick.bind(this), classes: ['bx-activated'], }); const $btnMuted = createButton({ style: ButtonStyle.GHOST, icon: BxIcon.MICROPHONE_MUTED, - onClick: onClick, + onClick: this.onClick.bind(this), }); this.$content = CE('div', {}, @@ -50,6 +43,12 @@ export class MicrophoneAction extends BaseGameBarAction { }); } + onClick(e: Event) { + super.onClick(e); + const enabled = MicrophoneShortcut.toggle(false); + this.$content.dataset.activated = enabled.toString(); + } + render(): HTMLElement { return this.$content; } diff --git a/src/modules/game-bar/action-renderer.ts b/src/modules/game-bar/action-renderer.ts index c61f024..c110854 100644 --- a/src/modules/game-bar/action-renderer.ts +++ b/src/modules/game-bar/action-renderer.ts @@ -1,4 +1,3 @@ -import { BxEvent } from "@utils/bx-event"; import { BxIcon } from "@utils/bx-icon"; import { createButton, ButtonStyle, CE } from "@utils/html"; import { BaseGameBarAction } from "./action-base"; @@ -11,22 +10,16 @@ export class RendererAction extends BaseGameBarAction { constructor() { super(); - const onClick = (e: Event) => { - BxEvent.dispatch(window, BxEvent.GAME_BAR_ACTION_ACTIVATED); - const isVisible = RendererShortcut.toggleVisibility(); - this.$content.dataset.activated = (!isVisible).toString(); - }; - const $btnDefault = createButton({ style: ButtonStyle.GHOST, icon: BxIcon.EYE, - onClick: onClick, + onClick: this.onClick.bind(this), }); const $btnActivated = createButton({ style: ButtonStyle.GHOST, icon: BxIcon.EYE_SLASH, - onClick: onClick, + onClick: this.onClick.bind(this), classes: ['bx-activated'], }); @@ -38,6 +31,12 @@ export class RendererAction extends BaseGameBarAction { this.reset(); } + onClick(e: Event) { + super.onClick(e); + const isVisible = RendererShortcut.toggleVisibility(); + this.$content.dataset.activated = (!isVisible).toString(); + } + render(): HTMLElement { return this.$content; } diff --git a/src/modules/game-bar/action-screenshot.ts b/src/modules/game-bar/action-screenshot.ts index 9b92198..f0bdee2 100644 --- a/src/modules/game-bar/action-screenshot.ts +++ b/src/modules/game-bar/action-screenshot.ts @@ -1,4 +1,3 @@ -import { BxEvent } from "@utils/bx-event"; import { BxIcon } from "@utils/bx-icon"; import { createButton, ButtonStyle } from "@utils/html"; import { BaseGameBarAction } from "./action-base"; @@ -11,19 +10,19 @@ export class ScreenshotAction extends BaseGameBarAction { constructor() { super(); - const onClick = (e: Event) => { - BxEvent.dispatch(window, BxEvent.GAME_BAR_ACTION_ACTIVATED); - Screenshot.takeScreenshot(); - }; - this.$content = createButton({ style: ButtonStyle.GHOST, icon: BxIcon.SCREENSHOT, title: t('take-screenshot'), - onClick: onClick, + onClick: this.onClick.bind(this), }); } + onClick(e: Event): void { + super.onClick(e); + Screenshot.takeScreenshot(); + } + render(): HTMLElement { return this.$content; } diff --git a/src/modules/game-bar/action-speaker.ts b/src/modules/game-bar/action-speaker.ts index a131c9b..a3b7f29 100644 --- a/src/modules/game-bar/action-speaker.ts +++ b/src/modules/game-bar/action-speaker.ts @@ -11,21 +11,16 @@ export class SpeakerAction extends BaseGameBarAction { constructor() { super(); - const onClick = (e: Event) => { - BxEvent.dispatch(window, BxEvent.GAME_BAR_ACTION_ACTIVATED); - SoundShortcut.muteUnmute(); - }; - const $btnEnable = createButton({ style: ButtonStyle.GHOST, icon: BxIcon.AUDIO, - onClick: onClick, + onClick: this.onClick.bind(this), }); const $btnMuted = createButton({ style: ButtonStyle.GHOST, icon: BxIcon.SPEAKER_MUTED, - onClick: onClick, + onClick: this.onClick.bind(this), classes: ['bx-activated'], }); @@ -44,6 +39,11 @@ export class SpeakerAction extends BaseGameBarAction { }); } + onClick(e: Event) { + super.onClick(e); + SoundShortcut.muteUnmute(); + } + render(): HTMLElement { return this.$content; } diff --git a/src/modules/game-bar/action-touch-control.ts b/src/modules/game-bar/action-touch-control.ts index 8926974..7c646f7 100644 --- a/src/modules/game-bar/action-touch-control.ts +++ b/src/modules/game-bar/action-touch-control.ts @@ -1,4 +1,3 @@ -import { BxEvent } from "@utils/bx-event"; import { BxIcon } from "@utils/bx-icon"; import { createButton, ButtonStyle, CE } from "@utils/html"; import { TouchController } from "@modules/touch-controller"; @@ -11,26 +10,18 @@ export class TouchControlAction extends BaseGameBarAction { constructor() { super(); - const onClick = (e: Event) => { - BxEvent.dispatch(window, BxEvent.GAME_BAR_ACTION_ACTIVATED); - - const $parent = (e as any).target.closest('div[data-activated]'); - const isVisible = TouchController.toggleVisibility(); - $parent.dataset.activated = (!isVisible).toString(); - }; - const $btnEnable = createButton({ style: ButtonStyle.GHOST, icon: BxIcon.TOUCH_CONTROL_ENABLE, title: t('show-touch-controller'), - onClick: onClick, + onClick: this.onClick.bind(this), }); const $btnDisable = createButton({ style: ButtonStyle.GHOST, icon: BxIcon.TOUCH_CONTROL_DISABLE, title: t('hide-touch-controller'), - onClick: onClick, + onClick: this.onClick.bind(this), classes: ['bx-activated'], }); @@ -42,6 +33,12 @@ export class TouchControlAction extends BaseGameBarAction { this.reset(); } + onClick(e: Event) { + super.onClick(e); + const isVisible = TouchController.toggleVisibility(); + this.$content.dataset.activated = (!isVisible).toString(); + } + render(): HTMLElement { return this.$content; } diff --git a/src/modules/game-bar/action-true-achievements.ts b/src/modules/game-bar/action-true-achievements.ts index 08a0101..2ea81e2 100644 --- a/src/modules/game-bar/action-true-achievements.ts +++ b/src/modules/game-bar/action-true-achievements.ts @@ -1,4 +1,3 @@ -import { BxEvent } from "@/utils/bx-event"; import { BxIcon } from "@/utils/bx-icon"; import { createButton, ButtonStyle } from "@/utils/html"; import { t } from "@/utils/translation"; @@ -11,19 +10,19 @@ export class TrueAchievementsAction extends BaseGameBarAction { constructor() { super(); - const onClick = (e: Event) => { - BxEvent.dispatch(window, BxEvent.GAME_BAR_ACTION_ACTIVATED); - TrueAchievements.open(false); - }; - this.$content = createButton({ style: ButtonStyle.GHOST, icon: BxIcon.TRUE_ACHIEVEMENTS, title: t('true-achievements'), - onClick: onClick, + onClick: this.onClick.bind(this), }); } + onClick(e: Event) { + super.onClick(e); + TrueAchievements.open(false); + } + render(): HTMLElement { return this.$content; }