diff --git a/src/index.ts b/src/index.ts index 7b19632..05adb15 100644 --- a/src/index.ts +++ b/src/index.ts @@ -119,7 +119,7 @@ document.addEventListener('readystatechange', e => { getPref(PrefKey.REMOTE_PLAY_ENABLED) && RemotePlay.preload(); } else { // Show Settings button in the header when not signed in - HeaderSection.watchHeader(); + window.setTimeout(HeaderSection.watchHeader, 2000); } // Hide "Play with Friends" skeleton section @@ -153,7 +153,7 @@ window.addEventListener(BxEvent.XCLOUD_SERVERS_UNAVAILABLE, e => { window.addEventListener(BxEvent.XCLOUD_SERVERS_READY, e => { STATES.isSignedIn = true; - HeaderSection.watchHeader(); + window.setTimeout(HeaderSection.watchHeader, 2000); }); window.addEventListener(BxEvent.STREAM_LOADING, e => { diff --git a/src/modules/ui/dialog/navigation-dialog.ts b/src/modules/ui/dialog/navigation-dialog.ts index 20ecdbc..45fd3c6 100644 --- a/src/modules/ui/dialog/navigation-dialog.ts +++ b/src/modules/ui/dialog/navigation-dialog.ts @@ -2,7 +2,7 @@ import { GamepadKey } from "@/enums/mkb"; import { EmulatedMkbHandler } from "@/modules/mkb/mkb-handler"; import { BxEvent } from "@/utils/bx-event"; import { STATES } from "@/utils/global"; -import { CE } from "@/utils/html"; +import { CE, isElementVisible } from "@/utils/html"; import { setNearby } from "@/utils/navigation-utils"; export enum NavigationDirection { @@ -519,11 +519,8 @@ export class NavigationDialogManager { return null; } - const rect = $elm.getBoundingClientRect(); - const isVisible = !!rect.width && !!rect.height; - // Ignore hidden element - if (!isVisible) { + if (!isElementVisible($elm)) { return null; } diff --git a/src/modules/ui/header.ts b/src/modules/ui/header.ts index 41ce4c0..1aa6044 100644 --- a/src/modules/ui/header.ts +++ b/src/modules/ui/header.ts @@ -1,5 +1,5 @@ import { SCRIPT_VERSION } from "@utils/global"; -import { createButton, ButtonStyle, CE } from "@utils/html"; +import { createButton, ButtonStyle, CE, isElementVisible } from "@utils/html"; import { BxIcon } from "@utils/bx-icon"; import { getPreferredServerRegion } from "@utils/region"; import { RemotePlay } from "@modules/remote-play"; @@ -44,12 +44,16 @@ export class HeaderSection { const PREF_LATEST_VERSION = getPref(PrefKey.LATEST_VERSION); // Setup Settings button - const $settingsBtn = HeaderSection.#$settingsBtn; - $settingsBtn.querySelector('span')!.textContent = getPreferredServerRegion(true) || t('better-xcloud'); + const $btnSettings = HeaderSection.#$settingsBtn; + if (isElementVisible(HeaderSection.#$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) { - $settingsBtn.setAttribute('data-update-available', 'true'); + $btnSettings.setAttribute('data-update-available', 'true'); } // Add the Settings button to the web page @@ -75,6 +79,9 @@ export class HeaderSection { return; } + HeaderSection.#timeout && clearTimeout(HeaderSection.#timeout); + HeaderSection.#timeout = null; + HeaderSection.#observer && HeaderSection.#observer.disconnect(); HeaderSection.#observer = new MutationObserver(mutationList => { HeaderSection.#timeout && clearTimeout(HeaderSection.#timeout); diff --git a/src/utils/html.ts b/src/utils/html.ts index dd0c039..3885185 100644 --- a/src/utils/html.ts +++ b/src/utils/html.ts @@ -146,5 +146,10 @@ export function escapeHtml(html: string): string { return $span.innerHTML; } +export function isElementVisible($elm: HTMLElement): boolean { + const rect = $elm.getBoundingClientRect(); + return !!rect.width && !!rect.height; +} + export const CTN = document.createTextNode.bind(document); window.BX_CE = createElement;