fix: Default to OCR mode on initial page load

- Fixed HTML initial state: OCR toggle button has 'active', OCR panel has 'active', barcode does not
- switchTab calls setAddAssetMode() which syncs visual panels AND starts the right camera
- Previously the JS variable was 'ocr' but HTML hardcoded barcode as active — visual mismatch
This commit is contained in:
2026-06-01 21:22:25 -04:00
parent 5ae9763f9a
commit b020665088
3 changed files with 6 additions and 7 deletions
Binary file not shown.
Binary file not shown.
+6 -7
View File
@@ -1238,12 +1238,12 @@
<div id="tabAddAsset" class="tab-panel active"> <div id="tabAddAsset" class="tab-panel active">
<!-- Mode Toggles --> <!-- Mode Toggles -->
<div class="mode-toggles"> <div class="mode-toggles">
<button class="mode-toggle active" data-mode="barcode" onclick="setAddAssetMode('barcode')"><svg class="gi" aria-hidden="true"><use href="#gi-camera"/></svg> Barcode</button> <button class="mode-toggle" data-mode="barcode" onclick="setAddAssetMode('barcode')"><svg class="gi" aria-hidden="true"><use href="#gi-camera"/></svg> Barcode</button>
<button class="mode-toggle" data-mode="ocr" onclick="setAddAssetMode('ocr')"><svg class="gi" aria-hidden="true"><use href="#gi-search"/></svg> OCR</button> <button class="mode-toggle active" data-mode="ocr" onclick="setAddAssetMode('ocr')"><svg class="gi" aria-hidden="true"><use href="#gi-search"/></svg> OCR</button>
</div> </div>
<!-- ── BARCODE MODE ──────────────────────────────────────────────── --> <!-- ── BARCODE MODE ──────────────────────────────────────────────── -->
<div id="addBarcodeMode" class="add-mode active"> <div id="addBarcodeMode" class="add-mode">
<div class="card"> <div class="card">
<div class="card-title">Barcode Scanner</div> <div class="card-title">Barcode Scanner</div>
<div id="cameraArea" class="camera-area"> <div id="cameraArea" class="camera-area">
@@ -1260,7 +1260,7 @@
</div> </div>
<!-- ── OCR MODE ──────────────────────────────────────────────────── --> <!-- ── OCR MODE ──────────────────────────────────────────────────── -->
<div id="addOcrMode" class="add-mode"> <div id="addOcrMode" class="add-mode active">
<div class="card"> <div class="card">
<div class="card-title">OCR Scanner — Photograph Sticker</div> <div class="card-title">OCR Scanner — Photograph Sticker</div>
<div id="ocrCameraArea" class="camera-area"> <div id="ocrCameraArea" class="camera-area">
@@ -2439,10 +2439,9 @@
el.classList.toggle('active', el.dataset.tab === tabId); el.classList.toggle('active', el.dataset.tab === tabId);
}); });
// Tab lifecycle hooks — start the appropriate scanner // Tab lifecycle hooks — sync visual panel + start correct camera
if (tabId === 'tabAddAsset') { if (tabId === 'tabAddAsset') {
if (addAssetMode === 'ocr') startOcrCamera(); setAddAssetMode(addAssetMode);
else startScanning();
} else { } else {
stopScanning(); stopScanning();
} }