<div>
  <table>
    <tr>
      <td></td>
      <td class="less-big">
        <div class="btn-group">
          <button ng-click="stopBundle(bundleId)" class="btn" title="stop"><i class="icon-off"/></button>
          <button ng-click="startBundle(bundleId)" class="btn" title="start"><i class="icon-play-circle"/></button>
          <button ng-click="refreshBundle(bundleId)" class="btn" title="refresh"><i class="icon-refresh"/></button>
          <button ng-click="updateBundle(bundleId)" class="btn" title="update"><i class="icon-cloud-download"/></button>
          <button ng-click="uninstallBundle(bundleId)" class="btn" title="uninstall"><i class="icon-eject"/></button>
        </div>
      </td>
    </tr>
    <tr>
      <td><p/></td>
      <td/>
    <tr>
      <td>
        <div ng-switch="row.Fragment">
          <div ng-switch-when="true"><strong>Fragment&nbsp;ID:</strong></div>
          <div ng-switch-default><strong>Bundle&nbsp;ID:</strong></div>
        </div>
      </td>
      <td class="less-big">{{row.Identifier}}
      </td>
    </tr>
    <tr>
      <td><strong>Bundle&nbsp;Name:</strong></td>
      <td class="less-big">{{row.Headers['Bundle-Name'].Value}}
      </td>
    </tr>
    <tr>
      <td><strong>Symbolic&nbsp;Name:</strong></td>
      <td class="less-big label">
        <div id="bsn" rel="tooltip">{{row.SymbolicName}}</div>
      </td>
    </tr>
    <tr>
      <td><strong>Version:</strong></td>
      <td class="less-big">{{row.Version}}
      </td>
    </tr>
    <tr>
      <td><strong>Start&nbsp;Level:</strong></td>
      <td class="less-big">{{row.StartLevel}}
      </td>
    </tr>
    <tr>
      <td><strong>Location:</strong></td>
      <td class="less-big">
        <a ng-href="{{mavenLink(row)}}">
          {{row.Location}}
        </a>
      </td>
    </tr>
    <tr>
      <td><strong>State:</strong></td>
      <td>
        <div class="less-big label" ng-class="row.StateStyle">{{row.State}}</div>
      </td>
    </tr>
    <tr>
      <td><strong>Last&nbsp;Modified:</strong></td>
      <td class="less-big">{{row.LastModified | date:'medium'}}
      </td>
    </tr>
    <tr>
      <td>
        <div ng-switch="row.Fragment">
          <div ng-switch-when="true"><strong>Hosts:</strong></div>
          <div ng-switch-default><strong>Fragments:</strong></div>
        </div>
      </td>
      <td class="less-big">
        <div ng-switch="row.Fragment">
          <div ng-switch-when="true" ng-bind-html-unsafe="row.Hosts"/>
          <div ng-switch-default ng-bind-html-unsafe="row.Fragments"/>
        </div>
      </td>
    </tr>
    <tr>
      <td>
      </td>
      <td>
        <div class="accordion" id="accordionInspectClassloading">
          <div class="accordion-group">
            <div class="accordion-heading">
              <a class="accordion-toggle" data-toggle="collapse" data-parent="#accordionInspectClassloading"
                 href="#collapseInspectClassloading">
                Inspect Classloading
              </a>
            </div>
            <div id="collapseInspectClassloading" class="accordion-body collapse in">
              <form class="form-inline">
                <fieldset>
                  &nbsp;&nbsp;
                  <input class="input-xlarge" type="text" ng-model="classToLoad" placeHolder="Enter Class Name to Load...">
                  <button class="btn btn-success execute" ng-click="executeLoadClass(classToLoad)">Load class</button>
                </fieldset>
              </form>
              <form class="form-inline">
                <fieldset>
                  &nbsp;&nbsp;
                  <input class="input-xlarge" type="text" ng-model="resourceToLoad"
                         placeHolder="Enter Resource Name to Find...">
                  <button class="btn btn-success execute" ng-click="executeFindResource(resourceToLoad)">Get resource
                  </button>
                </fieldset>
              </form>
              <div id="loadClassResult"/>
            </div>
          </div>
        </div>
      </td>
    </tr>
    <tr>
      <td>
      </td>
      <td>
        <div class="accordion" id="accordionImportedPackages">
          <div class="accordion-group">
            <div class="accordion-heading">
              <a class="accordion-toggle" data-toggle="collapse" data-parent="#accordionImportedPackages"
                 href="#collapseImportedPackages">
                Imported Packages
              </a>
            </div>
            <div id="collapseImportedPackages" class="accordion-body collapse in">
              <table>
                <tr ng-repeat="(package, data) in row.ImportData">
                  <td>
                    <div class="less-big badge" id="import.{{package}}">{{package}}</div>
                  </td>
                </tr>
              </table>
              <div id="unsatisfiedOptionalImports"/>
            </div>
          </div>
        </div>
      </td>
    </tr>
    <tr>
      <td>
      </td>
      <td>
        <div class="accordion" id="accordionExportedPackages">
          <div class="accordion-group">
            <div class="accordion-heading">
              <a class="accordion-toggle" data-toggle="collapse" data-parent="#accordionExportedPackages"
                 href="#collapseExportedPackages">
                Exported Packages
              </a>
            </div>
            <div id="collapseExportedPackages" class="accordion-body collapse in">
              <table>
                <tr ng-repeat="(package, data) in row.ExportData">
                  <td>
                    <div class="less-big badge badge-success" id="export.{{package}}">{{package}}</div>
                  </td>
                </tr>
              </table>
            </div>
          </div>
        </div>
      </td>
    </tr>
    <tr>
      <td></td>
      <td>
        <div class="accordion" id="accordionServices">
          <div class="accordion-group">
            <div class="accordion-heading">
              <a class="accordion-toggle" data-toggle="collapse" data-parent="#accordionServices"
                 href="#collapseServices">
                Services
              </a>
            </div>
            <div id="collapseServices" class="accordion-body collapse in">
              Registered Services
              <table>
                <tr ng-repeat="id in row.RegisteredServices">
                  <td><i class="icon-cog less-big text-success" id="registers.service.{{id}}">{{id}}</i></td>
                </tr>
              </table>
              <br/>
              Services used by this Bundle
              <table>
                <tr ng-repeat="id in row.ServicesInUse">
                  <td><i class="icon-cog less-big text-info" id="uses.service.{{id}}">{{id}}</i></td>
                </tr>
              </table>
            </div>
          </div>
        </div>
      </td>
    </tr>
    <tr>
      <td>
      </td>
      <td>
        <div class="accordion" id="accordionRequiringBundles">
          <div class="accordion-group">
            <div class="accordion-heading">
              <a class="accordion-toggle" data-toggle="collapse" data-parent="#accordionRequiringBundles"
                 href="#collapseRequiringBundles">
                Other Bundles using this Bundle
              </a>
            </div>
            <div id="collapseRequiringBundles" class="accordion-body collapse in">
              <div class="accordion-inner">
                <span ng-bind-html-unsafe="row.RequiringBundles"/>
              </div>
            </div>
          </div>
        </div>
      </td>
    </tr>
    <tr>
      <td>
      </td>
      <td>
        <div class="accordion" id="accordionHeaders">
          <div class="accordion-group">
            <div class="accordion-heading">
              <a class="accordion-toggle" data-toggle="collapse" data-parent="#accordionHeaders"
                 href="#collapsHeaders">
                Headers
              </a>
            </div>
            <div id="collapsHeaders" class="accordion-body collapse in">
              <table class="accordion-inner">
                <tr ng-repeat="(key, value) in row.Headers" ng-show="showValue(key)">
                  <td valign="top">{{key}}</td>
                  <td>{{value.Value}}</td>
                </tr>
              </table>
            </div>
          </div>
        </div>
      </td>
    </tr>
  </table>
</div>
