{% extends settings.TEMPLATE_LAYOUT %}
{% load static %}

{% block navbar %}
  {% if not app_platform.platform %}
    {% with view_name=request.resolver_match.view_name %}
    <nav class="navbar navbar-expand-xl bg-dark static-top" id="dynamic-navbar">
      <div class="container">
        <a class="navbar-brand" href="/">
          <svg width="100" height="30">
            <use href="#svg-logo-full" />
          </svg>
        </a>
        <button class="navbar-toggler" type="button" data-toggle="collapse" data-target="#navbarResponsive"
          aria-controls="navbarResponsive" aria-expanded="false" aria-label="Toggle navigation">
          <span class="navbar-toggler-icon"></span>
        </button>
        <div class="collapse navbar-collapse" id="navbarResponsive">
          <ul class="navbar-nav">
            {% if user.is_authenticated %}
            <li class="nav-item {% if  'printers' in view_name %}active{% endif %}">
              <a class="nav-link" href="/printers/">Printer
              </a>
            </li>
            <li class="nav-item {% if  'prints' in view_name %}active{% endif %}">
              <a class="nav-link" href="/prints/">Time-lapse
              </a>
            </li>
            <li class="nav-item {% if  'gcodes' in view_name %}active{% endif %}">
              <a class="nav-link" href="/gcodes/">G-Code
              </a>
            </li>
            {% endif %}
            {% block nav_item_pricing %}{% endblock nav_item_pricing %}
            <li class="nav-item">
              <a class="nav-link" href="https://www.obico.io/help/">Help</a>
            </li>
            <li class="nav-item">
              <a class="nav-link" href="https://obico.io/discord">Community</a>
            </li>
          </ul>
          <ul class="navbar-nav ml-auto">
            {% if not user.is_authenticated %}
              <li class="nav-item">
                <a class="nav-link" href="/accounts/login/">SIGN IN</a>
              </li>
              {% if settings.ACCOUNT_ALLOW_SIGN_UP %}
              <li class="nav-item">
                <a class="nav-link" href="/accounts/signup/">Sign up</a>
              </li>
              {% endif %}
            {% else %}
            <li class="nav-item dropdown">
              <a class="nav-link dropdown-toggle user-menu" data-toggle="dropdown" href="#" id="{{user.id}}"
                aria-expanded="false">{{user.first_name|default:user.email}}
                <span class="caret"></span></a>
              <div class="dropdown-menu dropdown-menu-right" aria-labelledby="themes">
                <a class="dropdown-item" href="/user_preferences/"><i class="fas fa-sliders-h"></i>Preferences</a>
                {% block nav_item_account %}{% endblock nav_item_account %}
                <div class="dropdown-divider"></div>
                <a class="dropdown-item" href="/accounts/logout/"><i class="fas fa-sign-out-alt"></i>Log out</a>
              </div>
            </li>
            {% endif %}
          </ul>
        </div>
      </div>
    </nav>
    {% endwith %}
  {% endif %}
{% endblock navbar %}


{% block page_js %}
<!-- Dark/Light theme -->
<script type="module" src="{% static 'js/static-color-scheme-controller.js' %}"></script>
{% endblock page_js %}