<h4 class="bg-primary">Enter your Programming Key</h4>
<p>You have selected to replace the primary base station. To swap or replace the primary base station for the system you must obtain a Programming Key from the Setup Menu on one of the remote controls in the system.</p>
<p>When you have the key, enter it below to proceed.</p>

<form name="authBaseForm" ng-submit="authBaseForm.$valid && doNext()" role="form">
  <div class="form-group">
    <label for="model-name">Base Station Model:</label>
    <button type="button" class="btn btn-default margin-left-md" ng-model="bsReplace.modelType" ng-options="modelName for modelName in availableModels" bs-select>  <span class="caret"></span></button>
  </div>


  <div class="form-group">
      <label for="key1">Programming Key:</label>

      <div class="system-key">
        <input class="form-control" id="key1" type="text" maxlength="4" ng-minlength="4" ng-model="bsReplace.key.first" ng-pattern="/^[a-z0-9]+$/i" auto-tab-to="key2" required>

        <input class="form-control" id="key2" type="text" maxlength="4" ng-minlength="4" ng-model="bsReplace.key.second" ng-pattern="/^[a-z0-9]+$/i" auto-tab-to="key3" required>

        <input class="form-control" id="key3" type="text" maxlength="4" ng-minlength="4" ng-model="bsReplace.key.third" ng-pattern="/^[a-z0-9]+$/i" auto-tab-to="key4" required>

        <input class="form-control" id="key4" type="text" maxlength="4" ng-minlength="4" ng-model="bsReplace.key.fourth" ng-pattern="/^[a-z0-9]+$/i" required>

        <p class="help-block" ng-show="authBaseForm.key.$error.required && authBaseForm.key.$dirty">Please enter a valid URC Programming Key.</p>
      </div>
    </div>

  <div class="left-and-right">
    <go-back state="system-settings.replace.main"></go-back>
    <button class="btn btn-primary btn-next" type="submit" ng-disabled="authBaseForm.$invalid">Next</button>
  </div>
</form>