{% extends 'base-admin.html.twig' %}



{% block content %}

<div class="clearfix"></div>
            <div class="row">
              <div class="col-md-12 col-sm-12 ">
                <div class="x_panel">
                  <div class="x_title">
                    <h1>Modifier le mot de passe</h1>
                    <div class="clearfix"></div>
                  </div>
                  <div class="x_content">
                    <br />
{% for message in app.flashes('danger')  %}
            <div class="alert alert-danger" role="alert">
              {{ message }}
            </div>
        {% endfor %}
        {% for message in app.flashes('success')  %}
            <div class="alert alert-success" role="alert">
              {{ message }}
            </div>
        {% endfor %}
   {{ form_start(form, { 'attr': {'name':'form','id':'form'} }) }}
    
        {{ form_errors(form.password) }}
    
    {{ form_widget(form.controlPassword, { 'attr': {'class': 'form-control','name':'controlPassword','id':'controlPassword','required':'true', 'placeholder':'Ancien Mot de passe'} }) }}
   <br>
    <div class="form-group">
    <input type="password" id="newPassword" name="newPassword" class="form-contol form-control" placeholder="Nouveau Mot de passe" >
    </div>
   <div id="idPassword">
    {{ form_widget(form.password, { 'attr': {'class': 'controlerPassword','id':'controlPassword','name':'controlPassword', 'placeholder':'Confirmer le mot de passe','value' : ''} }) }}
    </div>
    <br>
        <div id="errorMessageLength" style="display:none">
        <div class="alert alert-danger" role="alert">
            Le mot de passe doit contenir au moins 6 caractères
        </div>
        </div>
        <div id="errorMessage" style="display:none">
        <div class="alert alert-danger" role="alert">
            Les mot de passe sont différents
        </div>
        <div style="display:none">
        {{ form_widget(form) }}
        </div>
    </div>
    <br>
    <button class="btn btn-primary">{{ button_label|default('Modifier') }}</button>
    
{{ form_end(form) }}


    	</div>
                </div>
              </div>
            </div>

{% endblock %}

{% block script %}
    <script type="text/javascript">
   
        $( "#form" ).submit(function( event ) {
          
//alert(document.getElementById("newPassword").value);
  if(document.getElementById("newPassword").value  == document.getElementById("user_password").value ) {


  if(document.getElementById("newPassword").value.length >= 6  )
  {  
    return true;
    
    }
    else{
          
          document.getElementById("errorMessageLength").style.display ='block';
          document.getElementById("errorMessage").style.display ='none';
          return false;
    }
  }
  else {

    document.getElementById("errorMessage").style.display ='block';
    document.getElementById("errorMessageLength").style.display ='none';
   
  
    return false;
  }
        });
    function controlerPassword(){
  //alert(document.getElementById("newPassword").value);
}


</script>

{% endblock %}