dytools-capture-engine 1.2.2 → 1.2.4

package/dist/index.cjs

@@ -492,6 +492,8 @@ var SimpleZone = class extends CaptureZoneBase {
       this.primaryCanvasRectangleId = this.canvasManager.addRectangle(this.rect, this.name, "blue", true, true);
     }
     if (type === CaptureZoneEventType.ZoneHiddenChanged) {
+      const zoneHiddenChangedPayload = payload;
+      this.ocrOverlayIds.forEach((id) => this.canvasManager?.setVisibility(id, !zoneHiddenChangedPayload.newHidden));
     }
     if (type === CaptureZoneEventType.ZoneOcrMatchesChanged) {
       const zoneOcrMatchesChangedPayload = payload;
@@ -504,11 +506,10 @@ var SimpleZone = class extends CaptureZoneBase {
       let isFirstMatch = true;
       for (const match of ocrMatches) {
         if (match.templateZoneId != this.id) continue;
-        if (!this.hidden) {
-          this.ocrOverlayIds.push(this.canvasManager?.addPolygon(match.polygonAbsolute.points, "rgba(0, 255, 0, 0.25)", false));
-        }
+        this.ocrOverlayIds.push(this.canvasManager?.addPolygon(match.polygonAbsolute.points, "rgba(0, 255, 0, 0.25)", false));
         break;
       }
+      this.ocrOverlayIds.forEach((id) => this.canvasManager?.setVisibility(id, !this.hidden));
     }
   }
   handleEvent(id, type, payload) {
@@ -532,35 +533,6 @@ var SimpleZone = class extends CaptureZoneBase {
       }
     }
   }
-  update(ocrRead, ocrMatches, canvas, flags) {
-    if (!this.primaryCanvasRectangleId) {
-      this.primaryCanvasRectangleId = canvas.addRectangle(this.rect, this.name, "blue", true, true);
-    } else {
-      canvas.setName(this.primaryCanvasRectangleId, this.name);
-      canvas.setColor(this.primaryCanvasRectangleId, "blue");
-      canvas.setVisibility(this.primaryCanvasRectangleId, !this.hidden);
-      canvas.setSelectable(this.primaryCanvasRectangleId, true);
-      canvas.setResizable(this.primaryCanvasRectangleId, true);
-      canvas.setRectangleSize(this.primaryCanvasRectangleId, this.rect);
-    }
-    if (!ocrMatches || ocrMatches.length == 0) {
-      return;
-    }
-    let thisOcrMatches = ocrMatches?.filter((e) => e.templateZoneId == this.id) ?? [];
-    let matchHash = this.hidden + "|" + thisOcrMatches.map((e) => `${e.ocrTextResultIds.sort().join(",")}`).join(",");
-    if (matchHash === this.lastMatchHash) {
-      return;
-    }
-    this.ocrOverlayIds.forEach((id) => canvas.removeObject(id));
-    this.lastMatchHash = matchHash;
-    let isFirstMatch = true;
-    for (const match of thisOcrMatches) {
-      if (!this.hidden) {
-        this.ocrOverlayIds.push(canvas.addPolygon(match.polygonAbsolute.points, "rgba(0, 255, 0, 0.25)", false));
-      }
-      break;
-    }
-  }
   toExternal(docWidth, docHeight) {
     return {
       TemplateZoneId: this.id,
@@ -716,6 +688,10 @@ var AnchorZone = class extends CaptureZoneBase {
       });
       this.emitToEngine(CaptureToEngineEventType.ZoneChanged, { zone: this, propertiesChanged: ["groupChildren"] });
     }
+    if (type === CaptureZoneEventType.ZoneHiddenChanged) {
+      const zoneHiddenChangedPayload = payload;
+      this.ocrOverlayIds.forEach((id) => this.canvasManager?.setVisibility(id, !zoneHiddenChangedPayload.newHidden));
+    }
     if (type === CaptureZoneEventType.ZoneOcrMatchesChanged) {
       const zoneOcrMatchesChangedPayload = payload;
       let ocrMatches = zoneOcrMatchesChangedPayload.matches;
@@ -728,13 +704,9 @@ var AnchorZone = class extends CaptureZoneBase {
       let cycle = this.cycle;
       for (const match of ocrMatches) {
         if (match.templateZoneId != this.id) continue;
-        if (!this.hidden) {
-          this.ocrOverlayIds.push(this.canvasManager?.addPolygon(match.polygonAbsolute.points, "rgba(0, 255, 255, 0.25)", false));
-        }
+        this.ocrOverlayIds.push(this.canvasManager?.addPolygon(match.polygonAbsolute.points, "rgba(0, 255, 255, 0.25)", false));
         if (match.anchorPointAbsolute) {
-          if (!this.hidden) {
-            this.ocrOverlayIds.push(this.canvasManager?.addCircle(match.anchorPointAbsolute, 2, "rgba(0, 0, 255, 0.25)", false, false));
-          }
+          this.ocrOverlayIds.push(this.canvasManager?.addCircle(match.anchorPointAbsolute, 2, "rgba(0, 0, 255, 0.25)", false, false));
           if (isFirstMatch) {
             for (const child of this.children.filter((e) => e.needsAnchorReposition)) {
               let currentAnchorPoint = this.currentAnchorPoint ?? this.rect.origin;
@@ -743,10 +715,15 @@ var AnchorZone = class extends CaptureZoneBase {
               child.needsAnchorReposition = false;
             }
           } else {
-            for (const child of this.children) {
+            for (let i = 0; i < this.children.length; i++) {
+              const child = this.children[i];
               if (child.hidden == false) {
                 let vector = this.currentAnchorPoint ? match.anchorPointAbsolute.getDeltaFromPoint(this.currentAnchorPoint) : new import_dytools_geometry.Vector(0, 0);
-                let color = "rgba(" + cycle + ", 128, 255, 0.5)";
+                let maxOpacity = 0.5;
+                let minOpacity = 0.25;
+                let percentThroughArray = (i + 1) / this.children.length;
+                let opacity = maxOpacity - (maxOpacity - minOpacity) * percentThroughArray;
+                let color = `rgba(" + cycle + ", 128, 255, ${opacity.toFixed(2)})`;
                 const polygon = child.rect.move(vector).toPolygon().points;
                 this.ocrOverlayIds.push(this.canvasManager?.addPolygon(polygon, color, false));
               }
@@ -758,6 +735,7 @@ var AnchorZone = class extends CaptureZoneBase {
         }
         isFirstMatch = false;
       }
+      this.ocrOverlayIds.forEach((id) => this.canvasManager?.setVisibility(id, !this.hidden));
     }
   }
   get cycle() {

package/dist/index.js

@@ -476,6 +476,8 @@ var SimpleZone = class extends CaptureZoneBase {
       this.primaryCanvasRectangleId = this.canvasManager.addRectangle(this.rect, this.name, "blue", true, true);
     }
     if (type === CaptureZoneEventType.ZoneHiddenChanged) {
+      const zoneHiddenChangedPayload = payload;
+      this.ocrOverlayIds.forEach((id) => this.canvasManager?.setVisibility(id, !zoneHiddenChangedPayload.newHidden));
     }
     if (type === CaptureZoneEventType.ZoneOcrMatchesChanged) {
       const zoneOcrMatchesChangedPayload = payload;
@@ -488,11 +490,10 @@ var SimpleZone = class extends CaptureZoneBase {
       let isFirstMatch = true;
       for (const match of ocrMatches) {
         if (match.templateZoneId != this.id) continue;
-        if (!this.hidden) {
-          this.ocrOverlayIds.push(this.canvasManager?.addPolygon(match.polygonAbsolute.points, "rgba(0, 255, 0, 0.25)", false));
-        }
+        this.ocrOverlayIds.push(this.canvasManager?.addPolygon(match.polygonAbsolute.points, "rgba(0, 255, 0, 0.25)", false));
         break;
       }
+      this.ocrOverlayIds.forEach((id) => this.canvasManager?.setVisibility(id, !this.hidden));
     }
   }
   handleEvent(id, type, payload) {
@@ -516,35 +517,6 @@ var SimpleZone = class extends CaptureZoneBase {
       }
     }
   }
-  update(ocrRead, ocrMatches, canvas, flags) {
-    if (!this.primaryCanvasRectangleId) {
-      this.primaryCanvasRectangleId = canvas.addRectangle(this.rect, this.name, "blue", true, true);
-    } else {
-      canvas.setName(this.primaryCanvasRectangleId, this.name);
-      canvas.setColor(this.primaryCanvasRectangleId, "blue");
-      canvas.setVisibility(this.primaryCanvasRectangleId, !this.hidden);
-      canvas.setSelectable(this.primaryCanvasRectangleId, true);
-      canvas.setResizable(this.primaryCanvasRectangleId, true);
-      canvas.setRectangleSize(this.primaryCanvasRectangleId, this.rect);
-    }
-    if (!ocrMatches || ocrMatches.length == 0) {
-      return;
-    }
-    let thisOcrMatches = ocrMatches?.filter((e) => e.templateZoneId == this.id) ?? [];
-    let matchHash = this.hidden + "|" + thisOcrMatches.map((e) => `${e.ocrTextResultIds.sort().join(",")}`).join(",");
-    if (matchHash === this.lastMatchHash) {
-      return;
-    }
-    this.ocrOverlayIds.forEach((id) => canvas.removeObject(id));
-    this.lastMatchHash = matchHash;
-    let isFirstMatch = true;
-    for (const match of thisOcrMatches) {
-      if (!this.hidden) {
-        this.ocrOverlayIds.push(canvas.addPolygon(match.polygonAbsolute.points, "rgba(0, 255, 0, 0.25)", false));
-      }
-      break;
-    }
-  }
   toExternal(docWidth, docHeight) {
     return {
       TemplateZoneId: this.id,
@@ -700,6 +672,10 @@ var AnchorZone = class extends CaptureZoneBase {
       });
       this.emitToEngine(CaptureToEngineEventType.ZoneChanged, { zone: this, propertiesChanged: ["groupChildren"] });
     }
+    if (type === CaptureZoneEventType.ZoneHiddenChanged) {
+      const zoneHiddenChangedPayload = payload;
+      this.ocrOverlayIds.forEach((id) => this.canvasManager?.setVisibility(id, !zoneHiddenChangedPayload.newHidden));
+    }
     if (type === CaptureZoneEventType.ZoneOcrMatchesChanged) {
       const zoneOcrMatchesChangedPayload = payload;
       let ocrMatches = zoneOcrMatchesChangedPayload.matches;
@@ -712,13 +688,9 @@ var AnchorZone = class extends CaptureZoneBase {
       let cycle = this.cycle;
       for (const match of ocrMatches) {
         if (match.templateZoneId != this.id) continue;
-        if (!this.hidden) {
-          this.ocrOverlayIds.push(this.canvasManager?.addPolygon(match.polygonAbsolute.points, "rgba(0, 255, 255, 0.25)", false));
-        }
+        this.ocrOverlayIds.push(this.canvasManager?.addPolygon(match.polygonAbsolute.points, "rgba(0, 255, 255, 0.25)", false));
         if (match.anchorPointAbsolute) {
-          if (!this.hidden) {
-            this.ocrOverlayIds.push(this.canvasManager?.addCircle(match.anchorPointAbsolute, 2, "rgba(0, 0, 255, 0.25)", false, false));
-          }
+          this.ocrOverlayIds.push(this.canvasManager?.addCircle(match.anchorPointAbsolute, 2, "rgba(0, 0, 255, 0.25)", false, false));
           if (isFirstMatch) {
             for (const child of this.children.filter((e) => e.needsAnchorReposition)) {
               let currentAnchorPoint = this.currentAnchorPoint ?? this.rect.origin;
@@ -727,10 +699,15 @@ var AnchorZone = class extends CaptureZoneBase {
               child.needsAnchorReposition = false;
             }
           } else {
-            for (const child of this.children) {
+            for (let i = 0; i < this.children.length; i++) {
+              const child = this.children[i];
               if (child.hidden == false) {
                 let vector = this.currentAnchorPoint ? match.anchorPointAbsolute.getDeltaFromPoint(this.currentAnchorPoint) : new Vector(0, 0);
-                let color = "rgba(" + cycle + ", 128, 255, 0.5)";
+                let maxOpacity = 0.5;
+                let minOpacity = 0.25;
+                let percentThroughArray = (i + 1) / this.children.length;
+                let opacity = maxOpacity - (maxOpacity - minOpacity) * percentThroughArray;
+                let color = `rgba(" + cycle + ", 128, 255, ${opacity.toFixed(2)})`;
                 const polygon = child.rect.move(vector).toPolygon().points;
                 this.ocrOverlayIds.push(this.canvasManager?.addPolygon(polygon, color, false));
               }
@@ -742,6 +719,7 @@ var AnchorZone = class extends CaptureZoneBase {
         }
         isFirstMatch = false;
       }
+      this.ocrOverlayIds.forEach((id) => this.canvasManager?.setVisibility(id, !this.hidden));
     }
   }
   get cycle() {

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "dytools-capture-engine",
-  "version": "1.2.2",
+  "version": "1.2.4",
   "description": "An editor allowing the creation of templates for ocr capture.",
   "type": "module",
   "main": "./dist/index.cjs",
@@ -24,7 +24,7 @@
     "typescript": "^5.9.3"
   },
   "dependencies": {
-    "dytools-canvas-engine": "^1.1.1",
+    "dytools-canvas-engine": "^1.1.2",
     "dytools-geometry": "^1.0.0",
     "dytools-result": "^1.0.1"
   }