#*
 * Copyright 2012 LinkedIn Corp.
 *
 * Licensed 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.
*#

<style type="text/css">
  #banner {
    width: 100%;
    background: orange;
    height: 70px;
    position: float;
    top: 0;
    display: none;
    left: 0;
    text-align: center;
    line-height: 70px;
    font-weight: bold;
  }

  #banner span:hover {
    color: red;
    cursor: pointer;
  }
</style>
<script type="text/javascript">
  function navMenuClick(url) {
    window.location.href = url;
  }

  $(function(){

    if( $("#banner").data("id").indexOf('$') == -1  && $('#banner').is(':empty') == false) {
      $('#banner').attr('Target', '_blank');
      $("#banner").on("click", function(){
        window.open($("#banner").data("url"));
      });

      $("#banner").slideDown(function()  {
        if($("#banner").data("id") == "Warning") {
          $('#bannerText').append('<img ' + 'src=' + '"images/warning.png"' + ' width="50" height="50" ' + ' style=' + '"display:inline;" >' + ' </img>');
          $('#bannerText').append('<span style="font-size: 150%;" >' + $("#banner").data("message") + '</span>');
        } else if ($("#banner").data("id") == "Action Required") {
          $('#bannerText').append('<img ' + 'src=' + '"images/warning.png"' + ' width="50" height="50" ' + ' style=' + '"display:inline;" >' + ' </img>');
          $('#bannerText').append('<span style="font-size: 150%;" >' + $("#banner").data("id") + ":    " + '</span>');
          $('#bannerText').append('<span style="font-size: 150%;" >' + $("#banner").data("message") + '</span>');
        }
        // The banner will side up after 30 seconds
        setTimeout(function() {
          $("#banner").slideUp();
        }, 30000);
      });
    }
  });
</script>

<div id='banner' data-id="$note_type" data-message="$note_message" data-url="$note_url" >
    <div id="bannerText">
    </div>
</div>

<div class="navbar navbar-inverse navbar-static-top">
    <div class="container-full">
        <div class="navbar-header">
            <div class="navbar-logo">
                <a href="${context}/">Azkaban</a>
                <div class="navbar-version">
                    ${version}
                </div>
            </div>

        </div>
        <div class="navbar-left navbar-enviro">
            <div class="navbar-enviro-name">${azkaban_name}</div>
            <div class="navbar-enviro-server">${azkaban_label}</div>
        </div>
        <div class="navbar-collapse collapse">
          #if ($navbar_disabled != 1)
              <ul class="nav navbar-nav">
                  <li#if($current_page == 'all') class="active"#end onClick="navMenuClick('$!context/')"><a
                          href="$!context/index">Projects</a></li>
                  <li#if($current_page == 'schedule') class="active"#end onClick="navMenuClick('$!context/schedule')"><a
                          href="$!context/schedule">Scheduling</a></li>
                  <!--<li#if($current_page ==
                    'triggers') class="active"#end onClick="navMenuClick('$!context/triggers')"><a href="$!context/triggers">Triggers</a></li>-->
                  <li#if($current_page == 'executing') class="active"#end onClick="navMenuClick('$!context/executor')">
                      <a href="$!context/executor">Executing</a></li>
                  <li#if($current_page == 'history') class="active"#end onClick="navMenuClick('$!context/history')"><a
                          href="$!context/history">History</a></li>
                #foreach ($viewer in $viewers)
                  #if (!$viewer.hidden)
                      <li#if($current_page == $viewer.pluginName) class="active"#end
                                                                  onClick="navMenuClick('$!context/$viewer.pluginPath')">
                          <a href="$!context/$viewer.pluginPath">$viewer.pluginName</a></li>
                  #end
                #end

                #foreach ($trigger in $triggerPlugins)
                  #if (!$trigger.hidden)
                      <li#if($current_page == $trigger.pluginName) class="active"#end
                                                                   onClick="navMenuClick('$!context/$trigger.pluginPath')">
                          <a href="$!context/$trigger.pluginPath">$trigger.pluginName</a></li>
                  #end
                #end
              </ul>
              <ul class="nav navbar-nav navbar-right">
                  <li class="dropdown">
                      <a href="#" class="dropdown-toggle" data-toggle="dropdown">${user_id} <b class="caret"></b></a>
                      <ul class="dropdown-menu">
                          <li><a href="$!context?logout">Logout</a></li>
                      </ul>
                  </li>
              </ul>
          #end
        </div><!--/.nav-collapse -->
    </div>
</div>
