{% trans_default_domain 'FOSUserBundle' %}

<!-- form as modal panel -->
<div class="modal fade bs-example-modal-lg"
     id="new-user-modal"
     tabindex="-1"
     role="dialog"
     aria-labelledby="myModalLabel"
     aria-hidden="true">
    <div class="modal-dialog">
        <div class="modal-content">
            <div class="modal-header">
                <button type="button" class="close" data-dismiss="modal">
                    <span aria-hidden="true">&times;</span>
                    <span class="sr-only">Cancel</span>
                </button>
                <p class="modal-title"
                   style="font-size: 2.5vmin; font-weight: bold;">New User</p>
            </div>
            <div class="modal-body">
                <div class="container-fluid"
                     style="padding: 0px;">
                    {% form_theme new_user_form _self %}
                    <form id="new-user-form"
                          action="{{ path('vgm_user_create') }}"
                          method="POST" {{ form_enctype(new_user_form) }} class="fos_user_group_new">
                        <div class="container-fluid">
                            <div class="col-lg-5">
                                <div class="col-lg-12">
                                    {{ form_widget(new_user_form.email, { 'attr': {
                                    'tabindex' : 1,
                                    'class': 'input-control',
                                    'placeholder': 'E-mail'} }) }}
                                </div>
                                <div class="col-lg-12" style="margin-top: 10px;">
                                    {{ form_widget(new_user_form.username, { 'attr': {
                                    'tabindex' : 2,
                                    'class': 'input-control',
                                    'placeholder': 'Username'} }) }}
                                </div>
                                <div class="col-lg-12" style="margin-top: 10px;">
                                    {{ form_widget(new_user_form.worker, { 'attr': {
                                    'tabindex' : 3,
                                    'class': 'input-control',
                                    'placeholder': 'Username'} }) }}
                                </div>
                                <div class="col-lg-12" style="margin-top: 10px;">
                                    {{ form_widget(new_user_form.plainPassword.first, { 'attr': {
                                    'tabindex' : 4,
                                    'class': 'input-control',
                                    'placeholder': 'Password'} }) }}
                                </div>
                                <div class="col-lg-12" style="margin-top: 10px;">
                                    {{ form_widget(new_user_form.plainPassword.second, { 'attr': {
                                    'tabindex' : 5,
                                    'class': 'input-control',
                                    'placeholder': 'Confirm password'} }) }}
                                </div>
                            </div>
                            <div class="col-xs-1"></div>
                            <div class="col-lg-6">
                                <div><strong>Access Groups</strong></div>
                                {% for group in new_user_form.groups %}
                                    <div>{{ form_widget(group, { 'attr': {
                                        'tabindex' : loop.index + 5 } }) }}
                                    {{ form_label(group) }}</div>
                                {% endfor %}
                                {{ form_rest(new_user_form) }}
                            </div>

                        </div>
                    </form>
                </div>
            </div>
            <div class="modal-footer">
                <button form="new-user-form" id="new-group-modal-create-button"
                        type="submit" class="btn btn-primary">
                    Create user
                </button>
                <button id="new-group-modal-cancel-button"
                        type="button"
                        class="btn btn-warning"
                        data-dismiss="modal">
                    Cancel
                </button>
            </div>
        </div>
    </div>
</div>