Autodetection gets detected and applied, but css is still off

js/lib/GuardLine.js

@@ -100,7 +100,7 @@ class GuardLine {
     else{
       // fallback mode is a bit different
       edge_upper = 0;
-      edge_lower = this.canvas.height - 1;
+      edge_lower = this.conf.canvas.height - 1;
     }
     
     var rowStart, rowEnd;
@@ -109,8 +109,8 @@ class GuardLine {
     
     // <<<=======| checking upper row |========>>>
     
-    rowStart = ((edge_upper * this.canvas.width) << 2) + offset;
+    rowStart = ((edge_upper * this.conf.canvas.width) << 2) + offset;
-    rowEnd = rowStart + ( this.canvas.width << 2 ) - (offset * 2);
+    rowEnd = rowStart + ( this.conf.canvas.width << 2 ) - (offset * 2);
     
     if (Debug.debugCanvas.enabled && Debug.debugCanvas.guardLine) {
       offenderCount = this._gl_debugRowCheck(image, rowStart, rowEnd, offenders, offenderCount);
@@ -119,8 +119,8 @@ class GuardLine {
     }
     // <<<=======| checking lower row |========>>>
     
-    rowStart = ((edge_lower * this.canvas.width) << 2) + offset;
+    rowStart = ((edge_lower * this.conf.canvas.width) << 2) + offset;
-    rowEnd = rowStart + ( this.canvas.width << 2 ) - (offset * 2);
+    rowEnd = rowStart + ( this.conf.canvas.width << 2 ) - (offset * 2);
     
     if (Debug.debugCanvas.enabled && Debug.debugCanvas.guardLine) {
       offenderCount = this._gl_debugRowCheck(image, rowStart, rowEnd, offenders, offenderCount);
@@ -163,7 +163,7 @@ class GuardLine {
     
     //   if(fallbackMode){
     //     var edge_upper = ExtensionConf.arDetect.fallbackMode.noTriggerZonePx;
-    //     var edge_lower = this.canvas.height - ExtensionConf.arDetect.fallbackMode.noTriggerZonePx - 1;
+    //     var edge_lower = this.conf.canvas.height - ExtensionConf.arDetect.fallbackMode.noTriggerZonePx - 1;
     //   }
     //   else{
         var edge_upper = this.imageBar.top;
@@ -200,7 +200,7 @@ class GuardLine {
     // <<<=======| checking lower row |========>>>
     
     rowStart = ((edge_lower * this.conf.canvas.width) << 2) + offset;
-    // rowEnd = rowStart + ( this.canvas.width << 2 ) - (offset * 2);
+    // rowEnd = rowStart + ( this.conf.canvas.width << 2 ) - (offset * 2);
     
 
     if(Debug.debugCanvas.enabled && Debug.debugCanvas.guardLine){
@@ -248,7 +248,7 @@ class GuardLine {
       // we track sections that go over what's supposed to be a black line, so we can suggest more 
       // columns to sample
       if(image[i] > this.blackbarTreshold || image[i+1] > this.blackbarTreshold || image[i+2] > this.blackbarTreshold){
-        this.conf.this.conf.debugCanvas.trace(i, DebugCanvasClasses.VIOLATION);      
+        this.conf.debugCanvas.trace(i, DebugCanvasClasses.VIOLATION);      
         if(firstOffender < 0){
           firstOffender = (i - rowStart) >> 2;
           offenderCount++;
@@ -259,7 +259,7 @@ class GuardLine {
         }
       }
       else{
-        this.conf.this.conf.debugCanvas.trace(i, DebugCanvasClasses.GUARDLINE_BLACKBAR);              
+        this.conf.debugCanvas.trace(i, DebugCanvasClasses.GUARDLINE_BLACKBAR);              
         // is that a black pixel again? Let's reset the 'first offender' 
         firstOffender = -1;
       }

js/lib/PlayerData.js

@@ -36,6 +36,7 @@ class PlayerData {
     this.dimensions = undefined;
 
     this.getPlayerDimensions();
+    this.startChangeDetection();
   }
 
   static isFullScreen(){
@@ -43,25 +44,30 @@ class PlayerData {
   }
 
   startChangeDetection(){
-    this.watchTimeout = setInterval(this.ghettoWatcher, 100);
+    console.log("STARTING CHANGE DETECTION!")
+
+    // // var gw = this.ghettoWatcher;
+    this.watchTimeout = setInterval(this.ghettoWatcher, 100, this);
   }
 
   stopChangeDetection(){
     clearInterval(this.watchTimeout);
   }
 
-  ghettoWatcher(){
+  ghettoWatcher(ths){
-    if(this.checkPlayerSizeChange()){
+    console.log("playerdata — dimensions", ths.dimensions)
+    try{
+    if(ths.checkPlayerSizeChange()){
       if(Debug.debug){
         console.log("[uw::ghettoOnChange] change detected");
       }
 
-      this.getPlayerDimensions();
+      ths.getPlayerDimensions();
-      if(! this.element ){
+      if(! ths.element ){
         return;
       }
 
-      this.videoData.resizer.restore(); // note: this returns true if change goes through, false otherwise.
+      ths.videoData.resizer.restore(); // note: this returns true if change goes through, false otherwise.
       return;
     }
 
@@ -70,25 +76,29 @@ class PlayerData {
     // sometimes, checkPlayerSizeChange might not detect a change to fullscreen. This means we need to 
     // trick it into doing that
 
-    if(this.dimensions.fullscreen != PlayerData.isFullScreen()) {
+    if(ths.dimensions.fullscreen != PlayerData.isFullScreen()) {
       if(Debug.debug){
         console.log("[PlayerData::ghettoWatcher] fullscreen switch detected (basic change detection failed)");
       }
 
-      this.getPlayerDimensions();
+      ths.getPlayerDimensions();
 
-      if(! this.element ){
+      if(! ths.element ){
         return;
       }
 
-      this.videoData.resizer.restore();
+      ths.videoData.resizer.restore();
     }
   }
+  catch(e){
+    console.log("e",e)
+  }
+  }
 
   getPlayerDimensions(elementNames){
     // element names — reserved for future use. If element names are provided, this function should return first element that
     // has classname or id that matches at least one in the elementNames array.
-    var element = this.video;
+    var element = this.video.parentNode;
 
     if(! element ){
       if(Debug.debug)

js/modules/Resizer.js

@@ -49,12 +49,20 @@ class Resizer {
     }
 
     if (! this.video) {
-      console.log("No video detected.")
+      // console.log("No video detected.")
       // this.videoData.destroy();
     }
 
 
     var dimensions = Scaler.calculateCrop(ar, this.video, this.conf.player.dimensions);
+
+    if(dimensions.error){
+      if(Debug.debug){
+        console.log("[Resizer::setAr] failed to set AR due to problem with calculating crop. Error:", dimensions.error)
+      }
+      return;
+    }
+
     var stretchFactors = undefined;
 
     // if we set stretching, we apply stretching
@@ -63,9 +71,11 @@ class Resizer {
     } else if (this.stretch.mode == StretchMode.CONDITIONAL) {
       stretchFactors = Stretcher.conditionalStretch(dimensions, ExtensionConf.stretch.conditionalDifferencePercent);
     }
+    console.log("PRE_ZOOM DIMENSIONS:",dimensions);
 
     this.zoom.applyZoom(dimensions);
 
+    console.log("POST_ZOOM DIMENSIONS:",dimensions);
     var cssOffsets = this.computeOffsets(dimensions);
     this.applyCss(cssOffsets, stretchFactors);
   }
@@ -183,6 +193,8 @@ class Resizer {
   
   applyCss(dimensions, stretchFactors){
 
+    console.log("CSS DIMENSIOPNS", dimensions)
+
     if(this.video == undefined || this.video == null){
       if(Debug.debug)
         console.log("[Resizer::_res_applyCss] Video went missing, doing nothing.");

js/modules/Scaler.js

@@ -71,7 +71,7 @@ class Scaler {
     }
 
     if(Debug.debug)
-      console.log("[Scaler::calculateCrop] trying to set ar. args are: ar->",ar,"; playerDimensions->",playerDimensions.width, "×", playerDimensions.height, "| obj:", GlobalVars.playerDimensions);
+      console.log("[Scaler::calculateCrop] trying to set ar. args are: ar->",ar,"; playerDimensions->",playerDimensions.width, "×", playerDimensions.height, "| obj:", playerDimensions);
   
     if(!video || video.videoWidth == 0 || video.videoHeight == 0){
       if(Debug.debug)
@@ -79,7 +79,7 @@ class Scaler {
       return {error: "no_video"};
     }
 
-    if(! playerDimensions || playerDimensions.width === 0 || playerDimensions.height){
+    if( (! playerDimensions) || playerDimensions.width === 0 || playerDimensions.height === 0 ){
       if(Debug.debug)
         console.log("[Scaler::calculateCrop] ERROR — no (or invalid) playerDimensions:",playerDimensions);
       return {error: "playerDimensions_error"};
@@ -99,7 +99,7 @@ class Scaler {
 
   
     if(Debug.debug)
-      console.log("[Scaler::calculateCrop] ar is " ,ar, ", file ar is", fileAr, ", playerDimensions are ", GlobalVars.playerDimensions.width, "×", GlobalVars.playerDimensions.height, "| obj:", GlobalVars.playerDimensions);
+      console.log("[Scaler::calculateCrop] ar is " ,ar, ", file ar is", fileAr, ", playerDimensions are ", playerDimensions.width, "×", playerDimensions.height, "| obj:", playerDimensions);
     
     var videoDimensions = {
       width: 0,
@@ -109,18 +109,18 @@ class Scaler {
     }
   
     if(Debug.debug){
-      console.log("[Scaler::calculateCrop] Player dimensions?", GlobalVars.playerDimensions.width, "×", GlobalVars.playerDimensions.height, "| obj:", GlobalVars.playerDimensions);
+      console.log("[Scaler::calculateCrop] Player dimensions?", playerDimensions.width, "×", playerDimensions.height, "| obj:", playerDimensions);
     }
   
     if( fileAr < ar ){
       // imamo letterbox zgoraj in spodaj -> spremenimo velikost videa (a nikoli širše od ekrana)
       // letterbox -> change video size (but never to wider than monitor width)
 
-        videoDimensions.width = Math.min(GlobalVars.playerDimensions.height * ar, GlobalVars.playerDimensions.width);
+        videoDimensions.width = Math.min(playerDimensions.height * ar, playerDimensions.width);
         videoDimensions.height = videoDimensions.width * (1/fileAr);
     }
     else{
-        videoDimensions.height = Math.min(GlobalVars.playerDimensions.width / ar, GlobalVars.playerDimensions.height);
+        videoDimensions.height = Math.min(playerDimensions.width / ar, playerDimensions.height);
         videoDimensions.width = videoDimensions.height * fileAr;
     }
     
@@ -140,7 +140,7 @@ class Scaler {
     }
 
     if(Debug.debug){
-      console.log("[Scaler::calculateCrop] Video dimensions: ", videoDimensions.width, "×", videoDimensions.height, "(obj:", videoDimensions, "); playerDimensions:",GlobalVars.playerDimensions.width, "×", GlobalVars.playerDimensions.height, "(obj:", GlobalVars.playerDimensions, ")");
+      console.log("[Scaler::calculateCrop] Video dimensions: ", videoDimensions.width, "×", videoDimensions.height, "(obj:", videoDimensions, "); playerDimensions:",playerDimensions.width, "×", playerDimensions.height, "(obj:", playerDimensions, ")");
     }
 
     return videoDimensions;