<div>
  <!-- without a token, we offer for them to generate one. -->
  <form name="requestLink" crm-ui-id-scope
    ng-if="!$ctrl.formSubmitted && !$ctrl.token">

    <h1>Request Password Reset Link</h1>

    <div class="input-wrapper">
      <label crm-ui-for="identifier">{{ts('Enter the username or email on your account')}}</label>
      <input
          crm-ui-id="identifier"
          name="identifier"
          ng-model="$ctrl.identifier"
          class="crm-form-text form-control"
          type=text
          />
    </div>

    <button class=crm-button ng-click="$ctrl.sendPasswordReset()" >{{ts('Send Password Reset')}}</button>
  </form>

  <div ng-if="$ctrl.resetSuccessfullySubmitted" class="help" >
    <p>{{ts('Thanks. If your username/email matched an active account, we will email you with a special link to provide a new password.')}}</p>
    <p>{{ts('The link must be used within an hour, and can only be used once.')}}</p>
  </div>

  <div ng-if="$ctrl.busy" >{{$ctrl.busy}}</div>

  <!-- without a token, we offer for them to generate one. -->
  <form ng-if="$ctrl.token && $ctrl.token !== 'invalid' && !$ctrl.formSubmitted" name="resetPassword" crm-ui-id-scope >
    <h1>Reset Password</h1>

    <div class="input-wrapper">
      <label crm-ui-for="newPassword">{{ts('Enter a new password')}}</label>
      <input
          crm-ui-id="newPassword"
          name="newPassword"
          ng-model="$ctrl.newPassword"
          class="crm-form-text form-control"
          type=password
          />
    </div>
    <div class="input-wrapper">
      <label crm-ui-for="newPasswordAgain">{{ts('Re-enter new password')}}</label>
      <input
          crm-ui-id="newPasswordAgain"
          name="newPasswordAgain"
          ng-model="$ctrl.newPasswordAgain"
          class="crm-form-text form-control"
          type=password
          />
      <span class="crm-error" ng-show="$ctrl.newPasswordAgain && $ctrl.newPassword && $ctrl.newPassword !== $ctrl.newPasswordAgain">
          {{ts('Passwords do not match')}}
      </span>
    </div>

    <button class=crm-button ng-click="$event.preventDefault();$ctrl.attemptChange()" ng-disabled="$ctrl.formSubmitted">{{ts('Change Password')}}</button>
  </form>

  <div ng-if="$ctrl.token === 'invalid'" >
    <p>{{ts("This password reset link has expired or is otherwise invalid.")}}</p>
    <p><a href ng-click="$ctrl.completeReset()">{{ts('Send new password reset link')}}</a></p>
  </div>

</div>

