{% extends "layout2.html" %}
{% load i18n %}
{% load static %}

{% block css_include %}

{% endblock %}

{% block js_include %}

{% endblock %}

{% block content %}
    <section class="content">
        <div class="row">
          <div class="col-md-12">
            <form id="user_edit_form" action="" method="POST" novalidate="novalidate">
                {% csrf_token %}
                <div class="panel">
                    <div class="panel-heading">
                        <h1 class="panel-title"><i class="fa fa-users">&nbsp;</i>{% translate "LDAP Users edition" %}</h1>
                    </div>
                    {# Print form errors correctly #}
                    {% if form.non_field_errors %}
                        <div class="alert alert-danger alert-dismissible">
                            <h4><i class="icon fa fa-ban"></i> {% translate "Form errors" %} </h4>
                            <div class="tab-content no-padding">
                                {{ form.non_field_errors|safe }}
                            </div>
                        </div>
                    {% endif %}
                    <div class="panel-body">
                        <div class="row">
                            <div class="col-md-12">
                                <div class="col-lg-4 col-md-6 col-lg-offset-2">
                                    <div class="form-group">
                                        <label>{{ user_form.username.label }}</label>
                                        {{ user_form.username }}
                                        {% if user_form.username.help_text %}
                                            <small style="color: grey;">{{ user_form.username.help_text }}</small><br/>
                                          {% endif %}
                                        {% if user_form.username.errors %}
                                            <small style="color: red;">{{ user_form.username.errors }}</small>
                                        {% endif %}
                                    </div>
                                    <div class="form-group">
                                        <label>{{ user_form.groups.label }}</label>
                                        {{ user_form.groups }}
                                        {% if user_form.groups.help_text %}
                                            <small style="color: grey;">{{ user_form.groups.help_text }}</small><br/>
                                          {% endif %}
                                        {% if user_form.groups.errors %}
                                            <small style="color: red;">{{ user_form.groups.errors }}</small>
                                        {% endif %}
                                    </div>
                                </div>
                                <div class="col-lg-4 col-md-6">
                                    <div class="form-group">
                                        <div class="col-sm-5">
                                        <label>{{ user_form.is_superuser.label }}</label><br/>
                                        {{ user_form.is_superuser }}
                                        {% if user_form.is_superuser.help_text %}
                                            <small style="color: grey;">{{ user_form.is_superuser.help_text }}</small><br/>
                                          {% endif %}
                                        {% if user_form.is_superuser.errors %}
                                            <small style="color: red;">{{ user_form.is_superuser.errors }}</small>
                                        {% endif %}
                                        </div>
                                        <div class="col-sm-5">
                                        <label>{{ user_form.is_active.label }}</label><br/>
                                        {{ user_form.is_active }}
                                        {% if user_form.is_active.help_text %}
                                            <small style="color: grey;">{{ user_form.is_active.help_text }}</small><br/>
                                        {% endif %}
                                        {% if user_form.is_active.errors %}
                                            <small style="color: red;">{{ user_form.is_active.errors }}</small>
                                        {% endif %}
                                        </div>
                                    </div>
                                </div>
                            </div>
                        </div>
                    </div>
                    <div class="panel-footer">
                        <a href="{% url 'system.users.list' %}" class="btn btn-flat btn-default">{% translate "Cancel" %}</a>
                        <button type="submit" class="btn btn-info btn-flat pull-right">{% translate "Submit" %}</button>
                    </div>
                </div>
            </form>
          </div>
        </div>
    </section>
{% endblock %}

{% block jquery_code %}
    
    $(function(){
        $('.select2').select2();

        var elems = Array.prototype.slice.call(document.querySelectorAll('.js-switch'));
        elems.forEach(function(html) {
          var switchery = new Switchery(html, {
            'color': '#FA9834'
          });
        });
    })

{% endblock %}