<div class="col-sm-12 form-section-title">
  Test login
</div>
<div class="form-inline">
  <div class="form-group" style="margin: 0;">
    <label for="ldap_test_username" style="font-size: 0.9em; margin-right: 5px;">
      Username
    </label>
    <input type="text" class="form-control" id="ldap_test_username" ng-model="$ctrl.username" limited-feature-dir="{{::$ctrl.limitedFeatureId}}" limited-feature-tabindex="-1" />
  </div>

  <div class="form-group" style="margin: 0;">
    <label for="ldap_test_password" style="font-size: 0.9em; margin-right: 5px;">
      Password
    </label>
    <input
      type="password"
      class="form-control"
      id="ldap_test_password"
      ng-model="$ctrl.password"
      autocomplete="new-password"
      limited-feature-dir="{{::$ctrl.limitedFeatureId}}"
      limited-feature-tabindex="-1"
    />
  </div>

  <div class="form-group" style="margin: 0;">
    <button
      type="submit"
      class="btn btn-primary"
      ng-disabled="$ctrl.state.testStatus === $ctrl.TEST_STATUS.LOADING || !$ctrl.username || !$ctrl.password"
      ng-click="$ctrl.testLogin($ctrl.username, $ctrl.password)"
      limited-feature-dir="{{::$ctrl.limitedFeatureId}}"
      limited-feature-disabled
      limited-feature-tabindex="-1"
    >
      <span ng-if="$ctrl.state.testStatus !== $ctrl.TEST_STATUS.LOADING">Test</span>
      <span ng-if="$ctrl.state.testStatus === $ctrl.TEST_STATUS.LOADING">Testing...</span>
    </button>
    <i ng-if="$ctrl.state.testStatus === $ctrl.TEST_STATUS.SUCCESS" class="fa fa-check green-icon"></i>
    <i ng-if="$ctrl.state.testStatus === $ctrl.TEST_STATUS.FAILURE" class="fa fa-times red-icon"></i>
  </div>

  <be-feature-indicator ng-if="$ctrl.showBeIndicatorIfNeeded" feature="$ctrl.limitedFeatureId" class="space-left"></be-feature-indicator>
</div>
