<!--
/**
 * Licensed to the Apache Software Foundation (ASF) under one
 * or more contributor license agreements.  See the NOTICE file
 * distributed with this work for additional information
 * regarding copyright ownership.  The ASF licenses this file
 * to you under the Apache License, Version 2.0 (the
 * "License"); you may not use this file except in compliance
 * with the License.  You may obtain a copy of the License at
 *
 *     http://www.apache.org/licenses/LICENSE-2.0
 *
 * Unless required by applicable law or agreed to in writing, software
 * distributed under the License is distributed on an "AS IS" BASIS,
 * WITHOUT WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied.
 * See the License for the specific language governing permissions and
 * limitations under the License.
 */
-->
<nav class="col-sm-24 navbar navbar-default header1" role="navigation">
  <div class="col-sm-offset-2 col-sm-20">
    <a class="btn-link logoTitle" ui-sref="main">
      <h1 class="navbar-header">
        <span class="falconLogo"></span>
      </h1>
    </a>
    <div class="loginHeaderBox" ng-show="userLogged()">
        <!--<button type="button" class="btn btn-lg btn-link" data-ng-click="showMenu=!showMenu">
            <span class="glyphicon glyphicon-th" aria-hidden="true"></span>
        </button>-->
        <!-- <div class="dropdown visible-lg-inline-block">
            <a class="btn btn-link dropdown-toggle" data-ng-click="" id="settingMenu"
              data-toggle="dropdown" aria-expanded="true" role="button">
                <span class="glyphicon glyphicon-th"></span>
            </a>
            <ul class="dropdown-menu pull-right" role="menu" aria-labelledby="settingMenu">
              <li role="presentation" role="menuitem" tabindex="-1">
                  <button type="button" class="btn btn-link" data-ng-click="displayEntities('cluster')">
                      Clusters
                  </button>
              </li>
            </ul>
        </div> -->
        <span class="entypo archive icon-lg entypo-align-sub" title="Clusters" data-ng-click="displayEntities('cluster')">&nbsp;</span>
        <span class="separator"> | </span>
        <span class="notifications">
          <button class="btn btn-link" ng-click="notify()">
            <span class="glyphicon glyphicon-bell" title="Notifications"></span>
          </button>
          <server-messages></server-messages>
        </span>
        <span class="separator"> | </span>
        <div class="dropdown visible-lg-inline-block">
            <div class="dropdown-toggle pointer" id="userMenu" data-toggle="dropdown" aria-expanded="true" role="button">
              <span class="user hide"></span>{{userToken}} <span class="caret"></span>
            </div>
            <ul class="dropdown-menu pull-right" role="menu" aria-labelledby="userMenu">
                <li role="presentation">
                  <a class="btn btn-link" ng-show="userLogged() && !ambariView()" ng-click="logOut()">
                      <span class="glyphicon glyphicon-log-out" title="Logout"></span>
                      Logout
                  </a>
                </li>
                <li>
                  <a class="btn btn-link"
                        href="https://docs.hortonworks.com/HDPDocuments/HDP2/HDP-2.3.4/bk_data_governance/content/ch_hdp_data_governance_overview.html"
                        target="_blank">
                    <span class="glyphicon glyphicon-question-sign" title="Help"></span>
                    Help
                  </a>
                </li>
                <li><a class="btn btn-link" href="http://hortonworks.com/hadoop/falcon/" target="_blank">
                    <span class="glyphicon glyphicon-info-sign" title="About"></span>
                    About
                </a></li>
            </ul>
        </div>
    </div>
  </div>
</nav>
<nav class="col-sm-24 navbar navbar-default header2" role="navigation" ng-show="userLogged()">

  <div class="col-sm-16" ng-show="userLogged()">
      <div class="row searchBoxContainer">
          <div class=" col-sm-offset-4 col-sm-16">
              <!--<i class="glyphicon glyphicon-refresh search-loading-icon" ng-show="loading"></i>-->
              <img src="css/img/ajax-loader.gif" class="glyphicon search-loading-icon" ng-show="loading"/>
              <!--<tags-input ng-model="tags" min-length="1" add-on-space="true" on-tag-added="displayResults()"-->
              <!--on-tag-removed="displayResults()"></tags-input>-->

              <tags-input ng-model="tags" min-length="1" add-on-space="true" add-from-autocomplete-only="true"
                          on-tag-added="displayResults()" on-tag-removed="displayResults(true)" placeholder="Search">
                  <auto-complete source="loadTags($query)" min-length="0"></auto-complete>
              </tags-input>
              <!--ng-class="tags.length > 0 ? 'question-icon' : 'remove-icon'"-->
              <i id="nsPopover" class="glyphicon glyphicon-question-sign question-icon"
                 ns-popover
                 ns-popover-template="menu"
                 ns-popover-trigger="click"
                 ns-popover-theme="ns-popover-tooltip-theme"
                 ns-popover-timeout="5"
                 ns-popover-placement="bottom|right"></i>
              <i class="glyphicon glyphicon-search search-icon" ng-hide="loading" ng-click="displayResults()"></i>
              <script type="text/ng-template" id="menu">
                  <div class="triangle"></div>
                  <div class="ns-popover-tooltip">
                      <h5>Hey there! Want some search tips?</h5>
                      The <strong>first word</strong> you type will be taken as the <strong>Name</strong> of the entity.
                      <br/>
                      You can search <strong>*</strong> for getting all the entities.
                      <br/>
                      The <strong>second and following</strong> words will be taken as <strong> Tags</strong>.
                      <br/>
                      For filtering by type, write <strong>type=feed|process|mirror</strong>
                  </div>
              </script>
              <i class="glyphicon glyphicon-remove remove-icon" ng-if="tags.length > 0" ng-click="clearTags()"></i>
          </div>
      </div>
  </div>

  <div class="col-sm-8 uploadNavWrapper">
    <div class="dropdown">
          <!--<img src="css/img/32x32_create-entity.png" data-ng-click="showMenu=false" class="dropdown-toggle btn-create"
            title="Create entity" id="entityMenu" data-toggle="dropdown" aria-expanded="true" role="button" />-->
          <button class="dropdown-toggle btn-create" title="Create entity" id="entityMenu"
            data-toggle="dropdown" aria-expanded="true" role="button">
            Create <span class="caret"></span>
          </button>
          <ul class="dropdown-menu" role="menu" aria-labelledby="entityMenu">
              <li role="presentation">
                  <button class="cluster btn btn-link" role="menuitem" tabindex="-1" type="button" id="cluster.create"
                    ng-click="resetCluster()" ng-disabled="isInForm('cluster')">
                    <span title="Cluster">Cluster</span>
                  </button>
              </li>
              <li role="presentation">
                  <button class="feed btn btn-link" role="menuitem" tabindex="-1" type="button" id="feed.create"
                    ng-click="resetFeed()" ng-disabled="isInForm('feed')">
                    <span title="Feed">Feed</span>
                  </button>
              </li>
              <li role="presentation">
                  <button class="process btn btn-link" role="menuitem" tabindex="-1" type="button" id="process.create"
                    ng-click="resetProcess()" ng-disabled="isInForm('process')">
                    <span title="Process">Process</span>
                  </button>
              </li>
              <li role="presentation">
                <div class="dropdown open">
                  <button class="dataset btn btn-link" role="menuitem" tabindex="-1" type="button" id="dataset.create"
                    ng-click="resetDataset('HDFS')" ng-disabled="isInForm('dataset')  && isMirror('HDFS')">
                    <span title="Mirror">Mirror</span>
                  </button>
                  <ul class="dropdown-submenu" role="menu" aria-labelledby="dataset.create">
                    <li role="presentation">
                      <button class="hdfsMirror btn btn-link" role="menuitem" tabindex="-2" type="button"
                        id="hdfsMirror.create" ng-click="resetDataset('HDFS')" ng-disabled="isInForm('dataset') && isMirror('HDFS')">
                        <span title="File System">File System</span>
                      </button>
                    </li>
                    <li role="presentation">
                      <button class="hiveMirror btn btn-link" role="menuitem" tabindex="-2" type="button"
                        id="hiveMirror.create" ng-click="resetDataset('HIVE')" ng-disabled="isInForm('dataset') && isMirror('HIVE')">
                        <span title="Hive">Hive</span>
                      </button>
                    </li>
                    <li role="presentation">
                      <button class="snapshot btn btn-link" role="menuitem" tabindex="-2" type="button"
                        id="snapshot.create" ng-click="resetSnapshot()" ng-disabled="isInForm('snapshot')">
                        <span title="Snapshot">Snapshot</span>
                      </button>
                    </li>
                  </ul>
              </li>
              <li role="presentation">
                  <button class="dataset btn btn-link" role="menuitem" tabindex="-1" type="button" id="datasource.create" ng-click="resetDatasource()" ng-disabled="isInForm('datasource')" ng-class="{disabled:isInForm('datasource')}">
                    <span title="Data Source">Data Source</span>
                  </button>
              </li>
          </ul>
      </div>
      <div class="dropdown">
          <!--<img src="css/img/32x32_upload.png" data-ng-click="showMenu=false" class="dropdown-toggle btn-upload"
          title="Upload an entity definition" id="uploadMenu" data-toggle="dropdown"
          aria-expanded="true" role="button" />-->
          <button class="dropdown-toggle btn-upload" title="Upload an entity definition" id="uploadMenu"
            data-toggle="dropdown" aria-expanded="true" role="button">Import<span class="caret"></span></button>
          <ul class="dropdown-menu" role="menu" aria-labelledby="uploadMenu">
              <li role="presentation" class="btn-file">
                  <button class="btn btn-link" role="menuitem" tabindex="-1" type="button">
                      <span title="Xml file">Xml file</span>
                  </button>
                  <input type="file"
                         id="files"
                         ng-focus="fake.focus = true"
                         ng-blur="fake.focus = false"
                         name="files[]"
                         multiple
                         fileinput-change="handleFile"
                         ng-model="fileJson" />
              </li>
          </ul>
      </div>

  </div>
</nav>

<!--
<nav class="col-sm-24 navbar navbar-default header3" role="navigation" ng-show="userLogged() && showMenu">
    <div class="col-sm-offset-4 col-sm-18">
        <div class="loginHeaderBox">
            <a class="btn btn-link" ng-click="notify()">
                <span class="glyphicon glyphicon-bell" title="Notifications"></span>
                <div class="notifications">
                    <server-messages></server-messages>
                </div>
            </a>
            <a class="btn btn-link" ng-show="userLogged() && !ambariView()" ng-click="logOut()">
                <span class="glyphicon glyphicon-log-out" title="Logout"></span>
            </a>
            <a class="btn btn-link"
              href="http://docs.hortonworks.com/HDPDocuments/HDP2/HDP-2.1.1/bk_falcon/bk_falcon-20140422.pdf"
              target="_blank">
                <span class="glyphicon glyphicon-question-sign" title="Help"></span>
            </a>
            <a class="btn btn-link" href="http://hortonworks.com/hadoop/falcon/" target="_blank">
                <span class="glyphicon glyphicon-info-sign" title="About"></span>
            </a>
        </div>
    </div>
</nav>-->