From e0d53837c69c9029d95dddd92afd4929f77debd4 Mon Sep 17 00:00:00 2001
From: John O'Keefe <jrokeefe@protonmail.com>
Date: Mon, 13 Apr 2026 20:43:49 -0400
Subject: [PATCH] Add diagnostic logging to panel detection pipeline

Added comprehensive logging throughout the panel detection system to aid in debugging and understanding detection flow:

- detector.js: Log caching status, detection start, and attempts for each method (OpenCV, ML, Grid)
- opencv.js: Log number of potential panels detected
- coco-ssd.js: Log number of predictions from ML model
- grid.js: Log final merged panel count

These logs help track which detection method is being used and how many panels are found at each step, making it easier to diagnose detection issues.
---
 panel-detection/coco-ssd.js |  2 +-
 panel-detection/detector.js | 27 +++++++++++++++++++++++++--
 panel-detection/grid.js     |  2 +-
 panel-detection/opencv.js   |  1 +
 4 files changed, 28 insertions(+), 4 deletions(-)

diff --git a/panel-detection/coco-ssd.js b/panel-detection/coco-ssd.js
index 8acaa9b..70740c4 100644
--- a/panel-detection/coco-ssd.js
+++ b/panel-detection/coco-ssd.js
@@ -8,11 +8,11 @@ export async function detectPanelsML(imageData, model) {
   ctx.putImageData(imageData, 0, 0);
 
   const predictions = await model.detect(canvas);
+  console.log("[COCO-SSD] Got", predictions.length, "predictions");
 
   const panels = [];
   const imgWidth = imageData.width;
   const imgHeight = imageData.height;
-
   for (let i = 0; i < predictions.length; i++) {
     const pred = predictions[i];
     const [x, y, w, h] = pred.bbox;
diff --git a/panel-detection/detector.js b/panel-detection/detector.js
index 0e09130..4de650a 100644
--- a/panel-detection/detector.js
+++ b/panel-detection/detector.js
@@ -10,6 +10,7 @@ export class PanelDetector {
     const cacheKey = `${doc.location?.pathname || ""}-${index}`;
 
     if (!force && this.#cache.has(cacheKey)) {
+      console.log("[Panel Detection] Using cached result");
       return this.#cache.get(cacheKey);
     }
 
@@ -17,7 +18,10 @@ export class PanelDetector {
     if (!imageData) {
       return { panels: [], method: "no-image", confidence: 0 };
     }
-
+    console.log(
+      "[Panel Detection] Starting detection for image:",
+      `${imageData.width}x${imageData.height}px`,
+    );
     // Load ML libraries on first use
     if (!this.#scriptsLoaded) {
       const result = await loadMLLibraries();
@@ -66,7 +70,7 @@ export class PanelDetector {
     const { detectPanelsOpenCV } = await import("./opencv.js");
     const { detectPanelsML } = await import("./coco-ssd.js");
     const { detectPanelsGrid } = await import("./grid.js");
-
+    console.log("[Panel Detection] Attempting OpenCV detection...");
     // Try OpenCV (uses global cv)
     try {
       const cv = globalThis.cv;
@@ -83,8 +87,12 @@ export class PanelDetector {
         });
 
         const panels = await detectPanelsOpenCV(imageData, cv);
+        console.log("[Panel Detection] OpenCV found", panels.length, "panels");
         if (this.#validatePanels(panels, imageData)) {
+          console.log("[Panel Detection] ✓ Using OpenCV detection");
           return { panels, method: "opencv", confidence: 0.85 };
+        } else {
+          console.log("[Panel Detection] ✗ OpenCV panels failed validation");
         }
       }
     } catch (e) {
@@ -92,17 +100,26 @@ export class PanelDetector {
     }
 
     // Try ML (uses global cocoSsd)
+    console.log("[Panel Detection] Attempting ML detection...");
     try {
       const cocoSsdModule = globalThis.cocoSsd;
       if (cocoSsdModule && cocoSsdModule.load) {
         // Load model if not cached
         if (!this.#model) {
+          console.log("[Panel Detection] Loading COCO-SSD model...");
           this.#model = await cocoSsdModule.load();
+          console.log("[Panel Detection] COCO-SSD model loaded");
+        } else {
+          console.log("[Panel Detection] Using cached COCO-SSD model");
         }
 
         const panels = await detectPanelsML(imageData, this.#model);
+        console.log("[Panel Detection] ML found", panels.length, "panels");
         if (this.#validatePanels(panels, imageData)) {
+          console.log("[Panel Detection] ✓ Using ML detection");
           return { panels, method: "ml", confidence: 0.7 };
+        } else {
+          console.log("[Panel Detection] ✗ ML panels failed validation");
         }
       }
     } catch (e) {
@@ -110,7 +127,13 @@ export class PanelDetector {
     }
 
     // Grid fallback (always works)
+    console.log("[Panel Detection] Falling back to grid detection");
     const panels = detectPanelsGrid(imageData);
+    console.log(
+      "[Panel Detection] ✓ Using grid detection, found",
+      panels.length,
+      "panels",
+    );
     return { panels, method: "grid", confidence: 0.4 };
   }
 
diff --git a/panel-detection/grid.js b/panel-detection/grid.js
index da1e401..8f91ddb 100644
--- a/panel-detection/grid.js
+++ b/panel-detection/grid.js
@@ -82,7 +82,7 @@ function mergeAdjacentPanels(panels) {
         }
       }
     }
-
+    console.log("[Grid] Merged to", merged.length, "panels");
     merged.push(current);
   }
 
diff --git a/panel-detection/opencv.js b/panel-detection/opencv.js
index ff02d3f..3bc4393 100644
--- a/panel-detection/opencv.js
+++ b/panel-detection/opencv.js
@@ -41,6 +41,7 @@ export async function detectPanelsOpenCV(imageData, cv) {
         reading_order: i,
       });
     }
+    console.log("[OpenCV] Detected", panels.length, "potential panels");
 
     panels.sort((a, b) => {
       const rowA = Math.floor(a.y / 20);