From 0871ad6d971a6231cb3555ec31049f2ca092294b Mon Sep 17 00:00:00 2001 From: Tamius Han Date: Sun, 27 May 2018 21:41:08 +0200 Subject: [PATCH] Stretch mode buttons work --- js/lib/Comms.js | 5 ++++- js/modules/PageInfo.js | 4 +++- js/modules/Resizer.js | 2 +- js/modules/Stretcher.js | 23 ++++++++++++++++------- res/popup/js/popup.js | 19 +++++++++++++++++-- res/popup/popup.html | 8 ++++---- 6 files changed, 45 insertions(+), 16 deletions(-) diff --git a/js/lib/Comms.js b/js/lib/Comms.js index c8e5505..b8e3be1 100644 --- a/js/lib/Comms.js +++ b/js/lib/Comms.js @@ -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); } diff --git a/js/modules/PageInfo.js b/js/modules/PageInfo.js index 4e45b14..ee0e770 100644 --- a/js/modules/PageInfo.js +++ b/js/modules/PageInfo.js @@ -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) } } diff --git a/js/modules/Resizer.js b/js/modules/Resizer.js index 97ba865..d66b1a6 100644 --- a/js/modules/Resizer.js +++ b/js/modules/Resizer.js @@ -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){ diff --git a/js/modules/Stretcher.js b/js/modules/Stretcher.js index 34e5289..b07f461 100644 --- a/js/modules/Stretcher.js +++ b/js/modules/Stretcher.js @@ -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; } diff --git a/res/popup/js/popup.js b/res/popup/js/popup.js index 3a61a2a..7bc4c43 100644 --- a/res/popup/js/popup.js +++ b/res/popup/js/popup.js @@ -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")){ diff --git a/res/popup/popup.html b/res/popup/popup.html index 52d9dde..a619abf 100644 --- a/res/popup/popup.html +++ b/res/popup/popup.html @@ -250,10 +250,10 @@ Stretching mode
Stretching is independent of crop mode. Crop gets applied before stretching.
- Never
 - Basic
 - Hybrid
 - Conditional
 + Never
 + Basic
 + Hybrid
 + Thin borders