<div class="controller-section" ng-controller="Osgi.BundleListController">
  <div class="row-fluid bundle-list-toolbar">

    <div class="pull-left">
      <div class="btn-group">
        <a ng-href="#/osgi/bundle-list?p=container"
                type="button"
                class="btn active"
                title="List view">
          <i class="icon-list"></i>
        </a>
        <a ng-href="#/osgi/bundles?p=container"
                type="button"
                class="btn"
                title="Table view">
          <i class="icon-table"></i>
        </a>
      </div>

      <div class="input-append">
        <input class="input-large"
               type="text"
               placeholder="Install Bundle..."
               ng-model="bundleUrl">
        <button ng-disabled="installDisabled()"
                class="btn"
                ng-click="install()"
                title="Install">
          <i class="icon-ok"></i>
        </button>
      </div>

    </div>


    <div class="pull-right">
      <strong>Show: </strong>
      &nbsp;
      <label for="showCxfBundles">CXF bundles</label>
      <input id="showCxfBundles" type="checkbox" ng-model="display.showCxfBundles">
      &nbsp;
      &nbsp;
      <label for="showCamelBundles">Camel bundles</label>
      <input id="showCamelBundles" type="checkbox" ng-model="display.showCamelBundles">
      &nbsp;
      &nbsp;
      <label for="showPlatformBundles">Platform bundles</label>
      <input id="showPlatformBundles" type="checkbox" ng-model="display.showPlatformBundles">
      &nbsp;
      &nbsp;
      &nbsp;
      <select class="input-large" ng-model="display.sortField" id="sortField">
        <option value="Identifier">Sort by ID</option>
        <option value="Name">Sort by Name</option>
        <option value="SymbolicName">Sort by Symbolic Name</option>
      </select>
      <select class="input-large" ng-model="display.bundleField" id="bundleField">
        <option value="Name">Display Name</option>
        <option value="SymbolicName">Display Symbolic Name</option>
      </select>
      <input class="input-small search-query" type="number" min="0"
             ng-model="display.startLevelFilter"
             placeholder="Start Level..."/>
      <input class="input-large search-query" type="text"
             ng-model="display.bundleFilter"
             placeholder="Filter..."/>
    </div>

  </div>

  <div class="row-fluid" id="bundleTableHolder">
    <!-- Just create a bit of space between the form and the controls -->
    <p></p>

    <script type="text/ng-template" id="popoverTemplate">
<small>
  <table class="table">
    <tbody>
    <tr ng-repeat="(k, v) in bundle track by $index">
      <td class="property-name">{{k}}</td>
      <td class="property-value">{{v}}</td>
    </tr>
    </tbody>
  </table>
</small>
    </script>

    <div class="bundle-list"
         hawtio-auto-columns=".bundle-item">
      <div ng-repeat="bundle in bundles"
           class="bundle-item"
           ng-show="filterBundle(bundle)"
           hawtio-template-popover title="Bundle Details">
        <a id="{{bundle.Identifier}}"
           ng-href="#/osgi/bundle/{{bundle.Identifier}}?p=container">
          <span class="badge" ng-class="getStateStyle(bundle.State)">{{getLabel(bundle)}}</span>
        </a>
      </div>
    </div>
  </div>
</div>
