Spaces:
Running
Running
File size: 2,294 Bytes
829f2ca | 1 2 3 4 5 6 7 8 9 10 11 12 13 14 15 16 17 18 19 20 21 22 23 24 25 26 27 28 29 30 31 32 33 34 35 36 37 38 39 40 41 42 43 44 45 46 47 48 49 50 51 52 53 54 55 56 57 58 59 60 61 62 63 64 65 66 67 68 69 70 71 | const video = document.getElementById('video');
const canvas = document.getElementById('canvas');
const ctx = canvas.getContext('2d');
const qrText = document.getElementById('qr-text');
let stream = null;
navigator.mediaDevices.getUserMedia({ video: { facingMode: "environment" } }) // for rear camera
.then(function(str) {
stream = str;
video.srcObject = stream;
video.play();
})
.catch(function(err) {
console.error("Error accessing the webcam: " + err);
});
video.addEventListener('play', function() {
canvas.style.width = video.videoWidth;
canvas.style.height = video.videoHeight;
const scan = async () => {
if (video.paused || video.ended) {
return;
}
ctx.drawImage(video, 0, 0, canvas.width, canvas.height);
const imageData = ctx.getImageData(0, 0, canvas.width, canvas.height);
const code = jsQR(imageData.data, imageData.width, imageData.height, {
inversionAttempts: "dontInvert",
});
if (code) {
console.log("QR Code detected:", code.data);
qrText.innerHTML = code.data;
video.pause();
const response = await fetch('/qr', {
method: 'POST',
headers: {
'Content-Type': 'application/json'
},
body: JSON.stringify({
'data': code.data
})
});
const data = await response.json();
var source = document.createElement("source");
source.src = data['qroutput_file_path'];
source.type = "audio/mp3";
document.getElementById("qroutput").appendChild(source);
document.getElementById("qroutput").play();
stream.getTracks().forEach((track) => {
if (track.readyState == 'live' && track.kind === 'video') {
track.stop();
}
});
cancelAnimationFrame(scan);
}
requestAnimationFrame(scan);
};
requestAnimationFrame(scan);
});
document.getElementById("qroutput").onended = function(){
location.reload();
}
|