Test native MKB feature with Remote Play

* Add initial support for MKB

* Refactor icons

* Enable native MKB support for some games

* Move Stream settings & stats buttons to Stream HUD bar

* Split stream settings into tabs

* Use bx-gone class to show/hide Settings sidebar

* Update translations

* Update Toast class

* Press F9 to toggle MKB feature

* Disable Gamepad Disconnected screen

* Change from F9 key to F8 key

* Reverse back to F9 key + disable "disableGamepadDisconnectedScreen" patch

* Fix "disableGamepadDisconnectedScreen" patch

* Add fade in/out animations for Toast

* Fix Settings tabs not showing

* Fix touch controller not showing sometimes

* Add basic remapping screen

* Update MKB layout

* Add edit/save states

* Add borders to highlight Quick Settings tabs

* Get key name from key code

* Move the Dots button to the beginning

* Disable non-working native MKB games

* Optimize Patcher class: only apply "playing" patches when needed

* Refactor renderMkbSettings() to MkbRemapper class

* Refactor the rendering process of MkbRemapper

* Implement new method to control analog stick using mouse

Heavily inspired by Yuzu's "Mouse panning" feature

* Update README.md

* Refactor setting elements

* Reduce button prompt's font size

* Render mouse settings

* Add a warning in MKB remapper

* Update preset's structure

* Disable "contextmenu" event of dialog & its overlay

* Fix bug in MkbPreset.convert()

* Detect scrolling events while binding

* Convert wheel events to button press

* Fix minor bugs in Stream settings

* Fix RT mapping

* Add setValue() method to SettingElement

* Update preset after binding new key

* Update preset after changing mouse's settings

* Update UI of mouse's settings

* Update style

* Fixed action buttons at the bottom

* Add support for "exactTicks" param to Number Stepper element

* Don't render first & last markers

* Add basic LocalDb class

* Allow switching between presets

* Enable/disable elements when editing preset

* Update translations

* Refactor code

* Define  "CE = createElement" globally

* Add createButton()

* Add icons to buttons

* Implement the "Cancel" button

* Implement the "Rename" button

* Add styling for disabled buttons

* Implement "New" & "Copy" buttons

* Implement "Delete" button

* Refactor code

* Fix exception when creating Default preset

* Set default name when copying preset

* Implement "Save" button

* Implement "Activate" button

* Implement switching preset data

* Pre-calculate mouse's sensitivities + fix not converting preset before using

* Fix mouse buttons not working

* Remove "not working" line

* Show "right-click-to-unbind" text

* Bug fixes

* Add ENABLE_NATIVE_MKB_BETA flag

* Update styling

* Add mention to Yuzu emu

* Pre-calculate mouse's sensitivities in MkbPreset.convert()

* Update translations

* Add donation link

* Update translations

* Add "Map mouse to" setting

* Fix styling

* Bug fixes

* Implement requestPointerLock()

* Hide pointerLock message when StreamMenu is being shown

* Fix bugs in Chrome

* Fix a bug causing Remote Play not working

* Remove "Disable bandwidth checking" feature as it's useless

* Update README.md

* Update styling

* Add URL to document

* Temporary disable the "Controller shortcuts" feature as it conflicts with the MKB feature

* Update translations

* Update README.md

.github/FUNDING.yml

@@ -0,0 +1 @@
+ko_fi: redphx

.github/ISSUE_TEMPLATE/bug_report.md

@@ -0,0 +1,21 @@
+---
+name: Bug report
+about: Create a report to help us improve
+title: "[Bug] ..."
+labels: bug
+assignees: ''
+
+---
+
+**Platform**
+ - Device: Phone, Laptop, Desktop, TV...
+ - OS: Windows, Android, iOS...
+ - Browser: Chrome, Safari, Kiwi...
+ - Browser Version:
+ - Better xCloud Version:
+
+**Describe the bug**
+...
+
+**Screenshots/Videos**
+If applicable, add screenshots/videos to help explain your problem.

.github/ISSUE_TEMPLATE/feature_request.md

@@ -0,0 +1,16 @@
+---
+name: Feature request
+about: Suggest an idea for this project
+title: "[Feature] ..."
+labels: enhancement
+assignees: ''
+
+---
+
+**I'm using:**  
+- Device:
+- OS:
+- Browser:
+  
+**I want to suggest this feature:**  
+...

LICENSE

@@ -1,6 +1,7 @@
 MIT License
 
 Copyright (c) 2023 redphx
+Copyright (c) 2020 Phosphor Icons
 
 Permission is hereby granted, free of charge, to any person obtaining a copy
 of this software and associated documentation files (the "Software"), to deal
@@ -19,3 +20,5 @@ AUTHORS OR COPYRIGHT HOLDERS BE LIABLE FOR ANY CLAIM, DAMAGES OR OTHER
 LIABILITY, WHETHER IN AN ACTION OF CONTRACT, TORT OR OTHERWISE, ARISING FROM,
 OUT OF OR IN CONNECTION WITH THE SOFTWARE OR THE USE OR OTHER DEALINGS IN THE
 SOFTWARE.
+
+---

README.md

@@ -1,70 +1,78 @@
 # Better xCloud
-Improve [Xbox Cloud Gaming (xCloud)](https://www.xbox.com/play/) experience on web browser.  
-The main target of this script is Android users, but it should work great on desktop too.
+Improve Xbox Cloud Gaming (xCloud) experience on [xbox.com/play](https://www.xbox.com/play). It also allows you to use Remote Play on the xCloud website.  
 
-## Features:
+**Supported platforms:**  
+- Windows
+- macOS
+- Linux, SteamOS (including Steam Deck)
+- Android, Android TV (including Meta Quest VR Headsets)
+- iOS, iPadOS
 
-<img width="474" alt="image" src="https://github.com/redphx/better-xcloud/assets/96280/2793d404-3185-4c91-a500-dde362c661dd">
+This script makes me spend more time with xCloud, and I hope the same thing happens to you.  
+If you like this project please give it a 🌟. Thank you 🙏.
 
-- Switch region of streaming server.
-- Prefer IPv6 streaming server (might improve latency).
-- Force HD stream by disabling bandwidth checking -> xCloud always tries to use the best possible quality.
-- Skip Xbox splash video.
-- Make the top-left dots icon invisible while playing. You can still click on it, but it doesn't block the screen anymore.
-- Stretch video to full sctreen. Useful when you don't have a 16:9 screen.
-- Adjust video filters (brightness/contrast/saturation).
-- Hide footer and other UI elements.
-- Reduce UI animations (the smooth scrolling cannot be disabled).
-- Disable social features (friends, chat...).
-- Disable xCloud analytics. The analytics contains statistics of your streaming session, so I'd recommend to allow analytics to help Xbox improve xCloud's experence in the future.  
+[![Latest version](https://img.shields.io/github/v/release/redphx/better-xcloud?label=latest)](https://github.com/redphx/better-xcloud/releases) 
+[![Total downloads](https://img.shields.io/github/downloads/redphx/better-xcloud/total?color=%23e15f2c)](https://github.com/redphx/better-xcloud/releases) 
+[![Total stars](https://img.shields.io/github/stars/redphx/better-xcloud?color=%23cca400)](https://github.com/redphx/better-xcloud/stargazers)  
 
-## How to use:
-1. Install [Tampermonkey extension](https://www.tampermonkey.net/) on suppported browsers. It's also available for Firefox on Android.
-2. Install **Better xCloud**:
-    - [Directly on Github](https://github.com/redphx/better-xcloud/releases/latest/download/better-xcloud.user.js)
-4. Refresh [xCloud web page](https://www.xbox.com/play/).
-5. Click on the new "SERVER NAME" button next to your profile picture to adjust settings.
-6. Optional but recommended: change your browser's User-Agent. Check the [User-Agent section](#user-agent) below for more info.
-7. Don't forget to reload the page after changing settings.
+## Full documentations
+For the full details please visit: https://better-xcloud.github.io  
 
-## User-Agent
-Optional, as changing User-Agent won't guarantee a better streaming experience, but it's worth a try. You might need to install an external extension to do that.  
+⚠️ Please DO NOT report **Better xCloud**'s bugs on [/r/xcloud subreddit](https://reddit.com/r/xcloud/). Report bugs in [Issues](https://github.com/redphx/better-xcloud/issues) or [Telegram channel](https://t.me/betterxcloud) instead.
 
-It's recommended to change User-Agent to:
-```
-Mozilla/5.0 (Windows NT 10.0; Win64; x64) AppleWebKit/537.36 (KHTML, like Gecko) Chrome/114.0.0.0 Safari/537.36 Edg/114.0.1823.67
-```
-This will trick xCloud into thinking you're using Edge browser on desktop.
+## Table of Contents
+- [**How to install**](#how-to-install)
+- [**Features**](#features)
+- [**Donation**](#donation)
+- [**Acknowledgements**](#acknowledgements)
+- [**Disclaimers**](#disclaimers)
 
-Other options (only do one of these):
-- Add ` smarttv` to switch to Smart TV layout.
-- Add ` Xbox;` to become an Xbox console.
-- Add ` 36102dd3-6953-45f6-8b48-031fb95e0e0d` to become a Logitech G Cloud device.
-- Add ` 0ed22b6f-b61d-41eb-810a-a1ed586a550b` to become a Razer Edge device.
+## How to install
+Visit [this page](https://better-xcloud.github.io/browsers) to know how to install Better xCloud on your device.
 
-## Tested on:
-- Chrome on macOS.
-- Firefox for Android with Tampermonkey add-on.
-- *(NOT RECOMMENDED at the moment since its Userscript implementation is not working properly)* [Hermit Browser](https://hermit.chimbori.com) on Android. It supports custom User-Agent and has built-in Userscript support (premium features, only $7.99) so you don't have to install anything else. I built **Better xCloud** just so I could use it with Hermit.  
+## Features
 
-## FAQ
-1. **Why is it an Userscript and not extension?**  
-It's because not many browsers on Android support installing extensions (and not all extensions can be installed).
+<img width="400" alt="Settings UI" src="https://github.com/redphx/better-xcloud/assets/96280/4bec2d62-31df-499c-9aad-2485626b6925">
+<br>
+<img width="400" alt="Remote Play dialog" src="https://github.com/redphx/better-xcloud/assets/96280/daf7f698-a228-4f9c-8f23-9669e061a64c">
+<br>
+<img width="600" alt="Stream HUD" src="https://github.com/redphx/better-xcloud/assets/96280/51bdb96c-79ab-402f-902a-a9e6229973b2">
+<br>
+<img width="600" alt="Stream settings" src="https://github.com/redphx/better-xcloud/assets/96280/ed513cb3-6e6c-4e8e-9e06-c62e71e41c90">
+<br>
+<img width="600" alt="Remapper" src="https://github.com/redphx/better-xcloud/assets/96280/f2e2bc51-f673-4b24-b127-c7169b86462b">
 
-2. **I see "???" button instead of server's name**  
-That means Tampermonkey is not working properly. Please make sure you're using the latest version or switch to a well-known browser.  
 
-3. **Can I use this with the Xbox Android app?**  
-No you can't. You'll have to modify the app.
+&nbsp;  
   
-4. **Will you able to enable "Clarity Boost" feature on non-Edge browsers?**  
-No. "Clarity Boost" feature uses an exclusive API (`Video.msVideoProcessing`) that's only available on Edge browser for desktop at the moment.
+**Demo video:** [https://youtu.be/oDr5Eddp55E  ](https://youtu.be/AYb-EUcz72U)  
+- **🔥 Totally free and open-source**
+- **🔥 Allow playing with [Mouse & Keyboard](https://better-xcloud.github.io/mouse-and-keyboard)**
+- **🔥 Enable [Remote Play](https://better-xcloud.github.io/remote-play) support**  
+  > 1080p resolution and can stream Xbox 360 games.  
+- **🔥 [Improve visual quality](https://better-xcloud.github.io/ingame-features/#improve-streams-clarity) of the stream**  
+  > Similar to (but not as good as) the "Clarity Boost" of xCloud on Edge browser. [Demo video](https://youtu.be/ZhW2choAHUs). 
+- **🔥 Show [Stream stats](https://better-xcloud.github.io/stream-stats)**  
+- **🔥 [Screenshot capture](https://better-xcloud.github.io/screenshot-capture)**
+- **🔥 [Touch controller](https://better-xcloud.github.io/features/#touch-controller)**
+  > Enable touch controller support for all games.
+- [And more...](https://better-xcloud.github.io/features/)
+
+## Donation
+If you think this project is useful and want to support future developments, please consider making a donate via [my Ko-fi page](https://ko-fi.com/redphx).  
+Or you can give this project a star, that's also helpful.  
+Thank you.  
+
+## Translation  
+Help translating **Better xCloud** to another languagues using [Crowdin](https://crowdin.com/project/better-xcloud).  
+Use [this post](https://github.com/redphx/better-xcloud/discussions/131) for discussion. 
 
 ## Acknowledgements  
-**Better xCloud** is inspired by these projects:  
-- [n-thumann/xbox-cloud-server-selector](https://github.com/n-thumann/xbox-cloud-server-selector)  
+- The mouse controlling feature is heavily inspired by the "Mouse spinning" feature in [Yuzu emulator](https://github.com/yuzu-emu/yuzu-mainline)
+- [n-thumann/xbox-cloud-server-selector](https://github.com/n-thumann/xbox-cloud-server-selector) for the idea of IPv6 feature
+- Icons by [Phosphor Icons](https://phosphoricons.com)
+- [PromptFont](https://shinmera.com/promptfont) by Yukari "Shinmera" Hafner
 
 ## Disclaimers  
-- Use as your own risk.  
+- Use it at your own risk.
 - This project is not affiliated with Xbox in any way. All Xbox logos/icons/trademarks are copyright of their respective owners.
-

better-xcloud.meta.js

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