Merge pull request #1976 from viviicat/code-scanning

Add barcode scanning support
This commit is contained in:
Mouse Reeve
2022-03-13 12:26:31 -07:00
committed by GitHub
12 changed files with 269 additions and 1 deletions

View File

@ -56,8 +56,16 @@
</span>
</button>
</div>
<div class="control">
<button class="button" type="button" data-modal-open="barcode-scanner-modal">
<span class="icon icon-barcode" title="{% trans 'Scan Barcode' %}">
<span class="is-sr-only">{% trans "Scan Barcode" %}</span>
</span>
</button>
</div>
</div>
</form>
{% include "search/barcode_modal.html" with id="barcode-scanner-modal" %}
<button type="button" tabindex="0" class="navbar-burger pulldown-menu my-4" data-controls="main_nav" aria-expanded="false">
<i class="icon icon-dots-three-vertical" aria-hidden="true"></i>
@ -266,6 +274,7 @@
<script src="{% static "js/bookwyrm.js" %}?v={{ js_cache }}"></script>
<script src="{% static "js/localstorage.js" %}?v={{ js_cache }}"></script>
<script src="{% static "js/status_cache.js" %}?v={{ js_cache }}"></script>
<script src="{% static "js/vendor/quagga.min.js" %}?v={{ js_cache }}"></script>
{% block scripts %}{% endblock %}

View File

@ -0,0 +1,48 @@
{% extends 'components/modal.html' %}
{% load i18n %}
{% block modal-title %}
{% blocktrans %}
Scan Barcode
{% endblocktrans %}
{% endblock %}
{% block modal-body %}
<div class="block">
<div id="barcode-scanner"></div>
</div>
<div id="barcode-camera-list" class="select is-small">
<select>
</select>
</div>
<div id="barcode-status" class="block">
<div class="grant-access is-hidden">
<span class="icon icon-lock"></span>
<span class="is-size-5">{% trans "Requesting camera..." %}</span></br>
<span>{% trans "Grant access to the camera to scan a book's barcode." %}</span>
</div>
<div class="access-denied is-hidden">
<span class="icon icon-warning"></span>
<span class="is-size-5">Access denied</span><br/>
<span>{% trans "Could not access camera" %}</span>
</div>
<div class="scanning is-hidden">
<span class="icon icon-barcode"></span>
<span class="is-size-5">{% trans "Scanning..." context "barcode scanner" %}</span><br/>
<span>{% trans "Align your book's barcode with the camera." %}</span>
</div>
<div class="found is-hidden">
<span class="icon icon-check"></span>
<span class="is-size-5">{% trans "ISBN scanned" context "barcode scanner" %}</span><br/>
{% trans "Searching for book:" context "followed by ISBN" %} <span class="isbn"></span>...
</div>
</div>
{% endblock %}
{% block modal-footer %}
<button class="button" type="button" data-modal-close>{% trans "Cancel" %}</button>
{% endblock %}