<% include header %>

<!-- tester -->

<script>

'use strict';

// very basic angular app
var app = angular.module('Application', []);
app.controller('Controller', [function () {}]);

</script>

<div class="layout-content">

  <center>
    <h2>Hello <%= user.username %>, set a new password</h2>
  </center>

  <br/>

  <div class="container" ng-app="Application" ng-controller="Controller">
    <div class="row">
      <div class="col-md-6 col-md-offset-3">
        <form action="/api/v1/session/password/reset" method="post" name="resetForm" autocomplete="off" role="form" novalidate>
          <input type="password" style="display: none;">
          <input type="hidden" name="_csrf" value="<%= csrf %>"/>
          <input type="hidden" name="resetToken" value="<%= resetToken %>"/>

          <div class="form-group" ng-class="{ 'has-error': resetForm.password.$dirty && resetForm.password.$invalid }">
            <label class="control-label" for="inputPassword">New Password</label>
            <div class="control-label" ng-show="resetForm.password.$dirty && resetForm.password.$invalid">
              <small ng-show="resetForm.password.$dirty && resetForm.password.$invalid">Password must be 8-30 character with at least one uppercase, one numeric and one special character</small>
            </div>
            <input type="password" class="form-control" id="inputPassword" ng-model="password" name="password" ng-pattern="/^(?=.*\d)(?=.*[a-z])(?=.*[A-Z])(?=.*[^a-zA-Z0-9])(?!.*\s).{8,30}$/" autofocus required>
          </div>
          <div class="form-group" ng-class="{ 'has-error': resetForm.passwordRepeat.$dirty && (password !== passwordRepeat) }">
            <label class="control-label" for="inputPasswordRepeat">Repeat Password</label>
            <div class="control-label" ng-show="resetForm.passwordRepeat.$dirty && (password !== passwordRepeat)">
              <small ng-show="resetForm.passwordRepeat.$dirty && (password !== passwordRepeat)">Passwords don't match</small>
            </div>
            <input type="password" class="form-control" id="inputPasswordRepeat" ng-model="passwordRepeat" name="passwordRepeat" required>
          </div>
          <input class="btn btn-primary btn-outline pull-right" type="submit" value="Create" ng-disabled="resetForm.$invalid || password !== passwordRepeat"/>
        </form>
      </div>
    </div>
  </div>
</div>

<% include footer %>
