Reset panning on aspect ratio change.

src/ext/lib/video-transform/Resizer.js

@@ -133,6 +133,17 @@ class Resizer {
 
     const siteSettings = this.settings.active.sites[window.location.host];
 
+    // reset zoom, but only on aspect ratio switch. We also know that aspect ratio gets converted to
+    // AspectRatio.Fixed when zooming, so let's keep that in mind
+    if (ar.type !== AspectRatio.Fixed) {
+      this.zoom.reset();
+      this.resetPan();
+    } else if (ar.ratio !== this.lastAr.ratio) {
+      // we must check against this.lastAR.ratio because some calls provide same value for ar and lastAr
+      this.zoom.reset();
+      this.resetPan();
+    }
+
     // most everything that could go wrong went wrong by this stage, and returns can happen afterwards
     // this means here's the optimal place to set or forget aspect ratio. Saving of current crop ratio
     // is handled in pageInfo.updateCurrentCrop(), which also makes sure to persist aspect ratio if ar
@@ -263,6 +274,10 @@ class Resizer {
 
   }
 
+  toFixedAr() {
+    this.lastAr.type = AspectRatio.Fixed;
+  }
+
   resetLastAr() {
     this.lastAr = {type: AspectRatio.Initial};
   }
@@ -288,6 +303,9 @@ class Resizer {
       // dont allow weird floats
       this.videoAlignment = VideoAlignment.Center;
 
+      // because non-fixed aspect ratios reset panning:
+      this.toFixedAr();
+
       const player = this.conf.player.element;
 
       const relativeX = (event.pageX - player.offsetLeft) / player.offsetWidth;
@@ -299,6 +317,11 @@ class Resizer {
     }
   }
 
+  resetPan() {
+    this.pan = {};
+    this.videoAlignment = this.settings.getDefaultVideoAlignment(window.location.host);
+  }
+
   setPan(relativeMousePosX, relativeMousePosY){
     // relativeMousePos[X|Y] - on scale from 0 to 1, how close is the mouse to player edges. 
     // use these values: top, left: 0, bottom, right: 1

src/ext/lib/video-transform/Zoom.js

@@ -18,6 +18,7 @@ class Zoom {
 
   reset(){
     this.scale = 1;
+    this.logScale = 0;
   }
 
   zoomStep(amount){
@@ -34,6 +35,8 @@ class Zoom {
 
     this.logger.log('info', 'debug', "[Zoom::zoomStep] changing zoom by", amount, ". New zoom level:", this.scale);
 
+    this.conf.resizer.toFixedAr();
+
     this.conf.restoreAr();
     this.conf.announceZoom(this.scale);
   }