// QRCODE reader Copyright 2011 Lazar Laszlo
|
|
// http://www.webqr.com
|
|
|
|
var gCtx = null;
|
|
var gCanvas = null;
|
|
var c=0;
|
|
var stype=0;
|
|
var gUM=false;
|
|
var webkit=false;
|
|
var moz=false;
|
|
var v=null;
|
|
var qrSize = 0;
|
|
var margin = 0;
|
|
var scannedCallback = null;
|
|
|
|
|
|
var vidhtml = '<video id="video-stream" autoplay></video>';
|
|
|
|
|
|
function handleFiles(f)
|
|
{
|
|
var o=[];
|
|
|
|
for(var i =0;i<f.length;i++)
|
|
{
|
|
var reader = new FileReader();
|
|
reader.onload = (function(theFile) {
|
|
return function(e) {
|
|
gCtx.clearRect(0, 0, gCanvas.width, gCanvas.height);
|
|
|
|
qrcode.decode(e.target.result);
|
|
};
|
|
})(f[i]);
|
|
reader.readAsDataURL(f[i]);
|
|
}
|
|
}
|
|
|
|
function initCanvas(w,h)
|
|
{
|
|
gCanvas = document.getElementById("qr-canvas");
|
|
gCanvas.style.width = w + "px";
|
|
gCanvas.style.height = h + "px";
|
|
gCanvas.width = w;
|
|
gCanvas.height = h;
|
|
gCtx = gCanvas.getContext("2d");
|
|
gCtx.clearRect(0, 0, w, h);
|
|
}
|
|
|
|
|
|
function captureToCanvas() {
|
|
if(stype!=1)
|
|
return;
|
|
if(gUM)
|
|
{
|
|
try{
|
|
gCtx.drawImage(v,0,0);
|
|
try{
|
|
qrcode.decode();
|
|
}
|
|
catch(e){
|
|
console.log(e);
|
|
setTimeout(captureToCanvas, 500);
|
|
};
|
|
}
|
|
catch(e){
|
|
console.log(e);
|
|
setTimeout(captureToCanvas, 500);
|
|
};
|
|
}
|
|
}
|
|
|
|
function htmlEntities(str) {
|
|
return String(str).replace(/&/g, '&').replace(/</g, '<').replace(/>/g, '>').replace(/"/g, '"');
|
|
}
|
|
|
|
function read(a)
|
|
{
|
|
if (scannedCallback) scannedCallback(a);
|
|
}
|
|
|
|
function isCanvasSupported(){
|
|
var elem = document.createElement('canvas');
|
|
return !!(elem.getContext && elem.getContext('2d'));
|
|
}
|
|
function success(stream)
|
|
{
|
|
|
|
v.srcObject = stream;
|
|
v.play();
|
|
|
|
gUM=true;
|
|
setTimeout(captureToCanvas, 500);
|
|
}
|
|
|
|
function error(error) {
|
|
gUM=false;
|
|
return;
|
|
}
|
|
|
|
function load(initSize, initMargin, callback)
|
|
{
|
|
qrSize = initSize;
|
|
margin = initMargin;
|
|
scannedCallback = callback;
|
|
if(isCanvasSupported() && window.File && window.FileReader)
|
|
{
|
|
initCanvas(800, 600);
|
|
qrcode.callback = read;
|
|
setwebcam();
|
|
}
|
|
else
|
|
{
|
|
console.log("Sorry your browser is not supported");
|
|
}
|
|
}
|
|
|
|
function setwebcam()
|
|
{
|
|
var options = true;
|
|
if(navigator.mediaDevices && navigator.mediaDevices.enumerateDevices)
|
|
{
|
|
try{
|
|
navigator.mediaDevices.enumerateDevices()
|
|
.then(function(devices) {
|
|
devices.forEach(function(device) {
|
|
if (device.kind === 'videoinput') {
|
|
if(device.label.toLowerCase().search("back") >-1)
|
|
options={'deviceId': {'exact':device.deviceId}, 'facingMode':'environment'} ;
|
|
}
|
|
console.log(device.kind + ": " + device.label +" id = " + device.deviceId);
|
|
});
|
|
setwebcam2(options);
|
|
});
|
|
}
|
|
catch(e)
|
|
{
|
|
console.log(e);
|
|
}
|
|
}
|
|
else{
|
|
console.log("no navigator.mediaDevices.enumerateDevices" );
|
|
setwebcam2(options);
|
|
}
|
|
|
|
}
|
|
|
|
function setwebcam2(options)
|
|
{
|
|
console.log(options);
|
|
if(stype==1)
|
|
{
|
|
setTimeout(captureToCanvas, 500);
|
|
return;
|
|
}
|
|
var n=navigator;
|
|
document.getElementById("outdiv").innerHTML = vidhtml;
|
|
v=document.getElementById("video-stream");
|
|
v.style.width = qrSize + "px";
|
|
v.style.marginLeft = margin + "px";
|
|
|
|
|
|
if(n.mediaDevices.getUserMedia)
|
|
{
|
|
n.mediaDevices.getUserMedia({video: options, audio: false}).
|
|
then(function(stream){
|
|
success(stream);
|
|
}).catch(function(error){
|
|
error(error)
|
|
});
|
|
}
|
|
else
|
|
if(n.getUserMedia)
|
|
{
|
|
webkit=true;
|
|
n.getUserMedia({video: options, audio: false}, success, error);
|
|
}
|
|
else
|
|
if(n.webkitGetUserMedia)
|
|
{
|
|
webkit=true;
|
|
n.webkitGetUserMedia({video:options, audio: false}, success, error);
|
|
}
|
|
|
|
stype=1;
|
|
setTimeout(captureToCanvas, 500);
|
|
}
|