diff --git a/src/csui/Popup.vue b/src/csui/Popup.vue index 165c727..29e2d7f 100644 --- a/src/csui/Popup.vue +++ b/src/csui/Popup.vue @@ -19,6 +19,13 @@

Ultrawidify: Quick settings

+
+
site: {{site.host}}
+ + +
Build channel: {{BrowserDetect?.processEnvChannel}}
@@ -113,6 +120,7 @@ import Settings from '../ext/lib/Settings'; import Logger from '../ext/lib/Logger'; import EventBus from '../ext/lib/EventBus'; import {ChromeShittinessMitigations as CSM} from '../common/js/ChromeShittinessMitigations'; +import SupportLevelIndicator from '@csui/src/components/SupportLevelIndicator.vue' export default { components: { @@ -122,6 +130,7 @@ export default { PlayerDetectionPanel, BaseExtensionSettings, InPlayerUIAdvertisement, + SupportLevelIndicator, AboutPanel }, data () { @@ -146,6 +155,11 @@ export default { ], } }, + computed: { + siteSupportLevel() { + return (this.site && this.siteSettings) ? this.siteSettings.data.type || 'no-support' : 'waiting'; + } + }, async created() { this.logger = new Logger(); await this.logger.init({ diff --git a/src/csui/res/css/common.scss b/src/csui/res/css/common.scss index 6b4d733..443c7e1 100644 --- a/src/csui/res/css/common.scss +++ b/src/csui/res/css/common.scss @@ -103,7 +103,6 @@ body { } .label { - padding-top: 1.5rem; font-size: 1.5rem; font-variant: small-caps; font-weight: 600; diff --git a/src/csui/src/PlayerUIWindow.vue b/src/csui/src/PlayerUIWindow.vue index de4989e..19f04f7 100644 --- a/src/csui/src/PlayerUIWindow.vue +++ b/src/csui/src/PlayerUIWindow.vue @@ -138,8 +138,7 @@ import ChangelogPanel from './PlayerUiPanels/ChangelogPanel.vue' import AboutPanel from '@csui/src/PlayerUiPanels/AboutPanel.vue' import PlayerUiSettings from './PlayerUiPanels/PlayerUiSettings.vue' import ResetBackupPanel from './PlayerUiPanels/ResetBackupPanel.vue' - -import SupportLevelIndicator from './components/SupportLevelIndicator.vue' +import SupportLevelIndicator from '@csui/src/components/SupportLevelIndicator.vue' export default { components: { diff --git a/src/csui/src/PlayerUiPanels/PanelComponents/ExtensionSettings/SiteExtensionSettings.vue b/src/csui/src/PlayerUiPanels/PanelComponents/ExtensionSettings/SiteExtensionSettings.vue index 7d6b0f3..06b189a 100644 --- a/src/csui/src/PlayerUiPanels/PanelComponents/ExtensionSettings/SiteExtensionSettings.vue +++ b/src/csui/src/PlayerUiPanels/PanelComponents/ExtensionSettings/SiteExtensionSettings.vue @@ -3,7 +3,8 @@
- Enable extension under the following conditions: + Enable extension +
under the following conditions:
+
+
+ + +
+
Default crop:
+
+ + + + +
This is how extension will crop video if/when autodetection is disabled. Pick 'Reset' option to keep aspect ratio as-is by default.
-
- -
-
Default stretch:
-
- - Use default ({{getCommandValue(settings?.active.commands.stretch, siteSettings.data.defaults.stretch)}}) - - - + + + +
- - -
-
Default alignment:
-
- - Use default ({{getAlignmentLabel(siteSettings.data.defaults.alignment)}}) - - - + + + +
- - -
-
Persist crop, stretch, and alignment between videos
-
- - Use default ({{defaultPersistanceLabel}}) - - - - - - + + + + + + +
@@ -401,13 +441,20 @@ export default { commandArguments = undefined; } + console.log('saving settings ...'); await this.siteSettings.set(option, commandArguments, {reload: false}); + console.log('settings saved.'); - // changing alignment options doesn't trigger re-compute, so we need to do it ourselves. - // note that this re-computes siteDefaultAlignment even when setting other options, but - // it's _too late AM_ and hit to performance probably isn't bad enough to warrant - // spending time on a more correct solution tomorrow - this._computedWatchers.siteDefaultAlignment.run(); + // we also need to force re-compute all watchers, otherwise UI will lag behind + // actual state of settings until reload + this._computedWatchers?.simpleExtensionSettings?.run(); + this._computedWatchers?.siteDefaultCrop?.run(); + this._computedWatchers?.siteDefaultStretch?.run(); + this._computedWatchers?.siteDefaultAlignment?.run(); + this._computedWatchers?.siteDefaultCropPersistence?.run(); + this._computedWatchers?.defaultPersistanceLabel?.run(); + + console.log('watchers recomputed'); this.$nextTick( () => this.$forceUpdate()); }, diff --git a/src/csui/src/PlayerUiPanels/PanelComponents/VideoSettings/CropOptionsPanel.vue b/src/csui/src/PlayerUiPanels/PanelComponents/VideoSettings/CropOptionsPanel.vue index bd49578..3148b6c 100644 --- a/src/csui/src/PlayerUiPanels/PanelComponents/VideoSettings/CropOptionsPanel.vue +++ b/src/csui/src/PlayerUiPanels/PanelComponents/VideoSettings/CropOptionsPanel.vue @@ -16,7 +16,7 @@ -
- You can enter a ratio in width:height format (e.g. "21:9" or "1:2.39"), or just the factor - (in this case, "1:2.39" would become "2.39" and "21:9" would become "2.33"). You should enter - your numbers without quote marks. Number will be converted to factor form on save. -
+
+ You can enter a ratio in width:height format (e.g. "21:9" or "1:2.39"), or just the factor + (in this case, "1:2.39" would become "2.39" and "21:9" would become "2.33"). You should enter + your numbers without quote marks. Number will be converted to factor form on save. +
+
Label: @@ -67,9 +68,9 @@
-
- Label for the button. You can make it say something other than ratio. -
+
+
+ Label for the button. You can make it say something other than ratio.
@@ -83,11 +84,11 @@ >
-
- Note: Your browser and OS already use certain key combinations that involve Ctrl and Meta (Windows) keys — and, to a lesser extent, Alt. - The extension doesn't (and cannot) check whether the keyboard shortcut you enter is actually free for you to use. The extension also won't override - any keyboard shortcuts defined by the site itself. -
+ +
+ Note: Your browser and OS already use certain key combinations that involve Ctrl and Meta (Windows) keys — and, to a lesser extent, Alt. + The extension doesn't (and cannot) check whether the keyboard shortcut you enter is actually free for you to use. The extension also won't override + any keyboard shortcuts defined by the site itself.
diff --git a/src/csui/src/components/TriggerZoneEditor.vue b/src/csui/src/components/TriggerZoneEditor.vue index 889d3a7..ef76a0c 100644 --- a/src/csui/src/components/TriggerZoneEditor.vue +++ b/src/csui/src/components/TriggerZoneEditor.vue @@ -73,10 +73,11 @@ @change="(event) => updateSettings(true)" >
-
- Width of the trigger zone (% of player area). -
+
+ Width of the trigger zone (% of player area). +
+
Trigger zone height:
@@ -95,10 +96,11 @@ @change="(event) => updateSettings(true)" >
-
- Height of the trigger zone (% of player area). -
+
+ Height of the trigger zone (% of player area). +
+
Trigger zone horizontal offset:
@@ -116,10 +118,11 @@ @change="(event) => updateSettings(true)" >
-
- By default, trigger zone is centered around the button. This option moves trigger zone left and right. -
+
+ By default, trigger zone is centered around the button. This option moves trigger zone left and right. +
+
Trigger zone vertical offset:
@@ -137,9 +140,9 @@ @change="(event) => updateSettings(true)" >
-
- By default, trigger zone is centered around the button. This option moves trigger zone up and down. -
+
+
+ By default, trigger zone is centered around the button. This option moves trigger zone up and down.
diff --git a/src/csui/src/popup/panels/PopupVideoSettings.vue b/src/csui/src/popup/panels/PopupVideoSettings.vue index 365dcd1..a986747 100644 --- a/src/csui/src/popup/panels/PopupVideoSettings.vue +++ b/src/csui/src/popup/panels/PopupVideoSettings.vue @@ -1,5 +1,16 @@