Bump version to 1.10.2

* Update README.md

* Bump version to 1.10.1

* Bump version to 1.10.1

.github/ISSUE_TEMPLATE/bug_report.md

@@ -7,28 +7,15 @@ assignees: ''
 
 ---
 
-**Describe the bug**
-A clear and concise description of what the bug is.
-
-**To Reproduce**
-Steps to reproduce the behavior:
-1. Go to '...'
-2. Click on '....'
-3. Scroll down to '....'
-4. See error
-
-**Expected behavior**
-A clear and concise description of what you expected to happen.
-
-**Screenshots**
-If applicable, add screenshots to help explain your problem.
-
-**Platform (please complete the following information):**
- - Device: [e.g. Phone/Laptop/Desktop/TV]  
- - OS: [e.g. Android]  
+**Platform**
+ - Device: [e.g. Phone, Laptop, Desktop, TV]  
+ - OS: [e.g. Windows, Android, iOS]  
  - Browser: [e.g. Chrome, Kiwi]  
  - Browser Version: [e.g. 100]  
 - Better xCloud Version: [e.g. 1.4]  
 
-**Additional context**
-Add any other context about the problem here.
+**Describe the bug**
+...
+
+**Screenshots/Videos**
+If applicable, add screenshots/videos to help explain your problem.

.github/ISSUE_TEMPLATE/feature_request.md

@@ -7,14 +7,10 @@ assignees: ''
 
 ---
 
-**Is your feature request related to a problem? Please describe.**
-A clear and concise description of what the problem is. Ex. I'm always frustrated when [...]
-
-**Describe the solution you'd like**
-A clear and concise description of what you want to happen.
-
-**Describe alternatives you've considered**
-A clear and concise description of any alternative solutions or features you've considered.
-
-**Additional context**
-Add any other context or screenshots about the feature request here.
+**I'm using:**  
+- Device:
+- OS:
+- Browser:
+  
+**I want to suggest this feature:**  
+...

README.md

@@ -59,8 +59,11 @@ Give this project a 🌟 if you like it. Thank you 🙏.
 - **🔥 Touch controller**
   > Only for mobile (Android/iOS/iPadOS).  
   > - **Default**: nothing change.  
-  > - **All games**: enable touch controller support for all games. Games with custom layout won't be affected.  
   > - **Off**: stop the touch controller from showing when touching the screen. Useful when you play on a device with a built-in controller like Logitech G Cloud, Steam Deck, etc.  
+  > - **All games**: enable touch controller support for all games. Games with custom layout won't be affected.  
+  > Double-tap anywhere at the bottom of the screen to show/hide the controller. Useful when you're viewing cutscenes.
+  > ![touch-controller](https://github.com/redphx/better-xcloud/assets/96280/6ad6fc76-74aa-46f8-8fb0-806474f494ad)
+
 - **Hide mouse cursor on idle**  
   > Hide the mouse cursor after 3 seconds of not moving.  
 
@@ -90,7 +93,7 @@ Give this project a 🌟 if you like it. Thank you 🙏.
 - **Display stream's statuses**
   > Region/Server/Codecs/Resolution...  
   > Current playtime of the session.  
-  > Current battery level.  
+  > Current battery level. Not working on [some browsers](https://caniuse.com/battery-status).  
   > Estimated total data sent/received.  
 
 ### Advanced features  
@@ -211,7 +214,10 @@ No, you can't. You'll have to modify the app.
 No. The "Clarity Boost" feature uses an exclusive API (`Video.msVideoProcessing`) that's only available on Edge browser for desktop at the moment.
 
 6. **Will it be able to request a lower FPS or increase the maximum bitrate (15Mbps) of the stream?**  
-Sorry, no. The server decides all these settings.  
+Sorry, no. The server decides all these settings.
+
+7. **What's the meaning behind the name "Better xCloud"?**  
+It's a reference to an Userscript called "better360" that I created many years ago. I regret not choosing the name "xCloud Enhancement Suite", or XES for short.  
 
 ## User-Agent
 Moved to [wiki](https://github.com/redphx/better-xcloud/wiki/User‐Agent).

better-xcloud.meta.js

@@ -1,5 +1,5 @@
 // ==UserScript==
 // @name         Better xCloud
 // @namespace    https://github.com/redphx
-// @version      1.10
+// @version      1.10.2
 // ==/UserScript==

better-xcloud.user.js

@@ -1,7 +1,7 @@
 // ==UserScript==
 // @name         Better xCloud
 // @namespace    https://github.com/redphx
-// @version      1.10
+// @version      1.10.2
 // @description  Improve Xbox Cloud Gaming (xCloud) experience
 // @author       redphx
 // @license      MIT
@@ -13,7 +13,7 @@
 // ==/UserScript==
 'use strict';
 
-const SCRIPT_VERSION = '1.10';
+const SCRIPT_VERSION = '1.10.2';
 const SCRIPT_HOME = 'https://github.com/redphx/better-xcloud';
 
 const SERVER_REGIONS = {};
@@ -23,7 +23,6 @@ var $SCREENSHOT_CANVAS;
 var GAME_TITLE_ID;
 
 const TOUCH_SUPPORTED_GAME_IDS = new Set();
-var SHOW_GENERIC_TOUCH_CONTROLLER = false;
 
 // Credit: https://phosphoricons.com
 const ICON_VIDEO_SETTINGS = '<path d="M16 9.144A6.89 6.89 0 0 0 9.144 16 6.89 6.89 0 0 0 16 22.856 6.89 6.89 0 0 0 22.856 16 6.9 6.9 0 0 0 16 9.144zm0 11.427c-2.507 0-4.571-2.064-4.571-4.571s2.064-4.571 4.571-4.571 4.571 2.064 4.571 4.571-2.064 4.571-4.571 4.571zm15.704-7.541c-.065-.326-.267-.607-.556-.771l-4.26-2.428-.017-4.802c-.001-.335-.15-.652-.405-.868-1.546-1.307-3.325-2.309-5.245-2.953-.306-.103-.641-.073-.923.085L16 3.694l-4.302-2.407c-.282-.158-.618-.189-.924-.086a16.02 16.02 0 0 0-5.239 2.964 1.14 1.14 0 0 0-.403.867L5.109 9.84.848 12.268a1.14 1.14 0 0 0-.555.771 15.22 15.22 0 0 0 0 5.936c.064.326.267.607.555.771l4.261 2.428.017 4.802c.001.335.149.652.403.868 1.546 1.307 3.326 2.309 5.245 2.953.306.103.641.073.923-.085L16 28.306l4.302 2.407a1.13 1.13 0 0 0 .558.143 1.18 1.18 0 0 0 .367-.059c1.917-.648 3.695-1.652 5.239-2.962.255-.216.402-.532.405-.866l.021-4.807 4.261-2.428a1.14 1.14 0 0 0 .555-.771 15.21 15.21 0 0 0-.003-5.931zm-2.143 4.987l-4.082 2.321a1.15 1.15 0 0 0-.429.429l-.258.438a1.13 1.13 0 0 0-.174.601l-.022 4.606a13.71 13.71 0 0 1-3.623 2.043l-4.117-2.295a1.15 1.15 0 0 0-.559-.143h-.546c-.205-.005-.407.045-.586.143l-4.119 2.3a13.74 13.74 0 0 1-3.634-2.033l-.016-4.599a1.14 1.14 0 0 0-.174-.603l-.257-.437c-.102-.182-.249-.333-.429-.437l-4.085-2.328a12.92 12.92 0 0 1 0-4.036l4.074-2.325a1.15 1.15 0 0 0 .429-.429l.258-.438a1.14 1.14 0 0 0 .175-.601l.021-4.606a13.7 13.7 0 0 1 3.625-2.043l4.11 2.295a1.14 1.14 0 0 0 .585.143h.52c.205.005.407-.045.586-.143l4.119-2.3a13.74 13.74 0 0 1 3.634 2.033l.016 4.599a1.14 1.14 0 0 0 .174.603l.257.437c.102.182.249.333.429.438l4.085 2.327a12.88 12.88 0 0 1 .007 4.041h.007z" fill-rule="nonzero"/>';
@@ -31,6 +30,126 @@ const ICON_STREAM_STATS = '<path d="M27.295 9.31C24.303 6.313 20.234 4.631 16 4.
 const ICON_SCREENSHOT_B64 = 'data:image/svg+xml;base64,PHN2ZyB4bWxucz0iaHR0cDovL3d3dy53My5vcmcvMjAwMC9zdmciIHdpZHRoPSIyNCIgaGVpZ2h0PSIyNCIgdmlld0JveD0iMCAwIDMyIDMyIiBmaWxsPSIjZmZmIj48cGF0aCBkPSJNMjguMzA4IDUuMDM4aC00LjI2NWwtMi4wOTctMy4xNDVhMS4yMyAxLjIzIDAgMCAwLTEuMDIzLS41NDhoLTkuODQ2YTEuMjMgMS4yMyAwIDAgMC0xLjAyMy41NDhMNy45NTYgNS4wMzhIMy42OTJBMy43MSAzLjcxIDAgMCAwIDAgOC43MzF2MTcuMjMxYTMuNzEgMy43MSAwIDAgMCAzLjY5MiAzLjY5MmgyNC42MTVBMy43MSAzLjcxIDAgMCAwIDMyIDI1Ljk2MlY4LjczMWEzLjcxIDMuNzEgMCAwIDAtMy42OTItMy42OTJ6bS02Ljc2OSAxMS42OTJjMCAzLjAzOS0yLjUgNS41MzgtNS41MzggNS41MzhzLTUuNTM4LTIuNS01LjUzOC01LjUzOCAyLjUtNS41MzggNS41MzgtNS41MzggNS41MzggMi41IDUuNTM4IDUuNTM4eiIvPjwvc3ZnPgo=';
 
 
+class TouchController {
+    static get #EVENT_SHOW_CONTROLLER() {
+        return new MessageEvent('message', {
+                    data: '{"content":"{\\"layoutId\\":\\"\\"}","target":"/streaming/touchcontrols/showlayoutv2","type":"Message"}',
+                    origin: 'better-xcloud',
+                });
+    }
+
+    static get #EVENT_HIDE_CONTROLLER() {
+        return new MessageEvent('message', {
+                    data: '{"content":"","target":"/streaming/touchcontrols/hide","type":"Message"}',
+                    origin: 'better-xcloud',
+                });
+    }
+
+    static #$bar;
+    static #enable = false;
+    static #showing = false;
+    static #dataChannel;
+
+    static enable() {
+        TouchController.#enable = true;
+    }
+
+    static disable() {
+        TouchController.#enable = false;
+    }
+
+    static isEnabled() {
+        return TouchController.#enable;
+    }
+
+    static #show() {
+        TouchController.#dispatchMessage(TouchController.#EVENT_SHOW_CONTROLLER);
+        TouchController.#showing = true;
+    }
+
+    static #hide() {
+        TouchController.#dispatchMessage(TouchController.#EVENT_HIDE_CONTROLLER);
+        TouchController.#showing = false;
+    }
+
+    static #toggleVisibility() {
+        if (!TouchController.#dataChannel) {
+            return;
+        }
+
+        TouchController.#showing ? TouchController.#hide() : TouchController.#show();
+    }
+
+    static enableBar() {
+        TouchController.#$bar && TouchController.#$bar.setAttribute('data-showing', true);
+    }
+
+    static reset() {
+        TouchController.#enable = false;
+        TouchController.#showing = false;
+        TouchController.#dataChannel = null;
+
+        TouchController.#$bar && TouchController.#$bar.removeAttribute('data-showing');
+    }
+
+    static #dispatchMessage(msg) {
+        TouchController.#dataChannel && setTimeout(() => {
+            TouchController.#dataChannel.dispatchEvent(msg);
+        }, 10);
+    }
+
+    static setup() {
+        const $bar = createElement('div', {'id': 'better-xcloud-touch-controller-bar'});
+        document.documentElement.appendChild($bar);
+
+        // Setup double-tap event
+        let clickTimeout;
+        $bar.addEventListener('mousedown', e => {
+            clickTimeout && clearTimeout(clickTimeout);
+            if (clickTimeout) {
+                // Double-clicked
+                clickTimeout = null;
+                TouchController.#toggleVisibility();
+                return;
+            }
+
+            clickTimeout = setTimeout(() => {
+                clickTimeout = null;
+            }, 400);
+        });
+
+        TouchController.#$bar = $bar;
+
+        RTCPeerConnection.prototype.orgCreateDataChannel = RTCPeerConnection.prototype.createDataChannel;
+        RTCPeerConnection.prototype.createDataChannel = function() {
+            const dataChannel = this.orgCreateDataChannel.apply(this, arguments);
+            if (!TouchController.#enable) {
+                return dataChannel;
+            }
+
+            TouchController.#dataChannel = dataChannel;
+
+            // Fix sometimes the touch controller doesn't show at the beginning
+            dataChannel.addEventListener('open', e => {
+                TouchController.#show();
+            });
+
+            dataChannel.addEventListener('message', msg => {
+                if (msg.origin === 'better-xcloud' || typeof msg.data !== 'string') {
+                    return;
+                }
+
+                // Dispatch a message to display generic touch controller
+                if (msg.data.includes('touchcontrols/showtitledefault')) {
+                    TouchController.#show();
+                }
+            });
+
+            return dataChannel;
+        };
+    }
+}
+
 class MouseCursorHider {
     static #timeout;
     static #cursorVisible = true;
@@ -1157,9 +1276,13 @@ div[class*=StreamMenu-module__menuContainer] > div[class*=Menu-module] {
     opacity: 0;
     position: fixed;
     bottom: 0;
-    width: 60px;
-    height: 60px;
-    padding: 12px;
+    box-sizing: border-box;
+    width: 16vh;
+    height: 16vh;
+    max-width: 128px;
+    max-height: 128px;
+    padding: 2vh;
+    padding: 24px 24px 12px 12px;
     background-size: cover;
     background-repeat: no-repeat;
     background-origin: content-box;
@@ -1172,11 +1295,11 @@ div[class*=StreamMenu-module__menuContainer] > div[class*=Menu-module] {
 }
 
 .better-xcloud-screenshot-button[data-showing=true] {
-    opacity: 1;
+    opacity: 0.9;
 }
 
 .better-xcloud-screenshot-button[data-capturing=true] {
-    padding: 6px;
+    padding: 1vh;
 }
 
 .better-xcloud-screenshot-canvas {
@@ -1404,6 +1527,21 @@ div[class*=StreamMenu-module__menuContainer] > div[class*=Menu-module] {
     font-family: Consolas, "Courier New", Courier, monospace;
 }
 
+#better-xcloud-touch-controller-bar {
+    display: none;
+    opacity: 0;
+    position: fixed;
+    bottom: 0;
+    left: 0;
+    right: 0;
+    height: 6vh;
+    z-index: 5555;
+}
+
+#better-xcloud-touch-controller-bar[data-showing=true] {
+    display: block !important;
+}
+
 /* Hide UI elements */
 #headerArea, #uhfSkipToMain, .uhf-footer {
     display: none;
@@ -1722,16 +1860,16 @@ function interceptHttpRequests() {
         }
 
         if (PREF_STREAM_TOUCH_CONTROLLER === 'all' && url.endsWith('/configuration') && url.includes('/sessions/cloud/') && request.method === 'GET') {
-            SHOW_GENERIC_TOUCH_CONTROLLER = false;
+            TouchController.disable();
             // Get game ID from window.location
             const match = window.location.pathname.match(/\/launch\/[^\/]+\/([\w\d]+)/);
             // Check touch support
             if (match && !TOUCH_SUPPORTED_GAME_IDS.has(match[1])) {
-                SHOW_GENERIC_TOUCH_CONTROLLER = true;
+                TouchController.enable();
             }
 
             const promise = orgFetch(...arg);
-            if (!SHOW_GENERIC_TOUCH_CONTROLLER) {
+            if (!TouchController.isEnabled()) {
                 return promise;
             }
 
@@ -1997,7 +2135,7 @@ function injectSettingsButton($parent) {
                 $control.title = 'Your browser doesn\'t support this feature';
             } else if (settingId === Preferences.STREAM_TOUCH_CONTROLLER) {
                 // Disable this setting for non-touchable devices
-                if (!('ontouchstart'in window) && navigator.maxTouchPoints === 0) {
+                if (!('ontouchstart' in window) && navigator.maxTouchPoints === 0) {
                     $control.disabled = true;
                     $control.title = 'Your device doesn\'t have touch support';
                 }
@@ -2540,6 +2678,7 @@ function onHistoryChanged() {
     document.querySelector('.better-xcloud-screenshot-button').style = '';
 
     MouseCursorHider.stop();
+    TouchController.reset();
 }
 
 
@@ -2547,6 +2686,10 @@ function onStreamStarted($video) {
     // Get title ID for screenshot's name
     GAME_TITLE_ID = /\/launch\/([^/]+)/.exec(window.location.pathname)[1];
 
+    if (TouchController.isEnabled()) {
+        TouchController.enableBar();
+    }
+
     const PREF_SCREENSHOT_BUTTON_POSITION = PREFS.get(Preferences.SCREENSHOT_BUTTON_POSITION);
     const PREF_STATS_QUICK_GLANCE = PREFS.get(Preferences.STATS_QUICK_GLANCE);
 
@@ -2641,6 +2784,22 @@ function onStreamStarted($video) {
 }
 
 
+function disablePwa() {
+    const userAgent = (window.navigator.orgUserAgent || window.navigator.userAgent || '').toLowerCase();
+    if (!userAgent) {
+        return;
+    }
+
+    // Check if it's Safari on mobile
+    if (userAgent.includes('mobile') && userAgent.includes('safari') && !userAgent.includes('chrom')) {
+        // Disable the PWA prompt
+        Object.defineProperty(window.navigator, 'standalone', {
+            value: true,
+        });
+    }
+}
+
+
 // Hide Settings UI when navigate to another page
 window.addEventListener('xcloud_popstate', onHistoryChanged);
 window.addEventListener('popstate', onHistoryChanged);
@@ -2673,36 +2832,7 @@ RTCPeerConnection.prototype.addIceCandidate = function(...args) {
 }
 
 if (PREFS.get(Preferences.STREAM_TOUCH_CONTROLLER) === 'all') {
-    RTCPeerConnection.prototype.orgCreateDataChannel = RTCPeerConnection.prototype.createDataChannel;
-    RTCPeerConnection.prototype.createDataChannel = function() {
-        const dataChannel = this.orgCreateDataChannel.apply(this, arguments);
-        if (!SHOW_GENERIC_TOUCH_CONTROLLER) {
-            return dataChannel;
-        }
-
-        const dispatchLayout = () => {
-            // Dispatch a message to display generic touch controller
-            dataChannel.dispatchEvent(new MessageEvent('message', {
-                data: '{"content":"{\\"layoutId\\":\\"\\"}","target":"/streaming/touchcontrols/showlayoutv2","type":"Message"}',
-                origin: 'better-xcloud',
-            }));
-        }
-
-        // Fix sometimes the touch controller doesn't show at the beginning
-        setTimeout(dispatchLayout, 100);
-
-        dataChannel.addEventListener('message', msg => {
-            if (msg.origin === 'better-xcloud' || typeof msg.data !== 'string') {
-                return;
-            }
-
-            if (msg.data.includes('touchcontrols/showtitledefault')) {
-                setTimeout(dispatchLayout, 10);
-            }
-        });
-
-        return dataChannel;
-    };
+    TouchController.setup();
 }
 
 
@@ -2717,7 +2847,4 @@ setupVideoSettingsBar();
 setupScreenshotButton();
 StreamStats.render();
 
-// Disable PWA prompt in Safari on iOS/iPadOS
-Object.defineProperty(window.navigator, 'standalone', {
-    value: true,
-});
+disablePwa();