<div class="scrollable-window scrollable-window-lg">
  <!-- <h3>{{room.name}}</h3> -->

  <form role="form">
    <div class="form-group">
      <label for="room-name" >Room Name </label>
      <input type="text" class="form-control" id="installer-name" name="roomName" placeholder="Enter a room name" ng-model="room.name" required>
    </div>
    
    <button class="btn btn-fw btn-primary margin-bottom-md" type="button" fn="createNewBstation()" list="room.bstations" add-to-list>Add controller</button>

    <div class="well" ng-repeat="bstation in room.bstations track by bstation.id">
      
      <div class="form-group">
        <label>Controller Model</label>&nbsp;&nbsp;
        <select name="controllerType" id="" ng-model="bstation.type" ng-options="modelName for modelName in availableModels"></select>

        <a class="text-danger pull-right" href="" title="Delete {{bstation.name}}" ng-if="room.bstations.length > 1" item="bstation" list="room.bstations" delete-from-list><i class="fa fa-lg fa-times"></i></a>
      </div>
      
      <div class="form-group">
        <label for="controller-name" >Controller Name </label>
        <input type="text" class="form-control" id="installer-name" name="controllerName" placeholder="Enter a controller name" ng-model="bstation.name" required>
      </div>
    </div>

    
  </form>
</div>






