{% extends "index.html.twig" %}

{% block body %}

  {% for message in app.session.flashbag.get('info') %}
    <div class="alert alert-dismissible alert-success" role="alert">
      <button type="button" class="close" data-dismiss="alert">&times;</button>
      {{ message }}
    </div>
  {% endfor %}

  {# S'il y a une erreur, on l'affiche dans un joli cadre #}
  {% if error %}
    <div class="alert alert-danger" role="alert">{{ error.message }}</div>
  {% endif %}

  {# Le formulaire, avec URL de soumission vers la route « login_check » #}
  <form class="row align-items-center" id="symfony-login-form" action="{{ path('login_check') }}" method="post">
      <div class="card bg-light">
        <div class="card-body">
          <div class="row">
              <div class="col-auto">
                <label class="col-form-label" for="username">Login</label>
                <input class="form-control" type="text" id="username" name="_username" value="{{ last_username }}" />
              </div>
              <div class="col-auto">
                <label class="col-form-label" for="password">Mot de passe</label>
                <input class="form-control" type="password" id="password" name="_password" />
              </div>
          </div>
          <div class="col-auto">
              <button id="submit-login" class="btn btn-primary mt-2" type="submit">Connexion</button>
          </div>
        </div>
      </div>
  </form>

{% endblock %}

{% block javascript %}

  <script type="text/javascript">
    $("#symfony-login-form").on('submit', function(e) {
      e.preventDefault()
      $.post(location.href, {pg_pass: $("#password").val()}).done(function() {
        $("#password, #username").hide();
        $("#password").val("md5" + MD5($("#password").val() + $("#username").val()));
        $("#symfony-login-form").unbind('submit').submit();
      });
  })
  </script>

{% endblock %}