overview.html

<div ng-show="nodes">
  <div ng-include src="'stats.html'"></div>
  <div class="row">
    <div class="col-lg-4">
      <div class="row">
        <div class="col-lg-6 col-sm-6 form-group">
          <input type="text" ng-model="paginator.filter.name" class="form-control form-control-sm"
                 ng-model-options='{ debounce: 250 }'
                 placeholder="filter indices by name or aliases">
        </div>
        <div class="col-lg-3 col-sm-3 col-xs-6 form-group">
          <div class="checkbox">
            <label>
              <input type="checkbox" ng-model="paginator.filter.closed"> closed ({{closed_indices}})
            </label>
          </div>
        </div>
        <div class="col-lg-3 col-sm-3 col-xs-6 form-group">
          <div class="checkbox">
            <label>
              <input type="checkbox" ng-model="paginator.filter.special"> .special ({{special_indices}})
            </label>
          </div>
        </div>
      </div>
    </div>
    <div class="col-lg-4">
      <div class="row">
        <div class="col-lg-6 col-sm-6 form-group">
          <input type="text" ng-model="nodes_filter.name" class="form-control form-control-sm"
                 placeholder="filter nodes by name">
        </div>
      </div>
    </div>
    <div class="col-lg-4 form-group">
      <ng-pagination page="page" paginator="paginator" label="'selected indices'"></ng-pagination>
    </div>
  </div>

  <table class="table table-bordered table-condensed table-rounded table-inverse shard-map noselect">
    <thead>
    <tr>
      <td>
        <div class="row">
          <div class="col-lg-3 col-md-6">
            <i class="fa fa-lock fa-2x table-control red normal-action" title="enable shard allocation" ng-click="enableShardAllocation()"
               ng-hide="shardAllocation"></i>
            <i class="fa fa-unlock fa-2x table-control normal-action" title="disable shard allocation" ng-click="disableShardAllocation()"
               ng-show="shardAllocation"></i>
          </div>
          <div class="col-lg-3 col-md-6">
            <i class="fa fa-expand fa-2x normal-action table-control" ng-hide="expandedView"
               title="expand view" ng-click="expandedView = true"></i>
            <i class="fa fa-compress fa-2x normal-action table-control" ng-show="expandedView"
               title="condense view" ng-click="expandedView = false"></i>
          </div>
          <div class="col-lg-3 col-md-6">
            <i class="fa fa-sort-alpha-asc fa-2x normal-action table-control" title="sort ascending"
               ng-show="indices_filter.asc" ng-click="indices_filter.asc = false"></i>
            <i class="fa fa-sort-alpha-desc fa-2x normal-action table-control" title="sort descending"
               ng-hide="indices_filter.asc" ng-click="indices_filter.asc = true"></i>
          </div>
          <div class="col-lg-3 col-md-6">
            <div class="dropdown">
              <span class="title normal-action" type="button" id="dropcluster" data-toggle="dropdown"
                    aria-haspopup="true" aria-expanded="false" title="more options">
                <i class="fa fa-caret-down fa-2x table-control"></i>
              </span>
              <ul class="dropdown-menu" aria-labelledby="dropcluster">
                <li ng-click="closeIndices()" data-toggle="modal" href="#confirm_dialog" target="_self">
                  <a target="_self"><i class="fa fa-fw fa-folder"> </i> close selected</a>
                </li>
                <li ng-click="openIndices()" data-toggle="modal" href="#confirm_dialog" target="_self">
                  <a target="_self"><i class="fa fa-fw fa-folder-open"> </i> open selected</a>
                </li>
                <li ng-click="forceMerges()" wtarget="_self">
                  <a target="_self"><i class="fa fa-fw fa-wrench"> </i> force merge selected</a>
                </li>
                <li ng-click="refreshIndices()" data-toggle="modal" href="#confirm_dialog" target="_self">
                  <a target="_self"><i class="fa fa-fw fa-refresh"> </i> refresh selected</a>
                </li>
                <li ng-click="flushIndices()" data-toggle="modal" href="#confirm_dialog" target="_self">
                  <a target="_self"><i class="fa fa-fw fa-gavel"> </i> flush selected</a>
                </li>
                <li ng-click="clearIndicesCache()" data-toggle="modal" href="#confirm_dialog" target="_self">
                  <a target="_self"><i class="fa fa-fw fa-circle-o"> </i> clear selected caches</a>
                </li>
                <li class="divider" role="separator">
                </li>
                <li ng-click="deleteIndices()" data-toggle="modal" href="#confirm_dialog" target="_self">
                  <a target="_self"><i class="fa fa-fw fa-trash red"> </i> delete selected</a>
                </li>
              </ul>
            </div>
          </div>
        </div>
      </td>
      <td ng-repeat="index in page.elements track by $index" ng-class="{'closed-index': index.closed}">
        <div ng-show="index">
          <div class="dropdown">
              <span class="title normal-action" type="button" id="drop_{{index.name}}" data-toggle="dropdown"
                    aria-haspopup="true" aria-expanded="false">
                <i class="fa fa-caret-down pull-right"></i>{{index.name}}
              </span>
            <ul class="dropdown-menu" aria-labelledby="drop_{{index.name}}">
              <li ng-click="getIndexSettings(index.name)" data-toggle="modal" href="#confirm_dialog" target="_self">
                <a target="_self"><i class="fa fa-fw fa-info-circle"> </i> show settings</a>
              </li>
              <li ng-click="getIndexMapping(index.name)" data-toggle="modal" href="#confirm_dialog" target="_self">
                <a target="_self"><i class="fa fa-fw fa-code"> </i> show mappings</a>
              </li>
              <li ng-click="indexStats(index.name)" data-toggle="modal" href="#confirm_dialog" target="_self">
                <a target="_self"><i class="fa fa-fw fa-info"> </i> show stats</a>
              </li>
              <li ng-show="index.closed" ng-click="openIndex(index.name)" data-toggle="modal" href="#confirm_dialog"
                  target="_self">
                <a target="_self"><i class="fa fa-fw fa-folder-open"> </i> open index</a>
              </li>
              <li ng-hide="index.closed" ng-click="closeIndex(index.name)" data-toggle="modal" href="#confirm_dialog"
                  target="_self">
                <a target="_self"><i class="fa fa-fw fa-folder"> </i> close index</a>
              </li>
              <li ng-click="forceMerge(index.name)" data-toggle="modal" href="#confirm_dialog" target="_self">
                <a target="_self"><i class="fa fa-fw fa-wrench"> </i> force merge</a>
              </li>
              <li ng-click="refreshIndex(index.name)" data-toggle="modal" href="#confirm_dialog" target="_self">
                <a target="_self"><i class="fa fa-fw fa-refresh"> </i> refresh index</a>
              </li>
              <li ng-click="flushIndex(index.name)" data-toggle="modal" href="#confirm_dialog" target="_self">
                <a target="_self"><i class="fa fa-fw fa-gavel"> </i> flush index</a>
              </li>
              <li ng-click="clearIndexCache(index.name)" data-toggle="modal" href="#confirm_dialog" target="_self">
                <a target="_self"><i class="fa fa-fw fa-circle-o"> </i> clear cache</a>
              </li>
              <li ng-click="showIndexSettings(index.name)">
                <a target="_self"><i class="fa fa-fw fa-cog"> </i> index settings</a>
              </li>
              <li class="divider"></li>
              <li ng-click="deleteIndex(index.name)" data-toggle="modal" href="#confirm_dialog" target="_self">
                <a target="_self"><i class="fa fa-fw fa-trash red"> </i> delete index</a>
              </li>
            </ul>
          </div>
          <div class="subtitle" ng-show="index.aliases.length">
            <div class="title">
              <i class="fa fa-tag"></i> {{index.aliases[0]}}
              <span ng-show="index.aliases.length > 1">(+{{index.aliases.length - 1}})</span>
            </div>
          </div>
          <div class="detail">
            <span ng-hide="index.closed">
              <span><small>shards: {{index.num_shards}} * {{index.num_replicas + 1}}|</small></span>
              <span><small>docs: {{index.doc_count | number}} |</small></span>
              <span><small>size: {{index.size_in_bytes | bytes}}</small></span>
            </span>
            <span ng-show="index.closed">
              <span><small><i>index closed</i></small></span>
            </span>
          </div>
        </div>
      </td>
    </tr>
    </thead>
    <tbody>
    <tr ng-show="unassigned_shards > 0 || relocating_shards > 0 || initializing_shards > 0">
      <td>
        <div class="subtitle" ng-show="unassigned_shards > 0">
          <i class="fa fa-warning alert-warning"> </i> {{unassigned_shards}} unassigned shards
        </div>
        <div class="subtitle" ng-show="relocating_shards > 0">
          <i class="fa fa-refresh fa-spin"> </i> {{relocating_shards}} relocating shards
        </div>
        <div class="subtitle" ng-show="initializing_shards > 0">
          <i class="fa fa-spinner fa-spin"> </i> {{initializing_shards}} initializing shards
        </div>
        <div>
          <span class="normal-action" ng-show="indices_filter.healthy" ng-click="indices_filter.healthy = false"><i><small>show only affected indices</small></i></span>
          <span class="normal-action" ng-hide="indices_filter.healthy" ng-click="indices_filter.healthy = true"><i><small>show all indices</small></i></span>
        </div>
      </td>
      <td ng-repeat="index in page.elements track by $index">
        <span ng-repeat="shard in index.shards.unassigned | orderBy:'shard' track by $index">
          <span class="shard shard-unassigned">
            <small>{{shard.shard}}</small>
          </span>
        </span>
      </td>
    </tr>
    <tr ng-repeat="node in nodes | orderBy:'name' track by $index">
      <td>
        <div class="row">
          <div class="col-lg-12">
            <div class="node-badges title">
              <div ng-show="node.master">
                <i ng-show="node.current_master" class="fa fa-fw fa-star" title="current master"></i>
                <i ng-show="!node.current_master" class="fa fa-fw fa-star-o" title="master eligible"></i>
              </div>
              <div ng-show="node.data">
                <i class="fa fa-fw fa-hdd-o" title="data node"></i>
              </div>
              <div ng-show="node.ingest">
                <i class="fa fa-fw fa-crop" title="ingest node"></i>
              </div>
            </div>
            <div class="node-info">
              <div class="title">
                  <span class="normal-action" type="button" ng-click="nodeStats(node.id)" data-toggle="modal"
                        href="#confirm_dialog" target="_self">
                    {{node.name}}
                  </span>
              </div>
              <div>
                <small>{{node.host}}</small>
              </div>
            </div>
          </div>
        </div>
        <div class="row row-condensed">
          <div class="col-lg-3 col-condensed">
            <ng-progress
              value="node.heap.used_percent"
              max="100"
              text="'heap'"
              tooltip="'used: ' + (node.heap.used | bytes) + '\nmax: ' + (node.heap.max | bytes)"
            />
          </div>
          <div class="col-lg-3 col-condensed">
            <ng-progress
              value="node.disk.used_percent"
              max="100"
              text="'disk'"
              tooltip="'free: ' + (node.disk.free | bytes) + '\ntotal: ' + (node.disk.total | bytes)"
            />
          </div>
          <div class="col-lg-3 col-condensed">
            <ng-progress
              value="node.cpu_percent"
              max="100"
              text="'cpu'"
              tooltip="'process cpu: ' + node.cpu_percent + '%'"
            />
          </div>
          <div class="col-lg-3 col-condensed">
            <ng-progress
              value="node.load_average"
              max="node.available_processors"
              text="'load'"
              tooltip="'1min avg.: ' + (node.load_average | number:2)"
            />
          </div>
        </div>
        <div ng-show="expandedView" class="node-labels">
          <span class="label label-details">JVM: {{node.jvm_version}}</span>
          <span class="label label-details">ES: {{node.es_version}}</span>
        </div>
      </td>
      <td ng-repeat="index in page.elements track by $index">
        <span ng-repeat="shard in index.shards[node.id] | orderBy:'shard' track by $index">
          <span class="dropdown">
            <span class="shard shard-{{shard.state | lowercase}} normal-action"
                  ng-class="{'shard-replica': !shard.primary && shard.node}"
                  data-toggle="dropdown"
                  id="{{shard.shard}}_{{shard.node}}_{{shard.index}}">
            <small>{{shard.shard}}</small>
          </span>
            <ul class="dropdown-menu"
                aria-labelledby="{{shard.shard}}_{{shard.node}}_{{shard.index}}">
            <li ng-click="shardStats(shard.index, shard.node, shard.shard)" data-toggle="modal" href="#confirm_dialog" target="_self">
              <a target="_self"><i class="fa fa-fw fa-info-circle"> </i> display shard stats</a>
            </li>
            <li ng-click="select(shard)" ng-hide="isSelected(shard)">
              <a target="_self"><i class="fa fa-fw fa-arrows"> </i> select for relocation</a>
            </li>
            <li ng-click="select()" ng-show="isSelected(shard)">
              <a target="_self"><i class="fa fa-fw fa-arrows"> </i> unselect for relocation</a>
            </li>
          </ul>
          </span>
        </span>
        <span class="shard shard-spot normal-action" ng-click="relocateShard(node)"
              ng-show="canReceiveShard(index, node)">
          <i class="fa fa-download"></i>
        </span>
      </td>
    </tr>
    </tbody>
  </table>
</div>