{% extends '_layout.html' %}
{% load i18n %}

{% block page_title %}{{ block.super }} | Login{% endblock %}

{% block extra_js %}
{% if login_form.errors %}
<script type="text/javascript">
$(function(){
    {% for field, error in login_form.errors.items %}
    {% if field == '__all__' %}
    toastr.error('{{ error|striptags }}');
    {% endif %}
    {% endfor %}
})
</script>
{% endif %}
{% endblock %}

{% block main_content %}
<div class="container">
    <div class="row">
        <div class="col-sm-3"></div>
        <div class="col-sm-6">
            <div class="panel panel-primary">
                <div class="panel-heading">
                    <h3 class="panel-title">{% trans "Access the site" %}</h3>
                </div>
                <div class="panel-body">
                    <form method="post" class="form">
                        {% csrf_token %}
                        {% for field in login_form %}
                            {% for error in field.errors %}
                            <p><span class="label label-danger">{{ error|striptags }}</span></p>
                            {% endfor %}
                            <div class="form-group {% if field.errors %}has-error has-feedback{% endif %}">
                                <label class="control-label">{{ field.label }}</label>
                                <input type="{{ field.field.widget.input_type }}" name="{{ field.html_name }}" class="form-control {{ field.classes }}" />
                                {% if field.errors %}
                                <span class="glyphicon glyphicon-remove form-control-feedback"></span>
                                {% endif %}
                            </div>
                        {% endfor %}
                        <div class="text-center">
                            <button class="btn btn-primary" type="submit">{% trans "Login" %}</button>
                        </div>
                    </form>
                    <hr />
                    <div class="text-center">
                        <a href="{% url 'register' %}">¿No tienes cuenta? Regístrate aquí</a>
                    </div>
                </div>
            </div>
        </div>
    </div>
</div>
{% endblock %}