<div class="modal" tabindex="-1" role="dialog">
  <div class="modal-dialog">
    <div class="modal-content">
      <div class="modal-header">
        <button type="button" class="close" ng-click="stopLearn()">&times;</button>
        <h4 class="modal-title">Learning IR</h4>
      </div>
      
          
      <form name="learnCommandForm" novalidate>
        <div class="modal-body">
          <div class="alert alert-warning" role="alert" ng-if="selectedBtn.display_text.length">
            <i class="fa fa-warning"></i>&nbsp;&nbsp;<strong>Warning</strong>
            <p>Learning a command to this button will overwrite it's previously assigned command.</p>
          </div> 
          <p>Status: <strong ng-bind-html="status"></strong></p>
          <div class="form-group">
            <label for="btn-name">Button name</label>
            <input class="form-control" id="btn-name" type="text" name="btnName" placeholder="Enter a button name" ng-model="selectedBtnCopy.display_text"  ng-maxlength="32" required>
            <p class="help-block" ng-show="learnCommandForm.btnName.$error.required && learnCommandForm.btnName.$dirty">A valid button name is required.</p>
            <p class="help-block" ng-show="learnCommandForm.btnName.$error.maxlength && learnCommandForm.btnName.$dirty">The button name cannot be longer than 32 characters.</p>
          </div>
          

          <div class="form-group">
            <label for="func-name">Function name</label>
            <input class="form-control" id="func-name" type="text" name="funcName" placeholder="Enter a function name" ng-model="selectedBtnCopy.func.name" ng-maxlength="32" required>
            <p class="help-block" ng-show="learnCommandForm.funcName.$error.required && learnCommandForm.funcName.$dirty">A valid function name is required.</p>
            <p class="help-block" ng-show="learnCommandForm.funcName.$error.maxlength && learnCommandForm.funcName.$dirty">The function name cannot be longer than 32 characters.</p>
          </div>
          
        </div>

        <div class="modal-footer">
          <!-- <button type="button" class="btn btn-primary" ng-disabled="!retry" ng-click="retryLearn()">Retry</button> -->
          <!-- <button type="button" class="btn btn-primary" ng-disabled="!save || learnCommandForm.$invalid" ng-click="saveLearn()">Save &amp; Close</button> -->
          <!-- <button type="button" class="btn btn-primary" ng-if="selectedBtn.id !== 348" ng-disabled="!next || learnCommandForm.$invalid" ng-click="nextLearn()">Next</button> -->
          <!-- <button type="button" class="btn btn-danger" ng-disabled="!stop" ng-click="stopLearn()">Stop</button> -->
          
          <div class="pull-left">
            <a class="btn btn-default btn-circle" animation="" trigger="hover" data-title="Retry" bs-tooltip ng-disabled="!retry" ng-click="retryLearn()">
              <i class="fa fa-refresh fa-lg"></i>
            </a>

            <a class="btn btn-default btn-circle" animation="" trigger="hover" data-title="Skip This Button" bs-tooltip ng-if="selectedBtn.id !== 348" ng-click="skipLearn()">
              <i class="fa fa-rotate-right fa-lg"></i>
            </a>

            <a class="btn btn-default btn-circle" animation="" trigger="hover" data-title="Next" bs-tooltip ng-if="selectedBtn.id !== 348" ng-disabled="!next || learnCommandForm.$invalid" ng-click="nextLearn()">
              <i class="fa fa-arrow-right fa-lg" ></i>
            </a>
          </div>

          <div class="pull-right">
            <a class="btn btn-default btn-circle" animation="" trigger="hover" data-title="Save & Close" bs-tooltip ng-disabled="!save || learnCommandForm.$invalid" ng-click="saveLearn()">
              <i class="fa fa-save fa-lg" ></i>
            </a>

            <a class="btn btn-default btn-circle" animation="" trigger="hover" data-title="Stop" bs-tooltip ng-disabled="!stop" ng-click="stopLearn()">
              <i class="fa fa-stop fa-lg"></i>
            </a>
          </div>
          

          
          
        </div>
      </form>
    </div>
  </div>
</div>
