Stretch mode buttons work
This commit is contained in:
parent
293b784704
commit
0871ad6d97
@ -28,7 +28,7 @@ class CommsClient {
|
||||
this.hasSettings = true;
|
||||
ExtensionConf = message.conf;
|
||||
} else if (message.cmd === "set-stretch") {
|
||||
|
||||
this.pageInfo.setStretchMode(StretchMode[message.mode]);
|
||||
} else if (message.cmd === "autoar-enable") {
|
||||
if (message.enabled !== false) {
|
||||
this.pageInfo.initArDetection();
|
||||
@ -215,6 +215,9 @@ class CommsServer {
|
||||
if (message.cmd === 'get-config') {
|
||||
port.postMessage({cmd: "set-config", conf: ExtensionConf})
|
||||
}
|
||||
if (message.cmd === 'set-stretch') {
|
||||
this.sendToActive(message);
|
||||
}
|
||||
if (message.cmd === 'set-ar') {
|
||||
this.sendToActive(message);
|
||||
}
|
||||
|
@ -206,8 +206,10 @@ class PageInfo {
|
||||
}
|
||||
|
||||
setStretchMode(sm){
|
||||
// TODO: find a way to only change aspect ratio for one video
|
||||
|
||||
for(var vd of this.videos){
|
||||
vd.setStretchMode(ar)
|
||||
vd.setStretchMode(sm)
|
||||
}
|
||||
}
|
||||
|
||||
|
@ -8,7 +8,6 @@ var StretchMode = {
|
||||
CONDITIONAL: 3
|
||||
}
|
||||
|
||||
|
||||
class Resizer {
|
||||
|
||||
constructor(videoData){
|
||||
@ -108,6 +107,7 @@ class Resizer {
|
||||
|
||||
setStretchMode(stretchMode){
|
||||
this.stretch.mode = stretchMode;
|
||||
this.restore();
|
||||
}
|
||||
|
||||
setPan(relativeMousePosX, relativeMousePosY){
|
||||
|
@ -38,8 +38,8 @@ class Stretcher {
|
||||
var minW = this.conf.player.dimensions.width * (1 - ExtensionConf.stretch.conditionalDifferencePercent);
|
||||
var maxW = this.conf.player.dimensions.width * (1 + ExtensionConf.stretch.conditionalDifferencePercent);
|
||||
|
||||
var minX = this.conf.player.dimensions.height * (1 - ExtensionConf.stretch.conditionalDifferencePercent);
|
||||
var maxX = this.conf.player.dimensions.height * (1 + ExtensionConf.stretch.conditionalDifferencePercent);
|
||||
var minH = this.conf.player.dimensions.height * (1 - ExtensionConf.stretch.conditionalDifferencePercent);
|
||||
var maxH = this.conf.player.dimensions.height * (1 + ExtensionConf.stretch.conditionalDifferencePercent);
|
||||
|
||||
if (actualWidth >= minW && actualWidth <= maxW) {
|
||||
stretchFactors.xFactor *= this.conf.player.dimensions.width / actualWidth;
|
||||
@ -50,9 +50,6 @@ class Stretcher {
|
||||
}
|
||||
|
||||
calculateStretch(actualAr) {
|
||||
// naj ponovim: samo razširjamo, nikoli krčimo
|
||||
// let me reiterate: only stretch, no shrink
|
||||
|
||||
var playerAr = this.conf.player.dimensions.width / this.conf.player.dimensions.height;
|
||||
var videoAr = this.conf.video.videoWidth / this.conf.video.videoHeight;
|
||||
|
||||
@ -67,17 +64,29 @@ class Stretcher {
|
||||
|
||||
if (actualAr > videoAr) {
|
||||
if(videoAr > playerAr) {
|
||||
stretchFactors.xFactor = playerAr / videoAr;
|
||||
if(Debug.debug){
|
||||
console.log("[Stretcher.js::calculateStretch] stretching strategy 1")
|
||||
}
|
||||
stretchFactors.xFactor = playerAr / videoAr; // is this 1 then?
|
||||
stretchFactors.yFactor = actualAr / videoAr;
|
||||
} else {
|
||||
stretchFactors.xFactor = 1;
|
||||
if(Debug.debug){
|
||||
console.log("[Stretcher.js::calculateStretch] stretching strategy 2")
|
||||
}
|
||||
stretchFactors.xFactor = playerAr / videoAr;
|
||||
stretchFactors.yFactor = actualAr / videoAr;
|
||||
}
|
||||
} else {
|
||||
if (videoAr > playerAr) {
|
||||
if(Debug.debug){
|
||||
console.log("[Stretcher.js::calculateStretch] stretching strategy 3")
|
||||
}
|
||||
stretchFactors.xFactor = videoAr / actualAr;
|
||||
stretchFactors.yFactor = playerAr / actualAr;
|
||||
} else {
|
||||
if(Debug.debug){
|
||||
console.log("[Stretcher.js::calculateStretch] stretching strategy 4")
|
||||
}
|
||||
stretchFactors.xFactor = playerAr / actualAr;
|
||||
stretchFactors.yFactor = 1;
|
||||
}
|
||||
|
@ -274,7 +274,7 @@ document.addEventListener("click", (e) => {
|
||||
if(e.target.classList.contains("_changeAr")){
|
||||
if(e.target.classList.contains("_ar_auto")){
|
||||
command.cmd = "autoar-enable";
|
||||
command.enable = true;
|
||||
command.enabled = true;
|
||||
return command;
|
||||
}
|
||||
if(e.target.classList.contains("_ar_reset")){
|
||||
@ -313,7 +313,22 @@ document.addEventListener("click", (e) => {
|
||||
return command;
|
||||
}
|
||||
}
|
||||
|
||||
if(e.target.classList.contains("_stretch")){
|
||||
if(e.target.classList.contains("_ar_stretch_none")) {
|
||||
command.cmd = "set-stretch";
|
||||
command.mode = "NO_STRETCH";
|
||||
} else if(e.target.classList.contains("_ar_stretch_basic")) {
|
||||
command.cmd = "set-stretch";
|
||||
command.mode = "BASIC";
|
||||
} else if(e.target.classList.contains("_ar_stretch_hybrid")) {
|
||||
command.cmd = "set-stretch";
|
||||
command.mode = "HYBRID";
|
||||
} else if(e.target.classList.contains("_ar_stretch_conditional")) {
|
||||
command.cmd = "set-stretch";
|
||||
command.mode = "CONDITIONAL";
|
||||
}
|
||||
return command;
|
||||
}
|
||||
if(e.target.classList.contains("_autoAr")){
|
||||
// var command = {};
|
||||
// if(e.target.classList.contains("_autoar_temp-disable")){
|
||||
|
@ -250,10 +250,10 @@
|
||||
</div>
|
||||
<span class="label">Stretching mode<br><small>Stretching is independent of crop mode. Crop gets applied before stretching.</small></span>
|
||||
<div class="button-row">
|
||||
<a class="button _changeAr _ar_stretch_none w24">Never<br/><span id="_b_changeAr_reset_key" class="smallcaps small darker"></span></a>
|
||||
<a class="button _changeAr _ar_stretch_basic w24">Basic<br/><span id="_b_changeAr_reset_key" class="smallcaps small darker"></span></a>
|
||||
<a class="button _changeAr _ar_stretch_hybrid w24">Hybrid<br/><span id="_b_changeAr_sw_key" class="smallcaps small darker"></span></a>
|
||||
<a class="button _changeAr _ar_stretch_conditional w24">Conditional<br/><span id="_b_changeAr_sh_key" class="smallcaps small darker"></span></a>
|
||||
<a class="button _stretch _ar_stretch_none w24">Never<br/><span id="_b_changeAr_reset_key" class="smallcaps small darker"></span></a>
|
||||
<a class="button _stretch _ar_stretch_basic w24">Basic<br/><span id="_b_changeAr_reset_key" class="smallcaps small darker"></span></a>
|
||||
<a class="button _stretch _ar_stretch_hybrid w24">Hybrid<br/><span id="_b_changeAr_sw_key" class="smallcaps small darker"></span></a>
|
||||
<a class="button _stretch _ar_stretch_conditional w24">Thin borders<br/><span id="_b_changeAr_sh_key" class="smallcaps small darker"></span></a>
|
||||
</div>
|
||||
</div>
|
||||
<!--<div class="row">
|
||||
|
Loading…
Reference in New Issue
Block a user