[Plugin] Qr Code Decoder

Here's a plugin that decodes QR codes in Javascript only !

It's based on the work by Lazar Lazslo (the JS port of the ZXing library : https://github.com/LazarSoft/jsqrcode)

<img src="https://dl.dropbox.com/u/1412774/QRDecodeDemo/demo.png" border="0">

As you see, it's possible to recognize a QR Code captured byt the User Media plugin.

The demo showcase the recognition of a Sprite containing a QR Code (for example generated by my other plugin : QR Code Creator), but you can also recognize a snapshot taken from the webcam.

It works on FF and Chrome (surely on Opera and Safari desktop too, but I haven't tested it on my machine, I don't have a recent build of those on that one).

The demo : https://dl.dropbox.com/u/1412774/QRDecodeDemo/index.html

The plugin : https://dl.dropbox.com/u/1412774/QRDecodeDemo/pode_qrdecode.1.0.zip

The .capx : https://dl.dropbox.com/u/1412774/QRDecodeDemo/QRDecodeDemo.capx

<font size="2">QR Code for this page : </font>

<img src="https://dl.dropbox.com/u/1412774/QRDecodeDemo/qrpage.png" border="0">

Some informations (thanks Yann) :

if the detection fails, the source of the problem can be

• improper lightning
• QR Code image skewed too much
• damaged or scratched QR Code
• "blurry" webcam (if the resolution of the cam isn't high enough, or if the lens isn't set properly).

Nice!!! Great work as always Pode, you're one big motherf... khm a really good plugin developer and I really like your plugins!

JohnnySheffield : thanks a lot ! It's nice to know that people like my plugins <img src="smileys/smiley2.gif" border="0" align="middle" />.

is it possible to recognise codes from video, I mean if a qr code shows up in the camera the plugin will recognise it without the need of taking a snapshot?

jcberrincha : no, you need to take a screenshot (even if it's in the background).

All the decoders are doing it like that. You can take a snapshot every 0.X seconds, and provide it to the decoder, doing it in the background if you want.

Hi! ^^

I'm building a game (for tablets) and i was really interested in integrating a QR code reader into it.

But i'm having two issues... and im not even sure if you can help me out here!..

The first problem is that the webcam box in your demo shows up black.. i've tried running it locally and the same thing happens... i'm not sure if its a hardware or software issue but... do you have any idea what could be going wrong here? I've got two webcams and they both are connected and work fine (i dont get any request to use the webcam on my browser).

Secondly, I'm not sure if i can run Javascript on a tablet... and i'm not interested in showing the menus or the webcam box... i just want the input.. is Javascript absolutely necessary or can it be run "behind" the front page?

I'm really sorry if my questions are out of line or hard to understand.. i was just hoping that someone could help me out here as i'm kind of lost - and i'd really like to use your work!

Thank you for your time and your work!

ViLa

Note:

I tried running the demo on IExplorer (i was on Firefox - where nothing happened) but i get the following error message:

avascript Error!

'qrcode' isn't defined

http://localhost:50000/Pode_QRDecodeplugin.js, line 50 (col undefined)

This is either a bug in Construct 2 or a problem in a third party plugin or behavior - please report it to the developer!

<img src="smileys/smiley19.gif" border="0" align="middle" />

p.s.: i've re-checked: the webcams are fully operational - so its not a hardware issue!

vila4480 : is your browser recent enough to use getUSerMedia() to access the webcam ?

And by the way, you won't be able to access the webcam on a tablet this way, it's not allowed by the browser.

vila4480 : is your browser recent enough to use getUSerMedia() to access the webcam ?

And by the way, you won't be able to access the webcam on a tablet this way, it's not allowed by the browser.

Yeah i think so... i tried:

-Firefox 19.0.2 (oops its updating now!)

-IE 9.0.8112.16421 64bit

-Chrome 26.0.1410.43 m (latest)

Nevertheless i really need something like this on a tablet - do you think any other solution might be available?

Also, i tried compiling every info on barcodes on this post.

Kyatric mentioned your solution!

Sorry for bothering and thank you for your efforts!

(im sorry i cant edit the previous post due to a small bug in the forums! - ill report it)

EDIT: it works on Firefox version 20.0!

On a tablet, the only solution to access the video feed as you want in JS is to use a wrapper like PhoneGap, Titanium and the like...

Great! I'm going to try that Pode, thank you! <img src="smileys/smiley1.gif" border="0" align="middle" />

I tried the demo on a Samsung SIII Mini, using Chrome, and the scanning window shows up black - it does not use the camera. Android version 4.1.2.

I Also tried it on my desktop, running chrome, and the scan area also shows up black (i.e. it cant talk to my web cam).