{% extends "longs/base.html" %}
<!-- {% load static from static %} -->

{% block css %}
{{form.media}}
{% endblock %}
{% block js %}
<!--<script type="text/javascript" src="/admin/jsi18n/"></script>-->

<script type="text/javascript">
    function showEditPopup(url) {
        var win = window.open(url, "Edit",
            'height=500,width=800,resizable=yes,scrollbars=yes');
        return false;
    }
    function showAddPopup(triggeringLink) {
        var name = triggeringLink.id.replace(/^add_/, '');
        href = triggeringLink.href;
        var win = window.open(href, name, 'height=500,width=800,resizable=yes,scrollbars=yes');
        win.focus();
        return false;
    }
    function closePopup(win, newID, newRepr, id) {
        console.log(id)
        $(id + "_to").append('<option value=' + newID + ' title=' + newRepr + ' >' + newRepr + '</option>')
        win.close();
    }


    function add_input_form() {
        var form_idx = $('#id_Long_series-TOTAL_FORMS').val();
        $('#form_set').append($('#empty_form').html().replace(/__prefix__/g, form_idx));
        $('#id_Long_series-TOTAL_FORMS').val(parseInt(form_idx) + 1);
    }

    $(document).ready(function () {
        $('#add_more').click(() => { add_input_form() });
    })

</script>

<!-- {{ form.media }} -->
{% endblock %}
{% block content %}
<h2>Submit Long Case</h2>
Use this form to create a long case. Existing associated image sets can be added using this form.
<form action="" method="post" enctype="multipart/form-data" id="long-form">
    {% csrf_token %}

    <table>
        {{ form.as_table }}
    </table>
    <h3>Series:</h3>
    Add image sets here. These can only be added once created (they can also be added to cases on creation).
    <input type="button" value="Add More Series" id="add_more">
    <div id="form_set">
        {% for form in series_formset %}
        <ul class="no-error series-formset">
            {{form.non_field_errors}}
            {{form.errors}}
            {{ form.as_ul }}
        </ul>
        {% endfor %}
    </div>
    {{ series_formset.management_form }}
    <input type="submit" class="submit-button" value="Submit" name="submit">
</form>
<div id="empty_form" style="display:none">
    <ul class='no_error series-formset'>
        {{ series_formset.empty_form.as_ul }}
    </ul>
</div>
{% endblock %}