hh-shipments 0.3.0 → 0.3.1

package/package.json

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

package/public/app.js

@@ -180,21 +180,36 @@ $('photo-input').addEventListener('change', async (e) => {
   await handlePhotoFile(f);
 });
 
-// Paste a screenshot straight from the clipboard (iOS: tap the paste zone, long-press → Paste)
-$('tab-photo').addEventListener('paste', async (e) => {
+// Shared: pull image files out of a paste event's clipboard data
+function pastedImageFiles(e) {
   const dt = e.clipboardData;
-  if (!dt) return;
   const files = [];
+  if (!dt) return files;
   if (dt.items) for (const it of dt.items) {
     if (it.type && it.type.startsWith('image/')) { const f = it.getAsFile(); if (f) files.push(f); }
   }
   if (!files.length && dt.files) for (const f of dt.files) {
     if (f.type && f.type.startsWith('image/')) files.push(f);
   }
-  if (!files.length) return; // let text pastes behave normally
+  return files;
+}
+
+// Paste-text tab: pasting a screenshot runs OCR and extracts tracking numbers;
+// pasting plain text behaves normally
+$('tab-paste').addEventListener('paste', async (e) => {
+  const files = pastedImageFiles(e);
+  if (!files.length) return; // text paste — let it land in the textarea
   e.preventDefault();
-  $('paste-zone').innerHTML = '📋 <span class="muted">or tap here, then paste your screenshot</span>';
-  for (const f of files) await handlePhotoFile(f);
+  for (const f of files) {
+    try {
+      const text = await ocrFile(f, $('ocr-status-paste'));
+      const fd = new FormData();
+      fd.append('image', f);
+      const up = await fetch('/api/intake/image', { method: 'POST', body: fd });
+      if (!up.ok) throw new Error('upload failed');
+      await runQuick(text, $('quick-result'));
+    } catch (err) { $('quick-result').innerHTML = `<p class="error">${esc(err.message)}</p>`; }
+  }
 });
 
 async function loadPending() {
@@ -314,7 +329,6 @@ function urlB64(s) {
 function activateTab(name) {
   document.querySelectorAll('.tab').forEach((t) => t.classList.toggle('active', t.dataset.tab === name));
   ['paste', 'photo', 'manual'].forEach((n) => ($('tab-' + n).hidden = n !== name));
-  if (name === 'photo') { try { $('paste-zone').focus({ preventScroll: true }); } catch (_) {} }
 }
 document.querySelectorAll('.tab').forEach((t) => (t.onclick = () => activateTab(t.dataset.tab)));
 document.querySelectorAll('#tabbar button').forEach((b) => {

package/public/index.html

@@ -61,13 +61,13 @@
       <button class="tab" data-tab="manual">Manual</button>
     </div>
     <div id="tab-paste" class="tabpanel">
-      <textarea id="paste-text" rows="6" placeholder="Paste the seller's message here…"></textarea>
+      <textarea id="paste-text" rows="6" placeholder="Paste the seller's message or a tracking-number screenshot here…"></textarea>
+      <div id="ocr-status-paste" class="muted"></div>
       <button id="btn-quick" class="primary">Extract &amp; add</button>
       <div id="quick-result"></div>
     </div>
     <div id="tab-photo" class="tabpanel" hidden>
       <label class="filebtn">📷 Choose screenshot<input id="photo-input" type="file" accept="image/*" hidden></label>
-      <div id="paste-zone" class="pastezone" contenteditable="true" spellcheck="false" aria-label="Paste a screenshot here">📋 <span class="muted">or tap here, then paste your screenshot</span></div>
       <div id="ocr-status" class="muted"></div>
       <div id="photo-result"></div>
       <h3>Pending screenshots</h3>

package/public/styles.css

@@ -42,8 +42,6 @@ h2 { font-size: 17px; margin: 18px 0 8px; }
 .tab.active { background: var(--blue); color: #fff; }
 .tabpanel { margin-bottom: 12px; }
 .filebtn { display: block; text-align: center; background: #e5e5ea; border-radius: 12px; padding: 16px; font-weight: 600; cursor: pointer; }
-.pastezone { margin-top: 10px; border: 2px dashed #c7c7cc; border-radius: 12px; padding: 18px; text-align: center; font-size: 15px; min-height: 24px; outline: none; caret-color: transparent; }
-.pastezone:focus { border-color: #007aff; background: #f2f8ff; }
 .statusline { font-size: 17px; font-weight: 600; margin: 8px 0; }
 .timeline { border-left: 2px solid #d1d1d6; margin-left: 6px; padding-left: 14px; }
 .timeline .ev { margin-bottom: 12px; font-size: 14px; }