Settings page is now on some baseline of "works", but needs some minor touch-ups
This commit is contained in:
parent
a8847bdeff
commit
fcfc0361dc
@ -78,6 +78,7 @@
|
||||
:settings="settings"
|
||||
:siteSettings="selectedSiteSettings"
|
||||
:isDefaultConfiguration="selectedSite === '@global'"
|
||||
:visibleSegments="{advancedPlayerSettings: role === 'settings'}"
|
||||
></SiteExtensionSettings>
|
||||
</div>
|
||||
</template>
|
||||
@ -98,6 +99,7 @@ export default {
|
||||
},
|
||||
props: [
|
||||
'settings',
|
||||
'role',
|
||||
],
|
||||
components: {
|
||||
SiteExtensionSettings,
|
||||
|
||||
@ -115,8 +115,8 @@
|
||||
|
||||
<OtherSiteSettings
|
||||
v-if="selectedTab === 'website-extension-settings'"
|
||||
:role="role"
|
||||
:settings="settings"
|
||||
:enableSettingsEditor="true"
|
||||
></OtherSiteSettings>
|
||||
|
||||
<PlayerElementSettings
|
||||
@ -230,8 +230,6 @@ const AVAILABLE_TABS = {
|
||||
{ id: 'website-extension-settings', label: 'Website exceptions', },
|
||||
]
|
||||
},
|
||||
'siteSettings': {id: 'extensionSettings', label: 'Site and Extension options', icon: 'cogs' },
|
||||
'settings.player-element-settings': { id: 'settings.player-element-settings', label: 'Advanced video player options', icon: 'play-box-edit-outline' },
|
||||
'window.player-element-settings': { id: 'window.player-element-settings', label: 'Advanced video player options', icon: 'play-box-edit-outline' },
|
||||
'autodetectionSettings': {id: 'autodetectionSettings', label: 'Autodetection options', icon: 'auto-fix'},
|
||||
'ui-settings': {id: 'ui-settings', label: 'UI settings', icon: 'movie-cog-outline' },
|
||||
@ -275,6 +273,12 @@ const TAB_LOADOUT = {
|
||||
],
|
||||
}
|
||||
|
||||
const DEFAULT_TABS = {
|
||||
settings: 'default-extension-settings',
|
||||
updated: 'updated',
|
||||
popup: 'video-settings',
|
||||
}
|
||||
|
||||
export default defineComponent({
|
||||
components: {
|
||||
VideoSettings,
|
||||
@ -304,7 +308,7 @@ export default defineComponent({
|
||||
tabs: [
|
||||
|
||||
],
|
||||
selectedTab: 'extensionSettings',
|
||||
selectedTab: undefined,
|
||||
BrowserDetect: BrowserDetect,
|
||||
preventClose: false,
|
||||
siteSettings: null,
|
||||
@ -408,6 +412,7 @@ export default defineComponent({
|
||||
}
|
||||
}
|
||||
this.tabs = tabs;
|
||||
this.selectedTab = this.selectedTab ?? DEFAULT_TABS[this.role];
|
||||
},
|
||||
setInitialPath(path: string[] = this.initialPath) {
|
||||
console.log('setting initial path:', this.initialPath)
|
||||
|
||||
@ -50,6 +50,7 @@
|
||||
<template v-if="tab === 'otherSites'">
|
||||
<OtherSiteSettings
|
||||
v-if="settings"
|
||||
:role="role"
|
||||
:settings="settings"
|
||||
>
|
||||
</OtherSiteSettings>
|
||||
@ -174,6 +175,7 @@ export default {
|
||||
},
|
||||
mixins: [],
|
||||
props: [
|
||||
'role',
|
||||
'settings',
|
||||
'site',
|
||||
'enableSettingsEditor',
|
||||
|
||||
@ -43,6 +43,7 @@
|
||||
:settings="settings"
|
||||
:siteSettings="selectedSiteSettings"
|
||||
:isDefaultConfiguration="selectedSite === '@global'"
|
||||
:visibleSegments="{advancedPlayerSettings: role === 'settings'}"
|
||||
></SiteExtensionSettings>
|
||||
</div>
|
||||
</div>
|
||||
@ -63,6 +64,7 @@ export default {
|
||||
}
|
||||
},
|
||||
props: [
|
||||
'role',
|
||||
'settings',
|
||||
'isCompact',
|
||||
],
|
||||
|
||||
@ -317,10 +317,9 @@
|
||||
</div>
|
||||
</div>
|
||||
|
||||
<div class="mt-4">
|
||||
<div v-if="visibleSegments?.advancedPlayerSettings" class="mt-4">
|
||||
<h4 class="mt-4 text-primary-400 text-[1.125em] font-bold mb-2">Other options</h4>
|
||||
<button @click="playerDetectionOptionsDialog.visible = true">Advanced video player options</button>
|
||||
<p>{{playerDetectionOptionsDialog.visible}}</p>
|
||||
</div>
|
||||
</div>
|
||||
|
||||
@ -328,13 +327,13 @@
|
||||
<Popup
|
||||
v-if="playerDetectionOptionsDialog.visible"
|
||||
title="Player detection options"
|
||||
confirmButtonText="Save"
|
||||
cancelButtonText="Cancel"
|
||||
@onCancel="playerDetectionOptionsDialog.visible = false"
|
||||
:clientSideButtons="true"
|
||||
>
|
||||
<PlayerSelectorAdvancedForm
|
||||
role="popup"
|
||||
:settings="settings"
|
||||
:siteSettings="siteSettings"
|
||||
@close="playerDetectionOptionsDialog.visible = false"
|
||||
></PlayerSelectorAdvancedForm>
|
||||
</Popup>
|
||||
</template>
|
||||
@ -361,6 +360,7 @@ export default defineComponent({
|
||||
'siteSettings',
|
||||
'isDefaultConfiguration',
|
||||
'showPlayerSettings',
|
||||
'visibleSegments', // object of {[segment: string]: true}
|
||||
],
|
||||
data() {
|
||||
return {
|
||||
|
||||
@ -148,7 +148,7 @@
|
||||
<div class="w-full flex flex-row gap-2 justify-end">
|
||||
<button @click="openSaveAsDialog()">Save as</button>
|
||||
<button :disabled="!siteSettings.raw.DOMConfig?.[DOMConfigName] || DOMConfigName?.startsWith('@')">Save</button>
|
||||
<button @click="closeForm()">Close</button>
|
||||
<button v-if="role === 'popup'" @click="closeForm()">Close</button>
|
||||
</div>
|
||||
|
||||
<!-- PRESET SELECT DIALOG -->
|
||||
@ -317,6 +317,7 @@ export default({
|
||||
ConfirmButton,
|
||||
},
|
||||
props: [
|
||||
'role',
|
||||
'settings',
|
||||
'siteSettings'
|
||||
],
|
||||
@ -352,16 +353,16 @@ export default({
|
||||
this.DOMConfigName = configKey;
|
||||
|
||||
if (!DOMConfigData.elements) {
|
||||
DOMConfigData.elements = _cp(siteSettings.blankSettings.DOMConfig.empty);
|
||||
DOMConfigData.elements = _cp(siteSettings.blankSettings.DOMConfig['@empty']);
|
||||
}
|
||||
if (!DOMConfigData.elements.player) {
|
||||
DOMConfigData.elements.player = _cp(siteSettings.blankSettings.DOMConfig.empty.elements.player);
|
||||
DOMConfigData.elements.player = _cp(siteSettings.blankSettings.DOMConfig['@empty'].elements.player);
|
||||
}
|
||||
if (!DOMConfigData.elements.video) {
|
||||
DOMConfigData.elements.video = _cp(siteSettings.blankSettings.DOMConfig.empty.elements.video);
|
||||
DOMConfigData.elements.video = _cp(siteSettings.blankSettings.DOMConfig['@empty'].elements.video);
|
||||
}
|
||||
} else {
|
||||
DOMConfigData = _cp(siteSettings.blankSettings.DOMConfig.empty)
|
||||
DOMConfigData = _cp(siteSettings.blankSettings.DOMConfig['@empty'])
|
||||
}
|
||||
this.DOMConfigData = DOMConfigData;
|
||||
|
||||
@ -369,7 +370,6 @@ export default({
|
||||
},
|
||||
|
||||
|
||||
|
||||
openSelectSnapshotDialog() {
|
||||
this.selectSnapshotDialog = {
|
||||
visible: true
|
||||
@ -478,6 +478,10 @@ export default({
|
||||
this.siteSettings.raw.activeDOMConfig = this.DOMConfigName;
|
||||
this.saveAsDialog = {visible: false};
|
||||
await this.settings.save();
|
||||
},
|
||||
|
||||
closeForm() {
|
||||
this.$emit('close');
|
||||
}
|
||||
}
|
||||
});
|
||||
|
||||
@ -1,19 +1,13 @@
|
||||
<template>
|
||||
<div class="flex flex-col relative w-full">
|
||||
|
||||
<h2 class="text-[1.75em]">Player UI options</h2>
|
||||
|
||||
<!-- The rest of the tab is under 'edit ratios and shortcuts' row -->
|
||||
<div class="flex flex-col" style="width: 100%">
|
||||
<div v-if="settings" class="flex flex-col" style="width: 100%">
|
||||
|
||||
<div class="flex flex-col compact-form">
|
||||
<div v-if="!siteSettings.data.enableUI.fullscreen">
|
||||
UI is disabled for this site.
|
||||
</div>
|
||||
|
||||
<div
|
||||
class="flex flex-col field-group compact-form"
|
||||
:class="{disabled: !siteSettings.data.enableUI.fullscreen}"
|
||||
>
|
||||
<div class="field disabled">
|
||||
<div class="label">
|
||||
@ -107,6 +101,9 @@
|
||||
</div>
|
||||
|
||||
</div>
|
||||
<div v-else>
|
||||
Loading settings ...
|
||||
</div>
|
||||
</div>
|
||||
</template>
|
||||
|
||||
|
||||
Loading…
Reference in New Issue
Block a user