{% extends request.is_ajax|yesno:'bajax.html,base.html' %}
{% load globaltags i18n static %}

{% block breadcrumb %}
    <ol class="breadcrumb">
        <li><span class="glyphicon glyphicon-home"></span></li>
        <li><a href="{% url 'acc_app:accounts_list' %}">{% trans 'Administrators' %}</a></li>
        <li class="active">{% trans 'Add' %}</li>
    </ol>
{% endblock %}

{% block main %}
    <div class="panel panel-default">
        <div class="panel-heading">
            <h3 class="panel-title">{% trans 'Create new account' %}</h3>
        </div>
        <div class="panel-body">
            <div class="row">
                <div class="col-sm-3">
                    <div class="thumbnail">
                        <img alt="Avatar" src="{% static 'img/user_ava.gif' %}"/>

                        <div class="caption">
                            <input type="file" name="avatar"/>
                        </div>
                    </div>
                </div>
                <div class="col-sm-9">

                    <form role="form" action="{% url 'acc_app:create_profile' %}" method="post">{% csrf_token %}
                        <div class="form-group">
                            <label for="login">{% trans 'Username' %}</label>

                            <div class="input-group">
                                <span class="input-group-addon"><span class="glyphicon glyphicon-user"></span></span>
                                <input id="login" type="text" name="username" placeholder="{% trans 'Username' %}" required
                                       value="{{ newuser.username }}" class="form-control">
                            </div>
                        </div>
                        <div class="form-group">
                            <label for="fio">{% trans 'Fullname' %}</label>

                            <div class="input-group">
                                <span class="input-group-addon"><span
                                        class="glyphicon glyphicon-folder-close"></span></span>
                                <input id="fio" type="text" name="fio" placeholder="{% trans 'Fullname' %}" value="{{ newuser.fio }}"
                                       class="form-control">
                            </div>
                        </div>
                        <div class="form-group">
                            <label for="mail">{% trans 'EMail' %}</label>

                            <div class="input-group">
                                <span class="input-group-addon"><span
                                        class="glyphicon glyphicon-envelope"></span></span>
                                <input id='mail' type="text" name="email" placeholder="Email"
                                       value="{{ newuser.email }}" class="form-control">
                            </div>
                        </div>
                        <div class="form-group">
                            <label for="tel">{% trans 'Telephone' %}</label>

                            <div class="input-group">
                                <span class="input-group-addon"><span class="glyphicon glyphicon-phone"></span></span>
                                <input id="tel" type="tel" pattern="{% global_var 'TELEPHONE_REGEXP' %}" name="telephone"
                                       placeholder="{% trans '+[7,8,9,3] and 10,11 digits' %}" value="{{ newuser.telephone }}"
                                       class="form-control" required>
                            </div>
                        </div>
                        <div class="form-group">
                            <label for="passw1">{% trans 'Type password' %}</label>

                            <div class="input-group">
                                <span class="input-group-addon"><span class="glyphicon glyphicon-lock"></span></span>
                                <input id="passw1" type="password" name="passwd" required class="form-control">
                            </div>
                        </div>
                        <div class="form-group">
                            <label for="passw2">{% trans 'Repeat password' %}</label>

                            <div class="input-group">
                                <span class="input-group-addon"><span class="glyphicon glyphicon-lock"></span></span>
                                <input id="passw2" type="password" name="conpasswd" required class="form-control">
                            </div>
                        </div>
                        <div class="btn-group">
                            <button type="submit" class="btn btn-primary">
                                <span class="glyphicon glyphicon-floppy-disk"></span> {% trans 'Save' %}
                            </button>
                            <button type="reset" class="btn btn-default">
                                <span class="glyphicon glyphicon-remove"></span> {% trans 'Reset' %}
                            </button>
                        </div>
                    </form>
                </div>
            </div>
        </div>
    </div>
{% endblock %}