hh-shipments 0.3.24 → 0.3.25

package/package.json

@@ -18,7 +18,7 @@
     "test": "node test/run-tests.js && node test/run-carriers-tests.js"
   },
   "type": "commonjs",
-  "version": "0.3.24",
+  "version": "0.3.25",
   "bin": {
     "hh-shipments": "server.js"
   },

package/public/app.js

@@ -175,53 +175,120 @@ function loadTesseract() {
   return tesseractLoading;
 }
 
-// Tesseract reads dark-text-on-light far better than the reverse. Chat
-// screenshots (dark mode) come out as white-on-black, so detect dark images
-// and invert them before OCR. Light images (labels) pass through untouched.
-async function maybeInvertForOcr(file) {
+// "Better eyes": smart OCR pipeline that adapts to image type.
+// - Chat screenshots (dark): invert, PSM 6 (uniform block)
+// - Labels (light): crop to tracking zone, upscale, PSM 6
+// - Falls back to full-image PSM 3 if targeted fails
+async function ocrFile(file, statusEl) {
+  await loadTesseract();
+  statusEl.textContent = 'Reading screenshot…';
+  const isDark = await isDarkImage(file);
+  file = isDark ? await invertImage(file) : file;
+
+  const log = (m) => { if (m.status === 'recognizing text' && statusEl) statusEl.textContent = `Reading… ${Math.round(m.progress * 100)}%`; };
+
+  // Pass 1: targeted — for labels, crop to the tracking-number zone (bottom 45%)
+  // and upscale for Tesseract. For chats, use the full image.
+  let bestText = '';
+  if (!isDark) {
+    try {
+      const zoned = await cropAndUpscale(file, 0, 0.55, 1, 0.45, 2);
+      const r1 = await Tesseract.recognize(zoned, 'eng', {
+        logger: log,
+        tessedit_pageseg_mode: '6', // uniform block of text
+      });
+      bestText = r1.data.text || '';
+      // If the zone has a plausible tracking number, we're done
+      if (/(1Z|12|IZ|17)\s*[0-9A-Z)\]}(\[{|!]/i.test(bestText)) {
+        if (statusEl) statusEl.textContent = '';
+        return bestText;
+      }
+    } catch (e) {}
+  }
+
+  // Pass 2: full image with PSM 6
+  try {
+    const r2 = await Tesseract.recognize(file, 'eng', {
+      logger: log,
+      tessedit_pageseg_mode: '6',
+    });
+    const t2 = r2.data.text || '';
+    if (t2.length > bestText.length) bestText = t2;
+  } catch (e) {}
+
+  // Pass 3: fallback to default PSM 3 if we got nothing useful
+  if (!bestText || bestText.trim().length < 10) {
+    try {
+      const r3 = await Tesseract.recognize(file, 'eng', { logger: log });
+      const t3 = r3.data.text || '';
+      if (t3.length > bestText.length) bestText = t3;
+    } catch (e) {}
+  }
+
+  if (statusEl) statusEl.textContent = '';
+  return bestText;
+}
+
+async function isDarkImage(file) {
   try {
     const bmp = await createImageBitmap(file);
-    const w = bmp.width, h = bmp.height;
-    const canvas = document.createElement('canvas');
-    // sample at reduced size for speed
-    const sw = Math.min(200, w), sh = Math.min(200, h);
-    canvas.width = sw; canvas.height = sh;
-    const ctx = canvas.getContext('2d', { willReadFrequently: true });
+    const sw = Math.min(100, bmp.width), sh = Math.min(100, bmp.height);
+    const c = document.createElement('canvas');
+    c.width = sw; c.height = sh;
+    const ctx = c.getContext('2d', { willReadFrequently: true });
     ctx.drawImage(bmp, 0, 0, sw, sh);
     const px = ctx.getImageData(0, 0, sw, sh).data;
     let sum = 0, n = 0;
     for (let i = 0; i < px.length; i += 16) {
-      sum += 0.299 * px[i] + 0.587 * px[i + 1] + 0.114 * px[i + 2];
+      sum += 0.299 * px[i] + 0.587 * px[i+1] + 0.114 * px[i+2];
       n++;
     }
-    const avg = sum / n;
     bmp.close();
-    if (avg > 110) return file; // already light — leave it alone
-    // dark image: invert to dark-on-light
-    const c2 = document.createElement('canvas');
-    c2.width = w; c2.height = h;
-    const x2 = c2.getContext('2d');
-    const full = await createImageBitmap(file);
-    x2.drawImage(full, 0, 0);
-    full.close();
-    const img = x2.getImageData(0, 0, w, h);
+    return (sum / n) < 110;
+  } catch (e) { return false; }
+}
+
+async function invertImage(file) {
+  try {
+    const bmp = await createImageBitmap(file);
+    const c = document.createElement('canvas');
+    c.width = bmp.width; c.height = bmp.height;
+    const ctx = c.getContext('2d');
+    ctx.drawImage(bmp, 0, 0);
+    bmp.close();
+    const img = ctx.getImageData(0, 0, c.width, c.height);
     const d = img.data;
     for (let i = 0; i < d.length; i += 4) {
-      d[i] = 255 - d[i]; d[i + 1] = 255 - d[i + 1]; d[i + 2] = 255 - d[i + 2];
+      d[i] = 255 - d[i]; d[i+1] = 255 - d[i+1]; d[i+2] = 255 - d[i+2];
     }
-    x2.putImageData(img, 0, 0);
-    const blob = await new Promise((res) => c2.toBlob(res, 'image/jpeg', 0.92));
+    ctx.putImageData(img, 0, 0);
+    const blob = await new Promise((res) => c.toBlob(res, 'image/jpeg', 0.92));
     return blob ? new File([blob], 'inv.jpg', { type: 'image/jpeg' }) : file;
   } catch (e) { return file; }
 }
 
-async function ocrFile(file, statusEl) {
-  await loadTesseract();
-  statusEl.textContent = 'Reading screenshot…';
-  file = await maybeInvertForOcr(file);
-  const { data } = await Tesseract.recognize(file, 'eng', { logger: (m) => { if (m.status === 'recognizing text') statusEl.textContent = `Reading… ${Math.round(m.progress * 100)}%`; } });
-  statusEl.textContent = '';
-  return data.text || '';
+async function cropAndUpscale(file, fx, fy, fw, fh, scale) {
+  const bmp = await createImageBitmap(file);
+  const sw = Math.round(bmp.width * fw), sh = Math.round(bmp.height * fh);
+  const c = document.createElement('canvas');
+  c.width = Math.round(sw * scale);
+  c.height = Math.round(sh * scale);
+  const ctx = c.getContext('2d');
+  ctx.drawImage(bmp, bmp.width * fx, bmp.height * fy, sw, sh, 0, 0, c.width, c.height);
+  bmp.close();
+  // Boost contrast for text
+  try {
+    const img = ctx.getImageData(0, 0, c.width, c.height);
+    const d = img.data;
+    for (let i = 0; i < d.length; i += 4) {
+      const v = 0.299*d[i] + 0.587*d[i+1] + 0.114*d[i+2];
+      const nv = v < 140 ? Math.max(0, v - 40) : Math.min(255, v + 40);
+      d[i] = d[i+1] = d[i+2] = nv;
+    }
+    ctx.putImageData(img, 0, 0);
+  } catch (e) {}
+  const blob = await new Promise((res) => c.toBlob(res, 'image/jpeg', 0.95));
+  return new File([blob], 'crop.jpg', { type: 'image/jpeg' });
 }
 
 async function handlePhotoFile(f) {
@@ -533,13 +600,12 @@ async function loadPending() {
 async function reviewPendingImage(id) {
   $('photo-result').innerHTML = `<img src="/api/intake/image/${id}" style="max-width:100%;border-radius:10px"><p class="muted">Extracting…</p>`;
   try {
-    await loadTesseract();
     const resp = await fetch(`/api/intake/image/${id}`);
     const blob = await resp.blob();
-    const file = await maybeInvertForOcr(new File([blob], 'pending.jpg', { type: blob.type || 'image/jpeg' }));
-    const { data } = await Tesseract.recognize(file, 'eng');
+    const file = new File([blob], 'pending.jpg', { type: blob.type || 'image/jpeg' });
+    const text = await ocrFile(file, null);
     await api.patch('/api/intake/' + id, { state: 'reviewed' });
-    await runQuick(data.text || '', $('photo-result'));
+    await runQuick(text, $('photo-result'));
     loadPending();
   } catch (e) { $('photo-result').innerHTML = `<p class="error">${esc(e.message)}</p>`; }
 }

package/public/index.html

@@ -4,7 +4,7 @@
 <meta charset="utf-8">
 <meta name="viewport" content="width=device-width, initial-scale=1, viewport-fit=cover">
 <meta name="theme-color" content="#0a84ff">
-<meta name="app-version" content="0.3.24">
+<meta name="app-version" content="0.3.25">
 <title>HH Shipments</title>
 <link rel="manifest" href="/manifest.webmanifest">
 <link rel="apple-touch-icon" href="/icon-192.png">