<!DOCTYPE html>
<html lang="fr">
  <head>
    {% block head %}
      <title>{% block title %}{% trans %}Welcome!{% endtrans %}{% endblock %} - Association des Étudiants UTBM</title>
      <meta name="viewport" content="width=device-width, initial-scale=1.0">
      <link rel="shortcut icon" href="{{ static('core/img/favicon.ico') }}">
      <link rel="stylesheet" href="{{ static('core/base.css') }}">
      <link rel="stylesheet" href="{{ static('core/style.scss') }}">
      <link rel="stylesheet" href="{{ static('core/markdown.scss') }}">
      <link rel="stylesheet" href="{{ static('core/header.scss') }}">
      <link rel="stylesheet" href="{{ static('core/navbar.scss') }}">
      <link rel="stylesheet" href="{{ static('core/pagination.scss') }}">

      {% block jquery_css %}
        {# Thile file is quite heavy (around 250kb), so declaring it in a block allows easy removal #}
        <link rel="stylesheet" href="{{ static('bundled/jquery-ui-index.css') }}">
      {% endblock %}
      <link rel="preload" as="style" href="{{ static('bundled/fontawesome-index.css') }}" onload="this.onload=null;this.rel='stylesheet'">
      <noscript><link rel="stylesheet" href="{{ static('bundled/fontawesome-index.css') }}"></noscript>

      <script src="{{ url('javascript-catalog') }}"></script>
      <script type="module" src={{ static("bundled/core/components/include-index.ts") }}></script>
      <script type="module" src="{{ static('bundled/alpine-index.js') }}"></script>
      <script type="module" src="{{ static('bundled/htmx-index.js') }}"></script>

      <!-- Jquery declared here to be accessible in every django widgets -->
      <script src="{{ static('bundled/vendored/jquery.min.js') }}"></script>
      <script src="{{ static('bundled/vendored/jquery-ui.min.js') }}"></script>
      <script src="{{ static('core/js/script.js') }}"></script>



      {% block additional_css %}{% endblock %}
      {% block additional_js %}{% endblock %}
    {% endblock %}
  </head>

  <body>

    <!-- The token is always passed here to be accessible from the dom -->
    <!-- See this workaround https://docs.djangoproject.com/en/2.0/ref/csrf/#acquiring-the-token-if-csrf-use-sessions-is-true -->
    {% csrf_token %}

    {% block header %}
      {% if not popup %}
        {% include "core/base/header.jinja" %}

        {% block info_boxes %}
          <div id="info_boxes">
            {% set sith = get_sith() %}
            {% if sith.alert_msg %}
              <div id="alert_box">
                {{ sith.alert_msg|markdown }}
              </div>
            {% endif %}
            {% if sith.info_msg %}
              <div id="info_box">
                {{ sith.info_msg|markdown }}
              </div>
            {% endif %}
          </div>
        {% endblock %}

      {% else %}
        <div id="popupheader">{{ user.get_display_name() }}</div>
      {% endif %}

    {% endblock %}

    {% block nav %}
      {% if not popup %}
        {% include "core/base/navbar.jinja" %}
      {% endif %}
    {% endblock %}

    <div id="page">

      <ul id="quick_notif">
        {% for n in quick_notifs %}
          <li>{{ n }}</li>
        {% endfor %}
      </ul>

      <div id="content">
        {% block tabs %}
          {% include "core/base/tabs.jinja" %}
        {% endblock %}

        {% block errors%}
          {% if error %}
            {{ error }}
          {% endif %}
        {% endblock %}

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

    {% if not popup %}
      <footer>
        {% block footer %}
          <div>
            <a href="{{ url('core:page', 'contacts') }}">{% trans %}Contacts{% endtrans %}</a>
            <a href="{{ url('core:page', 'legals') }}">{% trans %}Legal notices{% endtrans %}</a>
            <a href="{{ url('core:page', 'copyright_agent') }}">{% trans %}Intellectual property{% endtrans %}</a>
            <a href="{{ url('core:page', 'docs') }}">{% trans %}Help & Documentation{% endtrans %}</a>
            <a href="{{ url('core:page', 'rd') }}">{% trans %}R&D{% endtrans %}</a>
          </div>
          <a href="https://discord.gg/XK9WfPsUFm" target="_link">
            {% trans %}Site created by the IT Department of the AE{% endtrans %}
          </a>
        {% endblock %}
        <br>
      </footer>
    {% endif %}

    {% block script %}
      <script>
        function showMenu() {
          let navbar = document.getElementById("navbar-content");
          const current = navbar.style.getPropertyValue("display");
          navbar.style.setProperty("display", current === "none" ? "block" : "none");
        }

        $(document).keydown(function (e) {
          if ($(e.target).is('input')) { return }
          if ($(e.target).is('textarea')) { return }
          if ($(e.target).is('select')) { return }
          if (e.keyCode === 83) {
            $("#search").focus();
            return false;
          }
        });
      </script>
    {% endblock %}
  </body>
</html>
