mirror of
https://github.com/redphx/better-xcloud.git
synced 2025-08-12 08:05:15 +02:00
Use a better method to show the Better xCloud button ASAP
This commit is contained in:
@@ -1029,9 +1029,14 @@ ${subsVar} = subs;
|
||||
return false;
|
||||
}
|
||||
|
||||
const newCode = 'window.BX_EXPOSED.reactCreateElement=';
|
||||
str = PatcherUtils.insertAt(str, index - 1, newCode);
|
||||
str = PatcherUtils.insertAt(str, index - 1, 'window.BX_EXPOSED.reactCreateElement=');
|
||||
|
||||
index = PatcherUtils.indexOf(str, '.useEffect=', index);
|
||||
if (index < 0) {
|
||||
return false;
|
||||
}
|
||||
|
||||
str = PatcherUtils.insertAt(str, index - 1, 'window.BX_EXPOSED.reactUseEffect=');
|
||||
return str;
|
||||
},
|
||||
|
||||
@@ -1130,7 +1135,24 @@ ${subsVar} = subs;
|
||||
|
||||
str = PatcherUtils.insertAt(str, index, `&q=${getGlobalPref(GlobalPref.UI_IMAGE_QUALITY)}`);
|
||||
return str;
|
||||
}
|
||||
},
|
||||
|
||||
injectHeaderUseEffect(str: string) {
|
||||
let index = str.indexOf('"EdgewaterHeader-module__spaceBetween');
|
||||
index > -1 && (index = PatcherUtils.lastIndexOf(str, 'return', index, 300));
|
||||
|
||||
if (index < 0) {
|
||||
return false;
|
||||
}
|
||||
|
||||
const newCode = `
|
||||
window.BX_EXPOSED.reactUseEffect(() => {
|
||||
window.BxEventBus.Script.emit('header.rendered', {});
|
||||
});
|
||||
`;
|
||||
str = PatcherUtils.insertAt(str, index, newCode);
|
||||
return str;
|
||||
},
|
||||
};
|
||||
|
||||
let PATCH_ORDERS = PatcherUtils.filterPatches([
|
||||
@@ -1140,6 +1162,7 @@ let PATCH_ORDERS = PatcherUtils.filterPatches([
|
||||
] : []),
|
||||
|
||||
'exposeReactCreateComponent',
|
||||
'injectHeaderUseEffect',
|
||||
'gameCardCustomIcons',
|
||||
// 'gameCardPassTitle',
|
||||
|
||||
|
@@ -1,7 +1,7 @@
|
||||
import { isFullVersion } from "@macros/build" with { type: "macro" };
|
||||
|
||||
import { SCRIPT_VERSION } from "@utils/global";
|
||||
import { createButton, ButtonStyle, CE, isElementVisible } from "@utils/html";
|
||||
import { SCRIPT_VERSION, STATES } from "@utils/global";
|
||||
import { createButton, ButtonStyle, CE } from "@utils/html";
|
||||
import { BxIcon } from "@utils/bx-icon";
|
||||
import { getPreferredServerRegion } from "@utils/region";
|
||||
import { RemotePlayManager } from "@/modules/remote-play-manager";
|
||||
@@ -10,6 +10,7 @@ import { SettingsDialog } from "./dialog/settings-dialog";
|
||||
import { GlobalPref } from "@/enums/pref-keys";
|
||||
import { getGlobalPref } from "@/utils/pref-utils";
|
||||
import { BxLogger } from "@/utils/bx-logger";
|
||||
import { BxEventBus } from "@/utils/bx-event-bus";
|
||||
|
||||
export class HeaderSection {
|
||||
private static instance: HeaderSection;
|
||||
@@ -20,9 +21,6 @@ export class HeaderSection {
|
||||
private $btnSettings: HTMLElement;
|
||||
private $buttonsWrapper: HTMLElement;
|
||||
|
||||
private observer?: MutationObserver;
|
||||
private timeoutId?: number | null;
|
||||
|
||||
constructor() {
|
||||
BxLogger.info(this.LOG_TAG, 'constructor()');
|
||||
|
||||
@@ -38,9 +36,9 @@ export class HeaderSection {
|
||||
this.$btnRemotePlay = null;
|
||||
}
|
||||
|
||||
this.$btnSettings = createButton({
|
||||
classes: ['bx-header-settings-button'],
|
||||
label: '???',
|
||||
let $btnSettings = this.$btnSettings = createButton({
|
||||
classes: ['bx-header-settings-button', 'bx-gone'],
|
||||
label: t('better-xcloud'),
|
||||
style: ButtonStyle.FROSTED | ButtonStyle.DROP_SHADOW | ButtonStyle.FOCUSABLE | ButtonStyle.FULL_HEIGHT,
|
||||
onClick: e => SettingsDialog.getInstance().show(),
|
||||
});
|
||||
@@ -49,65 +47,47 @@ export class HeaderSection {
|
||||
getGlobalPref(GlobalPref.REMOTE_PLAY_ENABLED) ? this.$btnRemotePlay : null,
|
||||
this.$btnSettings,
|
||||
);
|
||||
|
||||
BxEventBus.Script.on('xcloud.server', ({status}) => {
|
||||
if (status === 'ready') {
|
||||
STATES.isSignedIn = true;
|
||||
|
||||
// Show server name
|
||||
$btnSettings.querySelector('span')!.textContent = getPreferredServerRegion(true) || t('better-xcloud');
|
||||
const PREF_LATEST_VERSION = getGlobalPref(GlobalPref.VERSION_LATEST);
|
||||
// Show new update status
|
||||
if (!SCRIPT_VERSION.includes('beta') && PREF_LATEST_VERSION && PREF_LATEST_VERSION !== SCRIPT_VERSION) {
|
||||
$btnSettings.setAttribute('data-update-available', 'true');
|
||||
}
|
||||
} else if (status === 'unavailable') {
|
||||
STATES.supportedRegion = false;
|
||||
|
||||
// Open Settings dialog on Unsupported page
|
||||
const $unsupportedPage = document.querySelector<HTMLElement>('div[class^=UnsupportedMarketPage-module__container]');
|
||||
if ($unsupportedPage) {
|
||||
SettingsDialog.getInstance().show();
|
||||
}
|
||||
}
|
||||
|
||||
$btnSettings.classList.remove('bx-gone');
|
||||
});
|
||||
}
|
||||
|
||||
private injectSettingsButton($parent?: HTMLElement) {
|
||||
if (!$parent) {
|
||||
return;
|
||||
}
|
||||
|
||||
const PREF_LATEST_VERSION = getGlobalPref(GlobalPref.VERSION_LATEST);
|
||||
|
||||
// Setup Settings button
|
||||
const $btnSettings = this.$btnSettings;
|
||||
if (isElementVisible(this.$buttonsWrapper)) {
|
||||
return;
|
||||
}
|
||||
|
||||
$btnSettings.querySelector('span')!.textContent = getPreferredServerRegion(true) || t('better-xcloud');
|
||||
|
||||
// Show new update status
|
||||
if (!SCRIPT_VERSION.includes('beta') && PREF_LATEST_VERSION && PREF_LATEST_VERSION !== SCRIPT_VERSION) {
|
||||
$btnSettings.setAttribute('data-update-available', 'true');
|
||||
}
|
||||
|
||||
// Add the Settings button to the web page
|
||||
$parent.appendChild(this.$buttonsWrapper);
|
||||
}
|
||||
|
||||
private checkHeader = () => {
|
||||
checkHeader = () => {
|
||||
let $target = document.querySelector('#PageContent div[class*=EdgewaterHeader-module__rightSectionSpacing]');
|
||||
if (!$target) {
|
||||
$target = document.querySelector('div[class^=UnsupportedMarketPage-module__buttons]');
|
||||
}
|
||||
|
||||
$target && this.injectSettingsButton($target as HTMLElement);
|
||||
}
|
||||
// Add the Settings button to the web page
|
||||
$target?.appendChild(this.$buttonsWrapper);
|
||||
|
||||
private watchHeader() {
|
||||
const $root = document.querySelector('#PageContent header') || document.querySelector('#root');
|
||||
if (!$root) {
|
||||
return;
|
||||
if (!STATES.isSignedIn) {
|
||||
BxEventBus.Script.emit('xcloud.server', { status: 'signed-out' });
|
||||
}
|
||||
|
||||
this.timeoutId && clearTimeout(this.timeoutId);
|
||||
this.timeoutId = null;
|
||||
|
||||
this.observer && this.observer.disconnect();
|
||||
this.observer = new MutationObserver(mutationList => {
|
||||
this.timeoutId && clearTimeout(this.timeoutId);
|
||||
this.timeoutId = window.setTimeout(this.checkHeader, 2000);
|
||||
});
|
||||
this.observer.observe($root, { subtree: true, childList: true });
|
||||
|
||||
this.checkHeader();
|
||||
}
|
||||
|
||||
showRemotePlayButton() {
|
||||
this.$btnRemotePlay?.classList.remove('bx-gone');
|
||||
}
|
||||
|
||||
static watchHeader() {
|
||||
HeaderSection.getInstance().watchHeader();
|
||||
}
|
||||
}
|
||||
|
Reference in New Issue
Block a user