Bump version to 5.3.0

Update better-xcloud.user.js
Show allocation time instead of total wait time
2025-06-28 18:31:44 +02:00 · 2024-07-14 17:53:35 +07:00 · 2024-07-14 17:51:37 +07:00 · 2024-07-14 17:51:32 +07:00 · 2024-07-14 16:44:38 +07:00 · 2024-07-14 16:44:18 +07:00
54 changed files with 5072 additions and 5090 deletions
--- a/build.ts
+++ b/build.ts
@ -4,6 +4,7 @@ import { parseArgs } from "node:util";
 import { sys } from "typescript";
 import txtScriptHeader from "./src/assets/header_script.txt" with { type: "text" };
 import txtMetaHeader from "./src/assets/header_meta.txt" with { type: "text" };
+import { assert } from "node:console";

 enum BuildTarget {
    ALL = 'all',
@ -24,6 +25,8 @@ const postProcess = (str: string): string => {
    // Add ADDITIONAL CODE block
    str = str.replace('var DEFAULT_FLAGS', '\n/* ADDITIONAL CODE */\n\nvar DEFAULT_FLAGS');

+    assert(str.includes('/* ADDITIONAL CODE */'));
+
    return str;
 }

--- a/bun.lockb
+++ b/bun.lockb
--- a/dist/better-xcloud.meta.js
+++ b/dist/better-xcloud.meta.js
@ -1,5 +1,5 @@
 // ==UserScript==
 // @name         Better xCloud
 // @namespace    https://github.com/redphx
-// @version      5.0.1
+// @version      5.3.0
 // ==/UserScript==
--- a/dist/better-xcloud.user.js
+++ b/dist/better-xcloud.user.js
--- a/package.json
+++ b/package.json
@ -6,8 +6,8 @@
    "build": "build.ts"
  },
  "devDependencies": {
-    "@types/bun": "^1.1.5",
-    "@types/node": "^20.14.9",
+    "@types/bun": "^1.1.6",
+    "@types/node": "^20.14.10",
    "@types/stylus": "^0.48.42",
    "stylus": "^0.63.0"
  },
--- a/src/assets/css/global-settings.styl
+++ b/src/assets/css/global-settings.styl
@ -29,6 +29,13 @@
        outline: none !important;
    }

+    .bx-top-buttons {
+        .bx-button {
+            display: block;
+            margin-bottom: 8px;
+        }
+    }
+
    .bx-settings-title-wrapper {
        display: flex;
        margin-bottom: 10px;
@ -41,18 +48,21 @@
        text-decoration: none;
        font-weight: bold;
        display: block;
-        color: #5dc21e;
        flex: 1;
+        text-transform: none;
+        margin-right: 10px;
+
+        span {
+            color: #5dc21e !important;
+        }

        &:focus {
-            color: #83f73a;
+            span {
+                color: #83f73a !important;
+            }
        }
    }

-    .bx-button.bx-primary {
-        margin-top: 8px;
-    }
-
    a.bx-settings-update {
        display: block;
        color: #ff834b;
--- a/src/assets/css/number-stepper.styl
+++ b/src/assets/css/number-stepper.styl
@ -20,7 +20,6 @@
        font-weight: bold;
        font-size: 14px;
        font-family: var(--bx-monospaced-font);
-        color: #fff;

        &:hover {
            @media (hover: hover) {
--- a/src/assets/css/root.styl
+++ b/src/assets/css/root.styl
@ -23,9 +23,10 @@
    --bx-dialog-z-index: 9101;
    --bx-dialog-overlay-z-index: 9100;
    --bx-remote-play-popup-z-index: 9090;
-    --bx-stats-bar-z-index: 9001;
-    --bx-stream-settings-z-index: 9000;
-    --bx-mkb-pointer-lock-msg-z-index: 8999;
+    --bx-stats-bar-z-index: 9010;
+    --bx-stream-settings-z-index: 9001;
+    --bx-mkb-pointer-lock-msg-z-index: 9000;
+    --bx-stream-settings-overlay-z-index: 8999;
    --bx-game-bar-z-index: 8888;
    --bx-wait-time-box-z-index: 100;
    --bx-screenshot-animation-z-index: 1;
@ -79,6 +80,14 @@ div[class^=HUDButton-module__hiddenContainer] ~ div:not([class^=HUDButton-module
    visibility: hidden !important;
 }

+.bx-invisible {
+    opacity: 0;
+}
+
+.bx-unclickable {
+    pointer-events: none;
+}
+
 .bx-pixel {
    width: 1px !important;
    height: 1px !important;
@ -96,6 +105,10 @@ div[class^=HUDButton-module__hiddenContainer] ~ div:not([class^=HUDButton-module
    font-family: var(--bx-promptfont-font);
 }

+select[multiple] {
+    overflow: auto;
+}
+
 /* Hide UI elements */
 #headerArea, #uhfSkipToMain, .uhf-footer {
    display: none;
@ -112,3 +125,42 @@ div[class*=NotFocusedDialog] {
 #game-stream video:not([src]) {
    visibility: hidden;
 }
+
+/* Hide Controller icon in Game tiles */
+div[class*=SupportedInputsBadge] {
+    &:not(:has(:nth-child(2))), svg:first-of-type {
+        display: none;
+    }
+}
+
+
+.bx-game-tile-wait-time {
+    position: absolute;
+    top: 0;
+    left: 0;
+    z-index: 1;
+    background: #0000008c;
+    display: none;
+    border-radius: 0 0 4px 0;
+    align-items: center;
+    padding: 4px 8px;
+
+    a[class^=BaseItem-module__container]:focus &,
+    button[class^=BaseItem-module__container]:focus & {
+        display: flex;
+    }
+
+    svg {
+        width: 14px;
+        height: 16px;
+        margin-right: 2px;
+    }
+
+    span {
+        display: inline-block;
+        height: 16px;
+        line-height: 16px;
+        font-size: 12px;
+        font-weight: bold;
+    }
+}
--- a/src/assets/css/stream-settings.styl
+++ b/src/assets/css/stream-settings.styl
@ -7,6 +7,20 @@
    -webkit-user-select: none;
 }

+.bx-stream-settings-overlay {
+    position: fixed;
+    background: #0b0b0be3;
+    top: 0;
+    left: 0;
+    right: 0;
+    bottom: 0;
+    z-index: var(--bx-stream-settings-overlay-z-index);
+
+    &[data-is-playing="true"] {
+        background: transparent;
+    }
+}
+
 .bx-stream-settings-tabs {
    position: fixed;
    top: 0;
@ -95,7 +109,7 @@
    margin-bottom: 16px;
    padding-bottom: 16px;

-    label {
+    > label {
        font-size: 16px;
        display: block;
        text-align: left;
--- a/src/assets/css/styles.styl
+++ b/src/assets/css/styles.styl
@ -7,6 +7,7 @@
@import 'toast.styl';
@import 'loading-screen.styl';
@import 'remote-play.styl';
+@import 'web-components.styl';

@import 'stream.styl';
@import 'number-stepper.styl';
--- a/src/assets/css/web-components.styl
+++ b/src/assets/css/web-components.styl
@ -0,0 +1,48 @@
+.bx-select {
+    select {
+        display: none;
+    }
+
+    > div {
+        display: inline-block;
+        min-width: 110px;
+        text-align: center;
+        margin: 0 10px;
+        line-height: 24px;
+        vertical-align: middle;
+        background: #fff;
+        color: #000;
+        border-radius: 4px;
+        padding: 2px 4px;
+
+        input {
+            display: inline-block;
+            margin-right: 8px;
+        }
+
+        label {
+            margin-bottom: 0;
+        }
+    }
+
+    button {
+        border: none;
+        width: 24px;
+        height: 24px;
+        line-height: 24px;
+        color: #fff;
+        border-radius: 4px;
+        font-weight: bold;
+        font-size: 14px;
+        font-family: var(--bx-monospaced-font);
+
+        &.bx-inactive {
+            pointer-events: none;
+            opacity: 0.2;
+        }
+
+        span {
+            line-height: unset;
+        }
+    }
+}
--- a/src/enums/ui-sections.ts
+++ b/src/enums/ui-sections.ts
@ -0,0 +1,6 @@
+export enum UiSection {
+    NEWS = 'news',
+    FRIENDS = 'friends',
+    MOST_POPULAR = 'most-popular',
+    ALL_GAMES = 'all-games',
+}
--- a/src/enums/user-agent.ts
+++ b/src/enums/user-agent.ts
@ -1,10 +1,9 @@
 export enum UserAgentProfile {
    WINDOWS_EDGE = 'windows-edge',
    MACOS_SAFARI = 'macos-safari',
-    SMARTTV_GENERIC = 'smarttv-generic',
-    SMARTTV_TIZEN = 'smarttv-tizen',
+    SMART_TV_GENERIC = 'smarttv-generic',
+    SMART_TV_TIZEN = 'smarttv-tizen',
    VR_OCULUS = 'vr-oculus',
-    ANDROID_KIWI_V123 = 'android-kiwi-v123',
    DEFAULT = 'default',
    CUSTOM = 'custom',
 }
--- a/src/index.ts
+++ b/src/index.ts
@ -9,14 +9,13 @@ import { showGamepadToast } from "@utils/gamepad";
 import { EmulatedMkbHandler } from "@modules/mkb/mkb-handler";
 import { StreamBadges } from "@modules/stream/stream-badges";
 import { StreamStats } from "@modules/stream/stream-stats";
-import { addCss } from "@utils/css";
+import { addCss, preloadFonts } from "@utils/css";
 import { Toast } from "@utils/toast";
-import { setupStreamUi, updateVideoPlayer } from "@modules/ui/ui";
+import { setupStreamUi } from "@modules/ui/ui";
 import { PrefKey, getPref } from "@utils/preferences";
 import { LoadingScreen } from "@modules/loading-screen";
 import { MouseCursorHider } from "@modules/mkb/mouse-cursor-hider";
 import { TouchController } from "@modules/touch-controller";
-import { watchHeader } from "@modules/ui/header";
 import { checkForUpdate, disablePwa } from "@utils/utils";
 import { Patcher } from "@modules/patcher";
 import { RemotePlay } from "@modules/remote-play";
@ -31,17 +30,28 @@ import { GameBar } from "./modules/game-bar/game-bar";
 import { Screenshot } from "./utils/screenshot";
 import { NativeMkbHandler } from "./modules/mkb/native-mkb-handler";
 import { GuideMenu, GuideMenuTab } from "./modules/ui/guide-menu";
+import { StreamSettings } from "./modules/stream/stream-settings";
+import { updateVideoPlayer } from "./modules/stream/stream-settings-utils";
+import { UiSection } from "./enums/ui-sections";
+import { HeaderSection } from "./modules/ui/header";
+import { GameTile } from "./modules/ui/game-tile";


 // Handle login page
 if (window.location.pathname.includes('/auth/msa')) {
-    window.addEventListener('load', e => {
-            window.location.search.includes('loggedIn') && window.setTimeout(() => {
-                const location = window.location;
-                // @ts-ignore
-                location.pathname.includes('/play') && location.reload(true);
-            }, 2000);
-        });
+    const nativePushState = window.history['pushState'];
+    window.history['pushState'] = function(...args: any[]) {
+        const url = args[2];
+        if (url && (url.startsWith('/play') || url.substring(6).startsWith('/play'))) {
+            console.log('Redirecting to xbox.com/play');
+            window.stop();
+            window.location.href = 'https://www.xbox.com' + url;
+            return;
+        }
+
+        // @ts-ignore
+        return nativePushState.apply(this, arguments);
+    }
    // Stop processing the script
    throw new Error('[Better xCloud] Refreshing the page after logging in');
 }
@ -92,8 +102,19 @@ window.addEventListener('load', e => {
            window.location.reload(true);
        }
    }, 3000);
+
 });

+// Hide "Play with Friends" skeleton section
+if (getPref(PrefKey.UI_HIDE_SECTIONS).includes(UiSection.FRIENDS)) {
+    document.addEventListener('readystatechange', e => {
+        if (document.readyState === 'interactive') {
+            const $parent = document.querySelector('div[class*=PlayWithFriendsSkeleton]')?.closest('div[class*=HomePage-module]') as HTMLElement;
+            $parent && ($parent.style.display = 'none');
+        }
+    })
+}
+
 window.BX_EXPOSED = BxExposed;

 // Hide Settings UI when navigate to another page
@ -105,13 +126,13 @@ window.addEventListener('popstate', onHistoryChanged);
 window.history.pushState = patchHistoryMethod('pushState');
 window.history.replaceState = patchHistoryMethod('replaceState');

+window.addEventListener(BxEvent.XCLOUD_SERVERS_UNAVAILABLE, e => {
+    STATES.supportedRegion = false;
+    window.setTimeout(HeaderSection.watchHeader, 2000);
+});
+
 window.addEventListener(BxEvent.XCLOUD_SERVERS_READY, e => {
-    // Start rendering UI
-    if (document.querySelector('div[class^=UnsupportedMarketPage]')) {
-        window.setTimeout(watchHeader, 2000);
-    } else {
-        watchHeader();
-    }
+    HeaderSection.watchHeader();
 });

 window.addEventListener(BxEvent.STREAM_LOADING, e => {
@ -183,11 +204,7 @@ function unload() {
    window.BX_EXPOSED.shouldShowSensorControls = false;
    window.BX_EXPOSED.stopTakRendering = false;

-    const $streamSettingsDialog = document.querySelector('.bx-stream-settings-dialog');
-    if ($streamSettingsDialog) {
-        $streamSettingsDialog.classList.add('bx-gone');
-    }
-
+    StreamSettings.getInstance().hide();
    StreamStats.getInstance().onStoppedPlaying();

    MouseCursorHider.stop();
@ -279,7 +296,7 @@ function main() {
    getPref(PrefKey.AUDIO_ENABLE_VOLUME_CONTROL) && patchAudioContext();
    getPref(PrefKey.BLOCK_TRACKING) && patchMeControl();

-    STATES.userAgentHasTouchSupport && TouchController.updateCustomList();
+    STATES.userAgent.capabilities.touch && TouchController.updateCustomList();
    overridePreloadState();

    VibrationManager.initialSetup();
@ -289,9 +306,11 @@ function main() {

    // Setup UI
    addCss();
+    preloadFonts();
    Toast.setup();
    (getPref(PrefKey.GAME_BAR_POSITION) !== 'off') && GameBar.getInstance();
    BX_FLAGS.PreloadUi && setupStreamUi();
+    Screenshot.setup();

    GuideMenu.observe();
    StreamBadges.setupEvents();
@ -303,8 +322,10 @@ function main() {
    disablePwa();

    // Show a toast when connecting/disconecting controller
-    window.addEventListener('gamepadconnected', e => showGamepadToast(e.gamepad));
-    window.addEventListener('gamepaddisconnected', e => showGamepadToast(e.gamepad));
+    if (getPref(PrefKey.CONTROLLER_SHOW_CONNECTION_STATUS)) {
+        window.addEventListener('gamepadconnected', e => showGamepadToast(e.gamepad));
+        window.addEventListener('gamepaddisconnected', e => showGamepadToast(e.gamepad));
+    }

    // Preload Remote Play
    if (getPref(PrefKey.REMOTE_PLAY_ENABLED)) {
@ -320,6 +341,12 @@ function main() {
        STATES.pointerServerPort = AppInterface.startPointerServer() || 9269;
        BxLogger.info('startPointerServer', 'Port', STATES.pointerServerPort.toString());
    }
+
+    // Preload Remote Play
+    getPref(PrefKey.REMOTE_PLAY_ENABLED) && BX_FLAGS.PreloadRemotePlay && RemotePlay.preload();
+
+    // Show wait time in game card
+    getPref(PrefKey.UI_GAME_CARD_SHOW_WAIT_TIME) && GameTile.setup();
 }

 main();
--- a/src/macros/build.ts
+++ b/src/macros/build.ts
@ -4,6 +4,7 @@ import cssStr from "@assets/css/styles.styl" with { type: "text" };

 const generatedCss = await (stylus(cssStr, {})
 	.set('filename', 'styles.css')
+	.set('compress', true)
 	.include('src/assets/css/'))
 	.render();

--- a/src/modules/game-bar/game-bar.ts
+++ b/src/modules/game-bar/game-bar.ts
@ -41,7 +41,7 @@ export class GameBar {

        this.actions = [
            new ScreenshotAction(),
-            ...(STATES.userAgentHasTouchSupport && (getPref(PrefKey.STREAM_TOUCH_CONTROLLER) !== 'off') ? [new TouchControlAction()] : []),
+            ...(STATES.userAgent.capabilities.touch && (getPref(PrefKey.STREAM_TOUCH_CONTROLLER) !== 'off') ? [new TouchControlAction()] : []),
            new MicrophoneAction(),
        ];

--- a/src/modules/loading-screen.ts
+++ b/src/modules/loading-screen.ts
@ -109,7 +109,7 @@ export class LoadingScreen {

        let $waitTimeBox = LoadingScreen.#$waitTimeBox;
        if (!$waitTimeBox) {
-            $waitTimeBox = CE<HTMLElement>('div', {'class': 'bx-wait-time-box'},
+            $waitTimeBox = CE('div', {'class': 'bx-wait-time-box'},
                                    CE('label', {}, t('server')),
                                    CE('span', {}, getPreferredServerRegion()),
                                    CE('label', {}, t('wait-time-estimated')),
--- a/src/modules/mkb/mkb-handler.ts
+++ b/src/modules/mkb/mkb-handler.ts
@ -8,13 +8,13 @@ import { t } from "@utils/translation";
 import { LocalDb } from "@utils/local-db";
 import { KeyHelper } from "./key-helper";
 import type { MkbStoredPreset } from "@/types/mkb";
-import { showStreamSettings } from "@modules/stream/stream-ui";
 import { AppInterface, STATES } from "@utils/global";
 import { UserAgent } from "@utils/user-agent";
 import { BxLogger } from "@utils/bx-logger";
 import { PointerClient } from "./pointer-client";
 import { NativeMkbHandler } from "./native-mkb-handler";
 import { MkbHandler, MouseDataProvider } from "./base-mkb-handler";
+import { StreamSettings } from "../stream/stream-settings";

 const LOG_TAG = 'MkbHandler';

@ -507,7 +507,7 @@ export class EmulatedMkbHandler extends MkbHandler {
                                e.preventDefault();
                                e.stopPropagation();

-                                showStreamSettings('mkb');
+                                StreamSettings.getInstance().show('mkb');
                            },
                        }),
                    ),
--- a/src/modules/mkb/mkb-remapper.ts
+++ b/src/modules/mkb/mkb-remapper.ts
@ -10,6 +10,7 @@ import { BxIcon } from "@utils/bx-icon";
 import { SettingElement } from "@utils/settings";
 import type { MkbPresetData, MkbStoredPresets } from "@/types/mkb";
 import { MkbPresetKey, GamepadKey, GamepadKeyName } from "@enums/mkb";
+import { deepClone } from "@utils/global";


 type MkbRemapperElements = {
@ -291,7 +292,7 @@ export class MkbRemapper {
        this.#$.wrapper!.classList.toggle('bx-editing', this.#STATE.isEditing);

        if (this.#STATE.isEditing) {
-            this.#STATE.editingPresetData = structuredClone(this.#getCurrentPreset().data);
+            this.#STATE.editingPresetData = deepClone(this.#getCurrentPreset().data);
        } else {
            this.#STATE.editingPresetData = null;
        }
@ -510,7 +511,7 @@ export class MkbRemapper {
                           label: t('save'),
                           style: ButtonStyle.PRIMARY,
                           onClick: e => {
-                               const updatedPreset = structuredClone(this.#getCurrentPreset());
+                               const updatedPreset = deepClone(this.#getCurrentPreset());
                               updatedPreset.data = this.#STATE.editingPresetData as MkbPresetData;

                               LocalDb.INSTANCE.updatePreset(updatedPreset).then(id => {
--- a/src/modules/patcher.ts
+++ b/src/modules/patcher.ts
@ -9,10 +9,12 @@ import { BxEvent } from "@/utils/bx-event";
 import codeControllerShortcuts from "./patches/controller-shortcuts.js" with { type: "text" };
 import codeExposeStreamSession from "./patches/expose-stream-session.js" with { type: "text" };
 import codeLocalCoOpEnable from "./patches/local-co-op-enable.js" with { type: "text" };
+import codeSetCurrentlyFocusedInteractable from "./patches/set-currently-focused-interactable.js" with { type: "text" };
 import codeRemotePlayEnable from "./patches/remote-play-enable.js" with { type: "text" };
 import codeRemotePlayKeepAlive from "./patches/remote-play-keep-alive.js" with { type: "text" };
 import codeVibrationAdjust from "./patches/vibration-adjust.js" with { type: "text" };
 import { FeatureGates } from "@/utils/feature-gates.js";
+import { UiSection } from "@/enums/ui-sections.js";

 type PatchArray = (keyof typeof PATCHES)[];

@ -189,12 +191,18 @@ if (!!window.BX_REMOTE_PLAY_CONFIG) {
    },

    enableXcloudLogger(str: string) {
-        const text = 'this.telemetryProvider=e}log(e,t,i){';
+        const text = 'this.telemetryProvider=e}log(e,t,r){';
        if (!str.includes(text)) {
            return false;
        }

-        str = str.replaceAll(text, text + 'console.log(Array.from(arguments));');
+        const newCode = `
+const [logTag, logLevel, logMessage] = Array.from(arguments);
+const logFunc = [console.debug, console.log, console.warn, console.error][logLevel];
+logFunc(logTag, '//', logMessage);
+`;
+
+        str = str.replaceAll(text, text + newCode);
        return str;
    },

@ -623,7 +631,163 @@ true` + text;

        str = str.replace(text, text + 'return;');
        return str;
+    },
+
+    // Fix crashing when RequestInfo.origin is empty
+    patchRequestInfoCrash(str: string) {
+        const text = 'if(!e)throw new Error("RequestInfo.origin is falsy");';
+        if (!str.includes(text)) {
+            return false;
+        }
+
+        str = str.replace(text, 'if (!e) e = "https://www.xbox.com";');
+        return str;
+    },
+
+    exposeDialogRoutes(str: string) {
+        const text = 'return{goBack:function(){';
+        if (!str.includes(text)) {
+            return false;
+        }
+
+        str = str.replace(text, 'return window.BX_EXPOSED.dialogRoutes = {goBack:function(){');
+        return str;
+    },
+
+    /*
+    (x.AW, {
+        path: V.LoginDeviceCode.path,
+        exact: !0,
+        render: () => (0, n.jsx)(qe, {
+            children: (0, n.jsx)(Et.R, {})
+        })
+    }, V.LoginDeviceCode.name),
+
+    const qe = e => {
+        let {
+            children: t
+        } = e;
+        const {
+            isTV: a,
+            isSupportedTVBrowser: r
+        } = (0, T.d)();
+        return a && r ? (0, n.jsx)(n.Fragment, {
+            children: t
+        }) : (0, n.jsx)(x.l_, {
+            to: V.Home.getLink()
+        })
+    };
+    */
+    enableTvRoutes(str: string) {
+        let index = str.indexOf('.LoginDeviceCode.path,');
+        if (index < 0) {
+            return false;
+        }
+
+        // Find *qe* name
+        const match = /render:.*?jsx\)\(([^,]+),/.exec(str.substring(index, index + 100));
+        if (!match) {
+            return false;
+        }
+
+        const funcName = match[1];
+
+        // Replace *qe*'s return value
+        // `return a && r ?` => `return a && r || true ?`
+        index = str.indexOf(`const ${funcName}=e=>{`);
+        index > -1 && (index = str.indexOf('return ', index));
+        index > -1 && (index = str.indexOf('?', index));
+
+        if (index === -1) {
+            return false;
+        }
+
+        str = str.substring(0, index) + '|| true' + str.substring(index);
+        return str;
+    },
+
+    // Don't render "Play With Friends" sections
+    ignorePlayWithFriendsSection(str: string) {
+        let index = str.indexOf('location:"PlayWithFriendsRow",');
+        if (index === -1) {
+            return false;
+        }
+
+        index = str.indexOf('return', index - 50);
+        if (index === -1) {
+            return false;
+        }
+
+        str = str.substring(0, index) + 'return null;' + str.substring(index + 6);
+        return str;
+    },
+
+    // Don't render "All Games" sections
+    ignoreAllGamesSection(str: string) {
+        let index = str.indexOf('className:"AllGamesRow-module__allGamesRowContainer');
+        if (index === -1) {
+            return false;
+        }
+
+        index = str.indexOf('grid:!0,', index);
+        index > -1 && (index = str.indexOf('(0,', index - 70));
+
+        if (index === -1) {
+            return false;
+        }
+
+        str = str.substring(0, index) + 'true ? null :' + str.substring(index);
+        return str;
+    },
+
+    // Override Storage.getSettings()
+    overrideStorageGetSettings(str: string) {
+        const text = '}getSetting(e){';
+        if (!str.includes(text)) {
+            return false;
+        }
+
+        const newCode = `
+// console.log('setting', this.baseStorageKey, e);
+if (this.baseStorageKey in window.BX_EXPOSED.overrideSettings) {
+    const settings = window.BX_EXPOSED.overrideSettings[this.baseStorageKey];
+    if (e in settings) {
+        return settings[e];
    }
+}
+`;
+        str = str.replace(text, text + newCode);
+        return str;
+    },
+
+    // game-stream.js   24.16.4
+    alwaysShowStreamHud(str: string) {
+        let index = str.indexOf(',{onShowStreamMenu:');
+        if (index === -1) {
+            return false;
+        }
+
+        index = str.indexOf('&&(0,', index - 100);
+        if (index === -1) {
+            return false;
+        }
+
+        const commaIndex = str.indexOf(',', index - 10);
+        str = str.substring(0, commaIndex) + ',true' + str.substring(index);
+        return str;
+    },
+
+    // 24225.js#4127, 24.17.11
+    patchSetCurrentlyFocusedInteractable(str: string) {
+        let index = str.indexOf('.setCurrentlyFocusedInteractable=(');
+        if (index === -1) {
+            return false;
+        }
+
+        index = str.indexOf('{', index) + 1;
+        str = str.substring(0, index) + codeSetCurrentlyFocusedInteractable + str.substring(index);
+        return str;
+    },
 };

 let PATCH_ORDERS: PatchArray = [
@ -634,16 +798,27 @@ let PATCH_ORDERS: PatchArray = [
        'exposeInputSink',
    ] : []),

+    'patchRequestInfoCrash',
+
    'disableStreamGate',
    'overrideSettings',
    'broadcastPollingMode',

    'exposeStreamSession',
+    'exposeDialogRoutes',
+
+    'enableTvRoutes',
+
+    'overrideStorageGetSettings',
+    getPref(PrefKey.UI_GAME_CARD_SHOW_WAIT_TIME) && 'patchSetCurrentlyFocusedInteractable',

    getPref(PrefKey.UI_LAYOUT) !== 'default' && 'websiteLayout',
    getPref(PrefKey.LOCAL_CO_OP_ENABLED) && 'supportLocalCoOp',
    getPref(PrefKey.GAME_FORTNITE_FORCE_CONSOLE) && 'forceFortniteConsole',

+    getPref(PrefKey.UI_HIDE_SECTIONS).includes(UiSection.FRIENDS) && 'ignorePlayWithFriendsSection',
+    getPref(PrefKey.UI_HIDE_SECTIONS).includes(UiSection.ALL_GAMES) && 'ignoreAllGamesSection',
+
    ...(getPref(PrefKey.BLOCK_TRACKING) ? [
        'disableAiTrack',
        'disableTelemetry',
@ -659,7 +834,7 @@ let PATCH_ORDERS: PatchArray = [
        'remotePlayKeepAlive',
        'remotePlayDirectConnectUrl',
        'remotePlayDisableAchievementToast',
-        STATES.userAgentHasTouchSupport && 'patchUpdateInputConfigurationAsync',
+        STATES.userAgent.capabilities.touch && 'patchUpdateInputConfigurationAsync',
    ] : []),

    ...(BX_FLAGS.EnableXcloudLogging ? [
@ -675,6 +850,8 @@ let PLAYING_PATCH_ORDERS: PatchArray = [
    'patchStreamHud',
    'playVibration',

+    'alwaysShowStreamHud',
+
    // 'exposeEventTarget',

    // Patch volume control for normal stream
@ -685,10 +862,10 @@ let PLAYING_PATCH_ORDERS: PatchArray = [
    // Skip feedback dialog
    getPref(PrefKey.STREAM_DISABLE_FEEDBACK_DIALOG) && 'skipFeedbackDialog',

-    ...(STATES.userAgentHasTouchSupport ? [
+    ...(STATES.userAgent.capabilities.touch ? [
        getPref(PrefKey.STREAM_TOUCH_CONTROLLER) === 'all' && 'patchShowSensorControls',
        getPref(PrefKey.STREAM_TOUCH_CONTROLLER) === 'all' && 'exposeTouchLayoutManager',
-        (getPref(PrefKey.STREAM_TOUCH_CONTROLLER) === 'off' || getPref(PrefKey.STREAM_TOUCH_CONTROLLER_AUTO_OFF)) && 'disableTakRenderer',
+        (getPref(PrefKey.STREAM_TOUCH_CONTROLLER) === 'off' || getPref(PrefKey.STREAM_TOUCH_CONTROLLER_AUTO_OFF) || !STATES.userAgent.capabilities.touch) && 'disableTakRenderer',
        getPref(PrefKey.STREAM_TOUCH_CONTROLLER_DEFAULT_OPACITY) !== 100 && 'patchTouchControlDefaultOpacity',
        'patchBabylonRendererClass',
    ] : []),
--- a/src/modules/patches/set-currently-focused-interactable.js
+++ b/src/modules/patches/set-currently-focused-interactable.js
@ -0,0 +1 @@
+e && BxEvent.dispatch(window, BxEvent.NAVIGATION_FOCUS_CHANGED, {element: e});
--- a/src/modules/remote-play.ts
+++ b/src/modules/remote-play.ts
@ -7,6 +7,7 @@ import { getPref, PrefKey, setPref } from "@utils/preferences";
 import { t } from "@utils/translation";
 import { localRedirect } from "@modules/ui/ui";
 import { BxLogger } from "@utils/bx-logger";
+import { HeaderSection } from "./ui/header";

 const LOG_TAG = 'RemotePlay';

@ -97,6 +98,10 @@ export class RemotePlay {
        RemotePlay.#getXhomeToken(() => {
            RemotePlay.#getConsolesList(() => {
                BxLogger.info(LOG_TAG, 'Consoles', RemotePlay.#CONSOLES);
+                if (RemotePlay.#CONSOLES && RemotePlay.#CONSOLES.length > 0) {
+                    STATES.supportedRegion && HeaderSection.showRemotePlayButton();
+                }
+
                RemotePlay.#renderConsoles();
                BxEvent.dispatch(window, BxEvent.REMOTE_PLAY_READY);
            });
--- a/src/modules/stream/stream-badges.ts
+++ b/src/modules/stream/stream-badges.ts
@ -91,7 +91,7 @@ export class StreamBadges {
        let batteryLevel = '100%';
        let batteryLevelInt = 100;
        let isCharging = false;
-        if ('getBattery' in navigator) {
+        if (STATES.browser.capabilities.batteryApi) {
            try {
                const bm = await (navigator as NavigatorBattery).getBattery();
                isCharging = bm.charging;
@ -224,7 +224,7 @@ export class StreamBadges {

        // Battery
        let batteryLevel = '';
-        if ('getBattery' in navigator) {
+        if (STATES.browser.capabilities.batteryApi) {
            batteryLevel = '100%';
        }

@ -338,7 +338,7 @@ export class StreamBadges {

            // Get battery level
            try {
-                'getBattery' in navigator && (navigator as NavigatorBattery).getBattery().then(bm => {
+                STATES.browser.capabilities.batteryApi && (navigator as NavigatorBattery).getBattery().then(bm => {
                    streamBadges.startBatteryLevel = Math.round(bm.level * 100);
                });
            } catch(e) {}
--- a/src/modules/stream/stream-settings-utils.ts
+++ b/src/modules/stream/stream-settings-utils.ts
@ -0,0 +1,54 @@
+import { StreamPlayerType, StreamVideoProcessing } from "@enums/stream-player";
+import { STATES } from "@utils/global";
+import { getPref, PrefKey, setPref } from "@utils/preferences";
+import { UserAgent } from "@utils/user-agent";
+import type { StreamPlayerOptions } from "../stream-player";
+
+export function onChangeVideoPlayerType() {
+    const playerType = getPref(PrefKey.VIDEO_PLAYER_TYPE);
+    const $videoProcessing = document.getElementById('bx_setting_video_processing') as HTMLSelectElement;
+    const $videoSharpness = document.getElementById('bx_setting_video_sharpness') as HTMLElement;
+
+    let isDisabled = false;
+
+    if (playerType === StreamPlayerType.WEBGL2) {
+        ($videoProcessing.querySelector(`option[value=${StreamVideoProcessing.CAS}]`) as HTMLOptionElement).disabled = false;
+    } else {
+        // Only allow USM when player type is Video
+        $videoProcessing.value = StreamVideoProcessing.USM;
+        setPref(PrefKey.VIDEO_PROCESSING, StreamVideoProcessing.USM);
+
+        ($videoProcessing.querySelector(`option[value=${StreamVideoProcessing.CAS}]`) as HTMLOptionElement).disabled = true;
+
+        if (UserAgent.isSafari()) {
+            isDisabled = true;
+        }
+    }
+
+    $videoProcessing.disabled = isDisabled;
+    $videoSharpness.dataset.disabled = isDisabled.toString();
+
+    updateVideoPlayer();
+}
+
+
+export function updateVideoPlayer() {
+    const streamPlayer = STATES.currentStream.streamPlayer;
+    if (!streamPlayer) {
+        return;
+    }
+
+    const options = {
+        processing: getPref(PrefKey.VIDEO_PROCESSING),
+        sharpness: getPref(PrefKey.VIDEO_SHARPNESS),
+        saturation: getPref(PrefKey.VIDEO_SATURATION),
+        contrast: getPref(PrefKey.VIDEO_CONTRAST),
+        brightness: getPref(PrefKey.VIDEO_BRIGHTNESS),
+    } satisfies StreamPlayerOptions;
+
+    streamPlayer.setPlayerType(getPref(PrefKey.VIDEO_PLAYER_TYPE));
+    streamPlayer.updateOptions(options);
+    streamPlayer.refreshPlayer();
+}
+
+window.addEventListener('resize', updateVideoPlayer);
--- a/src/modules/stream/stream-settings.ts
+++ b/src/modules/stream/stream-settings.ts
@ -0,0 +1,397 @@
+import { BxEvent } from "@utils/bx-event";
+import { BxIcon } from "@utils/bx-icon";
+import { STATES, AppInterface } from "@utils/global";
+import { ButtonStyle, CE, createButton, createSvgIcon } from "@utils/html";
+import { PrefKey, Preferences, getPref, toPrefElement } from "@utils/preferences";
+import { t } from "@utils/translation";
+import { ControllerShortcut } from "../controller-shortcut";
+import { MkbRemapper } from "../mkb/mkb-remapper";
+import { NativeMkbHandler } from "../mkb/native-mkb-handler";
+import { SoundShortcut } from "../shortcuts/shortcut-sound";
+import { TouchController } from "../touch-controller";
+import { VibrationManager } from "../vibration-manager";
+import { StreamStats } from "./stream-stats";
+import { BX_FLAGS } from "@/utils/bx-flags";
+import { BxSelectElement } from "@/web-components/bx-select";
+import { onChangeVideoPlayerType, updateVideoPlayer } from "./stream-settings-utils";
+
+export class StreamSettings {
+    private static instance: StreamSettings;
+
+    public static getInstance(): StreamSettings {
+        if (!StreamSettings.instance) {
+            StreamSettings.instance = new StreamSettings();
+        }
+
+        return StreamSettings.instance;
+    }
+
+    private $container: HTMLElement | undefined;
+    private $overlay: HTMLElement | undefined;
+
+    readonly SETTINGS_UI = [{
+        icon: BxIcon.DISPLAY,
+        group: 'stream',
+        items: [{
+            group: 'audio',
+            label: t('audio'),
+            help_url: 'https://better-xcloud.github.io/ingame-features/#audio',
+            items: [{
+                pref: PrefKey.AUDIO_VOLUME,
+                onChange: (e: any, value: number) => {
+                    SoundShortcut.setGainNodeVolume(value);
+                },
+                params: {
+                    disabled: !getPref(PrefKey.AUDIO_ENABLE_VOLUME_CONTROL),
+                },
+                onMounted: ($elm: HTMLElement) => {
+                    const $range = $elm.querySelector('input[type=range') as HTMLInputElement;
+                    window.addEventListener(BxEvent.GAINNODE_VOLUME_CHANGED, e => {
+                        $range.value = (e as any).volume;
+                        BxEvent.dispatch($range, 'input', {
+                            ignoreOnChange: true,
+                        });
+                    });
+                },
+            }],
+        }, {
+            group: 'video',
+            label: t('video'),
+            help_url: 'https://better-xcloud.github.io/ingame-features/#video',
+            items: [{
+                pref: PrefKey.VIDEO_PLAYER_TYPE,
+                onChange: onChangeVideoPlayerType,
+            }, {
+                pref: PrefKey.VIDEO_RATIO,
+                onChange: updateVideoPlayer,
+            }, {
+                pref: PrefKey.VIDEO_PROCESSING,
+                onChange: updateVideoPlayer,
+            }, {
+                pref: PrefKey.VIDEO_SHARPNESS,
+                onChange: updateVideoPlayer,
+            }, {
+                pref: PrefKey.VIDEO_SATURATION,
+                onChange: updateVideoPlayer,
+            }, {
+                pref: PrefKey.VIDEO_CONTRAST,
+                onChange: updateVideoPlayer,
+            }, {
+                pref: PrefKey.VIDEO_BRIGHTNESS,
+                onChange: updateVideoPlayer,
+            }],
+        }],
+        }, {
+            icon: BxIcon.CONTROLLER,
+            group: 'controller',
+            items: [{
+                group: 'controller',
+                label: t('controller'),
+                help_url: 'https://better-xcloud.github.io/ingame-features/#controller',
+                items: [{
+                    pref: PrefKey.CONTROLLER_ENABLE_VIBRATION,
+                    unsupported: !VibrationManager.supportControllerVibration(),
+                    onChange: () => VibrationManager.updateGlobalVars(),
+                }, {
+                    pref: PrefKey.CONTROLLER_DEVICE_VIBRATION,
+                    unsupported: !VibrationManager.supportDeviceVibration(),
+                    onChange: () => VibrationManager.updateGlobalVars(),
+                }, (VibrationManager.supportControllerVibration() || VibrationManager.supportDeviceVibration()) && {
+                    pref: PrefKey.CONTROLLER_VIBRATION_INTENSITY,
+                    unsupported: !VibrationManager.supportDeviceVibration(),
+                    onChange: () => VibrationManager.updateGlobalVars(),
+                }],
+            },
+
+            STATES.userAgent.capabilities.touch && {
+                group: 'touch-controller',
+                label: t('touch-controller'),
+                items: [{
+                    label: t('layout'),
+                    content: CE('select', {disabled: true}, CE('option', {}, t('default'))),
+                    onMounted: ($elm: HTMLSelectElement) => {
+                        $elm.addEventListener('change', e => {
+                            TouchController.loadCustomLayout(STATES.currentStream?.xboxTitleId!, $elm.value, 1000);
+                        });
+
+                        window.addEventListener(BxEvent.CUSTOM_TOUCH_LAYOUTS_LOADED, e => {
+                            const data = (e as any).data;
+
+                            if (STATES.currentStream?.xboxTitleId && ($elm as any).xboxTitleId === STATES.currentStream?.xboxTitleId) {
+                                $elm.dispatchEvent(new Event('change'));
+                                return;
+                            }
+
+                            ($elm as any).xboxTitleId = STATES.currentStream?.xboxTitleId;
+
+                            // Clear options
+                            while ($elm.firstChild) {
+                                $elm.removeChild($elm.firstChild);
+                            }
+
+                            $elm.disabled = !data;
+                            if (!data) {
+                                $elm.appendChild(CE('option', {value: ''}, t('default')));
+                                $elm.value = '';
+                                $elm.dispatchEvent(new Event('change'));
+                                return;
+                            }
+
+                            // Add options
+                            const $fragment = document.createDocumentFragment();
+                            for (const key in data.layouts) {
+                                const layout = data.layouts[key];
+
+                                let name;
+                                if (layout.author) {
+                                    name = `${layout.name} (${layout.author})`;
+                                } else {
+                                    name = layout.name;
+                                }
+
+                                const $option = CE('option', {value: key}, name);
+                                $fragment.appendChild($option);
+                            }
+
+                            $elm.appendChild($fragment);
+                            $elm.value = data.default_layout;
+                            $elm.dispatchEvent(new Event('change'));
+                        });
+                    },
+                }],
+            }],
+        },
+
+        getPref(PrefKey.MKB_ENABLED) && {
+            icon: BxIcon.VIRTUAL_CONTROLLER,
+            group: 'mkb',
+            items: [{
+                group: 'mkb',
+                label: t('virtual-controller'),
+                help_url: 'https://better-xcloud.github.io/mouse-and-keyboard/',
+                content: MkbRemapper.INSTANCE.render(),
+            }],
+        },
+
+        AppInterface && getPref(PrefKey.NATIVE_MKB_ENABLED) === 'on' && {
+            icon: BxIcon.NATIVE_MKB,
+            group: 'native-mkb',
+            items: [{
+                group: 'native-mkb',
+                label: t('native-mkb'),
+                items: [{
+                    pref: PrefKey.NATIVE_MKB_SCROLL_VERTICAL_SENSITIVITY,
+                    onChange: (e: any, value: number) => {
+                        NativeMkbHandler.getInstance().setVerticalScrollMultiplier(value / 100);
+                    },
+                }, {
+                    pref: PrefKey.NATIVE_MKB_SCROLL_HORIZONTAL_SENSITIVITY,
+                    onChange: (e: any, value: number) => {
+                        NativeMkbHandler.getInstance().setHorizontalScrollMultiplier(value / 100);
+                    },
+                }],
+            }],
+        }, {
+            icon: BxIcon.COMMAND,
+            group: 'shortcuts',
+            items: [{
+                group: 'shortcuts_controller',
+                label: t('controller-shortcuts'),
+                content: ControllerShortcut.renderSettings(),
+            }],
+        }, {
+            icon: BxIcon.STREAM_STATS,
+            group: 'stats',
+            items: [{
+                group: 'stats',
+                label: t('stream-stats'),
+                help_url: 'https://better-xcloud.github.io/stream-stats/',
+                items: [{
+                        pref: PrefKey.STATS_SHOW_WHEN_PLAYING,
+                    }, {
+                        pref: PrefKey.STATS_QUICK_GLANCE,
+                        onChange: (e: InputEvent) => {
+                            const streamStats = StreamStats.getInstance();
+                            (e.target! as HTMLInputElement).checked ? streamStats.quickGlanceSetup() : streamStats.quickGlanceStop();
+                        },
+                    }, {
+                        pref: PrefKey.STATS_ITEMS,
+                        onChange: StreamStats.refreshStyles,
+                    }, {
+                        pref: PrefKey.STATS_POSITION,
+                        onChange: StreamStats.refreshStyles,
+                    }, {
+                        pref: PrefKey.STATS_TEXT_SIZE,
+                        onChange: StreamStats.refreshStyles,
+                    }, {
+                        pref: PrefKey.STATS_OPACITY,
+                        onChange: StreamStats.refreshStyles,
+                    }, {
+                        pref: PrefKey.STATS_TRANSPARENT,
+                        onChange: StreamStats.refreshStyles,
+                    }, {
+                        pref: PrefKey.STATS_CONDITIONAL_FORMATTING,
+                        onChange: StreamStats.refreshStyles,
+                    },
+                ],
+            }],
+        },
+    ];
+
+    constructor() {
+        this.#setupDialog();
+
+        // Hide dialog when the Guide menu is shown
+        window.addEventListener(BxEvent.XCLOUD_GUIDE_MENU_SHOWN, e => this.hide());
+    }
+
+    show(tabId?: string) {
+        const $container = this.$container!;
+        // Select tab
+        if (tabId) {
+            const $tab = $container.querySelector(`.bx-stream-settings-tabs svg[data-group=${tabId}]`);
+            $tab && $tab.dispatchEvent(new Event('click'));
+        }
+
+        this.$overlay!.classList.remove('bx-gone');
+        this.$overlay!.dataset.isPlaying = STATES.isPlaying.toString();
+
+        $container.classList.remove('bx-gone');
+        document.body.classList.add('bx-no-scroll');
+
+        BxEvent.dispatch(window, BxEvent.XCLOUD_DIALOG_SHOWN);
+    }
+
+    hide() {
+        this.$overlay!.classList.add('bx-gone');
+        this.$container!.classList.add('bx-gone');
+
+        document.body.classList.remove('bx-no-scroll');
+
+        BxEvent.dispatch(window, BxEvent.XCLOUD_DIALOG_DISMISSED);
+    }
+
+    #setupDialog() {
+        let $tabs: HTMLElement;
+        let $settings: HTMLElement;
+
+        const $overlay = CE('div', {'class': 'bx-stream-settings-overlay bx-gone'});
+        this.$overlay = $overlay;
+
+        const $container = CE('div', {'class': 'bx-stream-settings-dialog bx-gone'},
+                $tabs = CE('div', {'class': 'bx-stream-settings-tabs'}),
+                $settings = CE('div', {'class': 'bx-stream-settings-tab-contents'}),
+            );
+        this.$container = $container;
+
+        // Close dialog when clicking on the overlay
+        $overlay.addEventListener('click', e => {
+            e.preventDefault();
+            e.stopPropagation();
+            this.hide();
+        });
+
+        for (const settingTab of this.SETTINGS_UI) {
+            if (!settingTab) {
+                continue;
+            }
+
+            const $svg = createSvgIcon(settingTab.icon);
+            $svg.addEventListener('click', e => {
+                // Switch tab
+                for (const $child of Array.from($settings.children)) {
+                    if ($child.getAttribute('data-group') === settingTab.group) {
+                        $child.classList.remove('bx-gone');
+                    } else {
+                        $child.classList.add('bx-gone');
+                    }
+                }
+
+                // Highlight current tab button
+                for (const $child of Array.from($tabs.children)) {
+                    $child.classList.remove('bx-active');
+                }
+
+                $svg.classList.add('bx-active');
+            });
+
+            $tabs.appendChild($svg);
+
+            const $group = CE('div', {'data-group': settingTab.group, 'class': 'bx-gone'});
+
+            for (const settingGroup of settingTab.items) {
+                if (!settingGroup) {
+                    continue;
+                }
+
+                $group.appendChild(CE('h2', {},
+                        CE('span', {}, settingGroup.label),
+                        settingGroup.help_url && createButton({
+                                icon: BxIcon.QUESTION,
+                                style: ButtonStyle.GHOST,
+                                url: settingGroup.help_url,
+                                title: t('help'),
+                            }),
+                    ));
+                if (settingGroup.note) {
+                    if (typeof settingGroup.note === 'string') {
+                        settingGroup.note = document.createTextNode(settingGroup.note);
+                    }
+                    $group.appendChild(settingGroup.note);
+                }
+
+                if (settingGroup.content) {
+                    $group.appendChild(settingGroup.content);
+                    continue;
+                }
+
+                if (!settingGroup.items) {
+                    settingGroup.items = [];
+                }
+
+                for (const setting of settingGroup.items) {
+                    if (!setting) {
+                        continue;
+                    }
+
+                    const pref = setting.pref;
+
+                    let $control;
+                    if (setting.content) {
+                        $control = setting.content;
+                    } else if (!setting.unsupported) {
+                        $control = toPrefElement(pref, setting.onChange, setting.params);
+
+                        if ($control instanceof HTMLSelectElement && BX_FLAGS.ScriptUi === 'tv') {
+                            $control = BxSelectElement.wrap($control);
+                        }
+                    }
+
+                    const label = Preferences.SETTINGS[pref as PrefKey]?.label || setting.label;
+                    const note = Preferences.SETTINGS[pref as PrefKey]?.note || setting.note;
+
+                    const $content = CE('div', {'class': 'bx-stream-settings-row', 'data-type': settingGroup.group},
+                        CE('label', {for: `bx_setting_${pref}`},
+                            label,
+                            note && CE('div', {'class': 'bx-stream-settings-dialog-note'}, note),
+                            setting.unsupported && CE('div', {'class': 'bx-stream-settings-dialog-note'}, t('browser-unsupported-feature')),
+                        ),
+                        !setting.unsupported && $control,
+                    );
+
+                    $group.appendChild($content);
+
+                    setting.onMounted && setting.onMounted($control);
+                }
+            }
+
+            $settings.appendChild($group);
+        }
+
+        // Select first tab
+        $tabs.firstElementChild!.dispatchEvent(new Event('click'));
+
+        document.documentElement.appendChild($overlay);
+        document.documentElement.appendChild($container);
+    }
+}
--- a/src/modules/stream/stream-stats.ts
+++ b/src/modules/stream/stream-stats.ts
@ -1,6 +1,5 @@
-import { PrefKey } from "@utils/preferences"
+import { PrefKey, getPref } from "@utils/preferences"
 import { BxEvent } from "@utils/bx-event"
-import { getPref } from "@utils/preferences"
 import { CE } from "@utils/html"
 import { t } from "@utils/translation"
 import { STATES } from "@utils/global"
@ -39,6 +38,10 @@ export class StreamStats {

    #quickGlanceObserver?: MutationObserver | null;

+    constructor() {
+        this.#render();
+    }
+
    start(glancing=false) {
        if (!this.isHidden() || (glancing && this.isGlancing())) {
            return;
@ -85,11 +88,15 @@ export class StreamStats {
    isGlancing = () => this.#$container && this.#$container.dataset.display === 'glancing';

    quickGlanceSetup() {
-        if (this.#quickGlanceObserver) {
+        if (!STATES.isPlaying || this.#quickGlanceObserver) {
            return;
        }

        const $uiContainer = document.querySelector('div[data-testid=ui-container]')!;
+        if (!$uiContainer) {
+            return;
+        }
+
        this.#quickGlanceObserver = new MutationObserver((mutationList, observer) => {
            for (let record of mutationList) {
                if (record.attributeName && record.attributeName === 'aria-expanded') {
@ -135,10 +142,10 @@ export class StreamStats {
                this.#$fps!.textContent = stat.framesPerSecond || 0;

                // Packets Lost
-                const packetsLost = stat.packetsLost;
+                const packetsLost = Math.max(0, stat.packetsLost);  // packetsLost can be negative, but we don't care about that
                const packetsReceived = stat.packetsReceived;
                const packetsLostPercentage = (packetsLost * 100 / ((packetsLost + packetsReceived) || 1)).toFixed(2);
-                this.#$pl!.textContent = packetsLostPercentage === '0.00' ? packetsLost : `${packetsLost} (${packetsLostPercentage}%)`;
+                this.#$pl!.textContent = packetsLostPercentage === '0.00' ? packetsLost.toString() : `${packetsLost} (${packetsLostPercentage}%)`;

                // Frames dropped
                const framesDropped = stat.framesDropped;
@ -212,10 +219,6 @@ export class StreamStats {
    }

    #render() {
-        if (this.#$container) {
-            return;
-        }
-
        const stats = {
            [StreamStat.PING]: [t('stat-ping'), this.#$ping = CE('span', {}, '0')],
            [StreamStat.FPS]: [t('stat-fps'), this.#$fps = CE('span', {}, '0')],
@ -246,10 +249,6 @@ export class StreamStats {
    }

    static setupEvents() {
-        window.addEventListener(BxEvent.STREAM_LOADING, e => {
-            StreamStats.getInstance().#render();
-        });
-
        window.addEventListener(BxEvent.STREAM_PLAYING, e => {
            const PREF_STATS_QUICK_GLANCE = getPref(PrefKey.STATS_QUICK_GLANCE);
            const PREF_STATS_SHOW_WHEN_PLAYING = getPref(PrefKey.STATS_SHOW_WHEN_PLAYING);
--- a/src/modules/stream/stream-ui.ts
+++ b/src/modules/stream/stream-ui.ts
@ -5,6 +5,7 @@ import { BxEvent } from "@utils/bx-event.ts";
 import { t } from "@utils/translation.ts";
 import { StreamBadges } from "./stream-badges.ts";
 import { StreamStats } from "./stream-stats.ts";
+import { StreamSettings } from "./stream-settings.ts";


 function cloneStreamHudButton($orgButton: HTMLElement, label: string, svgIcon: typeof BxIcon) {
@ -34,7 +35,7 @@ function cloneStreamHudButton($orgButton: HTMLElement, label: string, svgIcon: t
        }
    };

-    if (STATES.browserHasTouchSupport) {
+    if (STATES.browser.capabilities.touch) {
        $container.addEventListener('transitionstart', onTransitionStart);
        $container.addEventListener('transitionend', onTransitionEnd);
    }
@ -87,27 +88,6 @@ export function injectStreamMenuButtons() {

    ($screen as any).xObserving = true;

-    const $settingsDialog = document.querySelector('.bx-stream-settings-dialog')!;
-    const $parent = $screen.parentElement;
-    const hideSettingsFunc = (e?: MouseEvent | TouchEvent) => {
-        if (e) {
-            const $target = e.target as HTMLElement;
-            e.stopPropagation();
-            if ($target != $parent && $target.id !== 'MultiTouchSurface' && !$target.querySelector('#BabylonCanvasContainer-main')) {
-                return;
-            }
-            if ($target.id === 'MultiTouchSurface') {
-                $target.removeEventListener('touchstart', hideSettingsFunc);
-            }
-        }
-
-        // Hide Stream settings dialog
-        $settingsDialog.classList.add('bx-gone');
-
-        $parent?.removeEventListener('click', hideSettingsFunc);
-        // $parent.removeEventListener('touchstart', hideSettingsFunc);
-    }
-
    let $btnStreamSettings: HTMLElement;
    let $btnStreamStats: HTMLElement;
    const streamStats = StreamStats.getInstance();
@ -145,7 +125,7 @@ export function injectStreamMenuButtons() {

                    // Hide Stream Settings dialog when closing HUD
                    $btnCloseHud.addEventListener('click', e => {
-                        $settingsDialog.classList.add('bx-gone');
+                        StreamSettings.getInstance().hide();
                    });

                    // Create Refresh button from the Close button
@ -165,7 +145,6 @@ export function injectStreamMenuButtons() {
                    const $menu = document.querySelector('div[class*=StreamMenu-module__menuContainer] > div[class*=Menu-module]');
                    $menu?.appendChild(await StreamBadges.getInstance().render());

-                    hideSettingsFunc();
                    return;
                }

@ -205,13 +184,7 @@ export function injectStreamMenuButtons() {
                        e.preventDefault();

                        // Show Stream Settings dialog
-                        $settingsDialog.classList.remove('bx-gone');
-
-                        $parent?.addEventListener('click', hideSettingsFunc);
-                        //$parent.addEventListener('touchstart', hideSettingsFunc);
-
-                        const $touchSurface = document.getElementById('MultiTouchSurface');
-                        $touchSurface && $touchSurface.style.display != 'none' && $touchSurface.addEventListener('touchstart', hideSettingsFunc);
+                        StreamSettings.getInstance().show();
                    });
                }

@ -249,37 +222,3 @@ export function injectStreamMenuButtons() {
    });
    observer.observe($screen, {subtree: true, childList: true});
 }
-
-
-export function showStreamSettings(tabId: string) {
-    const $wrapper = document.querySelector('.bx-stream-settings-dialog');
-    if (!$wrapper) {
-        return;
-    }
-
-    // Select tab
-    if (tabId) {
-        const $tab = $wrapper.querySelector(`.bx-stream-settings-tabs svg[data-group=${tabId}]`);
-        $tab && $tab.dispatchEvent(new Event('click'));
-    }
-
-    $wrapper.classList.remove('bx-gone');
-
-    const $screen = document.querySelector('#PageContent section[class*=PureScreens]');
-    if ($screen && $screen.parentElement) {
-        const $parent = $screen.parentElement;
-        if (!$parent || ($parent as any).bxClick) {
-            return;
-        }
-
-        ($parent as any).bxClick = true;
-
-        const onClick = (e: Event) => {
-            $wrapper.classList.add('bx-gone');
-            ($parent as any).bxClick = false;
-            $parent.removeEventListener('click', onClick);
-        };
-
-        $parent.addEventListener('click', onClick);
-    }
-}
--- a/src/modules/ui/game-tile.ts
+++ b/src/modules/ui/game-tile.ts
@ -0,0 +1,87 @@
+import { BxEvent } from "@/utils/bx-event";
+import { BxIcon } from "@/utils/bx-icon";
+import { CE, createSvgIcon, getReactProps } from "@/utils/html";
+import { XcloudApi } from "@/utils/xcloud-api";
+
+export class GameTile {
+    static #timeout: number | null;
+
+    static #secondsToHms(seconds: number) {
+        let h = Math.floor(seconds / 3600);
+        seconds %= 3600;
+        let m = Math.floor(seconds / 60);
+        let s = seconds % 60;
+
+        const output = [];
+        h > 0 && output.push(`${h}h`);
+        m > 0 && output.push(`${m}m`);
+        if (s > 0 || output.length === 0) {
+            output.push(`${s}s`);
+        }
+
+        return output.join(' ');
+    }
+
+    static async #showWaitTime($elm: HTMLElement, productId: string) {
+        let totalWaitTime;
+
+        const api = XcloudApi.getInstance();
+        const info = await api.getTitleInfo(productId);
+        if (info) {
+            const waitTime = await api.getWaitTime(info.titleId);
+            if (waitTime) {
+                totalWaitTime = waitTime.estimatedAllocationTimeInSeconds;
+            }
+        }
+
+        if (typeof totalWaitTime === 'number' && $elm.isConnected) {
+            const $div = CE('div', {'class': 'bx-game-tile-wait-time'},
+                createSvgIcon(BxIcon.PLAYTIME),
+                CE('span', {}, GameTile.#secondsToHms(totalWaitTime)),
+            );
+            $elm.insertAdjacentElement('afterbegin', $div);
+        }
+    }
+
+    static requestWaitTime($elm: HTMLElement, productId: string) {
+        GameTile.#timeout && clearTimeout(GameTile.#timeout);
+        GameTile.#timeout = window.setTimeout(async () => {
+            if (!($elm as any).hasWaitTime) {
+                ($elm as any).hasWaitTime = true;
+                GameTile.#showWaitTime($elm, productId);
+            }
+        }, 1000);
+    }
+
+    static setup() {
+        window.addEventListener(BxEvent.NAVIGATION_FOCUS_CHANGED, e => {
+            let productId;
+            const $elm = (e as any).element;
+            try {
+                if (($elm.tagName === 'BUTTON' && $elm.className.includes('MruGameCard')) || (($elm.tagName === 'A' && $elm.className.includes('GameCard')))) {
+                    let props = getReactProps($elm.parentElement);
+
+                    // When context menu is enabled
+                    if (Array.isArray(props.children)) {
+                        productId = props.children[0].props.productId;
+                    } else {
+                        productId = props.children.props.productId;
+                    }
+                } else if ($elm.tagName === 'A' && $elm.className.includes('GameItem'))  {
+                    let props = getReactProps($elm.parentElement);
+                    props = props.children.props;
+                    if (props.location !== 'NonStreamableGameItem') {
+                        if ('productId' in props) {
+                            productId = props.productId;
+                        } else {
+                            // Search page
+                            productId = props.children.props.productId;
+                        }
+                    }
+                }
+            } catch (e) {}
+
+            productId && GameTile.requestWaitTime($elm, productId);
+        });
+    }
+}
--- a/src/modules/ui/global-settings.ts
+++ b/src/modules/ui/global-settings.ts
@ -7,11 +7,15 @@ import { getPref, Preferences, PrefKey, setPref, toPrefElement } from "@utils/pr
 import { t, Translations } from "@utils/translation";
 import { PatcherCache } from "../patcher";
 import { UserAgentProfile } from "@enums/user-agent";
+import { BX_FLAGS } from "@/utils/bx-flags";
+import { BxSelectElement } from "@/web-components/bx-select";
+import { StreamSettings } from "../stream/stream-settings";

 const SETTINGS_UI = {
    'Better xCloud': {
        items: [
            PrefKey.BETTER_XCLOUD_LOCALE,
+            PrefKey.SERVER_BYPASS_RESTRICTION,
            PrefKey.REMOTE_PLAY_ENABLED,
        ],
    },
@ -63,8 +67,8 @@ const SETTINGS_UI = {
    },

    [t('touch-controller')]: {
-        note: !STATES.userAgentHasTouchSupport ? '⚠️ ' + t('device-unsupported-touch') : null,
-        unsupported: !STATES.userAgentHasTouchSupport,
+        note: !STATES.userAgent.capabilities.touch ? '⚠️ ' + t('device-unsupported-touch') : null,
+        unsupported: !STATES.userAgent.capabilities.touch,
        items: [
            PrefKey.STREAM_TOUCH_CONTROLLER,
            PrefKey.STREAM_TOUCH_CONTROLLER_AUTO_OFF,
@ -86,17 +90,20 @@ const SETTINGS_UI = {
        items: [
            PrefKey.UI_LAYOUT,
            PrefKey.UI_HOME_CONTEXT_MENU_DISABLED,
+            PrefKey.UI_GAME_CARD_SHOW_WAIT_TIME,
+            PrefKey.CONTROLLER_SHOW_CONNECTION_STATUS,
            PrefKey.STREAM_SIMPLIFY_MENU,
            PrefKey.SKIP_SPLASH_VIDEO,
            !AppInterface && PrefKey.UI_SCROLLBAR_HIDE,
            PrefKey.HIDE_DOTS_ICON,
            PrefKey.REDUCE_ANIMATIONS,
+            PrefKey.BLOCK_SOCIAL_FEATURES,
+            PrefKey.UI_HIDE_SECTIONS,
        ],
    },

    [t('other')]: {
        items: [
-            PrefKey.BLOCK_SOCIAL_FEATURES,
            PrefKey.BLOCK_TRACKING,
        ],
    },
@ -121,19 +128,18 @@ export function setupSettingsUi() {
    let $btnReload: HTMLButtonElement;

    // Setup Settings UI
-    const $container = CE<HTMLElement>('div', {
+    const $container = CE('div', {
        'class': 'bx-settings-container bx-gone',
    });

-    let $updateAvailable;
-
-    const $wrapper = CE<HTMLElement>('div', {'class': 'bx-settings-wrapper'},
-            CE<HTMLElement>('div', {'class': 'bx-settings-title-wrapper'},
-                CE('a', {
-                    'class': 'bx-settings-title',
-                    'href': 'https://github.com/redphx/better-xcloud/releases',
-                    'target': '_blank',
-                }, 'Better xCloud ' + SCRIPT_VERSION),
+    const $wrapper = CE('div', {'class': 'bx-settings-wrapper'},
+            CE('div', {'class': 'bx-settings-title-wrapper'},
+                createButton({
+                    classes: ['bx-settings-title'],
+                    style: ButtonStyle.FOCUSABLE | ButtonStyle.GHOST,
+                    label: 'Better xCloud ' + SCRIPT_VERSION,
+                    url: 'https://github.com/redphx/better-xcloud/releases',
+                }),
                createButton({
                    icon: BxIcon.QUESTION,
                    style: ButtonStyle.FOCUSABLE,
@ -142,46 +148,61 @@ export function setupSettingsUi() {
                }),
            )
        );
-    $updateAvailable = CE('a', {
-        'class': 'bx-settings-update bx-gone',
-        'href': 'https://github.com/redphx/better-xcloud/releases/latest',
-        'target': '_blank',
-    });

-    $wrapper.appendChild($updateAvailable);
+    const topButtons = [];

-    // Show new version indicator
+    // "New version available" button
    if (!SCRIPT_VERSION.includes('beta') && PREF_LATEST_VERSION && PREF_LATEST_VERSION != SCRIPT_VERSION) {
-        $updateAvailable.textContent = `🌟 Version ${PREF_LATEST_VERSION} available`;
-        $updateAvailable.classList.remove('bx-gone');
+        // Show new version indicator
+        topButtons.push(createButton({
+            label: `🌟 Version ${PREF_LATEST_VERSION} available`,
+            style: ButtonStyle.PRIMARY | ButtonStyle.FOCUSABLE | ButtonStyle.FULL_WIDTH,
+            url: 'https://github.com/redphx/better-xcloud/releases/latest',
+        }));
    }

+    // "Stream settings" button
+    topButtons.push(createButton({
+        label: t('stream-settings'),
+        icon: BxIcon.STREAM_SETTINGS,
+        style: ButtonStyle.FULL_WIDTH | ButtonStyle.FOCUSABLE,
+        onClick: e => {
+            StreamSettings.getInstance().show();
+        },
+    }));
+
+    // Buttons for Android app
    if (AppInterface) {
        // Show Android app settings button
-        const $btn = createButton({
+        topButtons.push(createButton({
            label: t('android-app-settings'),
            icon: BxIcon.STREAM_SETTINGS,
            style: ButtonStyle.FULL_WIDTH | ButtonStyle.FOCUSABLE,
            onClick: e => {
                AppInterface.openAppSettings && AppInterface.openAppSettings();
            },
-        });
-
-        $wrapper.appendChild($btn);
+        }));
    } else {
        // Show link to Android app
        const userAgent = UserAgent.getDefault().toLowerCase();
        if (userAgent.includes('android')) {
-            const $btn = createButton({
+            topButtons.push(createButton({
                label: '🔥 ' + t('install-android'),
                style: ButtonStyle.FULL_WIDTH | ButtonStyle.FOCUSABLE,
                url: 'https://better-xcloud.github.io/android',
-            });
-
-            $wrapper.appendChild($btn);
+            }));
        }
    }

+    if (topButtons.length) {
+        const $div = CE('div', {class: 'bx-top-buttons'});
+        for (const $button of topButtons) {
+            $div.appendChild($button);
+        }
+
+        $wrapper.appendChild($div);
+    }
+
    const onChange = async (e: Event) => {
        // Clear PatcherCache;
        PatcherCache.clear();
@ -197,8 +218,11 @@ export function setupSettingsUi() {
            Translations.refreshCurrentLocale();
            await Translations.updateTranslations();

-            $btnReload.textContent = t('settings-reloading');
-            $btnReload.click();
+            // Don't refresh the page on TV
+            if (BX_FLAGS.ScriptUi !== 'tv') {
+                $btnReload.textContent = t('settings-reloading');
+                $btnReload.click();
+            }
        }
    };

@ -238,9 +262,9 @@ export function setupSettingsUi() {
            if (setting.experimental) {
                settingLabel = '🧪 ' + settingLabel;
                if (!settingNote) {
-                    settingNote = t('experimental')
+                    settingNote = t('experimental');
                } else {
-                    settingNote = `${t('experimental')}: ${settingNote}`
+                    settingNote = `${t('experimental')}: ${settingNote}`;
                }
            }

@ -258,7 +282,7 @@ export function setupSettingsUi() {
                    placeholder: defaultUserAgent,
                    'class': 'bx-settings-custom-user-agent',
                });
-                $inpCustomUserAgent.addEventListener('change', e => {
+                $inpCustomUserAgent.addEventListener('input', e => {
                    const profile = $control.value;
                    const custom = (e.target as HTMLInputElement).value.trim();

@ -289,7 +313,7 @@ export function setupSettingsUi() {
                    });
                $control.name = $control.id;

-                $control.addEventListener('change', (e: Event) => {
+                $control.addEventListener('input', (e: Event) => {
                    setPref(settingId, (e.target as HTMLSelectElement).value);
                    onChange(e);
                });
@ -321,6 +345,8 @@ export function setupSettingsUi() {
                    $control.appendChild($option);
                }

+                $control.disabled = Object.keys(STATES.serverRegions).length === 0;
+
                // Select preferred region
                $control.value = selectedValue;
            } else {
@ -354,10 +380,20 @@ export function setupSettingsUi() {
            if (settingNote) {
                $label.appendChild(CE('b', {}, settingNote));
            }
-            const $elm = CE<HTMLElement>('div', {'class': 'bx-settings-row'},
+
+            let $elm: HTMLElement;
+
+            if ($control instanceof HTMLSelectElement && BX_FLAGS.ScriptUi === 'tv') {
+                $elm = CE('div', {'class': 'bx-settings-row'},
+                    $label,
+                    BxSelectElement.wrap($control),
+                );
+            } else {
+                $elm = CE('div', {'class': 'bx-settings-row'},
                    $label,
                    $control,
                );
+            }

            $wrapper.appendChild($elm);

@ -366,7 +402,7 @@ export function setupSettingsUi() {
                $wrapper.appendChild($inpCustomUserAgent!);
                // Trigger 'change' event
                $control.disabled = true;
-                $control.dispatchEvent(new Event('change'));
+                $control.dispatchEvent(new Event('input'));
                $control.disabled = false;
            }
        }
@ -400,7 +436,7 @@ export function setupSettingsUi() {
    try {
        const appVersion = (document.querySelector('meta[name=gamepass-app-version]') as HTMLMetaElement).content;
        const appDate = new Date((document.querySelector('meta[name=gamepass-app-date]') as HTMLMetaElement).content).toISOString().substring(0, 10);
-        $wrapper.appendChild(CE<HTMLElement>('div', {'class': 'bx-settings-app-version'}, `xCloud website version ${appVersion} (${appDate})`));
+        $wrapper.appendChild(CE('div', {'class': 'bx-settings-app-version'}, `xCloud website version ${appVersion} (${appDate})`));
    } catch (e) {}

    $container.appendChild($wrapper);
--- a/src/modules/ui/guide-menu.ts
+++ b/src/modules/ui/guide-menu.ts
@ -1,33 +1,97 @@
 import { BxEvent } from "@/utils/bx-event";
 import { AppInterface, STATES } from "@/utils/global";
-import { createButton, ButtonStyle } from "@/utils/html";
+import { createButton, ButtonStyle, CE } from "@/utils/html";
 import { t } from "@/utils/translation";
+import { StreamSettings } from "../stream/stream-settings";

 export enum GuideMenuTab {
    HOME,
 }

 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]');
        if (!$dividers) {
            return;
        }
-        const $lastDivider = $dividers[$dividers.length - 1];

-        // Add "Close app" button
+        const buttons: HTMLElement[] = [];
+
+        // "Stream settings" button
+        buttons.push(GuideMenu.#BUTTONS.streamSetting);
+
+        // "App settings" & "Close app" buttons
        if (AppInterface) {
-            const $btnQuit = createButton({
-                label: t('close-app'),
-                style: ButtonStyle.FULL_WIDTH | ButtonStyle.FOCUSABLE | ButtonStyle.DANGER,
-                onClick: e => {
-                    AppInterface.closeApp();
-                },
-            });
-
-            $lastDivider.insertAdjacentElement('afterend', $btnQuit);
+            buttons.push(GuideMenu.#BUTTONS.appSettings);
+            buttons.push(GuideMenu.#BUTTONS.closeApp);
        }
+
+        const $buttons = GuideMenu.#renderButtons(buttons);
+
+        const $lastDivider = $dividers[$dividers.length - 1];
+        $lastDivider.insertAdjacentElement('afterend', $buttons);
    }

    static #injectHomePlaying($root: HTMLElement) {
@ -36,25 +100,19 @@ 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);
+        // Reload stream
+        buttons.push(GuideMenu.#BUTTONS.reloadStream);
+
+        // Back to home
+        buttons.push(GuideMenu.#BUTTONS.backToHome);
+
+        const $buttons = GuideMenu.#renderButtons(buttons);
+        $btnQuit.insertAdjacentElement('afterend', $buttons);

        // Hide xCloud's Home button
        const $btnXcloudHome = $root.querySelector('div[class^=HomeButtonWithDivider]') as HTMLElement;
@ -65,11 +123,13 @@ export class GuideMenu {
        const where = (e as any).where as GuideMenuTab;

        if (where === GuideMenuTab.HOME) {
-            const $root = document.querySelector('#gamepass-dialog-root div[role=dialog]') as HTMLElement;
-            if (STATES.isPlaying) {
-                GuideMenu.#injectHomePlaying($root);
-            } else {
-                GuideMenu.#injectHome($root);
+            const $root = document.querySelector('#gamepass-dialog-root div[role=dialog] div[role=tabpanel] div[class*=HomeLandingPage]') as HTMLElement;
+            if ($root) {
+                if (STATES.isPlaying) {
+                    GuideMenu.#injectHomePlaying($root);
+                } else {
+                    GuideMenu.#injectHome($root);
+                }
            }
        }
    }
--- 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 } from "@utils/html";
+import { createButton, ButtonStyle, CE } from "@utils/html";
 import { BxIcon } from "@utils/bx-icon";
 import { getPreferredServerRegion } from "@utils/region";
 import { PrefKey, getPref } from "@utils/preferences";
@ -7,35 +7,20 @@ import { RemotePlay } from "@modules/remote-play";
 import { t } from "@utils/translation";
 import { setupSettingsUi } from "./global-settings";

+export class HeaderSection {
+    static #$remotePlayBtn = createButton({
+        classes: ['bx-header-remote-play-button', 'bx-gone'],
+        icon: BxIcon.REMOTE_PLAY,
+        title: t('remote-play'),
+        style: ButtonStyle.GHOST | ButtonStyle.FOCUSABLE,
+        onClick: e => {
+            RemotePlay.togglePopup();
+        },
+    });

-function injectSettingsButton($parent?: HTMLElement) {
-    if (!$parent) {
-        return;
-    }
-
-    const PREF_PREFERRED_REGION = getPreferredServerRegion(true);
-    const PREF_LATEST_VERSION = getPref(PrefKey.LATEST_VERSION);
-
-    const $headerFragment = document.createDocumentFragment();
-
-    // Remote Play button
-    if (getPref(PrefKey.REMOTE_PLAY_ENABLED)) {
-        const $remotePlayBtn = createButton({
-            classes: ['bx-header-remote-play-button'],
-            icon: BxIcon.REMOTE_PLAY,
-            title: t('remote-play'),
-            style: ButtonStyle.GHOST | ButtonStyle.FOCUSABLE,
-            onClick: e => {
-                RemotePlay.togglePopup();
-            },
-        });
-        $headerFragment.appendChild($remotePlayBtn);
-    }
-
-    // Setup Settings button
-    const $settingsBtn = createButton({
+    static #$settingsBtn = createButton({
        classes: ['bx-header-settings-button'],
-        label: PREF_PREFERRED_REGION,
+        label: '???',
        style: ButtonStyle.GHOST | ButtonStyle.FOCUSABLE | ButtonStyle.FULL_HEIGHT,
        onClick: e => {
            setupSettingsUi();
@ -47,39 +32,58 @@ function injectSettingsButton($parent?: HTMLElement) {
        },
    });

-    // Show new update status
-    if (!SCRIPT_VERSION.includes('beta') && PREF_LATEST_VERSION && PREF_LATEST_VERSION !== SCRIPT_VERSION) {
-        $settingsBtn.setAttribute('data-update-available', 'true');
+    static #$buttonsWrapper = CE('div', {},
+        getPref(PrefKey.REMOTE_PLAY_ENABLED) ? HeaderSection.#$remotePlayBtn : null,
+        HeaderSection.#$settingsBtn,
+    );
+
+    static #observer: MutationObserver;
+    static #timeout: number | null;
+
+    static #injectSettingsButton($parent?: HTMLElement) {
+        if (!$parent) {
+            return;
+        }
+
+        const PREF_LATEST_VERSION = getPref(PrefKey.LATEST_VERSION);
+
+        // Setup Settings button
+        const $settingsBtn = HeaderSection.#$settingsBtn;
+        $settingsBtn.querySelector('span')!.textContent = getPreferredServerRegion(true);
+
+        // Show new update status
+        if (!SCRIPT_VERSION.includes('beta') && PREF_LATEST_VERSION && PREF_LATEST_VERSION !== SCRIPT_VERSION) {
+            $settingsBtn.setAttribute('data-update-available', 'true');
+        }
+
+        // Add the Settings button to the web page
+        $parent.appendChild(HeaderSection.#$buttonsWrapper);
    }

-    // Add the Settings button to the web page
-    $headerFragment.appendChild($settingsBtn);
-    $parent.appendChild($headerFragment);
-}
-
-
-export function checkHeader() {
-    const $button = document.querySelector('.bx-header-settings-button');
-
-    if (!$button) {
-        const $rightHeader = document.querySelector('#PageContent div[class*=EdgewaterHeader-module__rightSectionSpacing]');
-        injectSettingsButton($rightHeader as HTMLElement);
-    }
-}
-
-
-export function watchHeader() {
-    const $header = document.querySelector('#PageContent header');
-    if (!$header) {
-        return;
+    static checkHeader() {
+        if (!HeaderSection.#$buttonsWrapper.isConnected) {
+            const $rightHeader = document.querySelector('#PageContent div[class*=EdgewaterHeader-module__rightSectionSpacing]');
+            HeaderSection.#injectSettingsButton($rightHeader as HTMLElement);
+        }
    }

-    let timeout: number | null;
-    const observer = new MutationObserver(mutationList => {
-        timeout && clearTimeout(timeout);
-        timeout = window.setTimeout(checkHeader, 2000);
-    });
-    observer.observe($header, {subtree: true, childList: true});
+    static showRemotePlayButton() {
+        HeaderSection.#$remotePlayBtn.classList.remove('bx-gone');
+    }

-    checkHeader();
+    static watchHeader() {
+        const $header = document.querySelector('#PageContent header');
+        if (!$header) {
+            return;
+        }
+
+        HeaderSection.#observer && HeaderSection.#observer.disconnect();
+        HeaderSection.#observer = new MutationObserver(mutationList => {
+            HeaderSection.#timeout && clearTimeout(HeaderSection.#timeout);
+            HeaderSection.#timeout = window.setTimeout(HeaderSection.checkHeader, 2000);
+        });
+        HeaderSection.#observer.observe($header, {subtree: true, childList: true});
+
+        HeaderSection.checkHeader();
+    }
 }
--- a/src/modules/ui/ui.ts
+++ b/src/modules/ui/ui.ts
@ -1,20 +1,6 @@
-import { AppInterface, STATES } from "@utils/global";
-import { CE, createButton, ButtonStyle, createSvgIcon } from "@utils/html";
-import { BxIcon } from "@utils/bx-icon";
-import { BxEvent } from "@utils/bx-event";
-import { MkbRemapper } from "@modules/mkb/mkb-remapper";
-import { getPref, Preferences, PrefKey, setPref, toPrefElement } from "@utils/preferences";
-import { StreamStats } from "@modules/stream/stream-stats";
-import { TouchController } from "@modules/touch-controller";
-import { t } from "@utils/translation";
-import { VibrationManager } from "@modules/vibration-manager";
-import { Screenshot } from "@/utils/screenshot";
-import { ControllerShortcut } from "../controller-shortcut";
-import { SoundShortcut } from "../shortcuts/shortcut-sound";
-import { NativeMkbHandler } from "../mkb/native-mkb-handler";
-import { UserAgent } from "@/utils/user-agent";
-import type { StreamPlayerOptions } from "../stream-player";
-import { StreamPlayerType, StreamVideoProcessing } from "@enums/stream-player";
+import { CE } from "@utils/html";
+import { onChangeVideoPlayerType } from "../stream/stream-settings-utils";
+import { StreamSettings } from "../stream/stream-settings";


 export function localRedirect(path: string) {
@ -40,451 +26,10 @@ export function localRedirect(path: string) {
    $anchor.click();
 }

-function setupStreamSettingsDialog() {
-    const SETTINGS_UI = [
-        {
-            icon: BxIcon.DISPLAY,
-            group: 'stream',
-            items: [
-                {
-                    group: 'audio',
-                    label: t('audio'),
-                    help_url: 'https://better-xcloud.github.io/ingame-features/#audio',
-                    items: [
-                        {
-                            pref: PrefKey.AUDIO_VOLUME,
-                            onChange: (e: any, value: number) => {
-                                SoundShortcut.setGainNodeVolume(value);
-                            },
-                            params: {
-                                disabled: !getPref(PrefKey.AUDIO_ENABLE_VOLUME_CONTROL),
-                            },
-                            onMounted: ($elm: HTMLElement) => {
-                                const $range = $elm.querySelector('input[type=range') as HTMLInputElement;
-                                window.addEventListener(BxEvent.GAINNODE_VOLUME_CHANGED, e => {
-                                    $range.value = (e as any).volume;
-                                    BxEvent.dispatch($range, 'input', {
-                                            ignoreOnChange: true,
-                                        });
-                                });
-                            },
-                        },
-                    ],
-                },
-
-                {
-                    group: 'video',
-                    label: t('video'),
-                    help_url: 'https://better-xcloud.github.io/ingame-features/#video',
-                    items: [
-                        {
-                            pref: PrefKey.VIDEO_PLAYER_TYPE,
-                            onChange: onChangeVideoPlayerType,
-                        },
-
-                        {
-                            pref: PrefKey.VIDEO_RATIO,
-                            onChange: updateVideoPlayer,
-                        },
-
-                        {
-                            pref: PrefKey.VIDEO_PROCESSING,
-                            onChange: updateVideoPlayer,
-                        },
-
-                        {
-                            pref: PrefKey.VIDEO_SHARPNESS,
-                            onChange: updateVideoPlayer,
-                        },
-
-                        {
-                            pref: PrefKey.VIDEO_SATURATION,
-                            onChange: updateVideoPlayer,
-                        },
-
-                        {
-                            pref: PrefKey.VIDEO_CONTRAST,
-                            onChange: updateVideoPlayer,
-                        },
-
-                        {
-                            pref: PrefKey.VIDEO_BRIGHTNESS,
-                            onChange: updateVideoPlayer,
-                        },
-                    ],
-                },
-            ],
-        },
-
-        {
-            icon: BxIcon.CONTROLLER,
-            group: 'controller',
-            items: [
-                {
-                    group: 'controller',
-                    label: t('controller'),
-                    help_url: 'https://better-xcloud.github.io/ingame-features/#controller',
-                    items: [
-                        {
-                            pref: PrefKey.CONTROLLER_ENABLE_VIBRATION,
-                            unsupported: !VibrationManager.supportControllerVibration(),
-                            onChange: () => VibrationManager.updateGlobalVars(),
-                        },
-
-                        {
-                            pref: PrefKey.CONTROLLER_DEVICE_VIBRATION,
-                            unsupported: !VibrationManager.supportDeviceVibration(),
-                            onChange: () => VibrationManager.updateGlobalVars(),
-                        },
-
-                        (VibrationManager.supportControllerVibration() || VibrationManager.supportDeviceVibration()) && {
-                            pref: PrefKey.CONTROLLER_VIBRATION_INTENSITY,
-                            unsupported: !VibrationManager.supportDeviceVibration(),
-                            onChange: () => VibrationManager.updateGlobalVars(),
-                        },
-                    ],
-                },
-
-                STATES.userAgentHasTouchSupport && {
-                    group: 'touch-controller',
-                    label: t('touch-controller'),
-                    items: [
-                        {
-                            label: t('layout'),
-                            content: CE('select', {disabled: true}, CE('option', {}, t('default'))),
-                            onMounted: ($elm: HTMLSelectElement) => {
-                                $elm.addEventListener('change', e => {
-                                    TouchController.loadCustomLayout(STATES.currentStream?.xboxTitleId!, $elm.value, 1000);
-                                });
-
-                                window.addEventListener(BxEvent.CUSTOM_TOUCH_LAYOUTS_LOADED, e => {
-                                    const data = (e as any).data;
-
-                                    if (STATES.currentStream?.xboxTitleId && ($elm as any).xboxTitleId === STATES.currentStream?.xboxTitleId) {
-                                        $elm.dispatchEvent(new Event('change'));
-                                        return;
-                                    }
-
-                                    ($elm as any).xboxTitleId = STATES.currentStream?.xboxTitleId;
-
-                                    // Clear options
-                                    while ($elm.firstChild) {
-                                        $elm.removeChild($elm.firstChild);
-                                    }
-
-                                    $elm.disabled = !data;
-                                    if (!data) {
-                                        $elm.appendChild(CE('option', {value: ''}, t('default')));
-                                        $elm.value = '';
-                                        $elm.dispatchEvent(new Event('change'));
-                                        return;
-                                    }
-
-                                    // Add options
-                                    const $fragment = document.createDocumentFragment();
-                                    for (const key in data.layouts) {
-                                        const layout = data.layouts[key];
-
-                                        let name;
-                                        if (layout.author) {
-                                            name = `${layout.name} (${layout.author})`;
-                                        } else {
-                                            name = layout.name;
-                                        }
-
-                                        const $option = CE('option', {value: key}, name);
-                                        $fragment.appendChild($option);
-                                    }
-
-                                    $elm.appendChild($fragment);
-                                    $elm.value = data.default_layout;
-                                    $elm.dispatchEvent(new Event('change'));
-                                });
-                            },
-                        },
-                    ],
-                }
-            ],
-        },
-
-        getPref(PrefKey.MKB_ENABLED) && {
-            icon: BxIcon.VIRTUAL_CONTROLLER,
-            group: 'mkb',
-            items: [
-                {
-                    group: 'mkb',
-                    label: t('virtual-controller'),
-                    help_url: 'https://better-xcloud.github.io/mouse-and-keyboard/',
-                    content: MkbRemapper.INSTANCE.render(),
-                },
-            ],
-        },
-
-        AppInterface && getPref(PrefKey.NATIVE_MKB_ENABLED) === 'on' && {
-            icon: BxIcon.NATIVE_MKB,
-            group: 'native-mkb',
-            items: [
-                {
-                    group: 'native-mkb',
-                    label: t('native-mkb'),
-                    items: [
-                        {
-                            pref: PrefKey.NATIVE_MKB_SCROLL_VERTICAL_SENSITIVITY,
-                            onChange: (e: any, value: number) => {
-                                NativeMkbHandler.getInstance().setVerticalScrollMultiplier(value / 100);
-                            },
-                        },
-                        {
-                            pref: PrefKey.NATIVE_MKB_SCROLL_HORIZONTAL_SENSITIVITY,
-                            onChange: (e: any, value: number) => {
-                                NativeMkbHandler.getInstance().setHorizontalScrollMultiplier(value / 100);
-                            },
-                        },
-                    ],
-                },
-            ],
-        },
-
-        {
-            icon: BxIcon.COMMAND,
-            group: 'shortcuts',
-            items: [
-                {
-                    group: 'shortcuts_controller',
-                    label: t('controller-shortcuts'),
-                    content: ControllerShortcut.renderSettings(),
-                },
-            ],
-        },
-
-        {
-            icon: BxIcon.STREAM_STATS,
-            group: 'stats',
-            items: [
-                {
-                    group: 'stats',
-                    label: t('stream-stats'),
-                    help_url: 'https://better-xcloud.github.io/stream-stats/',
-                    items: [
-                        {
-                            pref: PrefKey.STATS_SHOW_WHEN_PLAYING,
-                        },
-                        {
-                            pref: PrefKey.STATS_QUICK_GLANCE,
-                            onChange: (e: InputEvent) => {
-                                const streamStats = StreamStats.getInstance();
-                                (e.target! as HTMLInputElement).checked ? streamStats.quickGlanceSetup() : streamStats.quickGlanceStop();
-                            },
-                        },
-                        {
-                            pref: PrefKey.STATS_ITEMS,
-                            onChange: StreamStats.refreshStyles,
-                        },
-                        {
-                            pref: PrefKey.STATS_POSITION,
-                            onChange: StreamStats.refreshStyles,
-                        },
-                        {
-                            pref: PrefKey.STATS_TEXT_SIZE,
-                            onChange: StreamStats.refreshStyles,
-                        },
-                        {
-                            pref: PrefKey.STATS_OPACITY,
-                            onChange: StreamStats.refreshStyles,
-                        },
-                        {
-                            pref: PrefKey.STATS_TRANSPARENT,
-                            onChange: StreamStats.refreshStyles,
-                        },
-                        {
-                            pref: PrefKey.STATS_CONDITIONAL_FORMATTING,
-                            onChange: StreamStats.refreshStyles,
-                        },
-                    ],
-                },
-            ],
-        },
-    ];
-
-    let $tabs: HTMLElement;
-    let $settings: HTMLElement;
-
-    const $wrapper = CE<HTMLElement>('div', {'class': 'bx-stream-settings-dialog bx-gone'},
-            $tabs = CE<HTMLElement>('div', {'class': 'bx-stream-settings-tabs'}),
-            $settings = CE<HTMLElement>('div', {'class': 'bx-stream-settings-tab-contents'}),
-        );
-
-    for (const settingTab of SETTINGS_UI) {
-        if (!settingTab) {
-            continue;
-        }
-
-        const $svg = createSvgIcon(settingTab.icon);
-        $svg.addEventListener('click', e => {
-            // Switch tab
-            for (const $child of Array.from($settings.children)) {
-                if ($child.getAttribute('data-group') === settingTab.group) {
-                    $child.classList.remove('bx-gone');
-                } else {
-                    $child.classList.add('bx-gone');
-                }
-            }
-
-            // Highlight current tab button
-            for (const $child of Array.from($tabs.children)) {
-                $child.classList.remove('bx-active');
-            }
-
-            $svg.classList.add('bx-active');
-        });
-
-        $tabs.appendChild($svg);
-
-        const $group = CE<HTMLElement>('div', {'data-group': settingTab.group, 'class': 'bx-gone'});
-
-        for (const settingGroup of settingTab.items) {
-            if (!settingGroup) {
-                continue;
-            }
-
-            $group.appendChild(CE('h2', {},
-                    CE('span', {}, settingGroup.label),
-                    settingGroup.help_url && createButton({
-                            icon: BxIcon.QUESTION,
-                            style: ButtonStyle.GHOST,
-                            url: settingGroup.help_url,
-                            title: t('help'),
-                        }),
-                ));
-            if (settingGroup.note) {
-                if (typeof settingGroup.note === 'string') {
-                    settingGroup.note = document.createTextNode(settingGroup.note);
-                }
-                $group.appendChild(settingGroup.note);
-            }
-
-            if (settingGroup.content) {
-                $group.appendChild(settingGroup.content);
-                continue;
-            }
-
-            if (!settingGroup.items) {
-                settingGroup.items = [];
-            }
-
-            for (const setting of settingGroup.items) {
-                if (!setting) {
-                    continue;
-                }
-
-                const pref = setting.pref;
-
-                let $control;
-                if (setting.content) {
-                    $control = setting.content;
-                } else if (!setting.unsupported) {
-                    $control = toPrefElement(pref, setting.onChange, setting.params);
-                }
-
-                const label = Preferences.SETTINGS[pref as PrefKey]?.label || setting.label;
-                const note = Preferences.SETTINGS[pref as PrefKey]?.note || setting.note;
-
-                const $content = CE('div', {'class': 'bx-stream-settings-row', 'data-type': settingGroup.group},
-                    CE('label', {for: `bx_setting_${pref}`},
-                        label,
-                        note && CE('div', {'class': 'bx-stream-settings-dialog-note'}, note),
-                        setting.unsupported && CE('div', {'class': 'bx-stream-settings-dialog-note'}, t('browser-unsupported-feature')),
-                    ),
-                    !setting.unsupported && $control,
-                );
-
-                $group.appendChild($content);
-
-                setting.onMounted && setting.onMounted($control);
-            }
-        }
-
-        $settings.appendChild($group);
-    }
-
-    // Select first tab
-    $tabs.firstElementChild!.dispatchEvent(new Event('click'));
-
-    document.documentElement.appendChild($wrapper);
-}
-
-
-function onChangeVideoPlayerType() {
-    const playerType = getPref(PrefKey.VIDEO_PLAYER_TYPE);
-    const $videoProcessing = document.getElementById('bx_setting_video_processing') as HTMLSelectElement;
-    const $videoSharpness = document.getElementById('bx_setting_video_sharpness') as HTMLElement;
-
-    let isDisabled = false;
-
-    if (playerType === StreamPlayerType.WEBGL2) {
-        ($videoProcessing.querySelector(`option[value=${StreamVideoProcessing.CAS}]`) as HTMLOptionElement).disabled = false;
-    } else {
-        // Only allow USM when player type is Video
-        $videoProcessing.value = StreamVideoProcessing.USM;
-        setPref(PrefKey.VIDEO_PROCESSING, StreamVideoProcessing.USM);
-
-        ($videoProcessing.querySelector(`option[value=${StreamVideoProcessing.CAS}]`) as HTMLOptionElement).disabled = true;
-
-        if (UserAgent.isSafari()) {
-            isDisabled = true;
-        }
-    }
-
-    $videoProcessing.disabled = isDisabled;
-    $videoSharpness.dataset.disabled = isDisabled.toString();
-
-    updateVideoPlayer();
-}
-
-
-export function updateVideoPlayer() {
-    const streamPlayer = STATES.currentStream.streamPlayer;
-    if (!streamPlayer) {
-        return;
-    }
-
-    const options = {
-        processing: getPref(PrefKey.VIDEO_PROCESSING),
-        sharpness: getPref(PrefKey.VIDEO_SHARPNESS),
-        saturation: getPref(PrefKey.VIDEO_SATURATION),
-        contrast: getPref(PrefKey.VIDEO_CONTRAST),
-        brightness: getPref(PrefKey.VIDEO_BRIGHTNESS),
-    } satisfies StreamPlayerOptions;
-
-    streamPlayer.setPlayerType(getPref(PrefKey.VIDEO_PLAYER_TYPE));
-    streamPlayer.updateOptions(options);
-    streamPlayer.refreshPlayer();
-}
-
-
-function preloadFonts() {
-    const $link = CE<HTMLLinkElement>('link', {
-            rel: 'preload',
-            href: 'https://redphx.github.io/better-xcloud/fonts/promptfont.otf',
-            as: 'font',
-            type: 'font/otf',
-            crossorigin: '',
-        });
-
-    document.querySelector('head')?.appendChild($link);
-}
-
-
 export function setupStreamUi() {
-    // Prevent initializing multiple times
-    if (!document.querySelector('.bx-stream-settings-dialog')) {
-        preloadFonts();
-
-        window.addEventListener('resize', updateVideoPlayer);
-        setupStreamSettingsDialog();
-
-        Screenshot.setup();
-    }
-
+    StreamSettings.getInstance();
    onChangeVideoPlayerType();
 }
+
+
+(window as any).localRedirect = localRedirect;
--- a/src/types/index.d.ts
+++ b/src/types/index.d.ts
@ -24,12 +24,28 @@ interface NavigatorBattery extends Navigator {
 }

 type BxStates = {
+    supportedRegion: boolean;
+    serverRegions: any;
+    selectedRegion: any;
+    gsToken: string;
+
+
    isPlaying: boolean;
    appContext: any | null;
-    serverRegions: any;

-    userAgentHasTouchSupport: boolean;
-    browserHasTouchSupport: boolean;
+    browser: {
+        capabilities: {
+            touch: boolean;
+            batteryApi: boolean;
+        };
+    };
+
+    userAgent: {
+        isTv: boolean;
+        capabilities: {
+            touch: boolean;
+        };
+    };

    currentStream: Partial<{
        titleId: string;
@ -58,6 +74,8 @@ type BxStates = {
 type DualEnum = {[index: string]: number} & {[index: number]: string};

 type XcloudTitleInfo = {
+    titleId: string,
+
    details: {
        productId: string;
        supportedInputTypes: InputType[];
@ -75,6 +93,12 @@ type XcloudTitleInfo = {
    };
 };

+type XcloudWaitTimeInfo = Partial<{
+    estimatedAllocationTimeInSeconds: number,
+    estimatedProvisioningTimeInSeconds: number,
+    estimatedTotalWaitTimeInSeconds: number,
+}>;
+
 declare module '*.js';
 declare module '*.svg';
 declare module '*.styl';
--- a/src/utils/bx-event.ts
+++ b/src/utils/bx-event.ts
@ -26,6 +26,7 @@ export enum BxEvent {
    REMOTE_PLAY_FAILED = 'bx-remote-play-failed',

    XCLOUD_SERVERS_READY = 'bx-servers-ready',
+    XCLOUD_SERVERS_UNAVAILABLE = 'bx-servers-unavailable',

    DATA_CHANNEL_CREATED = 'bx-data-channel-created',

@ -38,6 +39,8 @@ export enum BxEvent {
    POINTER_LOCK_REQUESTED = 'bx-pointer-lock-requested',
    POINTER_LOCK_EXITED = 'bx-pointer-lock-exited',

+    NAVIGATION_FOCUS_CHANGED = 'bx-nav-focus-changed',
+
    // xCloud Dialog events
    XCLOUD_DIALOG_SHOWN = 'bx-xcloud-dialog-shown',
    XCLOUD_DIALOG_DISMISSED = 'bx-xcloud-dialog-dismissed',
--- a/src/utils/bx-exposed.ts
+++ b/src/utils/bx-exposed.ts
@ -1,6 +1,6 @@
 import { ControllerShortcut } from "@/modules/controller-shortcut";
 import { BxEvent } from "@utils/bx-event";
-import { STATES } from "@utils/global";
+import { deepClone, STATES } from "@utils/global";
 import { getPref, PrefKey } from "@utils/preferences";
 import { BxLogger } from "./bx-logger";
 import { BX_FLAGS } from "./bx-flags";
@ -19,7 +19,7 @@ export const BxExposed = {

    modifyTitleInfo: (titleInfo: XcloudTitleInfo): XcloudTitleInfo => {
        // Clone the object since the original is read-only
-        titleInfo = structuredClone(titleInfo);
+        titleInfo = deepClone(titleInfo);

        let supportedInputTypes = titleInfo.details.supportedInputTypes;

@ -34,7 +34,7 @@ export const BxExposed = {

        titleInfo.details.hasMkbSupport = supportedInputTypes.includes(InputType.MKB);

-        if (STATES.userAgentHasTouchSupport) {
+        if (STATES.userAgent.capabilities.touch) {
            let touchControllerAvailability = getPref(PrefKey.STREAM_TOUCH_CONTROLLER);

            // Disable touch control when gamepad found
@ -109,4 +109,10 @@ export const BxExposed = {

    handleControllerShortcut: ControllerShortcut.handle,
    resetControllerShortcut: ControllerShortcut.reset,
+
+    overrideSettings: {
+        'Tv_settings': {
+            hasCompletedOnboarding: true,
+        },
+    },
 };
--- a/src/utils/bx-flags.ts
+++ b/src/utils/bx-flags.ts
@ -9,6 +9,10 @@ type BxFlags = Partial<{

    ForceNativeMkbTitles: string[];
    FeatureGates: {[key: string]: boolean} | null,
+
+    ScriptUi: 'default' | 'tv',
+
+    IsSupportedTvBrowser: boolean,
 }>

 // Setup flags
@ -23,6 +27,8 @@ const DEFAULT_FLAGS: BxFlags = {

    ForceNativeMkbTitles: [],
    FeatureGates: null,
+
+    ScriptUi: 'default',
 }

 export const BX_FLAGS: BxFlags = Object.assign(DEFAULT_FLAGS, window.BX_FLAGS || {});
--- a/src/utils/css.ts
+++ b/src/utils/css.ts
@ -1,23 +1,33 @@
 import { CE } from "@utils/html";
 import { PrefKey, getPref } from "@utils/preferences";
 import { renderStylus } from "@macros/build" with {type: "macro"};
+import { UiSection } from "@/enums/ui-sections";


 export function addCss() {
    const STYLUS_CSS = renderStylus();
    let css = STYLUS_CSS;

+    const PREF_HIDE_SECTIONS = getPref(PrefKey.UI_HIDE_SECTIONS);
+    const selectorToHide = [];
+
+    // Hide "News" section
+    if (PREF_HIDE_SECTIONS.includes(UiSection.NEWS)) {
+        selectorToHide.push('#BodyContent > div[class*=CarouselRow-module]');
+    }
+
+    // Hide "All games" section
+    if (PREF_HIDE_SECTIONS.includes(UiSection.ALL_GAMES)) {
+        selectorToHide.push('#BodyContent div[class*=AllGamesRow-module__gridContainer]');
+    }
+
+   // Hide "Start a party" button in the Guide menu
    if (getPref(PrefKey.BLOCK_SOCIAL_FEATURES)) {
-        css += `
-/* Hide "Play with friends" section */
-div[class^=HomePage-module__bottomSpacing]:has(button[class*=SocialEmptyCard]),
-button[class*=SocialEmptyCard],
-/* Hide "Start a party" button in the Guide menu */
-#gamepass-dialog-root div[class^=AchievementsPreview-module__container] + button[class*=HomeLandingPage-module__button]
-{
-    display: none;
-}
-`;
+        selectorToHide.push('#gamepass-dialog-root div[class^=AchievementsPreview-module__container] + button[class*=HomeLandingPage-module__button]');
+    }
+
+    if (selectorToHide) {
+        css += selectorToHide.join(',') + '{ display: none; }';
    }

    // Reduce animations
@ -140,3 +150,16 @@ body::-webkit-scrollbar {
    const $style = CE('style', {}, css);
    document.documentElement.appendChild($style);
 }
+
+
+export function preloadFonts() {
+    const $link = CE<HTMLLinkElement>('link', {
+            rel: 'preload',
+            href: 'https://redphx.github.io/better-xcloud/fonts/promptfont.otf',
+            as: 'font',
+            type: 'font/otf',
+            crossorigin: '',
+        });
+
+    document.querySelector('head')?.appendChild($link);
+}
--- a/src/utils/feature-gates.ts
+++ b/src/utils/feature-gates.ts
@ -3,6 +3,7 @@ import { getPref, PrefKey } from "./preferences";

 export let FeatureGates: {[key: string]: boolean} = {
    'PwaPrompt': false,
+    'EnableWifiWarnings': false,
 };

 // Disable context menu in Home page
--- a/src/utils/global.ts
+++ b/src/utils/global.ts
@ -13,14 +13,42 @@ const browserHasTouchSupport = 'ontouchstart' in window || navigator.maxTouchPoi
 const userAgentHasTouchSupport = !isTv && !isVr && browserHasTouchSupport;

 export const STATES: BxStates = {
+    supportedRegion: true,
+    serverRegions: {},
+    selectedRegion: {},
+    gsToken: '',
+
    isPlaying: false,
    appContext: {},
-    serverRegions: {},
-    userAgentHasTouchSupport: userAgentHasTouchSupport,
-    browserHasTouchSupport: browserHasTouchSupport,
+
+    browser: {
+        capabilities: {
+            touch: browserHasTouchSupport,
+            batteryApi: 'getBattery' in window.navigator,
+        },
+    },
+
+    userAgent: {
+        isTv: isTv,
+        capabilities: {
+            touch: userAgentHasTouchSupport,
+        }
+    },

    currentStream: {},
    remotePlay: {},

    pointerServerPort: 9269,
 };
+
+export function deepClone(obj: any): any {
+    if ('structuredClone' in window) {
+        return structuredClone(obj);
+    }
+
+    if (!obj) {
+        return {};
+    }
+
+    return JSON.parse(JSON.stringify(obj));
+}
--- a/src/utils/history.ts
+++ b/src/utils/history.ts
@ -1,7 +1,7 @@
 import { BxEvent } from "@utils/bx-event";
 import { LoadingScreen } from "@modules/loading-screen";
 import { RemotePlay } from "@modules/remote-play";
-import { checkHeader } from "@modules/ui/header";
+import { HeaderSection } from "@/modules/ui/header";

 export function patchHistoryMethod(type: 'pushState' | 'replaceState') {
    const orig = window.history[type];
@ -34,7 +34,7 @@ export function onHistoryChanged(e: PopStateEvent) {
    RemotePlay.detachPopup();

    LoadingScreen.reset();
-    window.setTimeout(checkHeader, 2000);
+    window.setTimeout(HeaderSection.watchHeader, 2000);

    BxEvent.dispatch(window, BxEvent.STREAM_STOPPED);
 }
--- a/src/utils/html.ts
+++ b/src/utils/html.ts
@ -9,6 +9,7 @@ type BxButton = {
    title?: string;
    disabled?: boolean;
    onClick?: EventListener;
+    attributes?: {[key: string]: any},
 }

 type ButtonStyle = {[index: string]: number} & {[index: number]: string};
@ -94,9 +95,25 @@ export const createButton = <T=HTMLButtonElement>(options: BxButton): T => {
    options.disabled && (($btn as HTMLButtonElement).disabled = true);
    options.onClick && $btn.addEventListener('click', options.onClick);

+    for (const key in options.attributes) {
+        if (!$btn.hasOwnProperty(key)) {
+            $btn.setAttribute(key, options.attributes[key]);
+        }
+    }
+
    return $btn as T;
 }

+export function getReactProps($elm: HTMLElement): any | null {
+    for (const key in $elm) {
+        if (key.startsWith('__reactProps')) {
+            return ($elm as any)[key];
+        }
+    }
+
+    return null;
+}
+
 export function escapeHtml(html: string): string {
    const text = document.createTextNode(html);
    const $span = document.createElement('span');
--- a/src/utils/monkey-patches.ts
+++ b/src/utils/monkey-patches.ts
@ -2,7 +2,7 @@ import { BxEvent } from "@utils/bx-event";
 import { getPref, PrefKey } from "@utils/preferences";
 import { STATES } from "@utils/global";
 import { BxLogger } from "@utils/bx-logger";
-import { patchSdpBitrate } from "./sdp";
+import { patchSdpBitrate, setCodecPreferences } from "./sdp";
 import { StreamPlayer, type StreamPlayerOptions } from "@/modules/stream-player";

 export function patchVideoApi() {
@ -11,8 +11,6 @@ export function patchVideoApi() {
    // Show video player when it's ready
    const showFunc = function(this: HTMLVideoElement) {
        this.style.visibility = 'visible';
-        this.removeEventListener('playing', showFunc);
-
        if (!this.videoWidth) {
            return;
        }
@ -49,7 +47,7 @@ export function patchVideoApi() {
        const $parent = this.parentElement!!;
        // Video tag is stream player
        if (!this.src && $parent.dataset.testid === 'media-container') {
-            this.addEventListener('playing', showFunc);
+            this.addEventListener('loadedmetadata', showFunc, {once: true});
        }

        return nativePlay.apply(this);
@ -66,33 +64,6 @@ export function patchRtcCodecs() {
    if (typeof RTCRtpTransceiver === 'undefined' || !('setCodecPreferences' in RTCRtpTransceiver.prototype)) {
        return false;
    }
-
-    const profilePrefix = codecProfile === 'high' ? '4d' : (codecProfile === 'low' ? '420' : '42e');
-    const profileLevelId = `profile-level-id=${profilePrefix}`;
-
-    const nativeSetCodecPreferences = RTCRtpTransceiver.prototype.setCodecPreferences;
-    RTCRtpTransceiver.prototype.setCodecPreferences = function(codecs) {
-        // Use the same codecs as desktop
-        const newCodecs = codecs.slice();
-        let pos = 0;
-        newCodecs.forEach((codec, i) => {
-            // Find high-quality codecs
-            if (codec.sdpFmtpLine && codec.sdpFmtpLine.includes(profileLevelId)) {
-                // Move it to the top of the array
-                newCodecs.splice(i, 1);
-                newCodecs.splice(pos, 0, codec);
-                ++pos;
-            }
-        });
-
-        try {
-            nativeSetCodecPreferences.apply(this, [newCodecs]);
-        } catch (e) {
-            // Didn't work -> use default codecs
-            BxLogger.error('setCodecPreferences', e);
-            nativeSetCodecPreferences.apply(this, [codecs]);
-        }
-    }
 }

 export function patchRtcPeerConnection() {
@ -109,18 +80,27 @@ export function patchRtcPeerConnection() {
    }

    const maxVideoBitrate = getPref(PrefKey.BITRATE_VIDEO_MAX);
-    if (maxVideoBitrate > 0) {
+    const codec = getPref(PrefKey.STREAM_CODEC_PROFILE);
+
+    if (codec !== 'default' || maxVideoBitrate > 0) {
        const nativeSetLocalDescription = RTCPeerConnection.prototype.setLocalDescription;
        RTCPeerConnection.prototype.setLocalDescription = function(description?: RTCLocalSessionDescriptionInit): Promise<void> {
+            // Set preferred codec profile
+            if (codec !== 'default') {
+                arguments[0].sdp = setCodecPreferences(arguments[0].sdp, codec);
+            }
+
            // set maximum bitrate
            try {
-                if (description) {
+                if (maxVideoBitrate > 0 && description) {
                    arguments[0].sdp = patchSdpBitrate(arguments[0].sdp, Math.round(maxVideoBitrate / 1000));
                }
            } catch (e) {
                BxLogger.error('setLocalDescription', e);
            }

+            BxLogger.info('setLocalDescription', arguments[0].sdp);
+
            // @ts-ignore
            return nativeSetLocalDescription.apply(this, arguments);
        };
@ -181,6 +161,8 @@ export function patchMeControl() {
            API: {
                setDisplayMode: () => {},
                setMobileState: () => {},
+                addEventListener: () => {},
+                removeEventListener: () => {},
            },
        },
    };
--- a/src/utils/network.ts
+++ b/src/utils/network.ts
@ -1,15 +1,13 @@
 import { BxEvent } from "@utils/bx-event";
 import { BX_FLAGS, NATIVE_FETCH } from "@utils/bx-flags";
-import { LoadingScreen } from "@modules/loading-screen";
 import { PrefKey, getPref } from "@utils/preferences";
-import { RemotePlay } from "@modules/remote-play";
-import { StreamBadges } from "@modules/stream/stream-badges";
 import { TouchController } from "@modules/touch-controller";
 import { STATES } from "@utils/global";
-import { getPreferredServerRegion } from "@utils/region";
 import { GamePassCloudGallery } from "../enums/game-pass-gallery";
-import { InputType } from "./bx-exposed";
 import { FeatureGates } from "./feature-gates";
+import { BxLogger } from "./bx-logger";
+import { XhomeInterceptor } from "./xhome-interceptor";
+import { XcloudInterceptor } from "./xcloud-interceptor";

 enum RequestType {
    XCLOUD = 'xcloud',
@ -95,12 +93,12 @@ function updateIceCandidates(candidates: any, options: any) {

    newCandidates.push(newCandidate('a=end-of-candidates'));

-    console.log(newCandidates);
+    BxLogger.info('ICE Candidates', newCandidates);
    return newCandidates;
 }


-async function patchIceCandidates(request: Request, consoleAddrs?: {[index: string]: number}) {
+export async function patchIceCandidates(request: Request, consoleAddrs?: {[index: string]: number}) {
    const response = await NATIVE_FETCH(request);
    const text = await response.clone().text();

@ -124,382 +122,6 @@ async function patchIceCandidates(request: Request, consoleAddrs?: {[index: stri
    return response;
 }

-
-class XhomeInterceptor {
-    static #consoleAddrs: {[index: string]: number} = {};
-
-    static async #handleLogin(request: Request) {
-        try {
-            const clone = (request as Request).clone();
-
-            const obj = await clone.json();
-            obj.offeringId = 'xhome';
-
-            request = new Request('https://xhome.gssv-play-prod.xboxlive.com/v2/login/user', {
-                method: 'POST',
-                body: JSON.stringify(obj),
-                headers: {
-                    'Content-Type': 'application/json',
-                },
-            });
-        } catch (e) {
-            alert(e);
-            console.log(e);
-        }
-
-        return NATIVE_FETCH(request);
-    }
-
-    static async #handleConfiguration(request: Request | URL) {
-        const response = await NATIVE_FETCH(request);
-
-        const obj = await response.clone().json()
-        console.log(obj);
-
-        const serverDetails = obj.serverDetails;
-        if (serverDetails.ipV4Address) {
-            XhomeInterceptor.#consoleAddrs[serverDetails.ipV4Address] = serverDetails.ipV4Port;
-        }
-
-        if (serverDetails.ipV6Address) {
-            XhomeInterceptor.#consoleAddrs[serverDetails.ipV6Address] = serverDetails.ipV6Port;
-        }
-
-        response.json = () => Promise.resolve(obj);
-        response.text = () => Promise.resolve(JSON.stringify(obj));
-
-        return response;
-    }
-
-    static async #handleInputConfigs(request: Request | URL, opts: {[index: string]: any}) {
-        const response = await NATIVE_FETCH(request);
-
-        if (getPref(PrefKey.STREAM_TOUCH_CONTROLLER) !== 'all') {
-            return response;
-        }
-
-        const obj = await response.clone().json() as any;
-
-        const xboxTitleId = JSON.parse(opts.body).titleIds[0];
-        STATES.currentStream.xboxTitleId = xboxTitleId;
-
-        const inputConfigs = obj[0];
-
-        let hasTouchSupport = inputConfigs.supportedTabs.length > 0;
-        if (!hasTouchSupport) {
-            const supportedInputTypes = inputConfigs.supportedInputTypes;
-            hasTouchSupport = supportedInputTypes.includes(InputType.NATIVE_TOUCH) || supportedInputTypes.includes(InputType.CUSTOM_TOUCH_OVERLAY);
-        }
-
-        if (hasTouchSupport) {
-            TouchController.disable();
-
-            BxEvent.dispatch(window, BxEvent.CUSTOM_TOUCH_LAYOUTS_LOADED, {
-                data: null,
-            });
-        } else {
-            TouchController.enable();
-            TouchController.getCustomLayouts(xboxTitleId);
-        }
-
-        response.json = () => Promise.resolve(obj);
-        response.text = () => Promise.resolve(JSON.stringify(obj));
-
-        return response;
-    }
-
-    static async #handleTitles(request: Request) {
-        const clone = request.clone();
-
-        const headers: {[index: string]: any} = {};
-        for (const pair of (clone.headers as any).entries()) {
-            headers[pair[0]] = pair[1];
-        }
-        headers.authorization = `Bearer ${RemotePlay.XCLOUD_TOKEN}`;
-
-        const index = request.url.indexOf('.xboxlive.com');
-        request = new Request('https://wus.core.gssv-play-prod' + request.url.substring(index), {
-            method: clone.method,
-            body: await clone.text(),
-            headers: headers,
-        });
-
-        return NATIVE_FETCH(request);
-    }
-
-    static async #handlePlay(request: RequestInfo | URL) {
-        const clone = (request as Request).clone();
-        const body = await clone.json();
-
-        // body.settings.useIceConnection = true;
-
-        const newRequest = new Request(request, {
-            body: JSON.stringify(body),
-        });
-
-        return NATIVE_FETCH(newRequest);
-    }
-
-    static async handle(request: Request) {
-        TouchController.disable();
-
-        const clone = request.clone();
-
-        const headers: {[index: string]: string} = {};
-        for (const pair of (clone.headers as any).entries()) {
-            headers[pair[0]] = pair[1];
-        }
-        // Add xHome token to headers
-        headers.authorization = `Bearer ${RemotePlay.XHOME_TOKEN}`;
-
-        // Patch resolution
-        const deviceInfo = RemotePlay.BASE_DEVICE_INFO;
-        if (getPref(PrefKey.REMOTE_PLAY_RESOLUTION) === '720p') {
-            deviceInfo.dev.os.name = 'android';
-        }
-
-        headers['x-ms-device-info'] = JSON.stringify(deviceInfo);
-
-        const opts: {[index: string]: any} = {
-            method: clone.method,
-            headers: headers,
-        };
-
-        if (clone.method === 'POST') {
-            opts.body = await clone.text();
-        }
-
-        let newUrl = request.url;
-        if (!newUrl.includes('/servers/home')) {
-            const index = request.url.indexOf('.xboxlive.com');
-            newUrl = STATES.remotePlay.server + request.url.substring(index + 13);
-        }
-
-        request = new Request(newUrl, opts);
-        let url = (typeof request === 'string') ? request : request.url;
-
-        // Get console IP
-        if (url.includes('/configuration')) {
-            return XhomeInterceptor.#handleConfiguration(request);
-        } else if (url.endsWith('/sessions/home/play')) {
-            return XhomeInterceptor.#handlePlay(request);
-        } else if (url.includes('inputconfigs')) {
-            return XhomeInterceptor.#handleInputConfigs(request, opts);
-        } else if (url.includes('/login/user')) {
-            return XhomeInterceptor.#handleLogin(request);
-        } else if (url.endsWith('/titles')) {
-            return XhomeInterceptor.#handleTitles(request);
-        } else if (url && url.endsWith('/ice') && url.includes('/sessions/') && (request as Request).method === 'GET') {
-            return patchIceCandidates(request, XhomeInterceptor.#consoleAddrs);
-        }
-
-        return await NATIVE_FETCH(request);
-    }
-}
-
-
-class XcloudInterceptor {
-    static async #handleLogin(request: RequestInfo | URL, init?: RequestInit) {
-        const response = await NATIVE_FETCH(request, init);
-        const obj = await response.clone().json();
-
-        // Preload Remote Play
-        getPref(PrefKey.REMOTE_PLAY_ENABLED) && BX_FLAGS.PreloadRemotePlay && RemotePlay.preload();
-
-        // Store xCloud token
-        RemotePlay.XCLOUD_TOKEN = obj.gsToken;
-
-        // Get server list
-        const serverEmojis = {
-            AustraliaEast: '🇦🇺',
-            AustraliaSouthEast: '🇦🇺',
-            BrazilSouth: '🇧🇷',
-            EastUS: '🇺🇸',
-            EastUS2: '🇺🇸',
-            JapanEast: '🇯🇵',
-            KoreaCentral: '🇰🇷',
-            MexicoCentral: '🇲🇽',
-            NorthCentralUs: '🇺🇸',
-            SouthCentralUS: '🇺🇸',
-            UKSouth: '🇬🇧',
-            WestEurope: '🇪🇺',
-            WestUS: '🇺🇸',
-            WestUS2: '🇺🇸',
-        };
-
-        const serverRegex = /\/\/(\w+)\./;
-
-        for (let region of obj.offeringSettings.regions) {
-            const regionName = region.name as keyof typeof serverEmojis;
-            let shortName = region.name;
-
-            let match = serverRegex.exec(region.baseUri);
-            if (match) {
-                shortName = match[1];
-                if (serverEmojis[regionName]) {
-                    shortName = serverEmojis[regionName] + ' ' + shortName;
-                }
-            }
-
-            region.shortName = shortName.toUpperCase();
-            STATES.serverRegions[region.name] = Object.assign({}, region);
-        }
-
-        BxEvent.dispatch(window, BxEvent.XCLOUD_SERVERS_READY);
-
-        const preferredRegion = getPreferredServerRegion();
-        if (preferredRegion in STATES.serverRegions) {
-            const tmp = Object.assign({}, STATES.serverRegions[preferredRegion]);
-            tmp.isDefault = true;
-
-            obj.offeringSettings.regions = [tmp];
-        }
-
-        response.json = () => Promise.resolve(obj);
-        return response;
-    }
-
-    static async #handlePlay(request: RequestInfo | URL, init?: RequestInit) {
-        const PREF_STREAM_TARGET_RESOLUTION = getPref(PrefKey.STREAM_TARGET_RESOLUTION);
-        const PREF_STREAM_PREFERRED_LOCALE = getPref(PrefKey.STREAM_PREFERRED_LOCALE);
-
-        const url = (typeof request === 'string') ? request : (request as Request).url;
-        const parsedUrl = new URL(url);
-
-        let badgeRegion: string = parsedUrl.host.split('.', 1)[0];
-        for (let regionName in STATES.serverRegions) {
-            const region = STATES.serverRegions[regionName];
-            if (parsedUrl.origin == region.baseUri) {
-                badgeRegion = regionName;
-                break;
-            }
-        }
-        StreamBadges.getInstance().setRegion(badgeRegion);
-
-        const clone = (request as Request).clone();
-        const body = await clone.json();
-
-        // Force stream's resolution
-        if (PREF_STREAM_TARGET_RESOLUTION !== 'auto') {
-            const osName = (PREF_STREAM_TARGET_RESOLUTION === '720p') ? 'android' : 'windows';
-            body.settings.osName = osName;
-        }
-
-        // Override "locale" value
-        if (PREF_STREAM_PREFERRED_LOCALE !== 'default') {
-            body.settings.locale = PREF_STREAM_PREFERRED_LOCALE;
-        }
-
-        const newRequest = new Request(request, {
-            body: JSON.stringify(body),
-        });
-
-        return NATIVE_FETCH(newRequest);
-    }
-
-    static async #handleWaitTime(request: RequestInfo | URL, init?: RequestInit) {
-        const response = await NATIVE_FETCH(request, init);
-
-        if (getPref(PrefKey.UI_LOADING_SCREEN_WAIT_TIME)) {
-            const json = await response.clone().json();
-            if (json.estimatedAllocationTimeInSeconds > 0) {
-                // Setup wait time overlay
-                LoadingScreen.setupWaitTime(json.estimatedTotalWaitTimeInSeconds);
-            }
-        }
-
-        return response;
-    }
-
-    static async #handleConfiguration(request: RequestInfo | URL, init?: RequestInit) {
-        if ((request as Request).method !== 'GET') {
-            return NATIVE_FETCH(request, init);
-        }
-
-        // Touch controller for all games
-        if (getPref(PrefKey.STREAM_TOUCH_CONTROLLER) === 'all') {
-            const titleInfo = STATES.currentStream.titleInfo;
-            if (titleInfo?.details.hasTouchSupport) {
-                TouchController.disable();
-            } else {
-                TouchController.enable();
-            }
-        }
-
-        // Intercept configurations
-        const response = await NATIVE_FETCH(request, init);
-        const text = await response.clone().text();
-        if (!text.length) {
-            return response;
-        }
-
-        const obj = JSON.parse(text);
-        let overrides = JSON.parse(obj.clientStreamingConfigOverrides || '{}') || {};
-
-        overrides.inputConfiguration = overrides.inputConfiguration || {};
-        overrides.inputConfiguration.enableVibration = true;
-
-        let overrideMkb: boolean | null = null;
-
-        if (getPref(PrefKey.NATIVE_MKB_ENABLED) === 'on' || BX_FLAGS.ForceNativeMkbTitles?.includes(STATES.currentStream.titleInfo!.details.productId)) {
-            overrideMkb = true;
-        }
-
-        if (getPref(PrefKey.NATIVE_MKB_ENABLED) === 'off') {
-            overrideMkb = false;
-        }
-
-        if (overrideMkb !== null) {
-            overrides.inputConfiguration = Object.assign(overrides.inputConfiguration, {
-                enableMouseInput: overrideMkb,
-                enableKeyboardInput: overrideMkb,
-            });
-        }
-
-        overrides.videoConfiguration = overrides.videoConfiguration || {};
-        overrides.videoConfiguration.setCodecPreferences = true;
-
-        // Enable touch controller
-        if (TouchController.isEnabled()) {
-            overrides.inputConfiguration.enableTouchInput = true;
-            overrides.inputConfiguration.maxTouchPoints = 10;
-        }
-
-        // Enable mic
-        if (getPref(PrefKey.AUDIO_MIC_ON_PLAYING)) {
-            overrides.audioConfiguration = overrides.audioConfiguration || {};
-            overrides.audioConfiguration.enableMicrophone = true;
-        }
-
-        obj.clientStreamingConfigOverrides = JSON.stringify(overrides);
-
-        response.json = () => Promise.resolve(obj);
-        response.text = () => Promise.resolve(JSON.stringify(obj));
-
-        return response;
-    }
-
-    static async handle(request: RequestInfo | URL, init?: RequestInit) {
-        let url = (typeof request === 'string') ? request : (request as Request).url;
-
-        // Server list
-        if (url.endsWith('/v2/login/user')) {
-            return XcloudInterceptor.#handleLogin(request, init);
-        } else if (url.endsWith('/sessions/cloud/play')) {  // Get session
-            return XcloudInterceptor.#handlePlay(request, init);
-        } else if (url.includes('xboxlive.com') && url.includes('/waittime/')) {
-            return XcloudInterceptor.#handleWaitTime(request, init);
-        } else if (url.endsWith('/configuration')) {
-            return XcloudInterceptor.#handleConfiguration(request, init);
-        } else if (url && url.endsWith('/ice') && url.includes('/sessions/') && (request as Request).method === 'GET') {
-            return patchIceCandidates(request as Request);
-        }
-
-        return NATIVE_FETCH(request, init);
-    }
-}
-
-
 export function interceptHttpRequests() {
    let BLOCKED_URLS: string[] = [];
    if (getPref(PrefKey.BLOCK_TRACKING)) {
@ -579,8 +201,10 @@ export function interceptHttpRequests() {
                const response = await NATIVE_FETCH(request, init);
                const json = await response.json();

-                for (const key in FeatureGates) {
-                    json.exp.treatments[key] = FeatureGates[key]
+                if (json && json.exp && json.exp.treatments) {
+                    for (const key in FeatureGates) {
+                        json.exp.treatments[key] = FeatureGates[key]
+                    }
                }

                response.json = () => Promise.resolve(json);
@ -591,7 +215,7 @@ export function interceptHttpRequests() {
        }

        // Add list of games with custom layouts to the official list
-        if (STATES.userAgentHasTouchSupport && url.includes('catalog.gamepass.com/sigls/')) {
+        if (STATES.userAgent.capabilities.touch && url.includes('catalog.gamepass.com/sigls/')) {
            const response = await NATIVE_FETCH(request, init);
            const obj = await response.clone().json();

--- a/src/utils/preferences.ts
+++ b/src/utils/preferences.ts
@ -1,5 +1,5 @@
 import { CE } from "@utils/html";
-import { SUPPORTED_LANGUAGES, t } from "@utils/translation";
+import { SUPPORTED_LANGUAGES, t} from "@utils/translation";
 import { SettingElement, SettingElementType } from "@utils/settings";
 import { UserAgent } from "@utils/user-agent";
 import { StreamStat } from "@modules/stream/stream-stats";
@ -7,6 +7,7 @@ import type { PreferenceSetting, PreferenceSettings } from "@/types/preferences"
 import { AppInterface, STATES } from "@utils/global";
 import { StreamPlayerType, StreamVideoProcessing } from "@enums/stream-player";
 import { UserAgentProfile } from "@/enums/user-agent";
+import { UiSection } from "@/enums/ui-sections";

 export enum PrefKey {
    LAST_UPDATE_CHECK = 'version_last_check',
@ -16,6 +17,8 @@ export enum PrefKey {
    BETTER_XCLOUD_LOCALE = 'bx_locale',

    SERVER_REGION = 'server_region',
+    SERVER_BYPASS_RESTRICTION = 'server_bypass_restriction',
+
    PREFER_IPV6_SERVER = 'prefer_ipv6_server',
    STREAM_TARGET_RESOLUTION = 'stream_target_resolution',
    STREAM_PREFERRED_LOCALE = 'stream_preferred_locale',
@ -45,6 +48,7 @@ export enum PrefKey {
    CONTROLLER_ENABLE_VIBRATION = 'controller_enable_vibration',
    CONTROLLER_DEVICE_VIBRATION = 'controller_device_vibration',
    CONTROLLER_VIBRATION_INTENSITY = 'controller_vibration_intensity',
+    CONTROLLER_SHOW_CONNECTION_STATUS = 'controller_show_connection_status',

    NATIVE_MKB_ENABLED = 'native_mkb_enabled',
    NATIVE_MKB_SCROLL_HORIZONTAL_SENSITIVITY = 'native_mkb_scroll_x_sensitivity',
@ -69,8 +73,10 @@ export enum PrefKey {

    UI_LAYOUT = 'ui_layout',
    UI_SCROLLBAR_HIDE = 'ui_scrollbar_hide',
+    UI_HIDE_SECTIONS = 'ui_hide_sections',

    UI_HOME_CONTEXT_MENU_DISABLED = 'ui_home_context_menu_disabled',
+    UI_GAME_CARD_SHOW_WAIT_TIME = 'ui_game_card_show_wait_time',

    VIDEO_PLAYER_TYPE = 'video_player_type',
    VIDEO_PROCESSING = 'video_processing',
@ -119,6 +125,12 @@ export class Preferences {
            label: t('region'),
            default: 'default',
        },
+        [PrefKey.SERVER_BYPASS_RESTRICTION]: {
+            label: t('bypass-region-restriction'),
+            note: t('use-this-at-your-own-risk'),
+            default: false,
+        },
+
        [PrefKey.STREAM_PREFERRED_LOCALE]: {
            label: t('preferred-game-language'),
            default: 'default',
@ -170,7 +182,7 @@ export class Preferences {
                    default: t('default'),
                };

-                if (!('getCapabilities' in RTCRtpReceiver) || typeof RTCRtpTransceiver === 'undefined' || !('setCodecPreferences' in RTCRtpTransceiver.prototype)) {
+                if (!('getCapabilities' in RTCRtpReceiver)) {
                    return options;
                }

@ -267,7 +279,7 @@ export class Preferences {
                all: t('tc-all-games'),
                off: t('off'),
            },
-            unsupported: !STATES.userAgentHasTouchSupport,
+            unsupported: !STATES.userAgent.capabilities.touch,
            ready: (setting: PreferenceSetting) => {
                if (setting.unsupported) {
                    setting.default = 'default';
@ -277,7 +289,7 @@ export class Preferences {
        [PrefKey.STREAM_TOUCH_CONTROLLER_AUTO_OFF]: {
            label: t('tc-auto-off'),
            default: false,
-            unsupported: !STATES.userAgentHasTouchSupport,
+            unsupported: !STATES.userAgent.capabilities.touch,
        },
        [PrefKey.STREAM_TOUCH_CONTROLLER_DEFAULT_OPACITY]: {
            type: SettingElementType.NUMBER_STEPPER,
@ -291,7 +303,7 @@ export class Preferences {
                ticks: 10,
                hideSlider: true,
            },
-            unsupported: !STATES.userAgentHasTouchSupport,
+            unsupported: !STATES.userAgent.capabilities.touch,
        },
        [PrefKey.STREAM_TOUCH_CONTROLLER_STYLE_STANDARD]: {
            label: t('tc-standard-layout-style'),
@ -301,7 +313,7 @@ export class Preferences {
                white: t('tc-all-white'),
                muted: t('tc-muted-colors'),
            },
-            unsupported: !STATES.userAgentHasTouchSupport,
+            unsupported: !STATES.userAgent.capabilities.touch,
        },
        [PrefKey.STREAM_TOUCH_CONTROLLER_STYLE_CUSTOM]: {
            label: t('tc-custom-layout-style'),
@ -310,7 +322,7 @@ export class Preferences {
                default: t('default'),
                muted: t('tc-muted-colors'),
            },
-            unsupported: !STATES.userAgentHasTouchSupport,
+            unsupported: !STATES.userAgent.capabilities.touch,
        },

        [PrefKey.STREAM_SIMPLIFY_MENU]: {
@ -384,6 +396,11 @@ export class Preferences {
        },
        */

+        [PrefKey.CONTROLLER_SHOW_CONNECTION_STATUS]: {
+            label: t('show-controller-connection-status'),
+            default: true,
+        },
+
        [PrefKey.CONTROLLER_ENABLE_SHORTCUTS]: {
            default: false,
        },
@ -548,7 +565,26 @@ export class Preferences {

        [PrefKey.UI_HOME_CONTEXT_MENU_DISABLED]: {
            label: t('disable-home-context-menu'),
-            default: STATES.browserHasTouchSupport,
+            default: STATES.browser.capabilities.touch,
+        },
+
+        [PrefKey.UI_HIDE_SECTIONS]: {
+            label: t('hide-sections'),
+            default: [],
+            multipleOptions: {
+                [UiSection.NEWS]: t('section-news'),
+                [UiSection.FRIENDS]: t('section-play-with-friends'),
+                // [UiSection.MOST_POPULAR]: t('section-most-popular'),
+                [UiSection.ALL_GAMES]: t('section-all-games'),
+            },
+            params: {
+                size: 3,
+            },
+        },
+
+        [PrefKey.UI_GAME_CARD_SHOW_WAIT_TIME]: {
+            label: t('show-wait-time-in-game-card'),
+            default: false,
        },

        [PrefKey.BLOCK_SOCIAL_FEATURES]: {
@ -567,10 +603,9 @@ export class Preferences {
                [UserAgentProfile.DEFAULT]: t('default'),
                [UserAgentProfile.WINDOWS_EDGE]: 'Edge + Windows',
                [UserAgentProfile.MACOS_SAFARI]: 'Safari + macOS',
-                [UserAgentProfile.SMARTTV_GENERIC]: 'Smart TV',
-                [UserAgentProfile.SMARTTV_TIZEN]: 'Samsung Smart TV',
+                [UserAgentProfile.SMART_TV_GENERIC]: 'Smart TV',
+                [UserAgentProfile.SMART_TV_TIZEN]: 'Samsung Smart TV',
                [UserAgentProfile.VR_OCULUS]: 'Meta Quest VR',
-                [UserAgentProfile.ANDROID_KIWI_V123]: 'Kiwi Browser v123',
                [UserAgentProfile.CUSTOM]: t('custom'),
            },
        },
--- a/src/utils/preload-state.ts
+++ b/src/utils/preload-state.ts
@ -1,4 +1,4 @@
-import { STATES } from "@utils/global";
+import { deepClone, STATES } from "@utils/global";
 import { BxLogger } from "./bx-logger";
 import { TouchController } from "@modules/touch-controller";
 import { GamePassCloudGallery } from "../enums/game-pass-gallery";
@ -24,7 +24,7 @@ export function overridePreloadState() {
            }

            // Add list of games with custom layouts to the official list
-            if (STATES.userAgentHasTouchSupport) {
+            if (STATES.userAgent.capabilities.touch) {
                try {
                    const sigls = state.xcloud.sigls;
                    if (GamePassCloudGallery.TOUCH in sigls) {
@ -59,7 +59,7 @@ export function overridePreloadState() {

            // @ts-ignore
            _state = state;
-            STATES.appContext = structuredClone(state.appContext);
+            STATES.appContext = deepClone(state.appContext);
        }
    });
 }
--- a/src/utils/screenshot.ts
+++ b/src/utils/screenshot.ts
@ -57,7 +57,7 @@ export class Screenshot {
            return;
        }

-        $player.parentElement!.addEventListener('animationend', this.#onAnimationEnd);
+        $player.parentElement!.addEventListener('animationend', this.#onAnimationEnd, { once: true });
        $player.parentElement!.classList.add('bx-taking-screenshot');

        const canvasContext = Screenshot.#canvasContext;
--- a/src/utils/sdp.ts
+++ b/src/utils/sdp.ts
@ -1,5 +1,59 @@
+export function setCodecPreferences(sdp: string, preferredCodec: string) {
+    const h264Pattern = /a=fmtp:(\d+).*profile-level-id=([0-9a-f]{6})/g;
+    const profilePrefix = preferredCodec === 'high' ? '4d' : (preferredCodec === 'low' ? '420' : '42e');
+
+    const preferredCodecIds: string[] = [];
+
+    // Find all H.264 codec profile IDs
+    const matches = sdp.matchAll(h264Pattern) || [];
+    for (const match of matches) {
+        const id = match[1];
+        const profileId = match[2];
+
+        if (profileId.startsWith(profilePrefix)) {
+            preferredCodecIds.push(id);
+        }
+    }
+
+    // No preferred IDs found
+    if (!preferredCodecIds.length) {
+        return sdp;
+    }
+
+    const lines = sdp.split('\r\n');
+    for (let lineIndex = 0; lineIndex < lines.length; lineIndex++) {
+        const line = lines[lineIndex];
+        if (!line.startsWith('m=video')) {
+            continue;
+        }
+
+        // https://datatracker.ietf.org/doc/html/rfc4566#section-5.14
+        // m=<media> <port> <proto> <fmt>
+        // m=video 9 UDP/TLS/RTP/SAVPF 127 39 102 104 106 108
+        const tmp = line.trim().split(' ');
+
+        // Get array of <fmt>
+        // ['127', '39', '102', '104', '106', '108']
+        let ids = tmp.slice(3);
+
+        // Remove preferred IDs in the original array
+        ids = ids.filter(item => !preferredCodecIds.includes(item));
+
+        // Put preferred IDs at the beginning
+        ids = preferredCodecIds.concat(ids);
+
+        // Update line's content
+        lines[lineIndex] = tmp.slice(0, 3).concat(ids).join(' ');
+
+        break;
+    }
+
+    return lines.join('\r\n');
+}
+
+
 export function patchSdpBitrate(sdp: string, video?: number, audio?: number) {
-    const lines = sdp.split('\n');
+    const lines = sdp.split('\r\n');

    const mediaSet: Set<string> = new Set();
    !!video && mediaSet.add('video');
@ -57,5 +111,5 @@ export function patchSdpBitrate(sdp: string, video?: number, audio?: number) {
        }
    }

-    return lines.join('\n');
+    return lines.join('\r\n');
 }
--- a/src/utils/settings.ts
+++ b/src/utils/settings.ts
@ -27,7 +27,7 @@ export enum SettingElementType {
 export class SettingElement {
    static #renderOptions(key: string, setting: PreferenceSetting, currentValue: any, onChange: any) {
        const $control = CE<HTMLSelectElement>('select', {
-                title: setting.label,
+                // title: setting.label,
                tabindex: 0,
            }) as HTMLSelectElement;
        for (let value in setting.options) {
@ -38,7 +38,7 @@ export class SettingElement {
        }

        $control.value = currentValue;
-        onChange && $control.addEventListener('change', e => {
+        onChange && $control.addEventListener('input', e => {
            const target = e.target as HTMLSelectElement;
            const value = (setting.type && setting.type === 'number') ? parseInt(target.value) : target.value;
            onChange(e, value);
@ -54,7 +54,7 @@ export class SettingElement {

    static #renderMultipleOptions(key: string, setting: PreferenceSetting, currentValue: any, onChange: any, params: MultipleOptionsParams={}) {
        const $control = CE<HTMLSelectElement>('select', {
-                title: setting.label,
+                // title: setting.label,
                multiple: true,
                tabindex: 0,
            });
@ -76,7 +76,7 @@ export class SettingElement {

                const $parent = target.parentElement!;
                $parent.focus();
-                $parent.dispatchEvent(new Event('change'));
+                $parent.dispatchEvent(new Event('input'));
            });

            $control.appendChild($option);
@ -90,7 +90,7 @@ export class SettingElement {

        $control.addEventListener('mousemove', e => e.preventDefault());

-        onChange && $control.addEventListener('change', (e: Event) => {
+        onChange && $control.addEventListener('input', (e: Event) => {
            const target = e.target as HTMLSelectElement
            const values = Array.from(target.selectedOptions).map(i => i.value);
            onChange(e, values);
--- a/src/utils/translation.ts
+++ b/src/utils/translation.ts
@ -27,6 +27,8 @@ const Texts = {
    "activated": "Activated",
    "active": "Active",
    "advanced": "Advanced",
+    "always-off": "Always off",
+    "always-on": "Always on",
    "amd-fidelity-cas": "AMD FidelityFX CAS",
    "android-app-settings": "Android app settings",
    "apply": "Apply",
@ -49,6 +51,7 @@ const Texts = {
    "bottom-right": "Bottom-right",
    "brightness": "Brightness",
    "browser-unsupported-feature": "Your browser doesn't support this feature",
+    "bypass-region-restriction": "Bypass region restriction",
    "can-stream-xbox-360-games": "Can stream Xbox 360 games",
    "cancel": "Cancel",
    "cant-stream-xbox-360-games": "Can't stream Xbox 360 games",
@ -108,6 +111,7 @@ const Texts = {
    "hide": "Hide",
    "hide-idle-cursor": "Hide mouse cursor on idle",
    "hide-scrollbar": "Hide web page's scrollbar",
+    "hide-sections": "Hide sections",
    "hide-system-menu-icon": "Hide System menu's icon",
    "hide-touch-controller": "Hide touch controller",
    "horizontal-scroll-sensitivity": "Horizontal scroll sensitivity",
@ -162,13 +166,13 @@ const Texts = {
        (e: any) => `${e.key} でこの機能を切替`,
        (e: any) => `${e.key} 키를 눌러 이 기능을 켜고 끄세요`,
        (e: any) => `Naciśnij ${e.key} aby przełączyć tę funkcję`,
-        ,
+        (e: any) => `Pressione ${e.key} para alternar este recurso`,
        (e: any) => `Нажмите ${e.key} для переключения этой функции`,
        ,
        (e: any) => `Etkinleştirmek için ${e.key} tuşuna basın`,
        (e: any) => `Натисніть ${e.key} щоб перемкнути цю функцію`,
        (e: any) => `Nhấn ${e.key} để bật/tắt tính năng này`,
-        ,
+        (e: any) => `按下 ${e.key} 来切换此功能`,
    ],
    "press-to-bind": "Press a key or do a mouse click to bind...",
    "prompt-preset-name": "Preset's name:",
@ -189,6 +193,10 @@ const Texts = {
    "save": "Save",
    "screen": "Screen",
    "screenshot-apply-filters": "Applies video filters to screenshots",
+    "section-all-games": "All games",
+    "section-most-popular": "Most popular",
+    "section-news": "News",
+    "section-play-with-friends": "Play with friends",
    "separate-touch-controller": "Separate Touch controller & Controller #1",
    "separate-touch-controller-note": "Touch controller is Player 1, Controller #1 is Player 2",
    "server": "Server",
@ -198,11 +206,13 @@ const Texts = {
    "sharpness": "Sharpness",
    "shortcut-keys": "Shortcut keys",
    "show": "Show",
+    "show-controller-connection-status": "Show controller connection status",
    "show-game-art": "Show game art",
    "show-hide": "Show/hide",
    "show-stats-on-startup": "Show stats when starting the game",
    "show-touch-controller": "Show touch controller",
    "show-wait-time": "Show the estimated wait time",
+    "show-wait-time-in-game-card": "Show wait time in game card",
    "simplify-stream-menu": "Simplify Stream's menu",
    "skip-splash-video": "Skip Xbox splash video",
    "slow": "Slow",
@ -269,6 +279,7 @@ const Texts = {
    "unmuted": "Unmuted",
    "unsharp-masking": "Unsharp masking",
    "use-mouse-absolute-position": "Use mouse's absolute position",
+    "use-this-at-your-own-risk": "Use this at your own risk",
    "user-agent-profile": "User-Agent profile",
    "vertical-scroll-sensitivity": "Vertical scroll sensitivity",
    "vertical-sensitivity": "Vertical sensitivity",
@ -375,8 +386,12 @@ export class Translations {
            const resp = await NATIVE_FETCH(`https://raw.githubusercontent.com/redphx/better-xcloud/gh-pages/translations/${locale}.json`);
            const translations = await resp.json();

-            window.localStorage.setItem(Translations.#KEY_TRANSLATIONS, JSON.stringify(translations));
-            Translations.#foreignTranslations = translations;
+            // Prevent saving incorrect translations
+            let currentLocale = localStorage.getItem(Translations.#KEY_LOCALE);
+            if (currentLocale === locale) {
+                window.localStorage.setItem(Translations.#KEY_TRANSLATIONS, JSON.stringify(translations));
+                Translations.#foreignTranslations = translations;
+            }
            return true;
        } catch (e) {
            debugger;
--- a/src/utils/user-agent.ts
+++ b/src/utils/user-agent.ts
@ -1,10 +1,14 @@
 import { UserAgentProfile } from "@enums/user-agent";
+import { deepClone } from "./global";
+import { BX_FLAGS } from "./bx-flags";

 type UserAgentConfig = {
    profile: UserAgentProfile,
    custom?: string,
 };

+const SMART_TV_UNIQUE_ID = 'FC4A1DA2-711C-4E9C-BC7F-047AF8A672EA';
+
 let CHROMIUM_VERSION = '123.0.0.0';
 if (!!(window as any).chrome || window.navigator.userAgent.includes('Chrome')) {
    // Get Chromium version in the original User-Agent value
@ -25,10 +29,9 @@ export class UserAgent {
    static #USER_AGENTS: PartialRecord<UserAgentProfile, string> = {
        [UserAgentProfile.WINDOWS_EDGE]: `Mozilla/5.0 (Windows NT 10.0; Win64; x64) AppleWebKit/537.36 (KHTML, like Gecko) Chrome/${CHROMIUM_VERSION} Safari/537.36 Edg/${CHROMIUM_VERSION}`,
        [UserAgentProfile.MACOS_SAFARI]: 'Mozilla/5.0 (Macintosh; Intel Mac OS X 10_15_7) AppleWebKit/605.1.15 (KHTML, like Gecko) Version/16.5.2 Safari/605.1.1',
-        [UserAgentProfile.SMARTTV_GENERIC]: window.navigator.userAgent + ' SmartTV',
-        [UserAgentProfile.SMARTTV_TIZEN]: `Mozilla/5.0 (SMART-TV; LINUX; Tizen 7.0) AppleWebKit/537.36 (KHTML, like Gecko) ${CHROMIUM_VERSION}/7.0 TV Safari/537.36`,
+        [UserAgentProfile.SMART_TV_GENERIC]: `${window.navigator.userAgent} SmartTV`,
+        [UserAgentProfile.SMART_TV_TIZEN]: `Mozilla/5.0 (SMART-TV; LINUX; Tizen 7.0) AppleWebKit/537.36 (KHTML, like Gecko) ${CHROMIUM_VERSION}/7.0 TV Safari/537.36 ${SMART_TV_UNIQUE_ID}`,
        [UserAgentProfile.VR_OCULUS]: window.navigator.userAgent + ' OculusBrowser VR',
-        [UserAgentProfile.ANDROID_KIWI_V123]: 'Mozilla/5.0 (Linux; Android 10; K) AppleWebKit/537.36 (KHTML, like Gecko) Chrome/123.0.6312.118 Mobile Safari/537.36',
    }

    static init() {
@ -45,7 +48,7 @@ export class UserAgent {
    }

    static updateStorage(profile: UserAgentProfile, custom?: string) {
-        const clonedConfig = structuredClone(UserAgent.#config);
+        const clonedConfig = deepClone(UserAgent.#config);
        clonedConfig.profile = profile;

        if (typeof custom !== 'undefined') {
@ -116,7 +119,12 @@ export class UserAgent {
            return;
        }

-        const newUserAgent = UserAgent.get(profile);
+        let newUserAgent = UserAgent.get(profile);
+
+        // Pretend to be Tizen TV
+        if (BX_FLAGS.IsSupportedTvBrowser) {
+            newUserAgent += ` SmartTV ${SMART_TV_UNIQUE_ID}`;
+        }

        // Clear data of navigator.userAgentData, force xCloud to detect browser based on navigator.userAgent
        (window.navigator as any).orgUserAgentData = (window.navigator as any).userAgentData;
--- a/src/utils/xcloud-api.ts
+++ b/src/utils/xcloud-api.ts
@ -0,0 +1,79 @@
+import { NATIVE_FETCH } from "./bx-flags";
+import { STATES } from "./global";
+
+export class XcloudApi {
+    private static instance: XcloudApi;
+
+    public static getInstance(): XcloudApi {
+        if (!XcloudApi.instance) {
+            XcloudApi.instance = new XcloudApi();
+        }
+
+        return XcloudApi.instance;
+    }
+
+    #CACHE_TITLES: {[key: string]: XcloudTitleInfo} = {};
+    #CACHE_WAIT_TIME: {[key: string]: XcloudWaitTimeInfo} = {};
+
+    async getTitleInfo(id: string): Promise<XcloudTitleInfo | null> {
+        if (id in this.#CACHE_TITLES) {
+            return this.#CACHE_TITLES[id];
+        }
+
+        const baseUri = STATES.selectedRegion.baseUri;
+        if (!baseUri || !STATES.gsToken) {
+            return null;
+        }
+
+        let json;
+        try {
+            const response = await NATIVE_FETCH(`${baseUri}/v2/titles`, {
+                method: 'POST',
+                headers: {
+                    'Authorization': `Bearer ${STATES.gsToken}`,
+                    'Content-Type': 'application/json',
+                },
+
+                // format the data
+                body: JSON.stringify({
+                    alternateIds: [id],
+                    alternateIdType: 'productId',
+                }),
+            });
+
+            json = (await response.json()).results[0];
+        } catch (e) {
+            json = {}
+        }
+        this.#CACHE_TITLES[id] = json;
+        return json;
+    }
+
+    async getWaitTime(id: string): Promise<XcloudWaitTimeInfo | null> {
+        if (id in this.#CACHE_WAIT_TIME) {
+            return this.#CACHE_WAIT_TIME[id];
+        }
+
+        const baseUri = STATES.selectedRegion.baseUri;
+        if (!baseUri || !STATES.gsToken) {
+            return null;
+        }
+
+        let json;
+        try {
+            const response = await NATIVE_FETCH(`${baseUri}/v1/waittime/${id}`, {
+                method: 'GET',
+                headers: {
+                    'Authorization': `Bearer ${STATES.gsToken}`,
+                },
+            });
+
+            json = await response.json();
+        } catch (e) {
+            json = {};
+        }
+
+        this.#CACHE_WAIT_TIME[id] = json;
+        return json;
+    }
+}
--- a/src/utils/xcloud-interceptor.ts
+++ b/src/utils/xcloud-interceptor.ts
@ -0,0 +1,223 @@
+import { LoadingScreen } from "@modules/loading-screen";
+import { RemotePlay } from "@modules/remote-play";
+import { StreamBadges } from "@modules/stream/stream-badges";
+import { TouchController } from "@modules/touch-controller";
+import { BxEvent } from "./bx-event";
+import { NATIVE_FETCH, BX_FLAGS } from "./bx-flags";
+import { STATES } from "./global";
+import { patchIceCandidates } from "./network";
+import { getPref, PrefKey } from "./preferences";
+import { getPreferredServerRegion } from "./region";
+
+export
+class XcloudInterceptor {
+    static async #handleLogin(request: RequestInfo | URL, init?: RequestInit) {
+        if (getPref(PrefKey.SERVER_BYPASS_RESTRICTION)) {
+            (request as Request).headers.set('X-Forwarded-For', '9.9.9.9');
+        }
+
+        const response = await NATIVE_FETCH(request, init);
+        if (response.status !== 200) {
+            // Unsupported region
+            BxEvent.dispatch(window, BxEvent.XCLOUD_SERVERS_UNAVAILABLE);
+            return response;
+        }
+
+        const obj = await response.clone().json();
+
+        // Store xCloud token
+        RemotePlay.XCLOUD_TOKEN = obj.gsToken;
+
+        // Get server list
+        const serverEmojis = {
+            AustraliaEast: '🇦🇺',
+            AustraliaSouthEast: '🇦🇺',
+            BrazilSouth: '🇧🇷',
+            EastUS: '🇺🇸',
+            EastUS2: '🇺🇸',
+            JapanEast: '🇯🇵',
+            KoreaCentral: '🇰🇷',
+            MexicoCentral: '🇲🇽',
+            NorthCentralUs: '🇺🇸',
+            SouthCentralUS: '🇺🇸',
+            UKSouth: '🇬🇧',
+            WestEurope: '🇪🇺',
+            WestUS: '🇺🇸',
+            WestUS2: '🇺🇸',
+        };
+
+        const serverRegex = /\/\/(\w+)\./;
+
+        for (let region of obj.offeringSettings.regions) {
+            const regionName = region.name as keyof typeof serverEmojis;
+            let shortName = region.name;
+
+            if (region.isDefault) {
+                STATES.selectedRegion = Object.assign({}, region);
+            }
+
+            let match = serverRegex.exec(region.baseUri);
+            if (match) {
+                shortName = match[1];
+                if (serverEmojis[regionName]) {
+                    shortName = serverEmojis[regionName] + ' ' + shortName;
+                }
+            }
+
+            region.shortName = shortName.toUpperCase();
+            STATES.serverRegions[region.name] = Object.assign({}, region);
+        }
+
+        BxEvent.dispatch(window, BxEvent.XCLOUD_SERVERS_READY);
+
+        const preferredRegion = getPreferredServerRegion();
+        if (preferredRegion in STATES.serverRegions) {
+            const tmp = Object.assign({}, STATES.serverRegions[preferredRegion]);
+            tmp.isDefault = true;
+
+            obj.offeringSettings.regions = [tmp];
+            STATES.selectedRegion = tmp;
+        }
+
+        STATES.gsToken = obj.gsToken;
+
+        response.json = () => Promise.resolve(obj);
+        return response;
+    }
+
+    static async #handlePlay(request: RequestInfo | URL, init?: RequestInit) {
+        const PREF_STREAM_TARGET_RESOLUTION = getPref(PrefKey.STREAM_TARGET_RESOLUTION);
+        const PREF_STREAM_PREFERRED_LOCALE = getPref(PrefKey.STREAM_PREFERRED_LOCALE);
+
+        const url = (typeof request === 'string') ? request : (request as Request).url;
+        const parsedUrl = new URL(url);
+
+        let badgeRegion: string = parsedUrl.host.split('.', 1)[0];
+        for (let regionName in STATES.serverRegions) {
+            const region = STATES.serverRegions[regionName];
+            if (parsedUrl.origin == region.baseUri) {
+                badgeRegion = regionName;
+                break;
+            }
+        }
+        StreamBadges.getInstance().setRegion(badgeRegion);
+
+        const clone = (request as Request).clone();
+        const body = await clone.json();
+
+        // Force stream's resolution
+        if (PREF_STREAM_TARGET_RESOLUTION !== 'auto') {
+            const osName = (PREF_STREAM_TARGET_RESOLUTION === '720p') ? 'android' : 'windows';
+            body.settings.osName = osName;
+        }
+
+        // Override "locale" value
+        if (PREF_STREAM_PREFERRED_LOCALE !== 'default') {
+            body.settings.locale = PREF_STREAM_PREFERRED_LOCALE;
+        }
+
+        const newRequest = new Request(request, {
+            body: JSON.stringify(body),
+        });
+
+        return NATIVE_FETCH(newRequest);
+    }
+
+    static async #handleWaitTime(request: RequestInfo | URL, init?: RequestInit) {
+        const response = await NATIVE_FETCH(request, init);
+
+        if (getPref(PrefKey.UI_LOADING_SCREEN_WAIT_TIME)) {
+            const json = await response.clone().json();
+            if (json.estimatedAllocationTimeInSeconds > 0) {
+                // Setup wait time overlay
+                LoadingScreen.setupWaitTime(json.estimatedTotalWaitTimeInSeconds);
+            }
+        }
+
+        return response;
+    }
+
+    static async #handleConfiguration(request: RequestInfo | URL, init?: RequestInit) {
+        if ((request as Request).method !== 'GET') {
+            return NATIVE_FETCH(request, init);
+        }
+
+        // Touch controller for all games
+        if (getPref(PrefKey.STREAM_TOUCH_CONTROLLER) === 'all') {
+            const titleInfo = STATES.currentStream.titleInfo;
+            if (titleInfo?.details.hasTouchSupport) {
+                TouchController.disable();
+            } else {
+                TouchController.enable();
+            }
+        }
+
+        // Intercept configurations
+        const response = await NATIVE_FETCH(request, init);
+        const text = await response.clone().text();
+        if (!text.length) {
+            return response;
+        }
+
+        const obj = JSON.parse(text);
+        let overrides = JSON.parse(obj.clientStreamingConfigOverrides || '{}') || {};
+
+        overrides.inputConfiguration = overrides.inputConfiguration || {};
+        overrides.inputConfiguration.enableVibration = true;
+
+        let overrideMkb: boolean | null = null;
+
+        if (getPref(PrefKey.NATIVE_MKB_ENABLED) === 'on' || (STATES.currentStream.titleInfo && BX_FLAGS.ForceNativeMkbTitles?.includes(STATES.currentStream.titleInfo.details.productId))) {
+            overrideMkb = true;
+        }
+
+        if (getPref(PrefKey.NATIVE_MKB_ENABLED) === 'off') {
+            overrideMkb = false;
+        }
+
+        if (overrideMkb !== null) {
+            overrides.inputConfiguration = Object.assign(overrides.inputConfiguration, {
+                enableMouseInput: overrideMkb,
+                enableKeyboardInput: overrideMkb,
+            });
+        }
+
+        // Enable touch controller
+        if (TouchController.isEnabled()) {
+            overrides.inputConfiguration.enableTouchInput = true;
+            overrides.inputConfiguration.maxTouchPoints = 10;
+        }
+
+        // Enable mic
+        if (getPref(PrefKey.AUDIO_MIC_ON_PLAYING)) {
+            overrides.audioConfiguration = overrides.audioConfiguration || {};
+            overrides.audioConfiguration.enableMicrophone = true;
+        }
+
+        obj.clientStreamingConfigOverrides = JSON.stringify(overrides);
+
+        response.json = () => Promise.resolve(obj);
+        response.text = () => Promise.resolve(JSON.stringify(obj));
+
+        return response;
+    }
+
+    static async handle(request: RequestInfo | URL, init?: RequestInit) {
+        let url = (typeof request === 'string') ? request : (request as Request).url;
+
+        // Server list
+        if (url.endsWith('/v2/login/user')) {
+            return XcloudInterceptor.#handleLogin(request, init);
+        } else if (url.endsWith('/sessions/cloud/play')) {  // Get session
+            return XcloudInterceptor.#handlePlay(request, init);
+        } else if (url.includes('xboxlive.com') && url.includes('/waittime/')) {
+            return XcloudInterceptor.#handleWaitTime(request, init);
+        } else if (url.endsWith('/configuration')) {
+            return XcloudInterceptor.#handleConfiguration(request, init);
+        } else if (url && url.endsWith('/ice') && url.includes('/sessions/') && (request as Request).method === 'GET') {
+            return patchIceCandidates(request as Request);
+        }
+
+        return NATIVE_FETCH(request, init);
+    }
+}
--- a/src/utils/xhome-interceptor.ts
+++ b/src/utils/xhome-interceptor.ts
@ -0,0 +1,184 @@
+import { RemotePlay } from "@/modules/remote-play";
+import { TouchController } from "@/modules/touch-controller";
+import { BxEvent } from "./bx-event";
+import { InputType } from "./bx-exposed";
+import { NATIVE_FETCH } from "./bx-flags";
+import { STATES } from "./global";
+import { getPref, PrefKey } from "./preferences";
+import { patchIceCandidates } from "./network";
+
+export class XhomeInterceptor {
+    static #consoleAddrs: {[index: string]: number} = {};
+
+    static async #handleLogin(request: Request) {
+        try {
+            const clone = (request as Request).clone();
+
+            const obj = await clone.json();
+            obj.offeringId = 'xhome';
+
+            request = new Request('https://xhome.gssv-play-prod.xboxlive.com/v2/login/user', {
+                method: 'POST',
+                body: JSON.stringify(obj),
+                headers: {
+                    'Content-Type': 'application/json',
+                },
+            });
+        } catch (e) {
+            alert(e);
+            console.log(e);
+        }
+
+        return NATIVE_FETCH(request);
+    }
+
+    static async #handleConfiguration(request: Request | URL) {
+        const response = await NATIVE_FETCH(request);
+
+        const obj = await response.clone().json()
+        console.log(obj);
+
+        const serverDetails = obj.serverDetails;
+        if (serverDetails.ipAddress) {
+            XhomeInterceptor.#consoleAddrs[serverDetails.ipAddress] = serverDetails.port;
+        }
+
+        if (serverDetails.ipV4Address) {
+            XhomeInterceptor.#consoleAddrs[serverDetails.ipV4Address] = serverDetails.ipV4Port;
+        }
+
+        if (serverDetails.ipV6Address) {
+            XhomeInterceptor.#consoleAddrs[serverDetails.ipV6Address] = serverDetails.ipV6Port;
+        }
+
+        response.json = () => Promise.resolve(obj);
+        response.text = () => Promise.resolve(JSON.stringify(obj));
+
+        return response;
+    }
+
+    static async #handleInputConfigs(request: Request | URL, opts: {[index: string]: any}) {
+        const response = await NATIVE_FETCH(request);
+
+        if (getPref(PrefKey.STREAM_TOUCH_CONTROLLER) !== 'all') {
+            return response;
+        }
+
+        const obj = await response.clone().json() as any;
+
+        const xboxTitleId = JSON.parse(opts.body).titleIds[0];
+        STATES.currentStream.xboxTitleId = xboxTitleId;
+
+        const inputConfigs = obj[0];
+
+        let hasTouchSupport = inputConfigs.supportedTabs.length > 0;
+        if (!hasTouchSupport) {
+            const supportedInputTypes = inputConfigs.supportedInputTypes;
+            hasTouchSupport = supportedInputTypes.includes(InputType.NATIVE_TOUCH) || supportedInputTypes.includes(InputType.CUSTOM_TOUCH_OVERLAY);
+        }
+
+        if (hasTouchSupport) {
+            TouchController.disable();
+
+            BxEvent.dispatch(window, BxEvent.CUSTOM_TOUCH_LAYOUTS_LOADED, {
+                data: null,
+            });
+        } else {
+            TouchController.enable();
+            TouchController.getCustomLayouts(xboxTitleId);
+        }
+
+        response.json = () => Promise.resolve(obj);
+        response.text = () => Promise.resolve(JSON.stringify(obj));
+
+        return response;
+    }
+
+    static async #handleTitles(request: Request) {
+        const clone = request.clone();
+
+        const headers: {[index: string]: any} = {};
+        for (const pair of (clone.headers as any).entries()) {
+            headers[pair[0]] = pair[1];
+        }
+        headers.authorization = `Bearer ${RemotePlay.XCLOUD_TOKEN}`;
+
+        const index = request.url.indexOf('.xboxlive.com');
+        request = new Request('https://wus.core.gssv-play-prod' + request.url.substring(index), {
+            method: clone.method,
+            body: await clone.text(),
+            headers: headers,
+        });
+
+        return NATIVE_FETCH(request);
+    }
+
+    static async #handlePlay(request: RequestInfo | URL) {
+        const clone = (request as Request).clone();
+        const body = await clone.json();
+
+        // body.settings.useIceConnection = true;
+
+        const newRequest = new Request(request, {
+            body: JSON.stringify(body),
+        });
+
+        return NATIVE_FETCH(newRequest);
+    }
+
+    static async handle(request: Request) {
+        TouchController.disable();
+
+        const clone = request.clone();
+
+        const headers: {[index: string]: string} = {};
+        for (const pair of (clone.headers as any).entries()) {
+            headers[pair[0]] = pair[1];
+        }
+        // Add xHome token to headers
+        headers.authorization = `Bearer ${RemotePlay.XHOME_TOKEN}`;
+
+        // Patch resolution
+        const deviceInfo = RemotePlay.BASE_DEVICE_INFO;
+        if (getPref(PrefKey.REMOTE_PLAY_RESOLUTION) === '720p') {
+            deviceInfo.dev.os.name = 'android';
+        }
+
+        headers['x-ms-device-info'] = JSON.stringify(deviceInfo);
+
+        const opts: {[index: string]: any} = {
+            method: clone.method,
+            headers: headers,
+        };
+
+        if (clone.method === 'POST') {
+            opts.body = await clone.text();
+        }
+
+        let newUrl = request.url;
+        if (!newUrl.includes('/servers/home')) {
+            const index = request.url.indexOf('.xboxlive.com');
+            newUrl = STATES.remotePlay.server + request.url.substring(index + 13);
+        }
+
+        request = new Request(newUrl, opts);
+        let url = (typeof request === 'string') ? request : request.url;
+
+        // Get console IP
+        if (url.includes('/configuration')) {
+            return XhomeInterceptor.#handleConfiguration(request);
+        } else if (url.endsWith('/sessions/home/play')) {
+            return XhomeInterceptor.#handlePlay(request);
+        } else if (url.includes('inputconfigs')) {
+            return XhomeInterceptor.#handleInputConfigs(request, opts);
+        } else if (url.includes('/login/user')) {
+            return XhomeInterceptor.#handleLogin(request);
+        } else if (url.endsWith('/titles')) {
+            return XhomeInterceptor.#handleTitles(request);
+        } else if (url && url.endsWith('/ice') && url.includes('/sessions/') && (request as Request).method === 'GET') {
+            return patchIceCandidates(request, XhomeInterceptor.#consoleAddrs);
+        }
+
+        return await NATIVE_FETCH(request);
+    }
+}
--- a/src/web-components/bx-select.ts
+++ b/src/web-components/bx-select.ts
@ -0,0 +1,115 @@
+import { ButtonStyle, CE, createButton } from "@utils/html";
+
+export class BxSelectElement {
+    static wrap($select: HTMLSelectElement) {
+        const $btnPrev = createButton({
+            label: '<',
+            style: ButtonStyle.FOCUSABLE,
+            attributes: {
+                tabindex: 0,
+            },
+        });
+
+        const $btnNext = createButton({
+            label: '>',
+            style: ButtonStyle.FOCUSABLE,
+            attributes: {
+                tabindex: 0,
+            },
+        });
+
+        const isMultiple = $select.multiple;
+        let visibleIndex = $select.selectedIndex;
+        let $checkBox: HTMLInputElement;
+        let $label: HTMLElement;
+
+        const $content = CE('div', {},
+            $checkBox = CE('input', {type: 'checkbox', id: $select.id + '_checkbox'}),
+            $label = CE('label', {for: $select.id + '_checkbox'}, ''),
+        );
+
+        isMultiple && $checkBox.addEventListener('input', e => {
+            const $option = getOptionAtIndex(visibleIndex);
+            $option && ($option.selected = (e.target as HTMLInputElement).checked);
+
+            $select.dispatchEvent(new Event('input'));
+        });
+
+        // Only show checkbox in "multiple" <select>
+        $checkBox.classList.toggle('bx-gone', !isMultiple);
+
+        const getOptionAtIndex = (index: number): HTMLOptionElement | undefined => {
+            return $select.querySelector(`option:nth-of-type(${visibleIndex + 1})`) as HTMLOptionElement;
+        }
+
+        const render = () => {
+            // console.log('options', this.options, 'selectedIndices', this.selectedIndices, 'selectedOptions', this.selectedOptions);
+
+            visibleIndex = normalizeIndex(visibleIndex);
+
+            const $option = getOptionAtIndex(visibleIndex);
+            let content = '';
+            if ($option) {
+                content = $option.textContent || '';
+            }
+
+            $label.textContent = content;
+
+            // Hide checkbox when the selection is empty
+            isMultiple && ($checkBox.checked = $option?.selected || false);
+            $checkBox.classList.toggle('bx-gone', !isMultiple || !content);
+
+            const disablePrev = visibleIndex <= 0;
+            const disableNext = visibleIndex === $select.querySelectorAll('option').length - 1;
+
+            $btnPrev.classList.toggle('bx-inactive', disablePrev);
+            disablePrev && $btnNext.focus();
+
+            $btnNext.classList.toggle('bx-inactive', disableNext);
+            disableNext && $btnPrev.focus();
+        }
+
+        const normalizeIndex = (index: number): number => {
+            return Math.min(Math.max(index, 0), $select.querySelectorAll('option').length - 1);
+        }
+
+        const onPrevNext = (e: Event) => {
+            const goNext = e.target === $btnNext;
+
+            const currentIndex = visibleIndex;
+            let newIndex = goNext ? currentIndex + 1 : currentIndex - 1;
+            newIndex = normalizeIndex(newIndex);
+
+            visibleIndex = newIndex;
+            if (!isMultiple && newIndex !== currentIndex) {
+                $select.selectedIndex = newIndex;
+            }
+
+            $select.dispatchEvent(new Event('input'));
+        };
+
+        $select.addEventListener('input', e => render());
+        $btnPrev.addEventListener('click', onPrevNext);
+        $btnNext.addEventListener('click', onPrevNext);
+
+        const observer = new MutationObserver((mutationList, observer) => {
+            mutationList.forEach(mutation => {
+                mutation.type === 'childList' && render();
+            });
+        });
+
+        observer.observe($select, {
+            subtree: true,
+            childList: true,
+        });
+
+        render();
+
+        return CE('div', {class: 'bx-select'},
+            $select,
+            $btnPrev,
+            $content,
+            $btnNext,
+        );
+    }
+}
Author	SHA1	Message	Date
redphx	55a56837c8	Bump version to 5.3.0	2024-07-14 17:53:35 +07:00
redphx	df713136d8	Update better-xcloud.user.js	2024-07-14 17:51:37 +07:00
redphx	29dfdaf72e	Show allocation time instead of total wait time	2024-07-14 17:51:32 +07:00
redphx	04cf66a466	Update better-xcloud.user.js	2024-07-14 16:44:38 +07:00
redphx	1d55026c6d	Add option to show wait time in game card	2024-07-14 16:44:18 +07:00
redphx	fcfecf7ff9	Update global-settings.styl	2024-07-14 09:18:06 +07:00
redphx	5e22bf097a	Optimize checkHeader()	2024-07-14 09:17:12 +07:00
redphx	542079d53e	Update translations	2024-07-13 20:15:36 +07:00
redphx	1d00d793b8	Bump version to 5.2.0	2024-07-13 18:27:51 +07:00
redphx	2a9da6f827	Update better-xcloud.user.js	2024-07-13 18:24:18 +07:00
redphx	b6089a61f9	Update translations	2024-07-13 18:22:43 +07:00
redphx	0fe6608be9	Disable "patchSetCurrentlyFocusedInteractable" patch	2024-07-13 18:07:09 +07:00
redphx	9e39e80309	Fix watchHeader() being called multiple times	2024-07-13 18:04:17 +07:00
redphx	5bfcf3a044	Refactor header.ts	2024-07-13 18:00:15 +07:00
redphx	66d5d9edc6	Disable the region selection box when the server lis is empty	2024-07-13 17:41:27 +07:00
redphx	9d00082c67	Disable "EnableWifiWarnings" flag	2024-07-13 17:35:45 +07:00
redphx	ef2e0892bc	Add setting to bypass region restriction	2024-07-13 17:27:40 +07:00
redphx	ce1901b300	Refactor network.ts	2024-07-13 16:19:33 +07:00
redphx	18a8b8330c	Add "patchSetCurrentlyFocusedInteractable" patch	2024-07-13 16:07:53 +07:00
redphx	b9e78f09d3	Update better-xcloud.user.js	2024-07-12 06:20:02 +07:00
redphx	33b2b36e2b	Revert "Remove website's version detection" This reverts commit `91ab57fa29`.	2024-07-12 06:19:30 +07:00
redphx	61ed68c40f	Update better-xcloud.user.js	2024-07-10 07:18:18 +07:00
redphx	4ad0d44929	Disable touch for non-touch supported User-Agent profile	2024-07-10 07:18:10 +07:00
redphx	422442071e	Bump version to 5.1.3	2024-07-09 18:31:18 +07:00
redphx	8d1ae0656c	Update better-xcloud.user.js	2024-07-09 07:53:46 +07:00
redphx	a78de2ca37	Hide Stream settings when the Guide menu is shown (#441 )	2024-07-09 07:53:36 +07:00
redphx	db1da22c0a	Remove SMART_TV_UNIQUE_ID from SMART_TV_GENERIC profile	2024-07-09 07:48:05 +07:00
redphx	91ab57fa29	Remove website's version detection	2024-07-09 07:46:42 +07:00
redphx	416307e23a	Fix "alwaysShowStreamHud" not working on non-TV devices	2024-07-08 20:05:20 +07:00
redphx	e7c94f3ece	Update better-xcloud.user.js	2024-07-08 18:06:23 +07:00
redphx	ea9ad16770	Don't show negative packetLost	2024-07-08 18:02:07 +07:00
redphx	9a2e7de68d	Update better-xcloud.user.js	2024-07-08 17:55:01 +07:00
redphx	962f4dec6d	Minor update	2024-07-08 17:45:38 +07:00
redphx	10d0dedc0a	Add "alwaysShowStreamHud" patch	2024-07-08 17:17:28 +07:00
redphx	c6acc251ae	Update bun	2024-07-08 08:06:54 +07:00
redphx	a06d061409	Update better-xcloud.user.js	2024-07-08 07:32:33 +07:00
redphx	6b2412ff27	Disable Onboarding screen	2024-07-08 07:32:16 +07:00
redphx	0f360d4be1	Bump version to 5.1.2	2024-07-07 21:37:15 +07:00
redphx	900ab38153	Minor fixes	2024-07-07 19:20:58 +07:00
redphx	c03c63f3c3	Update better-xcloud.user.js	2024-07-07 18:23:37 +07:00
redphx	d4f4084991	Disable "Most popular" option	2024-07-07 18:22:41 +07:00
redphx	975549b4e7	Add option to hide "All games" section	2024-07-07 18:16:50 +07:00
redphx	345d0f78dc	Add option to hide "News" section	2024-07-07 16:55:57 +07:00
redphx	938dfa6aaa	Add option to hide "Friends" section	2024-07-07 16:43:56 +07:00
redphx	d7ed9e1603	Add "ignorePlayWithFriendsSection" patch	2024-07-07 16:14:08 +07:00
redphx	224e98829d	Improve "enableXcloudLogger" patch	2024-07-07 15:28:33 +07:00
redphx	56a3f1d8c8	Bug fixes	2024-07-07 14:59:12 +07:00
redphx	d82a38c0f1	Update better-xcloud.user.js	2024-07-07 11:21:22 +07:00
redphx	77729789e3	Fix problems in the Guide menu #436 #438	2024-07-07 11:20:43 +07:00
redphx	5763701355	Update better-xcloud.user.js	2024-07-06 20:58:08 +07:00
redphx	cafeed1a3c	Bug fixes	2024-07-06 20:48:27 +07:00
redphx	691f116ea0	Add "enableTvRoutes" patch	2024-07-06 17:14:02 +07:00
redphx	481b365e6e	Add "IsSupportedTvBrowser" flag	2024-07-06 16:13:53 +07:00
redphx	2b63edb7eb	Refactor browser & userAgent's capabilities	2024-07-06 15:53:01 +07:00
redphx	b6746598a3	Update better-xcloud.user.js	2024-07-13 12:26:53 +07:00
redphx	45bda4bb24	Fix script not being loaded after refreshing token	2024-07-13 12:19:07 +07:00
redphx	c93db035f3	Update ICE candidates	2024-07-06 11:08:41 +07:00
redphx	e75fa397ee	Bump version to 5.1.1	2024-07-02 18:11:08 +07:00
redphx	98a9f4fc37	Update better-xcloud.user.js	2024-07-02 18:10:52 +07:00
redphx	dee8c9dbd0	Refactor buttons in guide-menu	2024-07-02 18:06:33 +07:00
redphx	d31a06be89	Use {once: true} in some event listeners	2024-07-02 17:20:23 +07:00
redphx	277c777121	Add "Show controller connection status" setting	2024-07-02 17:08:40 +07:00
redphx	385fd71e86	Update better-xcloud.user.js	2024-07-02 06:49:40 +07:00
redphx	986d9fe088	Show "Stream settings" and "App settings" in the Guide menu	2024-07-02 06:41:23 +07:00
redphx	6de235ce2f	Fix overriding experimentation stopped working	2024-07-02 05:50:02 +07:00
redphx	f027565534	Bump version to 5.1.0	2024-07-01 18:08:46 +07:00
redphx	0213b860fd	No longer need "Kiwi Browser v123" profile	2024-07-01 17:52:12 +07:00
redphx	13feb36aae	Update better-xcloud.user.js	2024-07-01 17:44:49 +07:00
redphx	d83261d816	Dim Stream settings' overlay when not playing	2024-07-01 17:42:42 +07:00
redphx	c1502b5552	Prepare for webOS & Tizen support	2024-07-01 17:26:04 +07:00
redphx	64d60aedfa	Create bun.lockb	2024-07-01 17:23:13 +07:00
redphx	889a97e56b	Stop using setCodecPreferences() as it causes stuttering on Chromium 124+	2024-07-01 17:22:24 +07:00
redphx	7aee4d5148	Compress CSS	2024-07-01 17:20:39 +07:00
redphx	2000d6d80e	Update translations	2024-06-26 21:00:38 +07:00
				`@ -0,0 +1 @@`
				`e && BxEvent.dispatch(window, BxEvent.NAVIGATION_FOCUS_CHANGED, {element: e});`