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

Fix player detector panel

Browse Source
This commit is contained in:
Tamius Han 2024-06-11 01:55:02 +02:00
parent b96227b07a
commit d4f9ab9f37
2 changed files with 348 additions and 305 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

19
src/csui/src/PlayerUiPanels/PlayerDetectionPanel.vue
View File

@ -10,6 +10,7 @@
<div class="flex flex-row">
<h1><mdicon name="television-play" :size="32" /> Player element</h1>
</div>
<div class="flex flex-row">
<div class="sub-panel-content">
<p>
You're probably on this page because Ultrawidify doesn't crop the player correctly.
@ -18,13 +19,16 @@
If you hover over the boxes below, the corresponding element will change (sepia filter + higher brightness + reduced contrast + it gets an outline). Player element
should be the closest element to the video element, for which the sepia/brightness effect covers the area you expect the video will cover.
</p>
<p>
You need to reload the page for changes to take effect.
</p>
<!-- <p>
<a @click="showAdvancedOptions = !showAdvancedOptions">
<template v-if="showAdvancedOptions">Hide advanced options</template>
<template v-else>Show advanced options</template>
</a>
</p>
</p> -->
<div v-if="showAdvancedOptions" style="display: flex; flex-direction: row">
<div style="display: flex; flex-direction: column">
@ -72,7 +76,7 @@
</div>
</th>
<th>Element</th>
<th>Actions</th>
<!-- <th>Actions</th> -->
<!-- <th>Quick fixes</th> -->
</tr>
</thead>
@ -336,6 +340,11 @@
</div> -->
</div>
</div>
<!-- <div class="sub-panel-content">
<h2>Advanced settings</h2>
</div> -->
</div>
</div>
</div>
</div>
@ -450,6 +459,10 @@ export default({
</script>
<style lang="scss" scoped>
p {
font-size: 1rem;
}
.element-tree {
.element-row {
// display: flex;

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

@ -256,6 +256,12 @@ export class SiteSettings {
//#region get
/**
* TODO: check what this function is really doing — implementation didn't make sense
* and didn't quite agree with the comment.
*
* specifically, this function used to always return currentDOMConfig, and the stuff
* done inside if block appeared to not be affected. It is also only used in one spot.
*
* Gets DOMConfig. If DOMConfig with given name doesn't exist, we create a new one.
* @param configName We want to fetch this DOM config
* @param copyFrom If DOMConfig data doesn't exist, we copy things from DOMConfig with
@ -264,10 +270,34 @@ export class SiteSettings {
* @returns Current DOMConfig object for this site
*/
getDOMConfig(configName: string, copyFrom?: string) {
// NOTE: this was added because
// there are no DOMConfig objects for this site
if (!this.data.DOMConfig) {
this.data.DOMConfig = {
'original': {
type: undefined,
elements: {
player: undefined,
video: undefined,
other: undefined,
},
},
'modified': {
type: undefined,
elements: {
player: undefined,
video: undefined,
other: undefined,
},
},
};
}
// TODO: check what's with that and if this can be removed? This if looks rather useless
if (! this.data.DOMConfig[configName]) {
this.data.DOMConfig[configName] = _cp(this.data.DOMConfig[copyFrom ?? this.data.activeDOMConfig ?? 'original']);
}
return this.data.currentDOMConfig[configName];
return this.data.DOMConfig[configName];
}
//#endregion