yul/bookwyrm-mastodon
1
1
Fork 0
Code Issues Pull Requests Projects Releases Wiki Activity

Worked more on visuals of modal

Browse Source 
Need to finish camera selection mode.
This commit is contained in:
Vivianne Langdon
2022-02-15 02:38:57 -08:00
parent 5ae4eb9b8f
commit 1e04385f0c
4 changed files with 133 additions and 30 deletions
Download Patch File Download Diff File Expand all files Collapse all files

4
bookwyrm/templates/layout.html
View File

@ -54,7 +54,7 @@
<span class="is-sr-only">{% trans "Search" %}</span>
</span>
</button>
<button class="button" type="button" data-modal-open="barcode_scanner_modal">
<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>
@ -62,7 +62,7 @@
</div>
</div>
</form>
{% include "search/barcode_modal.html" with id="barcode_scanner_modal" %}
{% 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>

32
bookwyrm/templates/search/barcode_modal.html
View File

@ -2,13 +2,37 @@
{% load i18n %}
{% block modal-title %}
{% blocktrans %}
Scan Barcode
{% endblocktrans %}
{% blocktrans %}
Scan Barcode
{% endblocktrans %}
{% endblock %}
{% block modal-body %}
<div id="barcode_scanner"></div>
<div id="barcode-scanner"></div>
<div id="barcode-status" class="block">
<div class="grant-access is-hidden">
<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>
<span class="is-size-5 access-denied is-hidden">{% trans "Could not access camera." %}</span>
<div class="scanning is-hidden">
<div class="select is-small">
<select id="barcode-camera-list">
</select>
</div>
<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="is-size-5">{% trans "ISBN found" context "barcode scanner" %}</span><br/>
<span class="isbn"></span>
</div>
</div>
{% endblock %}
{% block modal-footer %}
<button class="button" type="button" data-modal-close>{% trans "Cancel" %}</button>
{% endblock %}