<div class="container-fluid">
  <h3>Spring Boot applications</h3>
  <div>
    <input placeholder="Filter" class="input-xxlarge" type="search" ng-model="searchFilter" />
  </div>
  <table class="table application-list">
    <col style="width: 30px; ">
    <col style="width: 300px;">
    <col style="width: 150px;">
    <col style="width: auto;">
    <col style="width: 100px;">
    <col style="width: 250px;">
    <thead>
      <tr>
        <th class="group-column" title="{{expandAll ? 'collapse' : 'expand'}} all" ng-click="toggleExpandAll()"><i class="fa" ng-class="{'fa-plus': !expandAll, 'fa-minus': expandAll}"></i></th>
        <th><span class="sortable" ng-class="orderByCssClass('name')" ng-click="orderBy('name')">Application</span> / <span class="sortable"
            ng-class="orderByCssClass('healthUrl')" ng-click="orderBy('healthUrl')">URL</span></th>
        <th><span class="sortable" ng-class="orderByCssClass('info.version')" ng-click="orderBy('info.version')">Version</span></th>
        <th>Info</th>
        <th>Status</th>
        <th></th>
      </tr>
    </thead>
    <tbody>
      <tr ng-repeat-start="application in filteredApps = (applicationGroups.applications|orderBy:order.column:order.descending|orderBy:'group.status':false|filter:searchFilter) track by application.id"
        ng-show="application.group.applicationCount > 1 &amp;&amp; (application.group.collapsed || application.group.collapsed == undefined) &amp;&amp; ($first || filteredApps[$index - 1].group.name != application.group.name) &amp;&amp; (searchFilter == '' || searchFilter == undefined)">
        <td class="group-column" ng-click="application.group.collapsed = false"><i class="fa fa-plus"></i></td>
        <td ng-bind="application.group.name"></td>
        <td><span ng-bind="application.group.version"></span></td>
        <td></td>
        <td colspan="2">
          <span ng-repeat-start="(status, count) in application.group.statusCounter track by status" class="status-{{status}}" ng-bind="count + ' ' + status"></span>
          <span ng-repeat-end ng-hide="$last"> / </span>
        </td>
      </tr>
      <tr ng-repeat-end ng-show="(!application.group.collapsed  && application.group.collapsed != undefined ) || application.group.applicationCount == 1 || (searchFilter != '' && searchFilter != undefined)">
        <td class="group-column" ng-class="{'hidden': !($first || filteredApps[$index - 1].group.name != application.group.name) &amp;&amp; (searchFilter == '' || searchFilter == undefined) }"
          rowspan="{{ (searchFilter != '' &amp;&amp; searchFilter != undefined) ? 1 : application.group.applicationCount }}"
          ng-click="application.group.collapsed = application.group.applicationCount > 1"><i ng-show="application.group.applicationCount > 1 &amp;&amp; (searchFilter == '' || searchFilter == undefined)"
            class="fa fa-minus"></i></td>
        <td>{{ application.name }} ({{ application.id }})<br/>
          <span class="muted">{{ application.serviceUrl || application.managementUrl || application.healthUrl }}</span></td>
        <td>{{ application.version }}</td>
        <td class="scroll">
          <sba-limited-text max-lines="3" bind-html="application.info | yaml | linkify:60"></sba-limited-text>
        </td>
        <td><span class="status-{{application.statusInfo.status}}" title="{{application.statusInfo.timestamp  | date:'dd.MM.yyyy HH:mm:ss' }}"
            ng-bind="application.statusInfo.status"></span>
          <span ng-show="application.refreshing"><i class="fa fa-spinner fa-pulse fa-lg"></i></span>
        </td>
        <td>
          <sba-notification-settings ng-show="notificationFilters" application="application" filters="notificationFilters" refresh-callback="loadFilters()"></sba-notification-settings>
          <sba-btn-detail-views details-for="application"></sba-btn-detail-views>
          <div class="btn-group" title="remove">
            <a class="btn btn-danger" ng-click="remove(application)"><i class="fa fa-times"></i></a>
          </div>
        </td>
      </tr>
    </tbody>
  </table>
</div>