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

Hotfix for popup

Browse Source
This commit is contained in:
Tamius Han 2019-08-25 01:52:04 +02:00
parent 68e2b276df
commit 9f2880c802
8 changed files with 116 additions and 45 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

14
CHANGELOG.md
View File

@ -6,7 +6,19 @@
* Settings page looks ugly af right now. Maybe fix it some time later
### v4.2.1 (current)
### v4.2.3 / 4.2.3.1
* Fixed twitchy behaviour on Twitch, Facebook and Twatter. Here's a [blog post](https://stuff.tamius.net/sacred-texts/2019/08/24/ultrawidify-the-twitchy-twitch-problem/) that covers the issue in more detail.
* Cropping now uses user styles (as opposed to modifying element's style attribute)
* Fixed the issue where one-pixel letterbox would result in constant aspect ratio corrections.
* Started using mutation observers to watch for anything modifying the size of our video.
* **[4.2.3.1]** fixed some bugs in popup.
### v4.2.2
* Fixed alignment issues for reddit on videos from v.reddit
* Some people reported issues with inconsistent video alignment on youtube. While I've not been able to make that bug happen to me, (which means I haven't been able to fix it either), reports describe behaviour similar to what was going on with Iridium. Examining the Iridium issue revealed an issue that could be potentially blamed for this behaviour. That issue was fixed. Since I've never been able to make this problem happen to me, I'm not being able to verify whether that issue is gone. If you're still experiencing issues with inconsistent video alignment, please contact me via github, reddit or email. See 'Report a problem' tab for more details.
### v4.2.1
* Fixed bug where custom CSS didn't get applied to pages
### v4.2.0

6
src/ext/lib/ActionHandler.js
View File

@ -120,6 +120,12 @@ class ActionHandler {
}
}
unregisterHandleMouse(videoData) {
var ths = this;
if (videoData.player && videoData.player.element) {
videoData.player.element.removeEventListener('mousemove', (event) => ths.handleMouseMove(event, videoData));
}
}
setKeyboardLocal(state) {
if (state === ExtensionMode.Enabled) {

37
src/ext/lib/Settings.js
View File

@ -14,6 +14,7 @@ class Settings {
constructor(activeSettings, updateCallback) {
this.active = activeSettings ? activeSettings : undefined;
this.default = ExtensionConf;
this.default['version'] = this.getExtensionVersion();
this.useSync = false;
this.version = undefined;
this.updateCallback = updateCallback;
@ -63,11 +64,26 @@ class Settings {
}
}
getExtensionVersion() {
if (currentBrowser.firefox) {
return browser.runtime.getManifest().version;
} else if (currentBrowser.chrome) {
return chrome.runtime.getManifest().version;
} else if (currentBrowser.edge) {
return browser.runtime.getManifest().version;
}
}
async init() {
const settings = await this.get();
const oldVersion = settings.version;
const currentVersion = this.getExtensionVersion();
if(Debug.debug) {
console.log("[Settings::init] Configuration fetched from storage:", settings);
console.log("[Settings::init] Configuration fetched from storage:", settings,
"\nlast saved with:", settings.version,
"\ncurrent version:", currentVersion
);
if (Debug.flushStoredSettings) {
console.log("%c[Settings::init] Debug.flushStoredSettings is true. Using default settings", "background: #d00; color: #ffd");
@ -96,18 +112,17 @@ class Settings {
// if there's settings, set saved object as active settings
this.active = settings;
// check if extension has been updated. If not, return settings as they were retreived
if (currentBrowser.firefox) {
this.version = browser.runtime.getManifest().version;
} else if (currentBrowser.chrome) {
this.version = chrome.runtime.getManifest().version;
} else if (currentBrowser.edge) {
this.version = browser.runtime.getManifest().version;
// from some point to 4.2.3.1, settings version wasn't saved. Fix that.
if (!settings.version) {
this.active.version = currentVersion;
}
if(settings.version === this.version) {
// check if extension has been updated. If not, return settings as they were retreived
if(oldVersion === currentVersion) {
if(Debug.debug) {
console.log("[Settings::init] extension was saved with current version of ultrawidify (", this.version, "). Returning object as-is.");
console.log("[Settings::init] extension was saved with current version of ultrawidify. Returning object as-is.");
}
return this.active;
@ -131,6 +146,8 @@ class Settings {
// set 'whatsNewChecked' flag to false when updating
this.active.whatsNewChecked = false;
// update settings version to current
this.active.version = currentVersion;
this.set(this.active);
return this.active;

8
src/ext/lib/video-data/PageInfo.js
View File

@ -71,8 +71,12 @@ class PageInfo {
clearTimeout(this.rescanTimer);
}
for (var video of this.videos) {
this.comms.unregisterVideo(video.id)
video.destroy();
try {
this.comms.unregisterVideo(video.id)
video.destroy();
} catch (e) {
console.log("unabel to destroy video!", e)
}
}
try {

69
src/ext/lib/video-data/VideoData.js
View File

@ -52,12 +52,16 @@ class VideoData {
}
onVideoDimensionsChanged(mutationList, observer) {
if (!mutationList || this.video === undefined) { // something's wrong
if (observer && this.video) {
observer.disconnect();
}
return;
}
for (let mutation of mutationList) {
if (mutation.type === 'attributes') {
console.log("video attributes were changed:", mutation)
if (mutation.attributeName === 'class') {
if (!this.video.classList.contains(this.userCssClassName)) {
console.log("class changed!")
// force the page to include our class in classlist, if the classlist has been removed
this.video.classList.add(this.userCssClassName);
@ -71,6 +75,13 @@ class VideoData {
// if size of the video has changed, this may mean we need to recalculate/reapply
// last calculated aspect ratio
this.restoreAr();
} else if (mutation.attribute = 'src' && mutation.attributeOldValue !== this.video.getAttribute('src')) {
// try fixing alignment issue on video change
try {
this.restoreAr();
} catch (e) {
console.error("[VideoData::onVideoDimensionsChanged] There was an error when handling src change.", e);
}
}
}
}
@ -78,7 +89,8 @@ class VideoData {
firstTimeArdInit(){
if(this.destroyed) {
throw {error: 'VIDEO_DATA_DESTROYED', data: {videoData: this}};
// throw {error: 'VIDEO_DATA_DESTROYED', data: {videoData: this}};
return;
}
if(! this.arSetupComplete){
this.arDetector = new ArDetector(this);
@ -87,7 +99,8 @@ class VideoData {
initArDetection() {
if(this.destroyed) {
throw {error: 'VIDEO_DATA_DESTROYED', data: {videoData: this}};
// throw {error: 'VIDEO_DATA_DESTROYED', data: {videoData: this}};
return;
}
if(this.arDetector){
this.arDetector.init();
@ -103,7 +116,8 @@ class VideoData {
console.log("[VideoData::startArDetection] starting AR detection")
}
if(this.destroyed) {
throw {error: 'VIDEO_DATA_DESTROYED', data: {videoData: this}};
// throw {error: 'VIDEO_DATA_DESTROYED', data: {videoData: this}};
return;
}
if(!this.arDetector) {
this.arDetector.init();
@ -113,7 +127,8 @@ class VideoData {
rebootArDetection() {
if(this.destroyed) {
throw {error: 'VIDEO_DATA_DESTROYED', data: {videoData: this}};
// throw {error: 'VIDEO_DATA_DESTROYED', data: {videoData: this}};
return;
}
this.arDetector.init();
}
@ -131,20 +146,31 @@ class VideoData {
this.pause();
this.destroyed = true;
if(this.arDetector){
this.arDetector.stop();
this.arDetector.destroy();
if (this.arDetector){
try {
this.arDetector.stop();
this.arDetector.destroy();
} catch (e) {}
}
this.arDetector = null;
if(this.resizer){
this.resizer.destroy();
this.arDetector = undefined;
if (this.resizer){
try {
this.resizer.destroy();
} catch (e) {}
}
this.resizer = null;
if(this.player){
this.player.destroy();
this.resizer = undefined;
if (this.player){
try {
this.player.destroy();
} catch (e) {}
}
this.player = null;
this.video = null;
if (this.observer) {
try {
this.observer.disconnect();
} catch (e) {}
}
this.player = undefined;
this.video = undefined;
}
pause(){
@ -152,9 +178,6 @@ class VideoData {
if(this.arDetector){
this.arDetector.stop();
}
if(this.resizer){
this.resizer.stop();
}
if(this.player){
this.player.stop();
}
@ -162,7 +185,8 @@ class VideoData {
resume(){
if(this.destroyed) {
throw {error: 'VIDEO_DATA_DESTROYED', data: {videoData: this}};
// throw {error: 'VIDEO_DATA_DESTROYED', data: {videoData: this}};
return;
}
this.paused = false;
try {
@ -214,7 +238,8 @@ class VideoData {
panHandler(event, forcePan) {
if(this.destroyed) {
throw {error: 'VIDEO_DATA_DESTROYED', data: {videoData: this}};
// throw {error: 'VIDEO_DATA_DESTROYED', data: {videoData: this}};
return;
}
if(!this.resizer) {
this.destroy();

2
src/manifest.json
View File

@ -2,7 +2,7 @@
"manifest_version": 2,
"name": "Ultrawidify",
"description": "Removes black bars on ultrawide videos and offers advanced options to fix aspect ratio.",
"version": "4.2.3",
"version": "4.2.3.1",
"applications": {
"gecko": {
"id": "{cf02b1a7-a01a-4e37-a609-516a283f1ed3}"

18
src/popup/App.vue
View File

@ -34,7 +34,7 @@
class="tabitem ltr"
:class="{
'tabitem-selected': site.host === selectedSite,
'tabitem-disabled': !settings.canStartExtension(site.host)
'tabitem-disabled': (settings && !settings.canStartExtension(site.host))
}"
@click="selectSite(site.host)"
>
@ -59,7 +59,7 @@
class="tabitem ltr"
:class="{
'tabitem-selected': selectedFrame === frame.id,
'disabled': !isDefaultFrame(frame.id) && !settings.canStartExtension(frame.label)
'disabled': !isDefaultFrame(frame.id) && (settings && !settings.canStartExtension(frame.label))
}"
:key="frame.id"
@click="selectFrame(frame.id)"
@ -100,7 +100,7 @@
:class="{'selected-tab': selectedTab === 'whats-new'}"
@click="selectTab('whats-new')"
>
<div :class="{'new': !settings.active.whatsNewChecked}"
<div :class="{'new': settings && settings.active && !settings.active.whatsNewChecked}"
>
What's new?
</div>
@ -196,6 +196,7 @@ export default {
siteTabDisabled: false,
videoTabDisabled: false,
canShowVideoTab: {canShow: true, warning: true},
showWhatsNew: false,
}
},
async created() {
@ -266,7 +267,6 @@ export default {
this.selectedFrame = frame;
},
async updateConfig() {
// when this runs, a site could have been enabled or disabled
// this means we must update canShowVideoTab
this.updateCanShowVideoTab();
@ -278,6 +278,7 @@ export default {
if (!this.settings) {
this.canShowVideoTab = {canShow: true, warning: false};
return;
}
for (const site of this.activeSites) {
t = this.settings.canStartExtension(site.host);
@ -287,8 +288,8 @@ export default {
if (t === undefined) {
// something isn't the way it should be. Show sites.
this.canShowVideoTab = {canShow: true, warning: true};
return;
}
this.canShowVideoTab = {canShow: canShow, warning: warning};
},
processReceivedMessage(message, port) {
@ -330,7 +331,7 @@ export default {
}
}
return true;
return true;
},
showFirstTab(videoTab) {
// determine which tab to show.
@ -381,6 +382,11 @@ return true;
if (videoTab.frames.length < 2 || Object.keys(videoTab.frames).length < 2) {
this.selectedFrame = '__all';
this.activeSites = [{
host: this.site.host,
isIFrame: false, // not used tho. Maybe one day
}];
this.updateCanShowVideoTab(); // update whether video tab can be shown
return;
}
for (const frame in videoTab.frames) {

7
src/popup/panels/WhatsNewPanel.vue
View File

@ -2,15 +2,16 @@
<div>
<h2>What's new</h2>
<p>Full changelog for older versions <a href="https://github.com/xternal7/ultrawidify/blob/master/CHANGELOG.md">is available here</a>.</p>
<p class="label">4.2.3</p>
<p class="label">4.2.3[.1]</p>
<ul>
<li>Fixed twitchy behaviour on Twitch, Facebook and Twatter. Here's a <a href="https://stuff.tamius.net/sacred-texts/2019/08/24/ultrawidify-the-twitchy-twitch-problem/" target="_blank">blog post</a> that covers the issue in more detail.</li>
<li>Cropping now uses user styles (as opposed to modifying element's style attribute)</li>
<li>Fixed the issue where one-pixel letterbox would result in constant aspect ratio corrections.</li>
<li>Started using mutation observers to watch for anything modifying the size of our video.</li>
<li><b>[4.2.3.1]</b> fixed some bugs in popup.</li>
</ul>
<p>As you can tell, I don't leave reddit and youtube much. To be fair, the twitching issue was intermittent on twitch.</p>
<p v-if="BrowserDetect.Chrome"><b>Chrome users:</b> as a result of Chrome's shortcomings, there now exists one potential performance issue.
<p v-if="BrowserDetect.chrome"><b>Chrome users:</b> as a result of Chrome's shortcomings, there now exists one potential performance issue.
If you notice any performance issues, please contact me via github, email or reddit (see: 'report a problem' tab
of this popup).</p>
</div>
@ -23,7 +24,7 @@ export default {
return {
BrowserDetect: BrowserDetect
}
}
},
}
</script>