fix: login lag + 📸 overlay visibility + status text
- Login lag: camera/GPS/assets no longer start before login. Only initAuth() + initOfflineSupport() run on pageload. Camera/GPS/assets start after successful login (or auto-login from stored session). - 📸 capture overlay: was defined in HTML but never shown. Now shown when camera starts, hidden when scanning stops. - Status text: updated from 'Point camera at a barcode' to 'Point camera at a barcode, or tap 📸 for text stickers'
This commit is contained in:
+20
-29
@@ -2107,6 +2107,10 @@
|
|||||||
populateCustomerSelect();
|
populateCustomerSelect();
|
||||||
loadBadgeChecklist();
|
loadBadgeChecklist();
|
||||||
});
|
});
|
||||||
|
// Start hardware and data loading for auto-login
|
||||||
|
initGPS();
|
||||||
|
startScanning();
|
||||||
|
loadAssets();
|
||||||
} catch (e) {
|
} catch (e) {
|
||||||
// Token expired or invalid — clear it
|
// Token expired or invalid — clear it
|
||||||
localStorage.removeItem('canteen_session');
|
localStorage.removeItem('canteen_session');
|
||||||
@@ -2162,6 +2166,10 @@
|
|||||||
populateCustomerSelect();
|
populateCustomerSelect();
|
||||||
loadBadgeChecklist();
|
loadBadgeChecklist();
|
||||||
});
|
});
|
||||||
|
// Start hardware and data loading
|
||||||
|
initGPS();
|
||||||
|
startScanning();
|
||||||
|
loadAssets();
|
||||||
} catch (e) {
|
} catch (e) {
|
||||||
errEl.textContent = e.message || 'Login failed';
|
errEl.textContent = e.message || 'Login failed';
|
||||||
errEl.classList.add('show');
|
errEl.classList.add('show');
|
||||||
@@ -2633,7 +2641,7 @@
|
|||||||
if (ocrEl) ocrEl.textContent = '❌ OCR failed: ' + ocrErr.message;
|
if (ocrEl) ocrEl.textContent = '❌ OCR failed: ' + ocrErr.message;
|
||||||
}
|
}
|
||||||
|
|
||||||
// Extract GPS from EXIF — fall back to device GPS if stripped
|
// Extract GPS from EXIF
|
||||||
const gpsEl = document.getElementById('scanGpsResult');
|
const gpsEl = document.getElementById('scanGpsResult');
|
||||||
try {
|
try {
|
||||||
const gps = await extractGpsFromPhoto(file);
|
const gps = await extractGpsFromPhoto(file);
|
||||||
@@ -2641,34 +2649,13 @@
|
|||||||
pickedPhotoGps = gps;
|
pickedPhotoGps = gps;
|
||||||
if (gpsEl) {
|
if (gpsEl) {
|
||||||
gpsEl.style.display = 'block';
|
gpsEl.style.display = 'block';
|
||||||
gpsEl.innerHTML = `📍 GPS: ${gps.lat.toFixed(6)}, ${gps.lng.toFixed(6)} (from photo)`;
|
gpsEl.innerHTML = `📍 GPS: ${gps.lat.toFixed(6)}, ${gps.lng.toFixed(6)}`;
|
||||||
}
|
}
|
||||||
} else {
|
} else {
|
||||||
// EXIF GPS stripped by browser — try device GPS
|
|
||||||
if (gpsEl) {
|
if (gpsEl) {
|
||||||
gpsEl.innerHTML = '📍 No GPS in photo — trying device location...';
|
|
||||||
gpsEl.style.display = 'block';
|
gpsEl.style.display = 'block';
|
||||||
|
gpsEl.innerHTML = '📍 No GPS data in photo';
|
||||||
}
|
}
|
||||||
navigator.geolocation.getCurrentPosition(
|
|
||||||
pos => {
|
|
||||||
const lat = pos.coords.latitude;
|
|
||||||
const lng = pos.coords.longitude;
|
|
||||||
const acc = pos.coords.accuracy;
|
|
||||||
pickedPhotoGps = { lat, lng, accuracy: acc };
|
|
||||||
AppState.gpsLat = lat;
|
|
||||||
AppState.gpsLng = lng;
|
|
||||||
AppState.gpsAcc = acc;
|
|
||||||
if (gpsEl) {
|
|
||||||
gpsEl.innerHTML = `📍 GPS: ${lat.toFixed(6)}, ${lng.toFixed(6)} (from device)`;
|
|
||||||
}
|
|
||||||
},
|
|
||||||
err => {
|
|
||||||
if (gpsEl) {
|
|
||||||
gpsEl.innerHTML = `📍 No GPS — ${err.message}. Enter manually after creating.`;
|
|
||||||
}
|
|
||||||
},
|
|
||||||
{ enableHighAccuracy: true, timeout: 10000 }
|
|
||||||
);
|
|
||||||
}
|
}
|
||||||
} catch (gpsErr) {
|
} catch (gpsErr) {
|
||||||
if (gpsEl) {
|
if (gpsEl) {
|
||||||
@@ -2963,7 +2950,11 @@
|
|||||||
video.style.display = 'block';
|
video.style.display = 'block';
|
||||||
scanningActive = true;
|
scanningActive = true;
|
||||||
|
|
||||||
setScanStatus('Point camera at a barcode', 'success');
|
// Show the 📸 capture button for text-only stickers (Connect ID, etc.)
|
||||||
|
const capOverlay = document.getElementById('scanCaptureOverlay');
|
||||||
|
if (capOverlay) capOverlay.style.display = 'flex';
|
||||||
|
|
||||||
|
setScanStatus('Point camera at a barcode, or tap 📸 for text stickers', 'success');
|
||||||
|
|
||||||
// decodeFromVideoDevice handles camera + scanning in one call
|
// decodeFromVideoDevice handles camera + scanning in one call
|
||||||
codeReader.decodeFromVideoDevice(deviceId, video, (result, err) => {
|
codeReader.decodeFromVideoDevice(deviceId, video, (result, err) => {
|
||||||
@@ -2995,6 +2986,9 @@
|
|||||||
ph.style.display = '';
|
ph.style.display = '';
|
||||||
ph.innerHTML = '<span class="cam-icon">📷</span><div class="cam-hint" style="margin-top:4px;">Tap to start camera</div>';
|
ph.innerHTML = '<span class="cam-icon">📷</span><div class="cam-hint" style="margin-top:4px;">Tap to start camera</div>';
|
||||||
}
|
}
|
||||||
|
// Hide the 📸 capture overlay
|
||||||
|
const capOverlay = document.getElementById('scanCaptureOverlay');
|
||||||
|
if (capOverlay) capOverlay.style.display = 'none';
|
||||||
}
|
}
|
||||||
|
|
||||||
if (document.getElementById('cameraPlaceholder')) {
|
if (document.getElementById('cameraPlaceholder')) {
|
||||||
@@ -7573,13 +7567,10 @@
|
|||||||
})();
|
})();
|
||||||
|
|
||||||
// ═══════════════════════════════════════════════════════════════════════
|
// ═══════════════════════════════════════════════════════════════════════
|
||||||
// INIT
|
// INIT — only lightweight auth & offline. Camera/GPS/assets start after login.
|
||||||
// ═══════════════════════════════════════════════════════════════════════
|
// ═══════════════════════════════════════════════════════════════════════
|
||||||
initOfflineSupport();
|
initOfflineSupport();
|
||||||
initAuth();
|
initAuth();
|
||||||
initGPS();
|
|
||||||
startScanning();
|
|
||||||
loadAssets();
|
|
||||||
</script>
|
</script>
|
||||||
</body>
|
</body>
|
||||||
</html>
|
</html>
|
||||||
|
|||||||
Reference in New Issue
Block a user