Merge pull request #18380 from calixteman/avoid_dbl_ml_queries

[Editor] Avoid to query ML engine several times for the same image
mozilla · Jul 5, 2024 · e777ae2 · e777ae2
2 parents ccb141e + 5274bab
commit e777ae2
Showing 1 changed file with 40 additions and 31 deletions.
diff --git a/src/display/editor/stamp.js b/src/display/editor/stamp.js
@@ -36,6 +36,8 @@ class StampEditor extends AnnotationEditor {
 
   #canvas = null;
 
+  #hasMLBeenQueried = false;
+
   #observer = null;
 
   #resizeTimeoutId = null;
@@ -423,6 +425,42 @@ class StampEditor extends AnnotationEditor {
     return bitmap;
   }
 
+  async #mlGuessAltText(bitmap, width, height) {
+    if (this.#hasMLBeenQueried) {
+      return;
+    }
+    this.#hasMLBeenQueried = true;
+    if (!this._uiManager.hasMLManager || this.hasAltText()) {
+      return;
+    }
+    const offscreen = new OffscreenCanvas(width, height);
+    const ctx = offscreen.getContext("2d", { willReadFrequently: true });
+    ctx.drawImage(
+      bitmap,
+      0,
+      0,
+      bitmap.width,
+      bitmap.height,
+      0,
+      0,
+      width,
+      height
+    );
+    const response = await this._uiManager.mlGuess({
+      service: "image-to-text",
+      request: {
+        data: ctx.getImageData(0, 0, width, height).data,
+        width,
+        height,
+        channels: 4,
+      },
+    });
+    const altText = response?.output || "";
+    if (this.parent && altText && !this.hasAltText()) {
+      this.altTextData = { altText, decorative: false };
+    }
+  }
+
   #drawBitmap(width, height) {
     width = Math.ceil(width);
     height = Math.ceil(height);
@@ -436,37 +474,8 @@ class StampEditor extends AnnotationEditor {
       ? this.#bitmap
       : this.#scaleBitmap(width, height);
 
-    if (this._uiManager.hasMLManager && !this.hasAltText()) {
-      const offscreen = new OffscreenCanvas(width, height);
-      const ctx = offscreen.getContext("2d");
-      ctx.drawImage(
-        bitmap,
-        0,
-        0,
-        bitmap.width,
-        bitmap.height,
-        0,
-        0,
-        width,
-        height
-      );
-      this._uiManager
-        .mlGuess({
-          service: "image-to-text",
-          request: {
-            data: ctx.getImageData(0, 0, width, height).data,
-            width,
-            height,
-            channels: 4,
-          },
-        })
-        .then(response => {
-          const altText = response?.output || "";
-          if (this.parent && altText && !this.hasAltText()) {
-            this.altTextData = { altText, decorative: false };
-          }
-        });
-    }
+    this.#mlGuessAltText(bitmap, width, height);
+
     const ctx = canvas.getContext("2d");
     ctx.filter = this._uiManager.hcmFilter;
     ctx.drawImage(