MSV FM

Path : /hermes/sb_web/b1536/advancedfunctions.co/bitcoindealer/

File Upload :

Current < : //hermes/sb_web/b1536/advancedfunctions.co/bitcoindealer/qrScanner.js

/**
Include in head tag:
<script type="text/javascript" src="https://unpkg.com/@zxing/library@0.18.5"></script> 
<script src='qrScanner.js'></script>
Note: Website for scanner versions: https://unpkg.com/browse/@zxing/library@0.18.6/README.md
**/
var uIAsStringBarcodeReader='';


var targetVisible=false;
var video=null;
var canvas=null;
var crdID = "";
var textRead = "";
 const codeReader = new ZXing.BrowserQRCodeReader();

function displayUiBarcodeReader(placeHolder){
uIAsStringBarcodeReader="<div class='container' style='width: 300px;'><div id= 'header'></div></div><h6 align='center'><div id='canvasContainer' style='scale:75%;zoom:75%;height:200px;display:none;'><canvas id='canvas' width='320' height='240' style='margin:auto;'></canvas></div><br></h6><br><div class='container' style='width: 300px;' id='formContainer'><form action='javascript:barcodeScanned()' autocomplete='off'><div class='form-group' style='display: grid;grid-template-columns: auto 30%;padding: 10px;grid-gap: 10px;'><input class='form-control' id='barcodeData' placeholder='"+placeHolder+"'><button type='submit' class='btn btn-default' id='submitButton'>Submit</button></div></form></div><div class='container' style='width: 300px;'><div id= 'footer'></div></div><video id='video' height='0'></video>";

return uIAsStringBarcodeReader;
}

function getHeader(headerCode){
document.getElementById('header').innerHTML=headerCode;
}

function getFooter(footerCode){
document.getElementById('footer').innerHTML=footerCode;
}


function getScannedText(){
return document.getElementById('barcodeData').value;
}

function setScannedText(text){
return document.getElementById('barcodeData').value=text;
}

function warning(text){
document.getElementById('barcodeData').value=text;
document.getElementById('barcodeData').style='background-color:lightyellow';
}

/**
Call this function to turn on environment cam and remove canvas
**/
function startScanning(){
canvas=document.getElementById("canvas").getContext('2d');
video=document.getElementById("video");
var mediaDevice=navigator.mediaDevices.getUserMedia({video: {facingMode: 'environment',width: {ideal: 480}}}).then(function (stream) {
video.srcObject = stream;
video.play();
document.getElementById("canvasContainer").style.display="block";
}).catch(function(err){
document.getElementById("canvasContainer").style.display="none";
});
repeatSwitch='true';
repeat();
  }  


 
/**
Call this function to turn off environment cam and remove canvas
**/
function stopScanning(){
repeatSwitch='false';
video.srcObject.getTracks().forEach(function(track){track.stop();});
video=null;
canvas=null;
const codeReader = new ZXing.BrowserMultiFormatReader();
document.getElementById("canvasContainer").style.display="none";
}           

function repeat() {
canvas.drawImage(video,0,0);
var canvasUrl=document.getElementById("canvas").toDataURL();
codeReader.decodeFromImage(undefined,canvasUrl).then((result, err) => {
if (result) {
textRead = result.text;

document.getElementById("barcodeData").value= textRead;
barcodeScanned();
}
});    
drawTarget();    
if(repeatSwitch=='true'){
setTimeout(repeat, 33);}
}
    
function setTargetVisible(trueOrFalse){
targetVisible=trueOrFalse;}
    
function drawTarget(){
    if(targetVisible){
canvas.lineJoin="round";
canvas.lineWidth="7";
canvas.strokeStyle="rgba(70,130,180,0.5)";

canvas.beginPath();
canvas.moveTo((320-150)/2, (240-150)/2+50);
canvas.lineTo((320-150)/2, (240-150)/2+50-30);
canvas.arc((320-150)/2+20,(240-150)/2+20,20,Math.PI,-Math.PI/2);

canvas.moveTo((320-150)/2+20, (240-150)/2);
canvas.lineTo((320-150)/2+50, (240-150)/2);

canvas.moveTo((320-150)/2+150, (240-150)/2+50);
canvas.lineTo((320-150)/2+150, (240-150)/2+50-30);



canvas.moveTo((320-150)/2+100, (240-150)/2);
canvas.lineTo((320-150)/2+130, (240-150)/2);
canvas.arc((320-150)/2+110+20,(240-150)/2+20,20,Math.PI/-2,0);

canvas.moveTo((320-150)/2, (240-150)/2+100);
canvas.lineTo((320-150)/2, (240-150)/2+100+30);
canvas.arc((320-150)/2+20,(240-150)/2+110+20,20,Math.PI,Math.PI/2,true);

canvas.moveTo((320-150)/2+20, (240-150)/2+150);
canvas.lineTo((320-150)/2+50, (240-150)/2+150);

canvas.moveTo((320-150)/2+150, (240-150)/2+100);
canvas.lineTo((320-150)/2+150, (240-150)/2+100+30);

canvas.moveTo((320-150)/2+100, (240-150)/2+150);
canvas.lineTo((320-150)/2+130, (240-150)/2+150);
canvas.arc((320-150)/2+110+20,(240-150)/2+110+20,20,Math.PI/2,0,true);

canvas.stroke();  
}
}