diff --git a/templates/index.html b/templates/index.html index ad6a1d9..ebd16bb 100644 --- a/templates/index.html +++ b/templates/index.html @@ -533,6 +533,13 @@ @@ -846,35 +853,73 @@ } let html5QrCode; + let currentCameraId; async function startScanner() { const modal = new bootstrap.Modal(document.getElementById('scannerModal')); modal.show(); - html5QrCode = new Html5Qrcode("reader"); + if (!html5QrCode) { + html5QrCode = new Html5Qrcode("reader"); + } + + try { + const devices = await Html5Qrcode.getCameras(); + const select = document.getElementById('camera-select'); + select.innerHTML = ''; // Clear "loading" message + + if (devices && devices.length) { + devices.forEach((device, index) => { + const option = document.createElement('option'); + option.value = device.id; + option.text = device.label || `Cámara ${index + 1}`; + select.appendChild(option); + }); + + // Default to the last camera (often the main back camera on mobile) + currentCameraId = devices[devices.length - 1].id; + select.value = currentCameraId; + + launchCamera(currentCameraId); + } else { + alert("No se encontraron cámaras."); + } + } catch (err) { + console.error("Error obteniendo cámaras:", err); + alert("Error de permisos de cámara. Revisa la conexión HTTPS."); + } + } + + async function launchCamera(cameraId) { const config = { fps: 10, qrbox: { width: 250, height: 150 } }; + // If already scanning, stop first before switching + if (html5QrCode.isScanning) { + await html5QrCode.stop(); + } + try { await html5QrCode.start( - { facingMode: "environment" }, + cameraId, config, (decodedText) => { - // Successfully scanned stopScanner(); bootstrap.Modal.getInstance(document.getElementById('scannerModal')).hide(); - - // Trigger your existing scan route fetch(`/scan?content=${decodedText}`) .then(res => { - if (res.status === 404) { - console.log("Producto nuevo detectado vía cámara"); - } + if (res.status === 404) console.log("Nuevo producto detectado"); }); } ); } catch (err) { - console.error("Error al iniciar cámara:", err); - alert("No se pudo acceder a la cámara. Asegúrate de dar permisos HTTPS."); + console.error("Error al iniciar cámara específica:", err); + } + } + + function switchCamera(cameraId) { + if (cameraId) { + currentCameraId = cameraId; + launchCamera(cameraId); } } @@ -882,7 +927,7 @@ if (html5QrCode && html5QrCode.isScanning) { html5QrCode.stop().then(() => { html5QrCode.clear(); - }); + }).catch(err => console.error("Error stopping scanner", err)); } }