<!-- start box -->
<div class="box" 
     ng-class="getSelectedClass(container)" 
     ng-click="container.selected = !container.selected">
  <div class="box-left">
    <div class="container-controls" >
      <div class="container-status">
        <i title="{{getStatusTitle(container)}}" ng-class='statusIcon(container)' ng-click="container.selected = !container.selected"></i>
      </div>
      <div class="container-type" title="Container type">
        <hawtio-icon config="container.icon"/>
      </div>
      <!--
      <div>
        <a class="btn btn-success"
           href=""
           ng-disabled="!(container.root && container.alive)"
           title="Create a new child container"
           ng-click="createChildContainer(container)">
          <i class="icon-plus"></i>
        </a>
      </div>
      -->
      <div>
        <span class="badge badge-info">
          {{container.versionId}}
        </span>
      </div>
      <div>
        <span class="contained c-wide"
              title="{{container.id}} / {{container.versionId}}">
          <a ng-click="showContainer(container)">{{container.id}}</a>
        </span>
        <span>
          <a class="clickable"
             href=""
             ng-show="canConnect(container)"
             ng-click="doConnect(container)"
             title="Open a new window and connect to this container">
            <i class="icon-signin"></i>
          </a>
        <span>
      </div>

    </div>
  </div>

  <div class="box-middle">
    <!-- empty -->
  </div>

  <div class="box-right">
    <ul class="service-list inline-block">
      <li>
        <i class="icon-cloud" title="Ensemble member" ng-click="showContainer(container)" ng-show="isEnsembleContainer(container.id)"></i>
      </li>
      <li ng-repeat="icon in container.services">
        <hawtio-icon config="icon"/>
      </li>
    </ul>
  </div>

</div>
<!-- end box -->
