Skip to content

FIXES_20251103.md

Latest commit

 

History

History
96 lines (73 loc) · 3.54 KB

FIXES_20251103.md

File metadata and controls

96 lines (73 loc) · 3.54 KB
Raw

UI and Display Fixes (2025-11-03b)

Issues Fixed

1. "SPQR" Text Appearing Inside QR Code Area ❌ → ✅

Problem: The "SPQR" label was positioned too high, overlapping the QR code modules.

Solution:

  • Moved label positioning to textY = height + textSize * 2 (below the QR code)
  • Expanded SVG viewBox and canvas height to accommodate the label
  • Applied to both monochrome (generateStandardQR) and SPQR (generateSpqrClient)

Files: docs/app.js lines ~17-39, 261-307, 401-459

2. Monochrome QR Showing "3 Layers Locked" ❌ → ✅

Problem: Standard monochrome QR codes were being misdetected as SPQR and showing incorrect layer status (3 layers).

Solution:

  • Added detection logic to identify standard QR codes misclassified as SPQR
  • Check if only base layer decoded with no red/green properties
  • Set layerCount = 1 for such cases
  • Don't show multi-layer progress for monochrome

Code:

const isLikelyStandardMisdetected = hasBase && !hasRed && !hasGreen && !hasParity && 
    result.spqr.red === undefined && result.spqr.green === undefined;

let layerCount = layerType === 'BWRG' ? 2 : 3;
if (isLikelyStandardMisdetected) {
    layerCount = 1; // Treat as monochrome
}

Files: docs/app.js lines ~5053-5061

3. Status Overlays Not Visible Over Camera ❌ → ✅

Problem: "Multi-frame aggregator" and "soft focus" warnings were displayed below the camera feed, making it impossible to see both simultaneously.

Solution:

  • Moved scan-progress to overlay position (top of video)
  • Styled with:
    • position: absolute
    • top: 10px; left: 10px; right: 10px
    • background: rgba(0,0,0,0.85) (semi-transparent black)
    • max-height: 40%; overflow-y: auto (scrollable if needed)
    • pointer-events: none (doesn't block video tap-to-focus)
  • Kept scan-status at bottom for main status messages
  • Changed CSS class .hidden to style.display = 'none'/'block' for better control

Files:

  • docs/index.html line 22
  • docs/app.js lines 83-84, 121-122, 5224-5230

Visual Layout

┌─────────────────────────────────┐
│ scan-progress (top overlay)     │  ← Multi-frame aggregator, chunks locked
│ • Layers locked: 2/3             │
│ • Base: 3/5 · Red: 2/5 · Green…  │
├─────────────────────────────────┤
│                                  │
│        VIDEO FEED                │
│     (with reticle overlay)       │
│                                  │
├─────────────────────────────────┤
│ scan-status (bottom overlay)     │  ← Main status: "Searching", "Found", etc.
│ ⚠️  QR structure found...        │
└─────────────────────────────────┘

Testing Checklist

  • Generate monochrome QR → "SPQR" label appears below code
  • Generate BWRG QR → label below, corners visible
  • Generate CMYRGB QR → label below, all 8 colours showing
  • Scan monochrome with camera → shows "Standard QR decoded", not "3 layers"
  • Scan SPQR with camera → shows correct layer count (2 or 3)
  • Multi-frame aggregator → visible over camera feed (top)
  • Focus warnings → visible in bottom status bar
  • Both overlays semi-transparent → camera feed still visible

Cache Version

Updated to 20251103b in docs/index.html