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

Add ButtonStyle enum

Browse Source
This commit is contained in:
redphx 2024-01-12 16:03:45 +07:00
parent a495d3147b
commit 15eaf76042
1 changed files with 31 additions and 12 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

43
better-xcloud.user.js
View File

@ -110,13 +110,23 @@ const createSvgIcon = (icon, strokeWidth=2) => {
return $svg; return $svg;
}; };
const ButtonStyle = {};
ButtonStyle[ButtonStyle.PRIMARY = 1] = 'bx-primary';
ButtonStyle[ButtonStyle.DANGER = 2] = 'bx-danger';
ButtonStyle[ButtonStyle.GHOST = 4] = 'bx-ghost';
ButtonStyle[ButtonStyle.FOCUSABLE = 8] = 'bx-focusable';
const ButtonStyleIndices = Object.keys(ButtonStyle).splice(0, Object.keys(ButtonStyle).length / 2).map(i => parseInt(i));
const createButton = options => { const createButton = options => {
const $btn = CE(options.url ? 'a' : 'button', {'class': 'bx-button'}); const $btn = CE(options.url ? 'a' : 'button', {'class': 'bx-button'});
options.isPrimary && $btn.classList.add('bx-primary'); const style = options.style || 0;
options.isDanger && $btn.classList.add('bx-danger'); style && ButtonStyleIndices.forEach(index => {
options.isGhost && $btn.classList.add('bx-ghost'); (style & index) && $btn.classList.add(ButtonStyle[index]);
});
options.icon && $btn.appendChild(createSvgIcon(options.icon, 4)); options.icon && $btn.appendChild(createSvgIcon(options.icon, 4));
options.label && $btn.appendChild(CE('span', {}, options.label)); options.label && $btn.appendChild(CE('span', {}, options.label));
options.title && $btn.setAttribute('title', options.title); options.title && $btn.setAttribute('title', options.title);
@ -2760,7 +2770,12 @@ class Dialog {
this.onClose = onClose; this.onClose = onClose;
this.$dialog = CE('div', {'class': `bx-dialog ${className || ''} bx-gone`}, this.$dialog = CE('div', {'class': `bx-dialog ${className || ''} bx-gone`},
this.$title = CE('h2', {}, CE('b', {}, title), this.$title = CE('h2', {}, CE('b', {}, title),
helpUrl && createButton({icon: Icon.QUESTION, isGhost: true, title: __('help'), url: helpUrl}), helpUrl && createButton({
icon: Icon.QUESTION,
style: ButtonStyle.GHOST,
title: __('help'),
url: helpUrl,
}),
), ),
this.$content = CE('div', {'class': 'bx-dialog-content'}, content), this.$content = CE('div', {'class': 'bx-dialog-content'}, content),
!hideCloseButton && ($close = CE('button', {}, __('close'))), !hideCloseButton && ($close = CE('button', {}, __('close'))),
@ -4943,7 +4958,7 @@ class MkbRemapper {
// Delete button // Delete button
createButton({ createButton({
icon: Icon.TRASH, icon: Icon.TRASH,
isDanger: true, style: ButtonStyle.DANGER,
title: __('delete'), title: __('delete'),
onClick: e => { onClick: e => {
if (!confirm(__('confirm-delete-preset'))) { if (!confirm(__('confirm-delete-preset'))) {
@ -5029,7 +5044,7 @@ class MkbRemapper {
// Activate button // Activate button
this.#$.activateButton = createButton({ this.#$.activateButton = createButton({
label: __('activate'), label: __('activate'),
isPrimary: true, style: ButtonStyle.PRIMARY,
onClick: e => { onClick: e => {
PREFS.set(Preferences.MKB_DEFAULT_PRESET_ID, this.#STATE.currentPresetId); PREFS.set(Preferences.MKB_DEFAULT_PRESET_ID, this.#STATE.currentPresetId);
MkbHandler.INSTANCE.refreshPresetData(); MkbHandler.INSTANCE.refreshPresetData();
@ -5043,7 +5058,7 @@ class MkbRemapper {
// Cancel button // Cancel button
createButton({ createButton({
label: __('cancel'), label: __('cancel'),
isGhost: true, style: ButtonStyle.GHOST,
onClick: e => { onClick: e => {
// Restore preset // Restore preset
this.#switchPreset(this.#STATE.currentPresetId); this.#switchPreset(this.#STATE.currentPresetId);
@ -5054,7 +5069,7 @@ class MkbRemapper {
// Save button // Save button
createButton({ createButton({
label: __('save'), label: __('save'),
isPrimary: true, style: ButtonStyle.PRIMARY,
onClick: e => { onClick: e => {
const updatedPreset = structuredClone(this.#getCurrentPreset()); const updatedPreset = structuredClone(this.#getCurrentPreset());
updatedPreset.data = this.#STATE.editingPresetData; updatedPreset.data = this.#STATE.editingPresetData;
@ -8840,13 +8855,12 @@ function injectSettingsButton($parent) {
const $remotePlayBtn = createButton({ const $remotePlayBtn = createButton({
icon: Icon.REMOTE_PLAY, icon: Icon.REMOTE_PLAY,
title: __('remote-play'), title: __('remote-play'),
isGhost: true, style: ButtonStyle.GHOST | ButtonStyle.FOCUSABLE,
isRound: true,
onClick: e => { onClick: e => {
RemotePlay.showDialog(); RemotePlay.showDialog();
}, },
}); });
$remotePlayBtn.classList.add('bx-remote-play-button', 'bx-focusable'); $remotePlayBtn.classList.add('bx-remote-play-button');
$parent.appendChild($remotePlayBtn); $parent.appendChild($remotePlayBtn);
} }
@ -9736,7 +9750,12 @@ function setupQuickSettingsBar() {
for (const settingGroup of settingTab.items) { for (const settingGroup of settingTab.items) {
$group.appendChild(CE('h2', {}, $group.appendChild(CE('h2', {},
CE('span', {}, settingGroup.label), CE('span', {}, settingGroup.label),
settingGroup.help_url && createButton({icon: Icon.QUESTION, isGhost: true, url: settingGroup.help_url, title: __('help')}), settingGroup.help_url && createButton({
icon: Icon.QUESTION,
style: ButtonStyle.GHOST,
url: settingGroup.help_url,
title: __('help'),
}),
)); ));
if (settingGroup.note) { if (settingGroup.note) {
if (typeof settingGroup.note === 'string') { if (typeof settingGroup.note === 'string') {