{% extends 'manuels/add_item.html' %}

{% load bootstrap4 %}
{% load static %}

{% block form %}
    <div class="form-row">
        <div class="col-lg-6">
            {% if form.levels %}
                {% bootstrap_field form.levels %}
            {% elif form.level %}
                {% bootstrap_field form.level %}
            {% endif %}
        </div>
        <div class="col-lg-6">
            {% bootstrap_field form.teacher %}
            {% bootstrap_field form.field %}
        </div>
    </div>
    <div class="form-row">
        <div class="col-lg-6">
            <div class="custom-control custom-checkbox">
                <input type="checkbox" class="custom-control-input" id="{{ form.no_book.auto_id }}">
                <label class="custom-control-label" for="{{ form.no_book.auto_id }}">{{ form.no_book.label }}</label>
                <small class="form-text text-muted">
                    {{ form.no_book.help_text|safe }}
                </small>
            </div>
        </div>
        <div class="col-lg-6">
            <div class="custom-control custom-checkbox">
                <input type="checkbox" class="custom-control-input" id="{{ form.see_later.auto_id }}">
                <label class="custom-control-label"
                       for="{{ form.see_later.auto_id }}">{{ form.see_later.label }}</label>
                <small class="form-text text-muted">
                    {{ form.see_later.help_text|safe }}
                </small>
            </div>
        </div>
    </div>
    <div class="form-row">
        <div class="col-12">
            <div class="form-group">
                {% bootstrap_label content=form.isbn.label label_for=form.isbn.auto_id %}
                <div class="input-group">
                    <input name="{{ form.isbn.name }}" maxlength="20"
                           class="form-control"
                           placeholder="{{ form.isbn.label }}"
                           {% if form.isbn.value != None %} value="{{ form.isbn.value|stringformat:'s' }}"{% endif %}
                           required="" id="{{ form.isbn.auto_id }}" type="text">
                    <div class="input-group-append">
                        <button class="btn btn-primary" type="button" id="id_isbn_button" data-toggle="tooltip" data-placement="top" title="Chercher avec Decitre">
                            <i class="fas fa-search"></i> <i class="fas fa-spinner fa-spin" id="id_isbn_spinner" hidden></i>
                            Remplir les champs suivants avec Decitre
                        </button>
                    </div>
                </div>
                <div class="invalid-feedback" id="id_isbn_invalid_feedback">
                </div>
                <small class="form-text text-muted">
                    {{ form.isbn.help_text|safe }}
                </small>
            </div>
        </div>
    </div>
    <div class="form-row">
        <div class="col-lg-4">
            {% bootstrap_field form.title %}
            {% bootstrap_field form.authors %}
        </div>
        <div class="col-lg-4">
            {% bootstrap_field form.publication_year %}
            {% bootstrap_field form.price %}
        </div>
        <div class="col-lg-4">
            {% bootstrap_field form.editor %}
            {% bootstrap_field form.other_editor %}
        </div>
    </div>
    <div class="form-row">
        <div class="col-lg-6 col-12">
            {% bootstrap_field form.previously_acquired %}
        </div>
        <div class="col-lg-6 col-12">
            {% bootstrap_field form.consumable %}
        </div>
    </div>
    <div class="form-row">
        <div class="col-12">
            {% bootstrap_field form.comments %}
        </div>
    </div>
    {% if form.add_another %}
        <div class="form-row">
            <div class="col-12">
                <div class="custom-control custom-checkbox">
                    <input type="checkbox" class="custom-control-input"
                           {% if form.add_another.initial %}checked="checked"{% endif %}
                           name="{{ form.add_another.name }}"
                           id="{{ form.add_another.auto_id }}">
                    <label class="custom-control-label"
                           for="{{ form.add_another.auto_id }}">{{ form.add_another.label }}</label>
                    <small class="form-text text-muted">
                        {{ form.add_another.help_text|safe }}
                    </small>
                </div>
            </div>
        </div>
    {% endif %}
{% endblock %}

{% block end_js %}
    <script defer src="{% static 'manuels/no_book.js' %}"></script>
    <script defer src="{% static 'manuels/fetch-isbn.js' %}"></script>
{% endblock %}