{% extends '::layout.html.twig' %}

{% block content_class 'user edit-profile' %}
    {% block content -%}
        <style>
            .row-actions
            {
                margin-left: 0px;
            }
        </style>
        {{ form_start(edit_form,{'attr':{'class':'pt-30'}}) }}
        <div class="edit-form">
            <div class="row">
                <div class="col-xs-12">
                    <div class="col-xs-6">
                        {{form_label(edit_form.password.first,'bsh.user.new.password'|trans({},"USBSHBundle"),{'label_attr':{'class':'text-left'}} )}}
                    </div>
                    <div class="col-xs-6">
                        {{form_label(edit_form.password.second,'bsh.user.repeat.password'|trans({},"USBSHBundle"),{'label_attr':{'class':'text-left'}} )}}
                    </div>
                </div>
            </div>
            <div class="row">
                <div class="col-xs-12">
                    
                    <div class="col-xs-6">
                        {{form_widget(edit_form.password.first)}}
                        <p class="error" style="color:red;"></p>
                    </div>
                    
                    <div class="col-xs-6">
                        {{form_widget(edit_form.password.second)}}
                    </div>
                </div>
            </div>
            <div class="col-xs-12">
                {{form_widget(edit_form.submit, {'attr':{'class':'save-form'}})}}
            </div>
            <div class="clearfix"></div>
        </div>
        {{ form_end(edit_form) }}
    
        <script>
            //Validación de password
            $(".pt-30").submit(function( event ) {
                var val1 = $( "#us_userbundle_user_password_password_first" ).val();
                var val2 = $( "#us_userbundle_user_password_password_second" ).val();
                if(val1 !== val2){
                    $(".error").text('{{'bsh.user.wrong.password'|trans({},"USBSHBundle")}}');
                    event.preventDefault();
                }
            });
        </script>
     
    {% endblock %}