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

Added extra stretch/squish options, hopefully fixed disney+, fixed bug that prevented removal of actions added by user

Browse Source
This commit is contained in:
Tamius Han 2019-12-06 00:17:09 +01:00
parent 0801c122e2
commit 73b1a57749
12 changed files with 175 additions and 24 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

2
src/common/components/ActionAlt.vue
View File

@ -5,7 +5,7 @@
</div>
<div class="flex action-name">
<span v-if="action.cmd && action.cmd.length > 1 || action.cmd[0].action === 'set-ar' && action.cmd[0].arg === AspectRatio.Fixed" class="icon red" @click="removeAction()">🗙</span>
<span v-if="action.cmd && action.cmd.length > 1 || action.cmd[0].action === 'set-ar' && action.userAdded || (action.cmd[0].arg === AspectRatio.Fixed)" class="icon red" @click="removeAction()">🗙</span>
<span v-else class="icon transparent">🗙</span> &nbsp; &nbsp;
<span class="icon" @click="editAction()">🖉</span> &nbsp; &nbsp;
{{action.name}}

2
src/common/enums/stretch.enum.js
View File

@ -3,6 +3,8 @@ var Stretch = Object.freeze({
Basic: 1,
Hybrid: 2,
Conditional: 3,
Fixed: 4,
FixedSource: 5,
Default: -1
});

14
src/ext/conf/ActionList.js
View File

@ -72,6 +72,20 @@ var ActionList = {
},{
name: 'Thin borders',
arg: Stretch.Conditional,
},{
name: 'Fixed (source)',
arg: Stretch.FixedSource,
customArg: true,
scopes: {
page: true,
}
},{
name: 'Fixed (displayed)',
arg: Stretch.Fixed,
customArg: true,
scopes: {
page: true,
}
},{
name: 'Default',
arg: Stretch.Default,

47
src/ext/conf/ExtConfPatches.js
View File

@ -1,5 +1,6 @@
// How to use:
// version: {ExtensionConf object, but only properties that get overwritten}
import Stretch from '../../common/enums/stretch.enum';
const ExtensionConfPatch = [
{
@ -146,6 +147,7 @@ const ExtensionConfPatch = [
show: true,
}
}, {
userAdded: true,
name: 'Persist crop while on page',
label: 'Until page load',
cmd: [{
@ -164,6 +166,7 @@ const ExtensionConfPatch = [
show: true,
}
}, {
userAdded: true,
name: 'Persist crop for current session',
label: 'Current session',
cmd: [{
@ -252,6 +255,50 @@ const ExtensionConfPatch = [
}
},
}
}, {
forVersion: '4.4.2',
updateFn: (userOptions, defaultOptions) => {
try {
userOptions.actions.push(
{
name: 'Stretch source to 4:3',
label: '4:3 stretch (src)',
cmd: [{
action: 'set-stretch',
arg: Stretch.FixedSource,
customArg: 1.33,
}],
scopes: {
page: {
show: true
}
},
playerUi: {
show: true,
path: 'crop'
}
}, {
name: 'Stretch source to 16:9',
label: '16:9 stretch (src)',
cmd: [{
action: 'set-stretch',
arg: Stretch.FixedSource,
customArg: 1.77,
}],
scopes: {
page: {
show: true,
}
},
playerUi: {
show: true,
path: 'crop'
}
});
} catch (e) {
console.error("PROBLEM APPLYING SETTINGS", e);
}
}
}
];

42
src/ext/conf/ExtensionConf.js
View File

@ -285,6 +285,7 @@ var ExtensionConf = {
path: 'crop'
}
}, {
userAdded: true,
name: 'Set aspect ratio to 16:9',
label: '16:9',
cmd: [{
@ -312,6 +313,7 @@ var ExtensionConf = {
path: 'crop'
}
}, {
userAdded: true,
name: 'Set aspect ratio to 21:9 (2.39:1)',
label: '21:9',
cmd: [{
@ -339,6 +341,7 @@ var ExtensionConf = {
path: 'crop'
}
}, {
userAdded: true,
name: 'Set aspect ratio to 18:9',
label: '18:9',
cmd: [{
@ -651,6 +654,41 @@ var ExtensionConf = {
show: true,
}
}
}, // NEW OPTIONS
{
name: 'Stretch source to 4:3',
label: '4:3 stretch (src)',
cmd: [{
action: 'set-stretch',
arg: Stretch.FixedSource,
customArg: 1.33,
}],
scopes: {
page: {
show: true,
}
},
playerUi: {
show: true,
path: 'crop'
}
}, {
name: 'Stretch source to 16:9',
label: '16:9 stretch (src)',
cmd: [{
action: 'set-stretch',
arg: Stretch.FixedSource,
customArg: 1.77,
}],
scopes: {
page: {
show: true,
}
},
playerUi: {
show: true,
path: 'crop'
}
},
//
// A L I G N M E N T
@ -920,8 +958,8 @@ var ExtensionConf = {
}
}
},
],
whatsNewChecked: true,
],
whatsNewChecked: true,
// -----------------------------------------
// ::: SITE CONFIGURATION :::
// -----------------------------------------

2
src/ext/lib/comms/CommsClient.js
View File

@ -65,7 +65,7 @@ class CommsClient {
this.pageInfo.setVideoAlignment(message.arg, message.playing);
this.pageInfo.restoreAr();
} else if (message.cmd === "set-stretch") {
this.pageInfo.setStretchMode(message.arg, message.playing);
this.pageInfo.setStretchMode(message.arg, message.playing, message.customArg);
} else if (message.cmd === 'set-keyboard') {
this.pageInfo.setKeyboardShortcutsEnabled(message.arg)
} else if (message.cmd === "autoar-start") {

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

@ -490,18 +490,18 @@ class PageInfo {
}
}
setStretchMode(sm, playingOnly){
setStretchMode(stretchMode, playingOnly, fixedStretchRatio){
// TODO: find a way to only change aspect ratio for one video
if (playingOnly) {
for(var vd of this.videos){
if (vd.isPlaying()) {
vd.setStretchMode(sm)
vd.setStretchMode(stretchMode, fixedStretchRatio)
}
}
} else {
for(var vd of this.videos){
vd.setStretchMode(sm)
vd.setStretchMode(stretchMode, fixedStretchRatio)
}
}
}

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

@ -359,11 +359,11 @@ class VideoData {
this.resizer.restore();
}
setStretchMode(stretchMode){
setStretchMode(stretchMode, fixedStretchRatio){
if (this.invalid) {
return;
}
this.resizer.setStretchMode(stretchMode);
this.resizer.setStretchMode(stretchMode, fixedStretchRatio);
}
setZoom(zoomLevel, no_announce){

26
src/ext/lib/video-transform/Resizer.js
View File

@ -242,7 +242,9 @@ class Resizer {
}
// do stretch thingy
if (this.stretcher.mode === Stretch.NoStretch || this.stretcher.mode === Stretch.Conditional){
if (this.stretcher.mode === Stretch.NoStretch
|| this.stretcher.mode === Stretch.Conditional
|| this.stretcher.mode === Stretch.FixedSource){
var stretchFactors = this.scaler.calculateCrop(ar);
if(! stretchFactors || stretchFactors.error){
@ -255,15 +257,23 @@ class Resizer {
}
return;
}
if(this.stretcher.mode === Stretch.Conditional){
this.stretcher.applyConditionalStretch(stretchFactors, ar.ratio);
}
this.logger.log('info', 'debug', "[Resizer::setAr] Processed stretch factors for ", this.stretcher.mode === Stretch.NoStretch ? 'stretch-free crop.' : 'crop with conditional stretch.', 'Stretch factors are:', stretchFactors);
if (this.stretcher.mode === Stretch.Conditional){
this.stretcher.applyConditionalStretch(stretchFactors, ar.ratio);
} else if (this.stretcher.mode === Stretch.FixedSource) {
this.stretcher.applyStretchFixedSource(stretchFactors);
}
this.logger.log('info', 'debug', "[Resizer::setAr] Processed stretch factors for ",
this.stretcher.mode === Stretch.NoStretch ? 'stretch-free crop.' :
this.stretcher.mode === Stretch.Conditional ? 'crop with conditional stretch.' : 'crop with fixed stretch',
'Stretch factors are:', stretchFactors
);
} else if (this.stretcher.mode === Stretch.Hybrid) {
var stretchFactors = this.stretcher.calculateStretch(ar.ratio);
this.logger.log('info', 'debug', '[Resizer::setAr] Processed stretch factors for hybrid stretch/crop. Stretch factors are:', stretchFactors);
} else if (this.stretcher.mode === Stretch.Fixed) {
var stretchFactors = this.stretchFactors.calculateStretchFixed(ar.ratio)
} else if (this.stretcher.mode === Stretch.Basic) {
var stretchFactors = this.stretcher.calculateBasicStretch();
this.logger.log('info', 'debug', '[Resizer::setAr] Processed stretch factors for basic stretch. Stretch factors are:', stretchFactors);
@ -296,8 +306,8 @@ class Resizer {
return this.lastAr;
}
setStretchMode(stretchMode){
this.stretcher.setStretchMode(stretchMode);
setStretchMode(stretchMode, fixedStretchRatio){
this.stretcher.setStretchMode(stretchMode, fixedStretchRatio);
this.restore();
}
@ -459,8 +469,6 @@ class Resizer {
'\nwdiff, hdiffAfterZoom:', wdiffAfterZoom, 'x', hdiffAfterZoom,
'\n\n---- data out ----\n',
'translate:', translate);
console.trace();
return translate;
}

48
src/ext/lib/video-transform/Stretcher.js
View File

@ -15,12 +15,16 @@ class Stretcher {
this.logger = videoData.logger;
this.settings = videoData.settings;
this.mode = this.settings.getDefaultStretchMode(window.location.hostname);
this.fixedStretchRatio = undefined;
}
setStretchMode(stretchMode) {
setStretchMode(stretchMode, fixedStretchRatio) {
if (stretchMode === Stretch.Default) {
this.mode = this.settings.getDefaultStretchMode(window.location.hostname);
} else {
if (stretchMode === Stretch.Fixed || stretchMode == Stretch.FixedSource) {
this.fixedStretchRatio = fixedStretchRatio;
}
this.mode = stretchMode;
}
}
@ -95,9 +99,43 @@ class Stretcher {
};
}
calculateStretch(actualAr) {
var playerAr = this.conf.player.dimensions.width / this.conf.player.dimensions.height;
var videoAr = this.conf.video.videoWidth / this.conf.video.videoHeight;
applyStretchFixedSource(postCropStretchFactors) {
const videoAr = this.conf.video.videoWidth / this.conf.video.videoHeight;
const playerAr = this.conf.player.dimensions.width / this.conf.player.dimensions.height;
const squezeFactor = this.fixedStretchRatio / videoAr;
// Whether squeezing happens on X or Y axis depends on whether required AR is wider or narrower than
// the player, in which the video is displayed
// * we squeeze X axis, if target AR is narrower than player size
// * we squeeze Y axis, if target AR is wider than the player size
this.logger.log('info', 'stretcher', `[Stretcher::applyStretchFixedSource] here's what we got:
postCropStretchFactors: x=${postCropStretchFactors.xFactor} y=${postCropStretchFactors.yFactor}
fixedStretchRatio: ${this.fixedStretchRatio}
videoAr: ${videoAr}
playerAr: ${playerAr}
squeezeFactor: ${squezeFactor}`, '\nvideo', this.conf.video);
if (this.fixedStretchRatio < playerAr) {
postCropStretchFactors.xFactor *= squezeFactor;
} else {
postCropStretchFactors.yFactor *= squezeFactor;
}
this.logger.log('info', 'stretcher', `[Stretcher::applyStretchFixedSource] here's what we'll apply:\npostCropStretchFactors: x=${postCropStretchFactors.x} y=${postCropStretchFactors.y}`);
return postCropStretchFactors;
}
calculateStretchFixed(actualAr) {
return this.calculateStretch(actualAr, this.fixedStretchRatio);
}
calculateStretch(actualAr, playerArOverride) {
const playerAr = playerArOverride || this.conf.player.dimensions.width / this.conf.player.dimensions.height;
const videoAr = this.conf.video.videoWidth / this.conf.video.videoHeight;
if (! actualAr){
actualAr = playerAr;
@ -158,7 +196,7 @@ class Stretcher {
// video is letterboxed by player
// actual is pillarboxed by video
stretchFactors.xFactor = actualAr / playerAr;
stretchFActors.yFactor = actualAr / playerAr;
stretchFactors.yFactor = actualAr / playerAr;
this.logger.log('info', 'stretcher', "[Stretcher.js::calculateStretch] stretching strategy 5")
} else {

2
src/options/controls-settings/AddEditActionPopup.vue
View File

@ -229,7 +229,7 @@ export default {
},
saveSettings() {
if (this.currentCmdIndex < 0) {
this.settings.active.actions.push(this.action);
this.settings.active.actions.push({...this.action, ...{userAdded: true}});
}
this.settings.save();
this.close();

4
src/popup/panels/VideoPanel.vue
View File

@ -22,6 +22,7 @@
>
</ShortcutButton>
</div>
<div><small>You can change or add additional aspect ratios on <a href="#" @click="openOptionsPage()">the settings page</a> (in 'actions&shortcuts' menu).</small></div>
</div>
<div v-if="true"
@ -155,6 +156,9 @@ export default {
}
},
methods: {
async openOptionsPage() {
browser.runtime.openOptionsPage();
},
execAction(action) {
this.exec.exec(action, 'page', this.frame);
},