Merge branch 'master' into feature/player-ui

CHANGELOG.md

@@ -18,6 +18,14 @@
 
 ## v5.x (current major)
 
+### v5.1.5
+
+* Fixed laginess in Chromium-based browsers on Windows. Details in [#199](https://github.com/tamius-han/ultrawidify/issues/199#issuecomment-1221383134)
+
+### v5.1.4
+
+* Fixed some problems with autodetection not returning to 16:9 when necessary if autodetection already changed aspect ratio ([#198](https://github.com/tamius-han/ultrawidify/issues/198))
+
 ### v5.1.3
 
 * Fixed some problems with autodetection sometimes briefly resetting on dark frames ([#195](https://github.com/tamius-han/ultrawidify/issues/195), [#196](https://github.com/tamius-han/ultrawidify/issues/196))

package-lock.json

@@ -13098,9 +13098,9 @@
       "dev": true
     },
     "webextension-polyfill": {
-      "version": "0.6.0",
+      "version": "0.10.0",
-      "resolved": "https://registry.npmjs.org/webextension-polyfill/-/webextension-polyfill-0.6.0.tgz",
+      "resolved": "https://registry.npmjs.org/webextension-polyfill/-/webextension-polyfill-0.10.0.tgz",
-      "integrity": "sha512-PlYwiX8e4bNZrEeBFxbFFsLtm0SMPxJliLTGdNCA0Bq2XkWrAn2ejUd+89vZm+8BnfFB1BclJyCz3iKsm2atNg==",
+      "integrity": "sha512-c5s35LgVa5tFaHhrZDnr3FpQpjj1BB+RXhLTYUxGqBVN460HkbM8TBtEqdXWbpTKfzwCcjAZVF7zXCYSKtcp9g==",
       "dev": true
     },
     "webextension-polyfill-ts": {

package.json

@@ -20,7 +20,7 @@
     "dev-ff": "cross-env NODE_ENV=development CHANNEL=dev BROWSER=firefox npm run build:dev -- --watch",
     "dev-chrome": "cross-env NODE_ENV=development CHANNEL=dev BROWSER=chrome npm run build:dev -- --watch",
     "dev-edge": "cross-env NODE_ENV=development CHANNEL=dev BROWSER=edge npm run build:dev -- --watch",
-    "pre-build": "rm -rf ./dist-ff; rm -rf ./dist-chrome; rm -rf ./node_modules; npm ci",
+    "pre-build": "rm -rf ./dist-ff; rm -rf ./dist-chrome; rm -rf ./dist-edge; rm -rf ./node_modules; npm ci",
     "start": "npm run dev",
     "start:windows": "npm run dev:windows"
   },

scripts/build-all.sh

@@ -4,7 +4,7 @@
 # command from the root directory of the project. Running it in
 # any other way probably isn't going to work.
 
-# pre-build steps: 
+# pre-build steps:
 mkdir -p ./build/old
 npm run pre-build
 rm ./dist-zip/uw-amo-source.zip
@@ -14,7 +14,7 @@ mv -f ./dist-zip/*.zip ./build/old
 # export NODE_OPTIONS=--max_old_space_size=4096
 
 # build the version for each browser and create a zip afterwards
-# step 1: define build functions 
+# step 1: define build functions
 #function buildFF {
   npm run build
   node scripts/build-zip.js ff

src/ext/lib/ar-detect/ArDetector.ts

@@ -298,15 +298,20 @@ class ArDetector {
     this.status.aardActive = false;
 
     if (this.animationFrameHandle) {
-      this.logger.log('info', 'debug', `"%c[ArDetect::stop] <@${this.arid}>  Stopping AnimationFrame loop.`, _ard_console_stop);
+      this.logger.log('info', 'debug', `%c[ArDetect::stop] <@${this.arid}>  Stopping AnimationFrame loop.`, _ard_console_stop);
       window.cancelAnimationFrame(this.animationFrameHandle);
     } else {
-      this.logger.log('info', 'debug', `"%c[ArDetect::stop] <@${this.arid}>  AnimationFrame loop is already paused (due to an earlier call of this function).`);
+      this.logger.log('info', 'debug', `%c[ArDetect::stop] <@${this.arid}>  AnimationFrame loop is already paused (due to an earlier call of this function).`);
     }
   }
 
   unpause() {
-    this.startLoop();
+    // unpause only when paused, otherwise we get an unnecessary reset
+    if (this._paused) {
+      this.startLoop();
+    } else {
+      this.logger.log('info', 'debug', `%c[ArDetect::unpause] <@${this.arid}  We are trying to unpause video, but video is not paused. This is potentially haram.`, 'color: #ff0');
+    }
   }
 
   pause() {
@@ -736,11 +741,11 @@ class ArDetector {
       }
     }
 
-    // if (this && !this._halted && !this._paused) {
+    if (this && !this._halted && !this._paused) {
       this.animationFrameHandle = window.requestAnimationFrame( (ts) => this.animationFrameBootstrap(ts));
-    // } else {
+    } else {
-    //   this.logger.log('info', 'debug', `[ArDetect::animationFrameBootstrap] <@${this.arid}>  Not renewing animation frame for some reason. Paused? ${this._paused}; Halted?: ${this._halted}, Exited?: ${this._exited}`);
+      this.logger.log('info', 'debug', `[ArDetect::animationFrameBootstrap] <@${this.arid}>  Not renewing animation frame for some reason. Paused? ${this._paused}; Halted?: ${this._halted}, Exited?: ${this._exited}`);
-    // }
+    }
   }
 
   calculateArFromEdges(edges) {
@@ -831,10 +836,6 @@ class ArDetector {
       return;
     }
 
-    if (!this.blackframeContext) {
-      this.init();
-    }
-
     let sampleCols = this.sampleCols.slice(0);
 
 
@@ -871,8 +872,6 @@ class ArDetector {
       this.conf.resizer.updateAr({type: AspectRatioType.AutomaticUpdate, ratio: this.defaultAr});
       this.guardLine.reset();
 
-      this.logger.log('info', 'arDetect_verbose', `%c[ArDetect::frameCheck] Letterbox not detected in fast test. Letterbox is either gone or we manually corrected aspect ratio. Nothing will be done.`, "color: #fa3");
-
       this.clearImageData(imageData);
       this.addPerformanceMeasurement(timerResults);
       return;
@@ -939,8 +938,7 @@ class ArDetector {
     }
 
     let newAr = this.calculateArFromEdges(edgePost);
-
+    this.logger.log('info', 'arDetect', `%c[ArDetect::frameCheck] Triggering aspect ration change! new ar: ${newAr}`, "color: #aaf");
-    this.logger.log('info', 'arDetect_verbose', `%c[ArDetect::frameCheck] Triggering aspect ration change! new ar: ${newAr}`, "color: #aaf");
 
     // we also know edges for guardline, so set them. If edges are okay and not invalid, we also
     // allow automatic aspect ratio correction. If edges
@@ -948,7 +946,6 @@ class ArDetector {
     try {
       // throws error if top/bottom are invalid
       this.guardLine.setBlackbar({top: edgePost.guardLineTop, bottom: edgePost.guardLineBottom});
-
       this.processAr(newAr);
     } catch (e) {
       // edges weren't gucci, so we'll just reset
@@ -1137,7 +1134,8 @@ class ArDetector {
   }
 
   /**
-   * Does a quick test to see if the aspect ratio is correct
+   * Does a quick test to see if the aspect ratio is correct by checking the topmost
+   * row of a video.
    * Returns 'true' if there's a chance of letterbox existing, false if not.
    * @param imageData
    * @param sampleCols
@@ -1150,25 +1148,31 @@ class ArDetector {
 
     // If we detect anything darker than blackLevel, we modify blackLevel to the new lowest value
     const rowOffset = this.canvas.width * (this.canvas.height - 1);
-    let currentMin = 255, currentMax = 0, colOffset_r, colOffset_g, colOffset_b, colOffset_rb, colOffset_gb, colOffset_bb, blthreshold = this.settings.active.arDetect.blackbar.threshold;
+    let currentMin = 255, currentMax = 0, colOffset_r, colOffset_g, colOffset_b, colOffset_rb, colOffset_gb, colOffset_bb, blThreshold = this.settings.active.arDetect.blackbar.threshold;
 
     // detect black level. if currentMax comes above blackbar + blackbar threshold, we know we aren't letterboxed
 
+    let violationCount = 0;
+    let currentBrightPixelThreshold = this.blackLevel + blThreshold;
+    const maxViolations = sampleCols.length / 3;
+
     for (let i = 0; i < sampleCols.length; ++i){
       colOffset_r = sampleCols[i] << 2;
       colOffset_g = colOffset_r + 1;
       colOffset_b = colOffset_r + 2;
-      colOffset_rb = colOffset_r + rowOffset;
+      // colOffset_rb = colOffset_r + rowOffset;
-      colOffset_gb = colOffset_g + rowOffset;
+      // colOffset_gb = colOffset_g + rowOffset;
-      colOffset_bb = colOffset_b + rowOffset;
+      // colOffset_bb = colOffset_b + rowOffset;
 
-      currentMax = Math.max(
+      if (
-        imageData[colOffset_r],  imageData[colOffset_g],  imageData[colOffset_b],
+        imageData[colOffset_r] > currentBrightPixelThreshold
-        // imageData[colOffset_rb], imageData[colOffset_gb], imageData[colOffset_bb],
+        || imageData[colOffset_g] > currentBrightPixelThreshold
-        currentMax
+        || imageData[colOffset_g] > currentBrightPixelThreshold
-      );
+      ) {
+        violationCount++;
+      }
 
-      if (currentMax > this.blackLevel + blthreshold) {
+      if (violationCount > maxViolations) {
         // we search no further
         if (currentMin < this.blackLevel) {
           this.blackLevel = currentMin;
@@ -1176,14 +1180,18 @@ class ArDetector {
         return false;
       }
 
+      currentMax = Math.max(
+        imageData[colOffset_r],  imageData[colOffset_g],  imageData[colOffset_b],
+        // imageData[colOffset_rb], imageData[colOffset_gb], imageData[colOffset_bb],
+        currentMax
+      );
+
       currentMin = Math.min(
         currentMax,
         currentMin
       );
     }
 
-
-
     if (currentMin < this.blackLevel) {
       this.blackLevel = currentMin
     }

src/ext/lib/comms/CommsServer.ts

@@ -15,10 +15,12 @@ class CommsServer {
 
 
   ports: {
-    [frame: string] : {
+    [tab: string] : {
-      [port: string]: any
+      [frame: string] : {
+        [port: string]: any
+      }
     }
-  }[] = [];
+  } = {};
   popupPort: any;
 
   /**
@@ -118,8 +120,9 @@ class CommsServer {
     }
   }
 
-  private sendToAll(message){
+  sendToAll(message){
-    for(const tab of this.ports){
+    for(const tid in this.ports){
+      const tab = this.ports[tid];
       for(const frame in tab){
         for (const port in tab[frame]) {
           tab[frame][port].postMessage(message);

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

@@ -247,6 +247,8 @@ class Resizer {
 
     this.logger.log('info', 'debug', '[Resizer::setAr] <rid:'+this.resizerId+'> trying to set ar. New ar:', ar);
 
+    this.logger.log('info', 'debug', '%c[Resizer::setAr] <rid:'+this.resizerId+'> trying to set ar. New ar:', 'background-color: #4c3a2f, color: #ffa349', ar);
+
     if (ar == null) {
       return;
     }
@@ -680,6 +682,8 @@ class Resizer {
     };
 
 
+
+
     if (this.pan.relativeOffsetX || this.pan.relativeOffsetY) {
       // don't offset when video is smaller than player
       if(wdiffAfterZoom >= 0 || hdiffAfterZoom >= 0) {

src/popup/panels/WhatsNewPanel.vue

@@ -4,7 +4,7 @@
     <p>Full changelog for older versions <a href="https://github.com/tamius-han/ultrawidify/blob/master/CHANGELOG.md">is available here</a>.</p>
     <p class="label">6.0.0</p>
     <ul>
-      <li>Fixed some problems with autodetection sometimes briefly resetting on dark frames (<a href="https://github.com/tamius-han/ultrawidify/issues/195" target="_blank">#195</a>), <a href="https://github.com/tamius-han/ultrawidify/issues/196" target="_blank">#196</a>)</li>
+      <li>Fixed laginess in Chromium-based browsers on Windows. Details in <a href="https://github.com/tamius-han/ultrawidify/issues/199#issuecomment-1221383134" target="blank">#199</a>.</li>
     </ul>
     <p class="label">5.1.2</p>
     <ul>