<!DOCTYPE html>
<html>
  <head>
    <META http-equiv="Content-Type" content="text/html; charset=UTF-8">
    <meta name="viewport" content="width=device-width, initial-scale=1">
    <title>yenu -- the image sharing tool for friends</title>
    {% if identity %}
    <link rel="alternate" type="application/atom+xml" title="Images" href="/feed?password={{ passwordhash }}" />
    {% endif %}
  </head>
  <body>

    <nav class="navbar navbar-expand-lg bg-dark navbar-dark">
      <div class="container-fluid">

        {% if identity %}
        <button class="navbar-toggler" type="button" data-bs-toggle="collapse" data-bs-target="#navbarSupportedContent" aria-controls="navbarSupportedContent" aria-expanded="false" aria-label="Toggle navigation">
          <span class="navbar-toggler-icon"></span>
        </button>
        {% endif %}

        <a class="navbar-brand" href="/">
          <img src="/img/logo.png">
          yenu
        </a>

        <div class="collapse navbar-collapse" id="navbarSupportedContent">
          <ul class="navbar-nav mr-auto mt-2 mt-md-0">
            {% if identity %}
            {% ifequal identity ":creator" %}
            <li class="nav-item">
              <a class="nav-link" href="/upload">
                <span class="fa fa-upload"></span>
                Upload
              </a>
            </li>
            <li class="nav-item">
              <a class="nav-link" href="/comments">
                <span class="fa fa-comments"></span>
                Comments
              </a>
            </li>
            <!--
                <li class="nav-item">
                  <a class="nav-link" href="/statistics">
                    <span class="fa fa-bar-chart"></span>
                    Statistics
                  </a>
                </li>
                -->
                {% endifequal %}

            <li class="nav-item">
              <a class="nav-link" href="/feed?password={{ passwordhash }}" >
                <span class="fa fa-rss-square"></span>
                RSS-Feed
              </a>
            </li>
            <li class="nav-item">
              <a class="nav-link" href="/logout">
                <span class="fa fa-sign-out"></span>
                Logout
              </a>
            </li>
            {% endif %}
          </ul>
        </div>
      </div>
    </nav>

    <div id="content" class="container col-md-12">
      {% if flash.message %}
      <div class="alert alert-{{ flash.type }}" role="alert">
        {{ flash.message }}
      </div>
      {% endif %}

      {% block content %}
      {% endblock %}
    </div>

    <div class="col-md-12mt-4 mb-1">
      <hr>
      <div class="container text-muted text-end">
        <p>{{ footer }}</p>
      </div>
    </div>

    {% style "/assets/bootstrap/css/bootstrap.min.css" %}
    {% style "/assets/font-awesome/css/font-awesome.min.css" %}
    {% style "/css/screen.css" %}

    <script type="text/javascript">
     var context = "{{servlet-context}}";
     var csrfToken = "{{csrf-token}}";
     var identity = "{{identity}}";
    </script>

    {% script "/assets/jquery/jquery.min.js" %}
    {% script "/assets/tether/dist/js/tether.min.js" %}
    {% script "/assets/bootstrap/js/bootstrap.min.js" %}
    {% script "/js/main.js?v3" %}
  </body>
</html>

