moviewyrm/bookwyrm/templates/search/barcode_modal.html

{% extends 'components/modal.html' %}
{% load i18n %}

{% block modal-title %}
    {% blocktrans %}
        Scan Barcode
    {% endblocktrans %}
{% endblock %}

{% block modal-body %}
    <div id="barcode-scanner" class="block"></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 scanned, searching..." 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 %}