marcel/better-xcloud
1
0
Fork 0
mirror of https://github.com/redphx/better-xcloud.git synced 2025-06-06 23:57:19 +02:00
Code Issues Packages Projects Releases Wiki Activity

Refactor buttons in guide-menu

Browse Source
This commit is contained in:
redphx 2024-07-02 18:06:33 +07:00
parent d31a06be89
commit dee8c9dbd0
2 changed files with 76 additions and 53 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

4
src/modules/stream/stream-settings.ts
View File

@ -255,6 +255,8 @@ export class StreamSettings {
$container.classList.remove('bx-gone');
document.body.classList.add('bx-no-scroll');
BxEvent.dispatch(window, BxEvent.XCLOUD_DIALOG_SHOWN);
}
hide() {
@ -262,6 +264,8 @@ export class StreamSettings {
this.$container!.classList.add('bx-gone');
document.body.classList.remove('bx-no-scroll');
BxEvent.dispatch(window, BxEvent.XCLOUD_DIALOG_DISMISSED);
}
#setupDialog() {

125
src/modules/ui/guide-menu.ts
View File

@ -9,6 +9,67 @@ export enum GuideMenuTab {
}
export class GuideMenu {
static #BUTTONS = {
streamSetting: createButton({
label: t('stream-settings'),
style: ButtonStyle.FULL_WIDTH | ButtonStyle.FOCUSABLE,
onClick: e => {
// Wait until the Guide dialog is closed
window.addEventListener(BxEvent.XCLOUD_DIALOG_DISMISSED, e => {
setTimeout(() => StreamSettings.getInstance().show(), 50);
}, {once: true});
// Close all xCloud's dialogs
window.BX_EXPOSED.dialogRoutes.closeAll();
},
}),
appSettings: createButton({
label: t('android-app-settings'),
style: ButtonStyle.FULL_WIDTH | ButtonStyle.FOCUSABLE,
onClick: e => {
// Close all xCloud's dialogs
window.BX_EXPOSED.dialogRoutes.closeAll();
AppInterface.openAppSettings && AppInterface.openAppSettings();
},
}),
closeApp: createButton({
label: t('close-app'),
style: ButtonStyle.FULL_WIDTH | ButtonStyle.FOCUSABLE | ButtonStyle.DANGER,
onClick: e => {
AppInterface.closeApp();
},
}),
reloadStream: createButton({
label: t('reload-stream'),
style: ButtonStyle.FULL_WIDTH | ButtonStyle.FOCUSABLE,
onClick: e => {
confirm(t('confirm-reload-stream')) && window.location.reload();
},
}),
backToHome: createButton({
label: t('back-to-home'),
style: ButtonStyle.FULL_WIDTH | ButtonStyle.FOCUSABLE,
onClick: e => {
confirm(t('back-to-home-confirm')) && (window.location.href = window.location.href.substring(0, 31));
},
}),
}
static #renderButtons(buttons: HTMLElement[]) {
const $div = CE('div', {});
for (const $button of buttons) {
$div.appendChild($button);
}
return $div;
}
static #injectHome($root: HTMLElement) {
// Find the last divider
const $dividers = $root.querySelectorAll('div[class*=Divider-module__divider]');
@ -16,51 +77,21 @@ export class GuideMenu {
return;
}
const buttons = [];
const buttons: HTMLElement[] = [];
// "Stream settings" button
buttons.push(createButton({
label: t('stream-settings'),
style: ButtonStyle.FULL_WIDTH | ButtonStyle.FOCUSABLE,
onClick: e => {
// Close all xCloud's dialogs
window.BX_EXPOSED.dialogRoutes.closeAll();
StreamSettings.getInstance().show();
},
}));
buttons.push(GuideMenu.#BUTTONS.streamSetting);
// "App settings" & "Close app" buttons
if (AppInterface) {
buttons.push(createButton({
label: t('android-app-settings'),
style: ButtonStyle.FULL_WIDTH | ButtonStyle.FOCUSABLE,
onClick: e => {
AppInterface.openAppSettings && AppInterface.openAppSettings();
},
}));
buttons.push(createButton({
label: t('close-app'),
style: ButtonStyle.FULL_WIDTH | ButtonStyle.FOCUSABLE | ButtonStyle.DANGER,
onClick: e => {
AppInterface.closeApp();
},
}));
buttons.push(GuideMenu.#BUTTONS.appSettings);
buttons.push(GuideMenu.#BUTTONS.closeApp);
}
if (!buttons.length) {
return;
}
const $div = CE('div', {});
for (const $button of buttons) {
$div.appendChild($button);
}
const $buttons = GuideMenu.#renderButtons(buttons);
const $lastDivider = $dividers[$dividers.length - 1];
$lastDivider.insertAdjacentElement('afterend', $div);
$lastDivider.insertAdjacentElement('afterend', $buttons);
}
static #injectHomePlaying($root: HTMLElement) {
@ -69,25 +100,13 @@ export class GuideMenu {
return;
}
// Add buttons
const $btnReload = createButton({
label: t('reload-stream'),
style: ButtonStyle.FULL_WIDTH | ButtonStyle.FOCUSABLE,
onClick: e => {
confirm(t('confirm-reload-stream')) && window.location.reload();
},
});
const buttons: HTMLElement[] = [];
const $btnHome = createButton({
label: t('back-to-home'),
style: ButtonStyle.FULL_WIDTH | ButtonStyle.FOCUSABLE,
onClick: e => {
confirm(t('back-to-home-confirm')) && (window.location.href = window.location.href.substring(0, 31));
},
});
buttons.push(GuideMenu.#BUTTONS.streamSetting);
AppInterface && buttons.push(GuideMenu.#BUTTONS.appSettings);
$btnQuit.insertAdjacentElement('afterend', $btnReload);
$btnReload.insertAdjacentElement('afterend', $btnHome);
const $buttons = GuideMenu.#renderButtons(buttons);
$btnQuit.insertAdjacentElement('afterend', $buttons);
// Hide xCloud's Home button
const $btnXcloudHome = $root.querySelector('div[class^=HomeButtonWithDivider]') as HTMLElement;