marcel/better-xcloud
1
0
Fork 0
mirror of https://github.com/redphx/better-xcloud.git synced 2025-06-07 16:17:20 +02:00
Code Issues Packages Projects Releases Wiki Activity

Rename "Quick Bar" to "Stream Settings dialog"

Browse Source
This commit is contained in:
redphx 2024-05-26 11:42:19 +07:00
parent ac37fe05bc
commit 9166761780
5 changed files with 36 additions and 36 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

12
src/assets/css/stream-settings.styl
View File

@ -1,4 +1,4 @@
.bx-quick-settings-bar { .bx-stream-settings-dialog {
display: flex; display: flex;
position: fixed; position: fixed;
z-index: var(--bx-stream-settings-z-index); z-index: var(--bx-stream-settings-z-index);
@ -7,7 +7,7 @@
-webkit-user-select: none; -webkit-user-select: none;
} }
.bx-quick-settings-tabs { .bx-stream-settings-tabs {
position: fixed; position: fixed;
top: 0; top: 0;
right: 420px; right: 420px;
@ -39,7 +39,7 @@
} }
.bx-quick-settings-tab-contents { .bx-stream-settings-tab-contents {
flex-direction: column; flex-direction: column;
position: fixed; position: fixed;
right: 0; right: 0;
@ -89,7 +89,7 @@
} }
.bx-quick-settings-row { .bx-stream-settings-row {
display: flex; display: flex;
border-bottom: 1px solid #40404080; border-bottom: 1px solid #40404080;
margin-bottom: 16px; margin-bottom: 16px;
@ -116,14 +116,14 @@
} }
} }
.bx-quick-settings-bar-note { .bx-stream-settings-dialog-note {
display: block; display: block;
font-size: 12px; font-size: 12px;
font-weight: lighter; font-weight: lighter;
font-style: italic; font-style: italic;
} }
.bx-quick-settings-tab-contents { .bx-stream-settings-tab-contents {
div[data-group="shortcuts"] { div[data-group="shortcuts"] {
> div { > div {
&[data-has-gamepad=true] { &[data-has-gamepad=true] {

6
src/index.ts
View File

@ -178,9 +178,9 @@ window.addEventListener(BxEvent.STREAM_STOPPED, e => {
// Stop MKB listeners // Stop MKB listeners
getPref(PrefKey.MKB_ENABLED) && MkbHandler.INSTANCE.destroy(); getPref(PrefKey.MKB_ENABLED) && MkbHandler.INSTANCE.destroy();
const $quickBar = document.querySelector('.bx-quick-settings-bar'); const $streamSettingsDialog = document.querySelector('.bx-stream-settings-dialog');
if ($quickBar) { if ($streamSettingsDialog) {
$quickBar.classList.add('bx-gone'); $streamSettingsDialog.classList.add('bx-gone');
} }
STATES.currentStream.audioGainNode = null; STATES.currentStream.audioGainNode = null;

2
src/modules/mkb/mkb-remapper.ts
View File

@ -460,7 +460,7 @@ export class MkbRemapper {
const onChange = (e: Event, value: any) => { const onChange = (e: Event, value: any) => {
(this.#STATE.editingPresetData!.mouse as any)[key] = value; (this.#STATE.editingPresetData!.mouse as any)[key] = value;
}; };
const $row = CE('div', {'class': 'bx-quick-settings-row'}, const $row = CE('div', {'class': 'bx-stream-settings-row'},
CE('label', {'for': `bx_setting_${key}`}, setting.label), CE('label', {'for': `bx_setting_${key}`}, setting.label),
$elm = SettingElement.render(setting.type, key, setting, value, onChange, setting.params), $elm = SettingElement.render(setting.type, key, setting, value, onChange, setting.params),
); );

34
src/modules/stream/stream-ui.ts
View File

@ -66,9 +66,9 @@ export function injectStreamMenuButtons() {
($screen as any).xObserving = true; ($screen as any).xObserving = true;
const $quickBar = document.querySelector('.bx-quick-settings-bar')!; const $settingsDialog = document.querySelector('.bx-stream-settings-dialog')!;
const $parent = $screen.parentElement; const $parent = $screen.parentElement;
const hideQuickBarFunc = (e?: MouseEvent | TouchEvent) => { const hideSettingsFunc = (e?: MouseEvent | TouchEvent) => {
if (e) { if (e) {
const $target = e.target as HTMLElement; const $target = e.target as HTMLElement;
e.stopPropagation(); e.stopPropagation();
@ -76,15 +76,15 @@ export function injectStreamMenuButtons() {
return; return;
} }
if ($target.id === 'MultiTouchSurface') { if ($target.id === 'MultiTouchSurface') {
$target.removeEventListener('touchstart', hideQuickBarFunc); $target.removeEventListener('touchstart', hideSettingsFunc);
} }
} }
// Hide Quick settings bar // Hide Stream settings dialog
$quickBar.classList.add('bx-gone'); $settingsDialog.classList.add('bx-gone');
$parent?.removeEventListener('click', hideQuickBarFunc); $parent?.removeEventListener('click', hideSettingsFunc);
// $parent.removeEventListener('touchstart', hideQuickBarFunc); // $parent.removeEventListener('touchstart', hideSettingsFunc);
} }
let $btnStreamSettings: HTMLElement; let $btnStreamSettings: HTMLElement;
@ -146,9 +146,9 @@ export function injectStreamMenuButtons() {
return; return;
} }
// Hide Quick bar when closing HUD // Hide Stream Settings dialog when closing HUD
$btnCloseHud && $btnCloseHud.addEventListener('click', e => { $btnCloseHud && $btnCloseHud.addEventListener('click', e => {
$quickBar.classList.add('bx-gone'); $settingsDialog.classList.add('bx-gone');
}); });
// Create Refresh button from the Close button // Create Refresh button from the Close button
@ -176,7 +176,7 @@ export function injectStreamMenuButtons() {
const $menu = document.querySelector('div[class*=StreamMenu-module__menuContainer] > div[class*=Menu-module]'); const $menu = document.querySelector('div[class*=StreamMenu-module__menuContainer] > div[class*=Menu-module]');
$menu?.appendChild(await StreamBadges.render()); $menu?.appendChild(await StreamBadges.render());
hideQuickBarFunc(); hideSettingsFunc();
return; return;
} }
@ -215,14 +215,14 @@ export function injectStreamMenuButtons() {
hideGripHandle(); hideGripHandle();
e.preventDefault(); e.preventDefault();
// Show Quick settings bar // Show Stream Settings dialog
$quickBar.classList.remove('bx-gone'); $settingsDialog.classList.remove('bx-gone');
$parent?.addEventListener('click', hideQuickBarFunc); $parent?.addEventListener('click', hideSettingsFunc);
//$parent.addEventListener('touchstart', hideQuickBarFunc); //$parent.addEventListener('touchstart', hideSettingsFunc);
const $touchSurface = document.getElementById('MultiTouchSurface'); const $touchSurface = document.getElementById('MultiTouchSurface');
$touchSurface && $touchSurface.style.display != 'none' && $touchSurface.addEventListener('touchstart', hideQuickBarFunc); $touchSurface && $touchSurface.style.display != 'none' && $touchSurface.addEventListener('touchstart', hideSettingsFunc);
}); });
} }
@ -263,14 +263,14 @@ export function injectStreamMenuButtons() {
export function showStreamSettings(tabId: string) { export function showStreamSettings(tabId: string) {
const $wrapper = document.querySelector('.bx-quick-settings-bar'); const $wrapper = document.querySelector('.bx-stream-settings-dialog');
if (!$wrapper) { if (!$wrapper) {
return; return;
} }
// Select tab // Select tab
if (tabId) { if (tabId) {
const $tab = $wrapper.querySelector(`.bx-quick-settings-tabs svg[data-group=${tabId}]`); const $tab = $wrapper.querySelector(`.bx-stream-settings-tabs svg[data-group=${tabId}]`);
$tab && $tab.dispatchEvent(new Event('click')); $tab && $tab.dispatchEvent(new Event('click'));
} }

18
src/modules/ui/ui.ts
View File

@ -68,7 +68,7 @@ function getVideoPlayerFilterStyle() {
return filters.join(' '); return filters.join(' ');
} }
function setupQuickSettingsBar() { function setupStreamSettingsDialog() {
const isSafari = UserAgent.isSafari(); const isSafari = UserAgent.isSafari();
const SETTINGS_UI = [ const SETTINGS_UI = [
@ -304,9 +304,9 @@ function setupQuickSettingsBar() {
let $tabs: HTMLElement; let $tabs: HTMLElement;
let $settings: HTMLElement; let $settings: HTMLElement;
const $wrapper = CE<HTMLElement>('div', {'class': 'bx-quick-settings-bar bx-gone'}, const $wrapper = CE<HTMLElement>('div', {'class': 'bx-stream-settings-dialog bx-gone'},
$tabs = CE<HTMLElement>('div', {'class': 'bx-quick-settings-tabs'}), $tabs = CE<HTMLElement>('div', {'class': 'bx-stream-settings-tabs'}),
$settings = CE<HTMLElement>('div', {'class': 'bx-quick-settings-tab-contents'}), $settings = CE<HTMLElement>('div', {'class': 'bx-stream-settings-tab-contents'}),
); );
for (const settingTab of SETTINGS_UI) { for (const settingTab of SETTINGS_UI) {
@ -384,11 +384,11 @@ function setupQuickSettingsBar() {
const label = Preferences.SETTINGS[pref as PrefKey].label || setting.label; const label = Preferences.SETTINGS[pref as PrefKey].label || setting.label;
const note = Preferences.SETTINGS[pref as PrefKey].note || setting.note; const note = Preferences.SETTINGS[pref as PrefKey].note || setting.note;
const $content = CE('div', {'class': 'bx-quick-settings-row', 'data-type': settingGroup.group}, const $content = CE('div', {'class': 'bx-stream-settings-row', 'data-type': settingGroup.group},
CE('label', {for: `bx_setting_${pref}`}, CE('label', {for: `bx_setting_${pref}`},
label, label,
note && CE('div', {'class': 'bx-quick-settings-bar-note'}, note), note && CE('div', {'class': 'bx-stream-settings-dialog-note'}, note),
setting.unsupported && CE('div', {'class': 'bx-quick-settings-bar-note'}, t('browser-unsupported-feature')), setting.unsupported && CE('div', {'class': 'bx-stream-settings-dialog-note'}, t('browser-unsupported-feature')),
), ),
!setting.unsupported && $control, !setting.unsupported && $control,
); );
@ -515,11 +515,11 @@ function preloadFonts() {
export function setupStreamUi() { export function setupStreamUi() {
// Prevent initializing multiple times // Prevent initializing multiple times
if (!document.querySelector('.bx-quick-settings-bar')) { if (!document.querySelector('.bx-stream-settings-dialog')) {
preloadFonts(); preloadFonts();
window.addEventListener('resize', updateVideoPlayerCss); window.addEventListener('resize', updateVideoPlayerCss);
setupQuickSettingsBar(); setupStreamSettingsDialog();
StreamStats.render(); StreamStats.render();
Screenshot.setup(); Screenshot.setup();