Fix settings cascade in ui

This commit is contained in:
Tamius Han 2025-01-29 23:37:31 +01:00
parent f728cbf817
commit 208a360c47

View File

@ -44,7 +44,7 @@
</div> </div>
<!-- The rest of the menu is disabled when extension is disabled --> <!-- The rest of the menu is disabled when extension is disabled -->
<div :class="{disabled: simpleExtensionSettings.enable === 'disabled' }"> <div :class="{disabled: simpleEffectiveSettings.enable === 'disabled'}">
<!-- Enable AARD --> <!-- Enable AARD -->
<div class="field"> <div class="field">
<div class="label"> <div class="label">
@ -275,6 +275,7 @@ export default {
data() { data() {
return { return {
CropModePersistence: CropModePersistence, CropModePersistence: CropModePersistence,
ExtensionMode,
alignmentOptions: [ alignmentOptions: [
{label: 'Top left', arguments: {x: VideoAlignmentType.Left, y: VideoAlignmentType.Top}}, {label: 'Top left', arguments: {x: VideoAlignmentType.Left, y: VideoAlignmentType.Top}},
{label: 'Top center', arguments: {x: VideoAlignmentType.Center, y: VideoAlignmentType.Top}}, {label: 'Top center', arguments: {x: VideoAlignmentType.Center, y: VideoAlignmentType.Top}},
@ -308,6 +309,14 @@ export default {
enableUI: this.compileSimpleSettings('enableUI') enableUI: this.compileSimpleSettings('enableUI')
} }
}, },
simpleEffectiveSettings() {
return {
enable: this.compileSimpleSettings('enable', 'site-effective'),
enableAard: this.compileSimpleSettings('enableAard', 'site-effective'),
enableKeyboard: this.compileSimpleSettings('enableKeyboard', 'site-effective'),
enableUI: this.compileSimpleSettings('enableUI', 'site-effective')
}
},
simpleDefaultSettings() { simpleDefaultSettings() {
return { return {
enable: this.getDefaultOptionLabel('enable'), enable: this.getDefaultOptionLabel('enable'),
@ -347,8 +356,20 @@ export default {
/** /**
* Compiles our extension settings into more user-friendly options * Compiles our extension settings into more user-friendly options
*/ */
compileSimpleSettings(component, getDefaults) { compileSimpleSettings(component, getFor = 'site') {
const settingsData = getDefaults ? this.settings.active.sites['@global'] : this.siteSettings?.raw; let settingsData;
switch (getFor) {
case 'site':
settingsData = this.siteSettings?.raw;
break;
case 'site-effective':
settingsData = this.siteSettings?.data;
break;
case 'default':
settingsData = this.settings.active.sites['@global'];
break;
}
try { try {
if ( if (
( settingsData?.[component]?.normal === ExtensionMode.Disabled || component === 'enableUI') ( settingsData?.[component]?.normal === ExtensionMode.Disabled || component === 'enableUI')
@ -393,7 +414,7 @@ export default {
}, },
getDefaultOptionLabel(component) { getDefaultOptionLabel(component) {
const componentValue = this.compileSimpleSettings(component, true); const componentValue = this.compileSimpleSettings(component, 'default');
if (componentValue === 'loading') { if (componentValue === 'loading') {
return componentValue; return componentValue;
@ -502,6 +523,18 @@ export default {
return; return;
} }
if (component === 'enable') {
this.setExtensionMode('enableAard', event);
this.setExtensionMode('enableKeyboard', event);
// in enableUI, 'enabled' is unused and 'theater' uses its place
if (option === 'enabled') {
this.setExtensionMode('enableUI', {target: {value: 'theater'}});
} else {
this.setExtensionMode('enableUI', event);
}
}
if (option === 'default') { if (option === 'default') {
return this.siteSettings.set(component, { return this.siteSettings.set(component, {
normal: ExtensionMode.Default, normal: ExtensionMode.Default,