Do the changelog + highlight changelog tab

This commit is contained in:
Tamius Han 2024-06-11 02:22:53 +02:00
parent 7dafe85c53
commit c5515934d9
2 changed files with 143 additions and 65 deletions

View File

@ -69,7 +69,7 @@
class="tab" class="tab"
:class="{ :class="{
'active': tab.id === selectedTab, 'active': tab.id === selectedTab,
'highlight-tab': tab.hasChanges, 'highlight-tab': tab.highlight,
}" }"
@click="selectTab(tab.id)" @click="selectTab(tab.id)"
> >
@ -141,6 +141,7 @@
></DebugPanel> ></DebugPanel>
<ChangelogPanel <ChangelogPanel
v-if="selectedTab === 'changelog'" v-if="selectedTab === 'changelog'"
:settings="settings"
></ChangelogPanel> ></ChangelogPanel>
<AboutPanel <AboutPanel
v-if="selectedTab === 'about'" v-if="selectedTab === 'about'"
@ -211,6 +212,7 @@ export default {
}, },
created() { created() {
this.siteSettings = this.settings.getSiteSettings(this.site); this.siteSettings = this.settings.getSiteSettings(this.site);
this.tabs.find(x => x.id === 'changelog').highlight = !this.settings.active.whatsNewChecked;
this.eventBus.subscribe( this.eventBus.subscribe(
'uw-show-ui', 'uw-show-ui',
@ -472,11 +474,12 @@ export default {
} }
&.highlight-tab { &.highlight-tab {
opacity: 0.9;
color: #eee; color: #eee;
.label { // .label {
color: rgb(255, 174, 107); // color: rgb(239, 192, 152);
} // }
} }
} }
} }

View File

@ -1,67 +1,142 @@
<template> <template>
<div> <div class="flex flex-col w-full h-full gap-2">
<h1>What's new</h1> <div class="flex flex-row gap-2 bg-black">
<p>Full changelog for older versions <a href="https://github.com/tamius-han/ultrawidify/blob/master/CHANGELOG.md">is available here</a>.</p> <div class="w-[1/2]" style="width: 50%">
<h1>What's new</h1>
<p>Full changelog for older versions <a href="https://github.com/tamius-han/ultrawidify/blob/master/CHANGELOG.md">is available here</a>.</p>
<h2>6.0.0</h2> <h2>6.0.0</h2>
<p> <p>
I don't think I need to write a changelog for this one. I don't think I need to write a changelog for this one. I've also been working on this, on and (mostly) off, for ... a long time, so I might have "kinda forgot" some minor things.
</p> </p>
<ul> <ul>
<li><b>Manifest v3</b>. Bit late, but still.</li> <li><b>Manifest v3</b>. Bit late, but still.</li>
<li> <li>
<b>In-player UI.</b><br/> <b>In-player UI.</b><br/>
This one took major effort to pull off. Required some changes under the hood, required me to de-spaghettify some code. The UI will only show This one took major effort to pull off. Required some changes under the hood, required me to de-spaghettify some code. The UI will only show
if the video takes up sufficient amount of space (currently determined as 960 pixels wide). if the video takes up sufficient amount of space (currently determined as 960 pixels wide).
</li> </li>
<li> <li>
<b>New alignment options.</b> Video can be aligned vertically as well as horizontally. <b>New alignment options.</b> Video can be aligned vertically as well as horizontally.
</li> </li>
<!-- <li> <!-- <li>
By default, Ultrawidify will not kick in on "small videos". You have to be either in full screen or theater mode. Ultrawidify assumes that any By default, Ultrawidify will not kick in on "small videos". You have to be either in full screen or theater mode. Ultrawidify assumes that any
video that takes up more than 85% of the window width is being viewed in theater mode. This value may be tweaked later on. This feature can be video that takes up more than 85% of the window width is being viewed in theater mode. This value may be tweaked later on. This feature can be
configured (or turned off entirely) via 'Advanced options' menu on the in-player UI. configured (or turned off entirely) via 'Advanced options' menu on the in-player UI.
</li> --> </li> -->
<li> <li>
The in-player extension UI will do a better job differentiating between the various level of support: "official" for the sites that Tam can check The in-player extension UI will do a better job differentiating between the various level of support: "official" for the sites that Tam can check
on his own, "fingers crossed" for sites that Tam can't check because my load-bearing credit card can't support the weight of a dozen subscription on his own, "fingers crossed" for sites that Tam can't check because my load-bearing credit card can't support the weight of a dozen subscription
services, and "community support" for sites that enjoy support through the helping hand of people willing to help. services, and "community support" for sites that enjoy support through the helping hand of people willing to help.
</li> </li>
<li> <li>
The in-player UI should now display a warning whenever Ultrawidify detects automatic aspect ratio detection isn't happening because the site uses DRM. The in-player UI should now display a warning whenever Ultrawidify detects automatic aspect ratio detection isn't happening because the site uses DRM.
</li> </li>
<li> <li>
Better zooming. The slider is back, baby. Better zooming. The slider is back, baby.
</li> </li>
<li> <li>
Panning option that's a bit more intuitive. Panning option that's a bit more intuitive.
</li> </li>
</ul> </ul>
<h3>Unbaked features</h3> <h3>Unbaked features</h3>
<ul> <ul>
<li> <li>
<b>Player UI settings</b>. Ultrawidify doesn't always correctly identify which area the video should fill, especially when not in full screen mode. <b>Player UI settings</b>. Ultrawidify doesn't always correctly identify which area the video should fill, especially when not in full screen mode.
Version 6.0.0 was intended to come with UI that makes it easier for you to "help" ultrawidify by identifying the correct player element. Alas, I was Version 6.0.0 was intended to come with UI that makes it easier for you to "help" ultrawidify by identifying the correct player element. Alas, I was
busier than expected and manifest v3 deadline came faster than expected. busier than expected and manifest v3 deadline came faster than expected.
</li> </li>
<li> <li>
<b>Disabling Ultrawidify UI trigger zone, or otherwise changing target area size and position, is not possible</b>. <b>Disabling Ultrawidify UI trigger zone, or otherwise changing target area size and position, is not possible</b>.
</li> </li>
</ul> </ul>
<h3>Regressions</h3> <h3>Regressions</h3>
<ul> <ul>
<li> <li>
Due to major changes under the hood, custom settings from older versions may not have been migrated. Due to major changes under the hood, custom settings from older versions were NOT been migrated (probably).
</li> </li>
<li> <li>
It is unclear how extension acts on sites with more than one video. It is unclear how extension acts on sites with more than one video.
</li> </li>
<li> <li>
Extension lost the ability to discriminate between iframes. Actions taken through the popup will be affect <b>all</b> iframes. Extension lost the ability to discriminate between iframes. Actions taken through the popup will be affect <b>all</b> iframes.
</li> </li>
</ul> <li>
Hope the UI is worth the regressions, because getting UI to work has been a MAJOR pain in the ass.
</li>
</ul>
</div>
<div class="w-[1/2]" style="width: 50%; padding-left: 1rem; padding-top: 5rem;">
<h2>Thank you monies</h2>
<p>
If you think I deserve money for the work I did up to this point, you can bankroll my caffeine addiction.
</p>
<p class="text-center">
<a class="donate" href="https://www.paypal.com/paypalme/tamius">Donate on Paypal</a>
</p>
<h2>Fun stuff</h2>
<p>
This is probably a bad idea but
</p>
<p>
Are you attending Isle of Wonders on Cres, Croatia, between 28. 6. and 30. 6.? So am I, by official duty.
</p>
<p>
Club Amulet D20 is forecasted to have a stand there, and I am forecasted to be in the general vicinity of it (barring any unexpected circumstances). I'll be either taking photos, painting minis, or doing heatstroke any% in rather rudamentary costume.
</p>
<p>
If you're there, you can swing around to say 'hi' or provide some validation, or paint some minis. Rumor has it Conquest will have paint&take event.
</p>
<p>
Tamius
</p>
<p>
</p>
<p>
<small>I am not paid to shill this.</small>
</p>
</div>
</div>
</div> </div>
</template> </template>
<script> <script>
export default({
props: [
'settings'
],
mounted() {
this.settings.active.whatsNewChecked = true;
this.settings.save();
}
});
</script> </script>
<style lang="scss" scoped>
.flex {
display: flex;
}
.flex-row {
flex-direction: row;
}
p, li {
font-size: 1rem;
}
small {
opacity: 0.5;
font-size: 0.8em;
}
a {
color: #fa6;
}
.text-center {
text-align: center;
}
.donate {
margin: 1rem;
padding: 0.5rem 1rem;
border-radius: 0.25rem;
background-color: #fa6;
color: #000;
}
</style>