65 lines
1.7 KiB
JavaScript
65 lines
1.7 KiB
JavaScript
|
import QrScanner from "./qr-scanner/qr-scanner.min.js";
|
||
|
|
|
||
|
|
const video = document.querySelector("video");
|
||
|
|
const camList = document.querySelector("select");
|
||
|
|
const fileSelector = document.querySelector("input[type='file']");
|
||
|
|
|
||
|
|
function scanAction(result) {
|
||
|
|
console.log(result.data);
|
||
|
|
}
|
||
|
|
|
||
|
|
function checkCam(hasCamera) {
|
||
|
|
const errorP = document.querySelector("article p:first-of-type");
|
||
|
|
if (!hasCamera) {
|
||
|
|
errorP.innerHTML = "⚠️ Aucune caméra détectée !";
|
||
|
|
}
|
||
|
|
else {
|
||
|
|
errorP.text = "";
|
||
|
|
}
|
||
|
|
}
|
||
|
|
|
||
|
|
const scanner = new QrScanner(
|
||
|
|
video,
|
||
|
|
result => scanAction(result),
|
||
|
|
{
|
||
|
|
highlightScanRegion: true,
|
||
|
|
highlightCodeOutline: true,
|
||
|
|
}
|
||
|
|
);
|
||
|
|
|
||
|
|
window.scanner = scanner; // Débogage
|
||
|
|
|
||
|
|
|
||
|
|
// Changement de caméra :
|
||
|
|
camList.addEventListener("change", event => {
|
||
|
|
scanner.setCamera(event.target.value);
|
||
|
|
});
|
||
|
|
|
||
|
|
// Démarrage du scan :
|
||
|
|
document.querySelector("button").addEventListener("click", () => {
|
||
|
|
scanner.start().then(() => {
|
||
|
|
QrScanner.listCameras(true).then(cameras => cameras.forEach(camera =>
|
||
|
|
{
|
||
|
|
const option = document.createElement("option");
|
||
|
|
option.value = camera.id;
|
||
|
|
option.text = camera.label;
|
||
|
|
camList.add(option);
|
||
|
|
}
|
||
|
|
));
|
||
|
|
});
|
||
|
|
QrScanner.hasCamera().then(hasCamera => checkCam(hasCamera));
|
||
|
|
});
|
||
|
|
|
||
|
|
// // Arrêt du scan :
|
||
|
|
// document.querySelector("nav button:nth-of-type(2)").addEventListener("click", () => {
|
||
|
|
// scanner.stop();
|
||
|
|
// });
|
||
|
|
|
||
|
|
// Scan de fichier :
|
||
|
|
fileSelector.addEventListener("change", () => {
|
||
|
|
const file = fileSelector.files[0];
|
||
|
|
if (file) {
|
||
|
|
QrScanner.scanImage(file, {returnDetailedScanResult: true})
|
||
|
|
.then(result => scanAction(result));
|
||
|
|
}
|
||
|
|
});
|