<div class="controller-section" ng-controller="Fabric.AssignProfilesController">

  <div class="row-fluid">
    <div class="pull-left">
      <a class='btn inline-block' ng-href="#/fabric/containers"><i class='icon-remove'></i> Cancel</a>
    </div>
    <div class="pull-right">
      <a ng-disabled="canApply()" class="btn btn-danger" href="" ng-click="showApply = true"><i class="icon-cogs"></i> Apply Changes</a>
    </div>
  </div>

  <div class="row-fluid form-horizontal">
    <div class="span8 offset2">
      <div class="control-group">
        <label class="inline-block">1. Select the version containing the profiles and containers to be modified: </label>
        <select ng-model="version" ng-options="v.id for v in versions"></select>
      </div>

    </div>
  </div>

  <div class="row-fluid">
    <div class="span4 offset2">
      <p>2. Select the profiles to be applied:</p>
      <input class="search-query column-filter" type="text" ng-model="profileGridOptions.filterOptions.filterText" placeholder="Filter...">
      <div class="gridStyle" ng-grid="profileGridOptions"></div>
    </div>
    <div class="span4">
      <p>3. Select the target containers to apply these profiles on:</p>
      <input class="search-query column-filter" type="text" ng-model="containerGridOptions.filterOptions.filterText" placeholder="Filter...">
      <div class="gridStyle" ng-grid="containerGridOptions"></div>
    </div>
  </div>

  <div hawtio-confirm-dialog="showApply" ok-button-text="Yes" cancel-button-text="No" on-ok="applyProfiles()" title="Apply profiles?">
    <div class="dialog-body">
      <p>Are you sure you want to set these {{selectedProfiles.length}} profiles on {{selectedContainers.length}} containers?</p>
    </div>
  </div>



</div>
