I am showing a button to open camera using phonegap :
document.addEventListener("deviceready", loaded, false);
function loaded() {
pictureSource = navigator.camera.PictureSourceType;
destinationType = navigator.camera.DestinationType;
}
function capturePhoto() {
navigator.camera.getPicture(getPhoto, onFail, {
quality : 50
});
}
function getPhoto(imageData) {
alert(imageData);
var smallImage = document.getElementById('cameraPic');
smallImage.style.display = 'block';
smallImage.src = "data:image/jpeg;base64," + imageData;
}
function onFail(message) {
alert('Failed because: ' + message);
}
<body>
<div id="camera">
<button class="camera-control" onclick="capturePhoto();">CapturePhoto</button>
<div style="text-align: center; margin: 20px;">
<img id="cameraPic" src="" style="width: auto; height: 120px;"> <img>
</div></div>
</body>
On click of button i want to decode a QR code and get show the decoded value on my page. I want to do this using javascript and phonegap only and dont want to use any native code.
There is an official plugin for that... check Barcode Scanner
There's a Library that decodes Qr-Code in Javascript only I have used: https://github.com/LazarSoft/jsqrcode
As it is a Javascript only solution, it should work on phonegap too.
There's an online Demo here: http://webqr.com/
jsqrcode works with Data-URIs, so you could use it like this:
qrcode.decode("data:image/jpeg;base64," + imageData);
In your code:
function getPhoto(imageData) {
alert(imageData);
var smallImage = document.getElementById('cameraPic');
smallImage.style.display = 'block';
qrcode.callback=function(){alert('Decoded:'+this.result)};
qrcode.decode("data:image/jpeg;base64," + imageData);
}
If you love us? You can donate to us via Paypal or buy me a coffee so we can maintain and grow! Thank you!
Donate Us With