{% macro head_text(url, name, bold=False) -%}
  <li>
    <a href="{{ from_base(url) }}" title="{{name}}" {%if download %}download{% endif %}>
      {% if bold %}<strong>{% endif %}
        <span>{{name}}</span>
      {% if bold %}</strong>{% endif %}
    </a>
  </li>
{%- endmacro %}


{% macro head_icon(url, name, icon, download=False) -%}
  <li>
    <a href="{{ from_base(url) }}" title="{{name}}" {%if download %}download{% endif %}>
      <span class="fa fa-{{icon}} fa-2x menu-icon"></span>
      <span class="menu-text">{{name}}</span>
    </a>
  </li>
{%- endmacro %}


{% macro link_breadcrumbs(crumbs) -%}
  {% if crumbs %}
  <ol class="breadcrumb">
    {% for crumb in crumbs %}
      <li>
        <a href="{{ from_base(crumb['url']) }}">{{crumb['name']}}</a>
      </li>
    {% endfor %}
  </ol>
  {% endif %}
{%- endmacro %}


<!DOCTYPE html>
<html lang="en">

<head>
  <meta charset="utf-8">
  <title>{{title|default("Jupyter Notebook Viewer", true)}}</title>
  <meta name="viewport" content="width=device-width, initial-scale=1.0">
  <meta name="description" content="{{ description | default('') }}">
  <meta name="author" content="{{ author | default('') }}">
  {% if not public %}
  <meta name="robots" content="noindex,nofollow">
  {% endif %}

  <!--NEW RELIC Start Perf Measurement-->
  {{ nrhead() | safe }}
  <!--NREND-->

  <!-- Le styles -->
  <link href="{{static_url("build/styles.css")}}" rel="stylesheet">

  <!-- Le HTML5 shim, for IE6-8 support of HTML5 elements -->
  <!--[if lt IE 9]>
    <script src="http://html5shim.googlecode.com/svn/trunk/html5.js"></script>
  <![endif]-->

  <!-- Le fav and touch icons -->
  <link rel="shortcut icon" href="/static/ico/ipynb_icon_16x16.png">
  <link rel="apple-touch-icon-precomposed" sizes="144x144"
        href="{{ static_url("ico/apple-touch-icon-144-precomposed.png") }}">
  <link rel="apple-touch-icon-precomposed" sizes="114x114"
        href="{{ static_url("ico/apple-touch-icon-114-precomposed.png") }}">
  <link rel="apple-touch-icon-precomposed" sizes="72x72"
        href="{{ static_url("ico/apple-touch-icon-72-precomposed.png") }}">
  <link rel="apple-touch-icon-precomposed"
        href="{{ static_url("ico/apple-touch-icon-57-precomposed.png") }}">
  {% block extra_head %}{% endblock %}
</head>

<body class="nbviewer">

  <!-- These are loaded at the top of the body so they are available to
       notebook cells when they are loaded below. -->
  <script src="{{ static_url("components/jquery/dist/jquery.min.js") }}"></script>
  <script src="{{ static_url("components/requirejs/require.js") }}"></script>
  <script src="{{ static_url("components/moment/min/moment.min.js") }}"></script>

<!-- Navbar
================================================== -->
  <nav id="menubar" class="navbar navbar-default navbar-fixed-top" data-spy="affix">
    <div class="container">
      <div class="navbar-header">
        <button type="button" class="navbar-toggle collapsed" data-toggle="collapse" data-target=".navbar-collapse">
          <span class="sr-only">Toggle navigation</span>
          <i class="fa fa-bars"></i>
        </button>
        <a class="navbar-brand" href="{{ from_base('/') }}">
          <img src="{{ static_url("img/nav_logo.svg") }}" width="159"/>
        </a>
      </div>

      <div class="collapse navbar-collapse">
        <ul class="nav navbar-nav navbar-right">
          <li>
            <a class="active" href="http://jupyter.org">JUPYTER</a>
          </li>
          {{ head_text(from_base('/faq'), "FAQ") }}

          {% block otherlinks %}
            {% if provider_url %}
              <li>
                <a href="{{provider_url}}" title="View on {{provider_label}}">
                  <i class="fa fa-{{provider_icon}} fa-2x menu-icon"></i>
                </a>
              </li>
            {% endif %}
          {% endblock %}
        </ul>
      </div><!-- /.navbar-collapse -->
      {% block menu_extra %}
      {% endblock %}
    </div>
  </nav>

  {% block container %}<div class="container container-main">
    {% block body %}{% endblock %}
  </div>{% endblock container %}


  {% block footer %}
    <footer class="footer hidden-print">
      <div class="container">
        <div class="col-md-4">
          <p>
            This website does not host notebooks, it only renders notebooks
            available on other websites.
          </p>
        </div>

        <div class="col-md-4">
          <p>
            Delivered by <a href="http://www.fastly.com/">Fastly</a>,
            Rendered by <a href="https://developer.rackspace.com/?nbviewer=awesome">Rackspace</a>
          </p>
          <p>
            nbviewer GitHub <a href="https://github.com/jupyter/nbviewer">repository</a>.
          </p>
        </div>

        <div class="col-md-4">
          {% block version_info %}
            {% if git_data %}
              <p>
                nbviewer version:
                <a href="https://github.com/jupyter/nbviewer/commit/{{git_data['sha']}}">
                  {{git_data['sha'][:7]}}
                </a>
              </p>
            {% endif %}
          {% endblock version_info %}
          {% block extra_footer %}{% endblock extra_footer %}
        </div>
      </div>
    </footer>
  {% endblock footer %}

  <script src="https://unpkg.com/jupyter-js-widgets@2.0.*/dist/embed.js"></script>
  <script src="{{ static_url("components/bootstrap/js/bootstrap.min.js") }}"></script>
  <script src="{{ static_url("components/headroom.js/dist/headroom.min.js") }}"></script>
  <script src="{{ static_url("components/headroom.js/dist/jQuery.headroom.min.js") }}"></script>

  {% block extra_script %}{% endblock %}

  {% if google_analytics_id %}
  <script>
    (function(i,s,o,g,r,a,m){i['GoogleAnalyticsObject']=r;i[r]=i[r]||function(){
      (i[r].q=i[r].q||[]).push(arguments)},i[r].l=1*new Date();a=s.createElement(o),
      m=s.getElementsByTagName(o)[0];a.async=1;a.src=g;m.parentNode.insertBefore(a,m)
    })(window,document,'script','https://www.google-analytics.com/analytics.js','ga');
    ga('create', '{{ google_analytics_id }}', 'auto');
    ga('send', 'pageview');
  </script>
  {% endif %}
  <script>
    require({
        paths: {
          moment: "{{ static_url("components/moment/min/moment.min.js") }}"
        }
      }, ["moment"], function(moment){
      var date = $("footer .date"),
        m = moment(new Date(date.data('date'))),
        update = function(){ date.text(m.fromNow()); };
      setInterval(update, 61*1000);
      update();
      var w = $(window).scroll(function(event){
        $("body").toggleClass("scrolled", w.scrollTop() > 0);
      });
    });
  </script>
  <!--NEW RELIC Stop Perf Measurement-->
  {{ nrfoot()| safe }}
  <!--NEW RELIC End-->
</body>
</html>
