Add Scan QR code from clipboard

[raffifu]

this PR close #2

The idea is to use paste event and then grab the files object from event.clipboardData

[praesentia.js]
....
const target = document.querySelector('body');

target.addEventListener('paste', (event) => {
    let paste = event.clipboardData || window.clipboardData;

    if(paste.files.length > 0) {
        html5QrcodeScanner.html5Qrcode.scanFile(paste.files[0], true)
        .then(decodedText => {
            processingDecodedText(decodedText)
        })
        .catch(err => {
            swal.fire('Error', 'Cannot read QR Code, Please make sure paste only the QR Code', 'error');
        });
    }
});
....

When the file object exist, call method scanFile from class html5Qrcode. it will return decodedText if successful and when fail will call swal.fire

CAUTION

html5Qrcode instance is private field from html5QrcodeScanner see this file on line (87). the problem can be solved by creating html5Qrcode directly (use Pro Mode as it says on the documentation)

For demo visit this link

[ttycelery]

Thank you for your PR. I really appreciate that.

Apologies, I messed up with the review. Haven't reviewed a pull request. I believe this is my first time. This PR is ready to merge, but I am still unsure about whether or not to use jQuery. I think it should be consistent. What do you think?

[raffifu]

I think so, this project can be developed further. So, the code must be consistent. I will fix that in the next commit

[ttycelery]

Thanks. I will merge after that commit.

[raffifu]

74a669f Now this PR follow jQuery format

[praesentia.js]
....
$('body').on('paste', event => {
    let paste = event.originalEvent.clipboardData || window.clipboardData;

    if(paste.files.length > 0) {
        html5QrcodeScanner.html5Qrcode.scanFile(paste.files[0], true)
        .then(decodedText => {
            processDecodedText(decodedText)
        })
        .catch(err => {
            swal.fire('Error', 'Cannot read QR code. Please make sure to only paste a QR code image.', 'error');
        });
    }

    event.preventDefault()
});
....

I also added event.preventDefault() as said on this page

[ttycelery]

I have just tested it and it worked really well just as expected. Before merging, let me just add a little label to the interface, so users can notice this feature.

[ttycelery]

Fixes: #2

[ttycelery]

Thanks, @raffifu.