Commit 30ce1f43 authored by Aljaž Srebrnič's avatar Aljaž Srebrnič

Add Javascript file for QR code reading

parent 64c12b64
......@@ -130,6 +130,8 @@ USE_TZ = True
STATIC_URL = '/static/'
STATICFILES_FINDERS = (
'django.contrib.staticfiles.finders.FileSystemFinder',
'django.contrib.staticfiles.finders.AppDirectoriesFinder',
'djangobower.finders.BowerFinder',
)
......
......@@ -17,7 +17,8 @@
</style>
<link rel="stylesheet" href="{% static 'css/main.css' %}">
<script src="{% static 'qcode-decoder/build/qcode-decoder.min.js' %}"></script>
{% block head_js %}
{% endblock %}
</head>
<body>
{% include 'menu.html' %}
......
$(function () {
"use strict";
var qr = new QCodeDecoder();
var resultHandler = function (err, result) {
if (err) {
console.log(err.message);
return;
}
$("input#id")[0].value = result;
$("#qr-scan").modal("hide");
};
$("#cameraProcess").click(function(e) {
var input = $("#cameraInput")[0];
if (input.files && input.files[0]) {
var reader = new FileReader();
reader.onload = function (e) {
qr.decodeFromImage(e.target.result, resultHandler);
};
reader.readAsDataURL(input.files[0]);
}
});
$("#qr-scan").on("show.bs.modal", function(){
if (!(qr.isCanvasSupported() && qr.hasGetUserMedia())) {
alert("Your browser doesn\'t match the required specs.");
throw new Error("Canvas and getUserMedia are required");
}
var video = document.querySelector("video");
var reset = document.querySelector("#reset");
// prepare a canvas element that will receive the image to decode, sets
// the callback for the result and then prepares the videoElement to
// send its source to the decoder.
qr.decodeFromCamera(video, resultHandler);
// attach some event handlers to reset and stop whenever we want.
reset.onclick = function () {
qr.decodeFromCamera(video, resultHandler);
};
}).on("hide.bs.modal", function() {
qr.stop();
});
});
{% extends 'main.html' %}
{% load static %}
{% block head_js %}
<script type="text/javascript" src="{% static 'qcode-decoder/build/qcode-decoder.min.js' %}"></script>
<script type="text/javascript" src="{% static 'things/main.js' %}"></script>
{% endblock %}
{% block modal %}
<div class="modal fade" id="qr-scan" tabindex="-1" role="dialog" aria-labelledby="qr-scan-label" aria-hidden="true">
<div class="modal-dialog" role="document">
......
Markdown is supported
0% or
You are about to add 0 people to the discussion. Proceed with caution.
Finish editing this message first!
Please register or to comment