tamius-han/ultrawidify
1
0
Fork 0
Code Issues Pull Requests Actions Packages Projects Releases Wiki Activity

Move player UI settings and make them site-dependent. Fix SiteSettings always overriding ExtensionStatus.Default with actual default value

Browse Source
This commit is contained in:
Tamius Han 2025-01-27 02:59:30 +01:00
parent 2d08a2f339
commit 32f4d99c98
8 changed files with 187 additions and 49 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

1
src/common/interfaces/SettingsInterface.ts
View File

@ -312,6 +312,7 @@ export interface SiteSettingsInterface {
enable: ExtensionEnvironmentSettingsInterface; enable: ExtensionEnvironmentSettingsInterface;
enableAard: ExtensionEnvironmentSettingsInterface; enableAard: ExtensionEnvironmentSettingsInterface;
enableKeyboard: ExtensionEnvironmentSettingsInterface; enableKeyboard: ExtensionEnvironmentSettingsInterface;
enableUI: ExtensionEnvironmentSettingsInterface; // Lies! enableUI doesn't use 'theater' property (but uses the other two)
type?: 'official' | 'community' | 'user-defined' | 'testing' | 'officially-disabled' | 'unknown' | 'modified'; type?: 'official' | 'community' | 'user-defined' | 'testing' | 'officially-disabled' | 'unknown' | 'modified';
defaultType: 'official' | 'community' | 'user-defined' | 'testing' | 'officially-disabled' | 'unknown' | 'modified'; defaultType: 'official' | 'community' | 'user-defined' | 'testing' | 'officially-disabled' | 'unknown' | 'modified';

1
src/csui/src/PlayerUIWindow.vue
View File

@ -86,6 +86,7 @@
<PlayerUiSettings <PlayerUiSettings
v-if="selectedTab === 'playerUiSettings'" v-if="selectedTab === 'playerUiSettings'"
:settings="settings" :settings="settings"
:siteSettings="siteSettings"
:eventBus="eventBus" :eventBus="eventBus"
> >
</PlayerUiSettings> </PlayerUiSettings>

93
src/csui/src/PlayerUiPanels/PanelComponents/ExtensionSettings/SiteExtensionSettings.vue
View File

@ -24,7 +24,7 @@
</template> </template>
<template v-else> <template v-else>
<option value="default"> <option value="default">
Use default () Use default ({{simpleDefaultSettings.enable}})
</option> </option>
<option value="disabled"> <option value="disabled">
Never Never
@ -69,7 +69,7 @@
</template> </template>
<template v-else> <template v-else>
<option value="default"> <option value="default">
Use default () Use default ({{simpleDefaultSettings.enableAard}})
</option> </option>
<option value="disabled"> <option value="disabled">
Never Never
@ -112,7 +112,7 @@
</template> </template>
<template v-else> <template v-else>
<option value="default"> <option value="default">
Use default () Use default ({{simpleDefaultSettings.enableKeyboard}})
</option> </option>
<option value="disabled"> <option value="disabled">
Never Never
@ -131,7 +131,7 @@
</div> </div>
</div> </div>
<!-- Enable keyboard --> <!-- Enable UI -->
<div class="field"> <div class="field">
<div class="label"> <div class="label">
Enable <span class="color-emphasis">in-player UI</span> Enable <span class="color-emphasis">in-player UI</span>
@ -149,7 +149,7 @@
</template> </template>
<template v-else> <template v-else>
<option value="default"> <option value="default">
Use default () Use default ({{simpleDefaultSettings.enableUI}})
</option> </option>
<option value="disabled"> <option value="disabled">
Never Never
@ -267,9 +267,9 @@
</template> </template>
<script> <script>
import ExtensionMode from '../../../../../common/enums/ExtensionMode.enum'; import ExtensionMode from '@src/common/enums/ExtensionMode.enum';
import VideoAlignmentType from '../../../../../common/enums/VideoAlignmentType.enum'; import VideoAlignmentType from '@src/common/enums/VideoAlignmentType.enum';
import CropModePersistence from './../../../../../common/enums/CropModePersistence.enum'; import CropModePersistence from '@src/common/enums/CropModePersistence.enum';
export default { export default {
data() { data() {
@ -305,8 +305,17 @@ export default {
enable: this.compileSimpleSettings('enable'), enable: this.compileSimpleSettings('enable'),
enableAard: this.compileSimpleSettings('enableAard'), enableAard: this.compileSimpleSettings('enableAard'),
enableKeyboard: this.compileSimpleSettings('enableKeyboard'), enableKeyboard: this.compileSimpleSettings('enableKeyboard'),
enableUI: this.compileSimpleSettings('enableUI')
} }
}, },
simpleDefaultSettings() {
return {
enable: this.getDefaultOptionLabel('enable'),
enableAard: this.getDefaultOptionLabel('enableAard'),
enableKeyboard: this.getDefaultOptionLabel('enableKeyboard'),
enableUI: this.getDefaultOptionLabel('enableUI')
};
},
siteDefaultCrop() { siteDefaultCrop() {
return this.siteSettings.raw?.defaults?.crop ? JSON.stringify(this.siteSettings.raw?.defaults?.crop) : JSON.stringify({useDefault: true}); return this.siteSettings.raw?.defaults?.crop ? JSON.stringify(this.siteSettings.raw?.defaults?.crop) : JSON.stringify({useDefault: true});
}, },
@ -338,40 +347,41 @@ export default {
/** /**
* Compiles our extension settings into more user-friendly options * Compiles our extension settings into more user-friendly options
*/ */
compileSimpleSettings(component) { compileSimpleSettings(component, getDefaults) {
const settingsData = getDefaults ? this.settings.active.sites['@global'] : this.siteSettings?.raw;
try { try {
if ( if (
this.siteSettings?.data?.[component]?.normal === ExtensionMode.Disabled ( settingsData?.[component]?.normal === ExtensionMode.Disabled || component === 'enableUI')
&& this.siteSettings?.data?.[component]?.theater === ExtensionMode.Disabled && settingsData?.[component]?.theater === ExtensionMode.Disabled
&& this.siteSettings?.data?.[component]?.fullscreen === ExtensionMode.Disabled && settingsData?.[component]?.fullscreen === ExtensionMode.Disabled
) { ) {
return 'disabled'; return 'disabled';
} }
if ( if (
this.siteSettings?.data?.[component]?.normal === ExtensionMode.Default ( settingsData?.[component]?.normal === ExtensionMode.Default || component === 'enableUI')
&& this.siteSettings?.data?.[component]?.theater === ExtensionMode.Default && settingsData?.[component]?.theater === ExtensionMode.Default
&& this.siteSettings?.data?.[component]?.fullscreen === ExtensionMode.Default && settingsData?.[component]?.fullscreen === ExtensionMode.Default
) { ) {
return 'default'; return 'default';
} }
if ( if (
this.siteSettings?.data?.[component]?.normal === ExtensionMode.Disabled ( settingsData?.[component]?.normal === ExtensionMode.Disabled || component === 'enableUI')
&& this.siteSettings?.data?.[component]?.theater === ExtensionMode.Disabled && settingsData?.[component]?.theater === ExtensionMode.Disabled
&& this.siteSettings?.data?.[component]?.fullscreen === ExtensionMode.Enabled && settingsData?.[component]?.fullscreen === ExtensionMode.Enabled
) { ) {
return 'fs'; return 'fs';
} }
if ( if (
this.siteSettings?.data?.[component]?.normal === ExtensionMode.Disabled ( settingsData?.[component]?.normal === ExtensionMode.Disabled || component === 'enableUI')
&& this.siteSettings?.data?.[component]?.theater === ExtensionMode.Enabled && settingsData?.[component]?.theater === ExtensionMode.Enabled
&& this.siteSettings?.data?.[component]?.fullscreen === ExtensionMode.Enabled && settingsData?.[component]?.fullscreen === ExtensionMode.Enabled
) { ) {
return 'theater'; return 'theater';
} }
if ( if (
this.siteSettings?.data?.[component]?.normal === ExtensionMode.Enabled ( settingsData?.[component]?.normal === ExtensionMode.Enabled || component === 'enableUI')
&& this.siteSettings?.data?.[component]?.theater === ExtensionMode.Enabled && settingsData?.[component]?.theater === ExtensionMode.Enabled
&& this.siteSettings?.data?.[component]?.fullscreen === ExtensionMode.Enabled && settingsData?.[component]?.fullscreen === ExtensionMode.Enabled
) { ) {
return 'enabled'; return 'enabled';
} }
@ -382,6 +392,36 @@ export default {
} }
}, },
getDefaultOptionLabel(component) {
const componentValue = this.compileSimpleSettings(component, true);
if (componentValue === 'loading') {
return componentValue;
}
if (component === 'enableUI') {
switch (componentValue) {
case 'fs':
return 'fullscreen only';
case 'theater':
return 'where possible';
case 'disabled':
return 'disabled';
}
}
switch (componentValue) {
case 'fs':
return 'Fullscreen only';
case 'theater':
return 'theater & FS';
case 'enabled':
return 'always';
case 'disabled':
return 'disabled';
case 'default':
return 'complex'
}
},
getCommandValue(availableCommands, command) { getCommandValue(availableCommands, command) {
for (const cmd of availableCommands) { for (const cmd of availableCommands) {
if (JSON.stringify(cmd.arguments) === JSON.stringify(command)) { if (JSON.stringify(cmd.arguments) === JSON.stringify(command)) {
@ -441,21 +481,18 @@ export default {
commandArguments = undefined; commandArguments = undefined;
} }
console.log('saving settings ...');
await this.siteSettings.set(option, commandArguments, {reload: false}); await this.siteSettings.set(option, commandArguments, {reload: false});
console.log('settings saved.');
// we also need to force re-compute all watchers, otherwise UI will lag behind // we also need to force re-compute all watchers, otherwise UI will lag behind
// actual state of settings until reload // actual state of settings until reload
this._computedWatchers?.simpleExtensionSettings?.run(); this._computedWatchers?.simpleExtensionSettings?.run();
this._computedWatchers?.simpleDefaultSettings?.run();
this._computedWatchers?.siteDefaultCrop?.run(); this._computedWatchers?.siteDefaultCrop?.run();
this._computedWatchers?.siteDefaultStretch?.run(); this._computedWatchers?.siteDefaultStretch?.run();
this._computedWatchers?.siteDefaultAlignment?.run(); this._computedWatchers?.siteDefaultAlignment?.run();
this._computedWatchers?.siteDefaultCropPersistence?.run(); this._computedWatchers?.siteDefaultCropPersistence?.run();
this._computedWatchers?.defaultPersistanceLabel?.run(); this._computedWatchers?.defaultPersistanceLabel?.run();
console.log('watchers recomputed');
this.$nextTick( () => this.$forceUpdate()); this.$nextTick( () => this.$forceUpdate());
}, },
setExtensionMode(component, event) { setExtensionMode(component, event) {

22
src/csui/src/PlayerUiPanels/PlayerUiSettings.vue
View File

@ -5,23 +5,14 @@
<h2>Player UI options</h2> <h2>Player UI options</h2>
<div class="flex flex-col compact-form"> <div class="flex flex-col compact-form">
<div class="field"> <div v-if="!siteSettings.data.enableUI.fullscreen">
<div class="label">Enable in-player UI</div> UI is disabled for this site.
<input
type="checkbox"
v-model="settings.active.ui.inPlayer.enabled"
@change="saveSettings()"
/>
</div>
<div
class="flex flex-col field-group compact-form"
:class="{disabled: !settings.active.ui.inPlayer.enabled}"
>
<div class="field">
<div class="label">Enable only in full screen</div>
<input type="checkbox" v-model="settings.active.ui.inPlayer.enabledFullscreenOnly" />
</div> </div>
<div
class="flex flex-col field-group compact-form"
:class="{disabled: !siteSettings.data.enableUI.fullscreen}"
>
<div class="field disabled"> <div class="field disabled">
<div class="label"> <div class="label">
Popup activator position: Popup activator position:
@ -171,6 +162,7 @@ export default {
], ],
props: [ props: [
'settings', // required for buttons and actions, which are global 'settings', // required for buttons and actions, which are global
'siteSettings',
'eventBus', 'eventBus',
], ],
mounted() { mounted() {

22
src/ext/conf/ExtConfPatches.ts
View File

@ -202,6 +202,28 @@ const ExtensionConfPatch = [
} }
} }
} }
}, {
forVersion: '6.2.4',
updateFn: (userOptions: SettingsInterface, defaultOptions) => {
for (const site in userOptions.sites) {
userOptions.sites[site].enableUI = {
fullscreen: ExtensionMode.Default,
theater: ExtensionMode.Default,
normal: ExtensionMode.Default,
}
}
const uiEnabled =
userOptions.sites['@global'].enableUI = {
fullscreen: userOptions.ui.inPlayer.enabled ? ExtensionMode.Enabled : ExtensionMode.Disabled,
theater: ExtensionMode.Enabled,
normal: (userOptions.ui.inPlayer.enabled && !userOptions.ui.inPlayer.enabledFullscreenOnly) ? ExtensionMode.Enabled : ExtensionMode.Disabled
}
userOptions.sites['@empty'].enableUI = {
fullscreen: ExtensionMode.Default,
theater: ExtensionMode.Default,
normal: ExtensionMode.Default,
}
}
} }
]; ];

90
src/ext/conf/ExtensionConf.ts
View File

@ -1433,6 +1433,12 @@ const ExtensionConf: SettingsInterface = {
theater: ExtensionMode.Enabled, theater: ExtensionMode.Enabled,
normal: ExtensionMode.Disabled normal: ExtensionMode.Disabled
}, },
enableUI: {
fullscreen: ExtensionMode.Enabled,
theater: ExtensionMode.Enabled, // Lies! means 'theater-ish'
normal: ExtensionMode.Enabled // Not actually used.
},
defaultType: 'unknown', defaultType: 'unknown',
persistCSA: CropModePersistence.Disabled, persistCSA: CropModePersistence.Disabled,
@ -1458,6 +1464,12 @@ const ExtensionConf: SettingsInterface = {
theater: ExtensionMode.Default, theater: ExtensionMode.Default,
normal: ExtensionMode.Default normal: ExtensionMode.Default
}, },
enableUI: {
fullscreen: ExtensionMode.Default,
theater: ExtensionMode.Default,
normal: ExtensionMode.Disabled
},
type: 'user-defined', type: 'user-defined',
defaultType: 'user-defined', defaultType: 'user-defined',
persistCSA: CropModePersistence.Default, persistCSA: CropModePersistence.Default,
@ -1483,6 +1495,12 @@ const ExtensionConf: SettingsInterface = {
theater: ExtensionMode.Default, theater: ExtensionMode.Default,
normal: ExtensionMode.Default normal: ExtensionMode.Default
}, },
enableUI: {
fullscreen: ExtensionMode.Default,
theater: ExtensionMode.Default,
normal: ExtensionMode.Default
},
override: false, // ignore value localStorage in favour of this override: false, // ignore value localStorage in favour of this
type: 'official', // is officially supported? (Alternatives are 'community' and 'user-defined') type: 'official', // is officially supported? (Alternatives are 'community' and 'user-defined')
defaultType: 'official', // if user mucks around with settings, type changes to 'user-defined'. defaultType: 'official', // if user mucks around with settings, type changes to 'user-defined'.
@ -1517,6 +1535,12 @@ const ExtensionConf: SettingsInterface = {
theater: ExtensionMode.Default, theater: ExtensionMode.Default,
normal: ExtensionMode.Disabled normal: ExtensionMode.Disabled
}, },
enableUI: {
fullscreen: ExtensionMode.Default,
theater: ExtensionMode.Default,
normal: ExtensionMode.Default
},
override: false, override: false,
type: 'community', type: 'community',
defaultType: 'community', defaultType: 'community',
@ -1537,6 +1561,11 @@ const ExtensionConf: SettingsInterface = {
theater: ExtensionMode.Default, theater: ExtensionMode.Default,
normal: ExtensionMode.Default normal: ExtensionMode.Default
}, },
enableUI: {
fullscreen: ExtensionMode.Default,
theater: ExtensionMode.Default,
normal: ExtensionMode.Default
},
type: 'community', type: 'community',
defaultType: 'community', defaultType: 'community',
activeDOMConfig: 'community-mstefan99', activeDOMConfig: 'community-mstefan99',
@ -1559,9 +1588,9 @@ const ExtensionConf: SettingsInterface = {
}, },
"www.twitch.tv": { "www.twitch.tv": {
enable: { enable: {
fullscreen: ExtensionMode.Default, fullscreen: ExtensionMode.Enabled,
theater: ExtensionMode.Default, theater: ExtensionMode.Enabled,
normal: ExtensionMode.Default, normal: ExtensionMode.Enabled,
}, },
enableAard: { enableAard: {
fullscreen: ExtensionMode.Default, fullscreen: ExtensionMode.Default,
@ -1573,6 +1602,11 @@ const ExtensionConf: SettingsInterface = {
theater: ExtensionMode.Default, theater: ExtensionMode.Default,
normal: ExtensionMode.Default normal: ExtensionMode.Default
}, },
enableUI: {
fullscreen: ExtensionMode.Default,
theater: ExtensionMode.Default,
normal: ExtensionMode.Default
},
type: 'official', type: 'official',
defaultType: 'official', defaultType: 'official',
}, },
@ -1592,6 +1626,11 @@ const ExtensionConf: SettingsInterface = {
theater: ExtensionMode.Default, theater: ExtensionMode.Default,
normal: ExtensionMode.Default normal: ExtensionMode.Default
}, },
enableUI: {
fullscreen: ExtensionMode.Default,
theater: ExtensionMode.Default,
normal: ExtensionMode.Default
},
type: 'official', type: 'official',
defaultType: 'official', defaultType: 'official',
activeDOMConfig: 'official', activeDOMConfig: 'official',
@ -1624,6 +1663,11 @@ const ExtensionConf: SettingsInterface = {
theater: ExtensionMode.Disabled, theater: ExtensionMode.Disabled,
normal: ExtensionMode.Disabled, normal: ExtensionMode.Disabled,
}, },
enableUI: {
fullscreen: ExtensionMode.Disabled,
theater: ExtensionMode.Disabled,
normal: ExtensionMode.Disabled
},
type: 'officially-disabled', type: 'officially-disabled',
defaultType: 'officially-disabled', defaultType: 'officially-disabled',
activeDOMConfig: 'official', activeDOMConfig: 'official',
@ -1656,6 +1700,11 @@ const ExtensionConf: SettingsInterface = {
theater: ExtensionMode.Disabled, theater: ExtensionMode.Disabled,
normal: ExtensionMode.Disabled, normal: ExtensionMode.Disabled,
}, },
enableUI: {
fullscreen: ExtensionMode.Disabled,
theater: ExtensionMode.Disabled,
normal: ExtensionMode.Disabled
},
type: 'officially-disabled', type: 'officially-disabled',
defaultType: 'officially-disabled', defaultType: 'officially-disabled',
activeDOMConfig: 'official', activeDOMConfig: 'official',
@ -1688,6 +1737,11 @@ const ExtensionConf: SettingsInterface = {
theater: ExtensionMode.Disabled, theater: ExtensionMode.Disabled,
normal: ExtensionMode.Disabled, normal: ExtensionMode.Disabled,
}, },
enableUI: {
fullscreen: ExtensionMode.Disabled,
theater: ExtensionMode.Disabled,
normal: ExtensionMode.Disabled
},
type: 'officially-disabled', type: 'officially-disabled',
defaultType: 'officially-disabled', defaultType: 'officially-disabled',
}, },
@ -1707,6 +1761,11 @@ const ExtensionConf: SettingsInterface = {
theater: ExtensionMode.Disabled, theater: ExtensionMode.Disabled,
normal: ExtensionMode.Disabled, normal: ExtensionMode.Disabled,
}, },
enableUI: {
fullscreen: ExtensionMode.Default,
theater: ExtensionMode.Default,
normal: ExtensionMode.Default
},
type: 'officially-disabled', type: 'officially-disabled',
defaultType: 'officially-disabled', defaultType: 'officially-disabled',
}, },
@ -1726,6 +1785,11 @@ const ExtensionConf: SettingsInterface = {
theater: ExtensionMode.Disabled, theater: ExtensionMode.Disabled,
normal: ExtensionMode.Disabled, normal: ExtensionMode.Disabled,
}, },
enableUI: {
fullscreen: ExtensionMode.Default,
theater: ExtensionMode.Default,
normal: ExtensionMode.Default
},
type: 'officially-disabled', type: 'officially-disabled',
defaultType: 'officially-disabled', defaultType: 'officially-disabled',
}, },
@ -1745,6 +1809,11 @@ const ExtensionConf: SettingsInterface = {
theater: ExtensionMode.Default, theater: ExtensionMode.Default,
normal: ExtensionMode.Default normal: ExtensionMode.Default
}, },
enableUI: {
fullscreen: ExtensionMode.Default,
theater: ExtensionMode.Default,
normal: ExtensionMode.Default
},
type: 'community', type: 'community',
defaultType: 'community', defaultType: 'community',
activeDOMConfig: 'community', activeDOMConfig: 'community',
@ -1776,6 +1845,11 @@ const ExtensionConf: SettingsInterface = {
theater: ExtensionMode.Default, theater: ExtensionMode.Default,
normal: ExtensionMode.Default normal: ExtensionMode.Default
}, },
enableUI: {
fullscreen: ExtensionMode.Default,
theater: ExtensionMode.Default,
normal: ExtensionMode.Default
},
type: 'community', type: 'community',
defaultType: 'community', defaultType: 'community',
activeDOMConfig: 'community', activeDOMConfig: 'community',
@ -1802,6 +1876,11 @@ const ExtensionConf: SettingsInterface = {
theater: ExtensionMode.Default, theater: ExtensionMode.Default,
normal: ExtensionMode.Default normal: ExtensionMode.Default
}, },
enableUI: {
fullscreen: ExtensionMode.Default,
theater: ExtensionMode.Default,
normal: ExtensionMode.Default
},
type: "community", type: "community",
defaultType: "community", defaultType: "community",
activeDOMConfig: 'community', activeDOMConfig: 'community',
@ -1832,6 +1911,11 @@ const ExtensionConf: SettingsInterface = {
theater: ExtensionMode.Default, theater: ExtensionMode.Default,
normal: ExtensionMode.Default normal: ExtensionMode.Default
}, },
enableUI: {
fullscreen: ExtensionMode.Default,
theater: ExtensionMode.Default,
normal: ExtensionMode.Default
},
type: "community", type: "community",
defaultType: "community", defaultType: "community",
activeDOMConfig: 'community', activeDOMConfig: 'community',

6
src/ext/lib/settings/SiteSettings.ts
View File

@ -28,7 +28,7 @@ export class SiteSettings {
//#region lifecycle //#region lifecycle
constructor(settings: Settings, site: string) { constructor(settings: Settings, site: string) {
this.settings = settings; this.settings = settings;
this.data = settings.active.sites[site]; this.raw = settings.active.sites[site];
this.site = site; this.site = site;
this.defaultSettings = settings.default.sites['@global']; this.defaultSettings = settings.default.sites['@global'];
@ -52,7 +52,7 @@ export class SiteSettings {
* Alan pls ensure default settings object follows the correct structure * Alan pls ensure default settings object follows the correct structure
*/ */
private compileSettingsObject() { private compileSettingsObject() {
this.raw = _cp(this.settings.active.sites[this.site] ?? {}) this.data = _cp(this.settings.active.sites[this.site] ?? {})
if (!this.data) { if (!this.data) {
this.data = _cp(this.defaultSettings); this.data = _cp(this.defaultSettings);
@ -81,7 +81,7 @@ export class SiteSettings {
} }
} }
for (const enableSegment of ['enable', 'enableAard', 'enableKeyboard']) { for (const enableSegment of ['enable', 'enableAard', 'enableKeyboard', 'enableUI']) {
if (!this.data[enableSegment]) { if (!this.data[enableSegment]) {
this.data[enableSegment] = {}; this.data[enableSegment] = {};
} }

5
src/ext/lib/video-data/PlayerData.ts
View File

@ -248,14 +248,15 @@ class PlayerData {
//#endregion //#endregion
deferredUiInitialization(playerDimensions) { deferredUiInitialization(playerDimensions) {
if (this.ui || ! this.videoData.settings.active.ui?.inPlayer?.enabled) { if (this.ui || this.siteSettings.data.enableUI.fullscreen === ExtensionMode.Disabled) {
return; return;
} }
if ( if (
this.isFullscreen this.isFullscreen
|| ( || (
playerDimensions.width > 1208 this.siteSettings.data.enableUI.theater !== ExtensionMode.Disabled
&& playerDimensions.width > 1208
&& playerDimensions.height > 720 && playerDimensions.height > 720
) )
) { ) {