<nav class="navbar navbar-default navbar-fixed-top navbar-{{status}}" ng-controller="NavbarController">
  <div class="container-fluid">
    <div class="navbar-header">
      <button type="button" class="navbar-toggle collapsed" data-toggle="collapse" data-target="#navbar" aria-expanded="false" aria-controls="navbar">
        <span class="sr-only">Toggle navigation</span>
        <span class="icon-bar"></span>
        <span class="icon-bar"></span>
        <span class="icon-bar"></span>
      </button>
      <a href=""><img src="./img/favicon.png" width="28" style="padding-top:6px;"></a>
    </div>
    <div id="navbar" class="navbar-collapse collapse">
      <ul class="nav navbar-nav" ng-show="host">
        <li><a class="nav-item nav-link" ng-href="#overview?host={{host}}"><i class="fa fa-sitemap"></i> overview</a></li>
        <li><a class="nav-item nav-link" ng-href="#nodes?host={{host}}"><i class="fa fa-server"></i> nodes</a></li>
        <li><a class="nav-item nav-link" ng-href="#rest?host={{host}}"><i class="fa fa-edit"></i> rest</a></li>
        <li>
          <a target="_self" href="#" data-toggle="dropdown" class="dropdown-toggle">
            <i class="fa fa-fw fa-magic"></i> more <i class="fa fa-fw fa-caret-down"></i>
          </a>
          <ul class="dropdown-menu">
            <li>
              <a class="nav-item nav-link" ng-href="#create?host={{host}}">
                <i class="fa fa-file-o"></i> create index
              </a>
            </li>
            <li>
              <a class="nav-item nav-link" ng-href="#cluster_settings?host={{host}}">
                <i class="fa fa-cogs"></i> cluster settings
              </a>
            </li>
            <li>
              <a class="nav-item nav-link" ng-href="#aliases?host={{host}}">
                <i class="fa fa-tags"></i> aliases
              </a>
            </li>
            <li>
              <a class="nav-item nav-link" ng-href="#analysis?host={{host}}">
                <i class="fa fa-puzzle-piece"></i> analysis
              </a>
            </li>
            <li>
              <a class="nav-item nav-link" ng-href="#templates?host={{host}}">
                <i class="fa fa-book"></i> index templates
              </a>
            </li>
            <li>
              <a class="nav-item nav-link" ng-href="#repository?host={{host}}">
                <i class="fa fa-database"></i> repositories
              </a>
            </li>
            <li>
              <a class="nav-item nav-link" ng-href="#snapshot?host={{host}}">
                <i class="fa fa-camera"></i> snapshot
              </a>
            </li>
            <li>
              <a class="nav-item nav-link" ng-href="#cat?host={{host}}">
                <i class="fa fa-list"></i> cat apis
              </a>
            </li>
          </ul>
        </li>
      </ul>
      <ul class="nav navbar-nav navbar-right">
        <li>
          <a target="_self" href="#" data-toggle="dropdown" class="dropdown-toggle">
            <i class="fa fa-fw fa-refresh"></i> {{refreshInterval | timeInterval}} <i class="fa fa-fw fa-caret-down"></i>
          </a>
          <ul class="dropdown-menu" style="min-width: 60px;">
            <li ng-repeat="i in [3000, 5000, 10000, 15000, 30000, 60000] track by $index">
              <a class="nav-item nav-link" ng-click="setRefreshInterval(i)">
                {{i | timeInterval}}
              </a>
            </li>
          </ul>
        </li>
        <li class="hidden-xs">
          <a class="nav-item nav-link">
            <span ng-show="host">{{host}}</span>
          </a>
        </li>
        <li>
          <a href="#connect" class="nav-item nav-link hidden-xs"><i class="fa fa-plug"></i></a>
        </li>
        <li>
          <form action="auth/logout" method="POST" ng-show="username">
            <button class="btn btn-lg btn-link" type="submit">
              <i class="fa fa-power-off"></i>
            </button>
          </form>
        </li>
      </ul>
    </div>
  </div>
</nav>
