{% load i18n %}
{% load static %}

{% if form.non_field_errors %}
<div class="block">
    <p class="notification is-danger">{{ form.non_field_errors }}</p>
</div>
{% endif %}

{% csrf_token %}

<input type="hidden" name="last_edited_by" value="{{ request.user.id }}">
<input type="hidden" name="parent_work" value="{% firstof book.parent_work.id form.parent_work %}">

<div class="columns">
    <div class="column is-half">
        <section class="block">
            <h2 class="title is-4">
                {% trans "Metadata" %}
            </h2>
            <div class="box">
                <div class="field">
                    <label class="label" for="id_title">
                        {% trans "Title:" %}
                    </label>
                    <input type="text" name="title" value="{{ form.title.value|default:'' }}" maxlength="255" class="input" required="" id="id_title" aria-describedby="desc_title">

                    {% include 'snippets/form_errors.html' with errors_list=form.title.errors id="desc_title" %}
                </div>

                <div class="field">
                    <label class="label" for="id_subtitle">
                        {% trans "Subtitle:" %}
                    </label>
                    <input type="text" name="subtitle" value="{{ form.subtitle.value|default:'' }}" maxlength="255" class="input" id="id_subtitle" aria-describedby="desc_subtitle">

                    {% include 'snippets/form_errors.html' with errors_list=form.subtitle.errors id="desc_subtitle" %}
                </div>

                <div class="field">
                    <label class="label" for="id_description">
                        {% trans "Description:" %}
                    </label>
                    {{ form.description }}

                    {% include 'snippets/form_errors.html' with errors_list=form.description.errors id="desc_description" %}
                </div>

                <div class="columns">
                    <div class="column is-two-thirds">
                        <div class="field">
                            <label class="label" for="id_series">
                                {% trans "Series:" %}
                            </label>
                            <input type="text" class="input" name="series" id="id_series" value="{{ form.series.value|default:'' }}" aria-describedby="desc_series">

                            {% include 'snippets/form_errors.html' with errors_list=form.series.errors id="desc_series" %}
                        </div>
                    </div>
                    <div class="column is-one-third">
                        <div class="field">
                            <label class="label" for="id_series_number">
                                {% trans "Series number:" %}
                            </label>
                            {{ form.series_number }}

                            {% include 'snippets/form_errors.html' with errors_list=form.series_number.errors id="desc_series_number" %}
                        </div>
                    </div>
                </div>

                <div class="field">
                    <label class="label" for="id_languages">
                        {% trans "Languages:" %}
                    </label>
                    {{ form.languages }}
                    <span class="help" id="desc_languages_help">
                        {% trans "Separate multiple values with commas." %}
                    </span>

                    {% include 'snippets/form_errors.html' with errors_list=form.languages.errors id="desc_languages" %}
                </div>

                <div class="field">
                    <label class="label" for="id_add_subjects">
                        {% trans "Subjects:" %}
                    </label>
                    {% for subject in book.subjects %}
                    <label class="label is-sr-only" for="id_add_subject={% if not forloop.first %}-{{forloop.counter}}{% endif %}">
                        {% trans "Add subject" %}
                    </label>
                    <div class="field has-addons" id="subject_field_wrapper_{{ forloop.counter }}">
                        <div class="control is-expanded">
                            <input
                                id="id_add_subject-{{ forloop.counter }}"
                                type="text"
                                name="subjects"
                                value="{{ subject }}"
                                class="input"
                            >
                        </div>
                        <div class="control">
                            <button
                                class="button is-danger is-light"
                                type="button"
                                data-remove="subject_field_wrapper_{{ forloop.counter }}"
                            >
                                {% trans "Remove subject" as text %}
                                <span class="icon icon-x" title="{{ text }}">
                                    <span class="is-sr-only">{{ text }}</span>
                                </span>
                            </button>
                        </div>
                    </div>
                    {% endfor %}
                    <input
                        class="input"
                        type="text"
                        name="subjects"
                        id="id_add_subject"
                        value="{{ subject }}"
                        {% if confirm_mode %}readonly{% endif %}
                    >

                    {% include 'snippets/form_errors.html' with errors_list=form.subjects.errors id="desc_subjects" %}
                </div>

                <span class="help">
                    <button class="button is-small" type="button" data-duplicate="id_add_subject" id="another_subject_field">
                        <span class="icon icon-plus" aria-hidden="true"></span>
                        <span>{% trans "Add Another Subject" %}</span>
                    </button>
                </span>
            </div>
        </section>

        <section class="block">
            <h2 class="title is-4">
                {% trans "Publication" %}
            </h2>
            <div class="box">
                <div class="field">
                    <label class="label" for="id_publishers">
                        {% trans "Publisher:" %}
                    </label>
                    {{ form.publishers }}
                    <span class="help" id="desc_publishers_help">
                        {% trans "Separate multiple values with commas." %}
                    </span>

                    {% include 'snippets/form_errors.html' with errors_list=form.publishers.errors id="desc_publishers" %}
                </div>

                <div class="field">
                    <label class="label" for="id_first_published_date">
                        {% trans "First published date:" %}
                    </label>
                    {{ form.first_published_date }}
                    {% include 'snippets/form_errors.html' with errors_list=form.first_published_date.errors id="desc_first_published_date" %}
                </div>

                <div class="field">
                    <label class="label" for="id_published_date">
                        {% trans "Published date:" %}
                    </label>
                    {{ form.published_date }}

                    {% include 'snippets/form_errors.html' with errors_list=form.published_date.errors id="desc_published_date" %}
                </div>
            </div>
        </section>

        <section class="block">
            <h2 class="title is-4">
                {% trans "Authors" %}
            </h2>
            <div class="box">
                {% if book.authors.exists %}
                {# preserve authors if the book is unsaved #}
                <input type="hidden" name="authors" value="{% for author in book.authors.all %}{{ author.id }},{% endfor %}">
                <fieldset>
                    {% for author in book.authors.all %}
                    <div class="is-flex is-justify-content-space-between">
                        <label class="label mb-2">
                            <input type="checkbox" name="remove_authors" value="{{ author.id }}" {% if author.id|stringformat:"i" in remove_authors %}checked{% endif %} aria-describedby="desc_remove_author_{{author.id}}">
                            {% blocktrans with name=author.name %}Remove {{ name }}{% endblocktrans %}
                        </label>
                        <p class="help" id="desc_remove_author_{{author.id}}">
                            <a href="{{ author.local_path }}">{% blocktrans with name=author.name %}Author page for {{ name }}{% endblocktrans %}</a>
                        </p>
                    </div>
                    {% endfor %}
                </fieldset>
                {% endif %}
                <div class="field">
                    <label class="label" for="id_add_author">
                        {% trans "Add Authors:" %}
                    </label>
                    {% for author in add_author %}
                    <label class="label is-sr-only" for="id_add_author{% if not forloop.first %}-{{forloop.counter}}{% endif %}">{% trans "Add Author" %}</label>
                    <input class="input" type="text" name="add_author" id="id_add_author{% if not forloop.first %}-{{forloop.counter}}{% endif %}" placeholder="{% trans 'Jane Doe' %}" value="{{ author }}" {% if confirm_mode %}readonly{% endif %}>
                    {% empty %}
                    <label class="label is-sr-only" for="id_add_author">{% trans "Add Author" %}</label>
                    <input class="input" type="text" name="add_author" id="id_add_author" placeholder="{% trans 'Jane Doe' %}" value="{{ author }}" {% if confirm_mode %}readonly{% endif %}>
                    {% endfor %}
                </div>
                <span class="help">
                    <button class="button is-small" type="button" data-duplicate="id_add_author" id="another_author_field">
                        <span class="icon icon-plus" aria-hidden="true"></span>
                        <span>{% trans "Add Another Author" %}</span>
                    </button>
                </span>
            </div>
        </section>
    </div>

    <div class="column is-half">
        <section class="block">
            <h2 class="title is-4">
                {% trans "Cover" %}
            </h2>
            <div class="box">
                <div class="columns">
                    {% if book.cover %}
                    <div class="column is-3 is-cover">
                        {% include 'snippets/book_cover.html' with book=book cover_class='is-h-xl-mobile is-w-auto-tablet' size_mobile='xlarge' size='large' %}
                    </div>
                    {% endif %}

                    <div class="column">
                        <div class="field">
                            <label class="label" for="id_cover">
                                {% trans "Upload cover:" %}
                            </label>
                            {{ form.cover }}
                        </div>
                        <div class="field">
                            <label class="label" for="id_cover_url">
                                {% trans "Load cover from url:" %}
                            </label>
                            <input class="input" name="cover-url" id="id_cover_url" type="url" value="{{ cover_url|default:'' }}" aria-describedby="desc_cover">
                        </div>

                        {% include 'snippets/form_errors.html' with errors_list=form.cover.errors id="desc_cover" %}
                    </div>
                </div>
            </div>
        </section>

        <section class="block">
            <h2 class="title is-4">
                {% trans "Physical Properties" %}
            </h2>
            <div class="box">
                <div class="columns">
                    <div class="column is-one-third">
                        <div class="field">
                            <label class="label" for="id_physical_format">
                                {% trans "Format:" %}
                            </label>
                            {{ form.physical_format }}

                            {% include 'snippets/form_errors.html' with errors_list=form.physical_format.errors id="desc_physical_format" %}
                        </div>
                    </div>
                    <div class="column">
                        <div class="field">
                            <label class="label" for="id_physical_format_detail">
                                {% trans "Format details:" %}
                            </label>
                            {{ form.physical_format_detail }}

                            {% include 'snippets/form_errors.html' with errors_list=form.physical_format_detail.errors id="desc_physical_format_detail" %}
                        </div>
                    </div>
                </div>

                <div class="field">
                    <label class="label" for="id_pages">
                        {% trans "Pages:" %}
                    </label>
                    {{ form.pages }}

                    {% include 'snippets/form_errors.html' with errors_list=form.pages.errors id="desc_pages" %}
                </div>
            </div>
        </section>

        <section class="block">
            <h2 class="title is-4">
                {% trans "Book Identifiers" %}
            </h2>
            <div class="box">
                <div class="field">
                    <label class="label" for="id_isbn_13">
                        {% trans "ISBN 13:" %}
                    </label>
                    {{ form.isbn_13 }}

                    {% include 'snippets/form_errors.html' with errors_list=form.isbn_13.errors id="desc_isbn_13" %}
                </div>

                <div class="field">
                    <label class="label" for="id_isbn_10">
                        {% trans "ISBN 10:" %}
                    </label>
                    {{ form.isbn_10 }}

                    {% include 'snippets/form_errors.html' with errors_list=form.isbn_10.errors id="desc_isbn_10" %}
                </div>

                <div class="field">
                    <label class="label" for="id_openlibrary_key">
                        {% trans "Openlibrary ID:" %}
                    </label>
                    {{ form.openlibrary_key }}

                    {% include 'snippets/form_errors.html' with errors_list=form.openlibrary_key.errors id="desc_openlibrary_key" %}
                </div>

                <div class="field">
                    <label class="label" for="id_inventaire_id">
                        {% trans "Inventaire ID:" %}
                    </label>
                    {{ form.inventaire_id }}

                    {% include 'snippets/form_errors.html' with errors_list=form.inventaire_id.errors id="desc_inventaire_id" %}
                </div>

                <div class="field">
                    <label class="label" for="id_oclc_number">
                        {% trans "OCLC Number:" %}
                    </label>
                    {{ form.oclc_number }}

                    {% include 'snippets/form_errors.html' with errors_list=form.oclc_number.errors id="desc_oclc_number" %}
                </div>

                <div class="field">
                    <label class="label" for="id_asin">
                        {% trans "ASIN:" %}
                    </label>
                    {{ form.asin }}

                    {% include 'snippets/form_errors.html' with errors_list=form.ASIN.errors id="desc_ASIN" %}
                </div>
            </div>
        </section>
    </div>
</div>

{% block scripts %}
<script src="{% static "js/forms.js" %}"></script>
{% endblock %}