lowry/tmpl/password.html

{{template "header.html"}}
{{template "navbar.html" .}}


    <div class="container">
      <br />
{{if eq .Data "PassChanged"}}
      <h1 class="row justify-content-center">La contraseña se ha actualizado.</h1>
{{else}}
      <h1 class="row justify-content-center">Cambio de contraseña</h1>

      <br />

      <div class="row justify-content-center">
        <form class="col-sm-4" id="needs-validation" action="/password/" method="post" novalidate>
          <div class="form-group">
            <label for="oldpass">Contraseña actual:</label>
            <input type="password" class="form-control {{if eq .Data "WrongOldpass"}}is-invalid{{end}}" id="oldpass" name="oldpass" placeholder="Contraseña">
               {{if eq .Data "WrongOldpass"}}<div class="invalid-feedback">Contraseña incorrecta.</div>{{end}}
          </div>
          <div class="form-group">
            <label for="password">Nueva contraseña:</label>
            <input type="password" class="form-control {{if eq .Data "SameOldPass"}}is-invalid{{end}}" id="password" name="password" placeholder="Contraseña">
               {{ if eq .Data "SameOldPass"}}<div class="invalid-feedback">Cuando dec&iacute;amos "cambiarla" nos refer&iacute;amos a... cambiarla ;)</div>{{end}}
	    <div class="progress">
		<div id="StrengthProgressBar" class="progress-bar"></div>
	    </div>
          </div>
          <div class="form-group">
            <label for="password2">Repite la contraseña nueva:</label>
            <input type="password" class="form-control {{if eq .Data "WrongPass"}}is-invalid{{end}}" id="password2" name="password2" placeholder="Contraseña">
            <div class="invalid-feedback">No ha introducido la misma contraseña.</div>
          </div>
          <button type="submit" class="btn btn-primary">Cambiar</button>
        </form>
      </div>
{{end}}
    </div>

<script>
(function() {
  "use strict";
  window.addEventListener("load", function() {
    var form = document.getElementById("needs-validation");
    form.addEventListener("submit", function(event) {
      if (form.password.value !== form.password2.value) {
        event.preventDefault();
        event.stopPropagation();
      }
      form.classList.add("was-validated");
    }, false);
  }, false);
}());

window.onload = function() {
  $(document).ready(function() {
    $("#StrengthProgressBar").zxcvbnProgressBar({
                              passwordInput: "#password",
			      ratings: ["Muy d&eacute;bil", "D&eacute;bil", "OK", "Fuerte", "Muy buena!"]
                              });
  });
}
</script>

{{template "footer.html"}}