{% extends "base.html" %}
{% load i18n %}

{% block subtitle %}
    {% if editing_user %}
        {% trans 'Edit user' %} "{{ editing_user }}"
    {% else %}
        {% trans 'Add user' %}
    {% endif %}
{% endblock %}

{% block actions %}
    <a class="btn btn-primary" href="{% url 'accounts:user-list' %}">
        {% trans 'Back' %}
    </a>
{% endblock %}

{% block main %}
    <form action="" method="post" id="edit-user-form">{% csrf_token %}
        <div class="panel panel-default">
            <table class="table table-bordered">
                {% include 'extras/form.html' %}
            </table>
            <div class="panel-footer clearfix">
                <div class="pull-right">
                    <input class="btn btn-default" type="submit" value="{% trans 'Save and add another' %}" name="_addanother"/>
                    <input class="btn btn-primary" type="submit" value="{% trans 'Save' %}" name="_save"/>
                </div>
            </div>
        </div>
        <script type="text/javascript">
            $(function(){
                {% comment %}
                We don't want the form to be submitted twice. So we add a flag on the form and
                mark all fields and buttons as "disabled".
                {% endcomment %}
                var $form = $('#edit-user-form');
                $form.submit(function(event) {
                    {#  The form is marked as disabled because it was already submitted, we stop. #}
                    if ($form.data('disabled')) {
                        event.preventDefault();
                        event.stopPropagation();
                        return false;
                    }
                    {# Disabled input won't be sent, so just set them readonly. #}
                    {# Don't need to save selectors here as this won't be called more than once. #}
                    $form.find(':input').prop('readonly', true).addClass('disabled');
                    {# Avoid further submits by setting a flag #}
                    $form.data('disabled', true);
                });
            });
        </script>
    </form>
{% endblock %}