{%- import '_macros_site.html' as macros_site with context -%}
{%- import '_macros_page.html' as macros_page with context -%}
{%- import '_macros_form.html' as macros_form with context -%}
{%- import '_macros_chart.html' as macros_chart with context -%}
<!DOCTYPE html>
<html lang="en">
    <!--
    ============================================================================
        HEADER
    ============================================================================
    -->
    <head>
{%- block head %}

        <!----------------------------------------------------------------------
            Required meta tags
        ----------------------------------------------------------------------->
        <meta charset="utf-8">
        <meta name="viewport" content="width=device-width, initial-scale=1, shrink-to-fit=no">

    {%- block headcss %}

        <!----------------------------------------------------------------------
            Head CSS
        ----------------------------------------------------------------------->

        <!-- Font Awesome -->
        <link rel="stylesheet" href="{{ url_for('static', filename='vendor/font-awesome/css/solid.min.css') }}">
        <link rel="stylesheet" href="{{ url_for('static', filename='vendor/font-awesome/css/regular.min.css') }}">
        <link rel="stylesheet" href="{{ url_for('static', filename='vendor/font-awesome/css/brands.min.css') }}">
        <link rel="stylesheet" href="{{ url_for('static', filename='vendor/font-awesome/css/fontawesome.min.css') }}">

        <!-- Bootstrap CSS -->
        <link rel="stylesheet" href="{{ url_for('static', filename='vendor/bootstrap/css/bootstrap.min.css') }}">
        <link rel="stylesheet" href="{{ url_for('static', filename='vendor/tom-select/css/tom-select.bootstrap5.min.css') }}">
        <link rel="stylesheet" href="{{ url_for('static', filename='vendor/@eonasdan/tempus-dominus/css/tempus-dominus.min.css') }}">

        <!-- Custom CSS -->
        <link rel="stylesheet" href="{{ url_for('static', filename='css/hawat.css') }}">
    {%- endblock headcss %}

    {%- block headjs %}

        <!----------------------------------------------------------------------
            Head JS
        ----------------------------------------------------------------------->

        <!-- Flask JSGlue plugin -->
        {{ JSGlue.include() }}

        <!-- @popperjs/core -->
        <script defer src="{{ url_for('static', filename='vendor/popperjs/js/popper.min.js') }}"></script>

        <!-- jQuery -->
        <script defer src="{{ url_for('static', filename='vendor/jquery/js/jquery.min.js') }}"></script>

        <!-- Plotly chart library -->
        <script defer src="{{ url_for('static', filename='vendor/plotly/js/plotly.min.js') }}"></script> {# Maybe plotly-basic.min.js #}

        <!-- Localization initializations -->
        <script>

            // These global variables must be defined here to bypass browser caching,
            // they might change with each request.
            const GLOBAL_LOCALE   = "{{ babel_get_locale() }}"
            const GLOBAL_TIMEZONE = "{{ babel_get_timezone() }}"

        </script>

        <!-- Main application library -->
        <script defer src="{{ url_for('mainjs') }}"></script>

        <!-- Custom libraries -->
        <script defer src="{{ url_for('static', filename='js/hawat-charts.js') }}"></script>
    {%- endblock headjs %}

        <!----------------------------------------------------------------------
            Page metadata
        ----------------------------------------------------------------------->
        <link rel="shortcut icon" href="{{ url_for('static', filename='favicon.ico') }}">

        <title>{% block title %}{{ hawat_current_view.get_view_title() }}{% endblock title %} - Mentat</title>
{%- endblock head %}
    </head>

    <!--
    ============================================================================
        BODY
    ============================================================================
    -->
    <body>
        <!--
        inner bodies are here to allow bootstrap to use both popovers and
        tooltips on dynamically added HTML elements without printing errors into
        the console.
        -->
        <div id="inner-body-1">
            <div id="inner-body-2">
{%- block body %}

        <div id="ajax-loader-overlay">
            <div id="ajax-loader">
                {{ get_icon('ajax-loader') }}
                <hr>
                <h3><strong>{{ _('... LOADING ...') }}</strong></h3>
            </div>
        </div>

        <!-- Fixed header and navbar - BEGIN ---------------------------------->
        <nav class="navbar navbar-expand-sm navbar-light navbar-fixed-top bg-light mb-3">
            <div class="container-fluid">
                <a id="navbar-header" class="navbar-brand" href="{{ url_for(config['ENDPOINT_HOME']) }}">
                    <img src="{{ url_for('static', filename='images/app-logo-mini.png') }}" class="mentat-logo-mini" alt="Mentat logo">
                    {{ hawat_appname }}
                </a>
                <button class="navbar-toggler" type="button" data-bs-toggle="collapse" data-bs-target="#navbarContent" aria-controls="navbarContent" aria-expanded="false" aria-label="_('Toggle navigation')">
                    <span class="navbar-toggler-icon"></span>
                </button>

                <div class="collapse navbar-collapse" id="navbarContent">
                    {{ macros_site.render_menu_main() }}
                    <ul class="navbar-nav">
                        {{ macros_site.render_submenu_auth() }}
                        {{ macros_site.render_locale_switcher() }}
                        {%- if hawat_current_view.has_help %}
                        <li class="nav-item">
                            {{ macros_page.render_help_link(icon = 'help', text = '', in_navbar = True) }}
                        </li>
                        {%- endif %}
                    </ul>
                </div>
            </div>
        </nav>
        <!-- Fixed header and navbar - END ------------------------------------>

        <!-- Content container - BEGIN ---------------------------------------->
        <div class="container-fluid px-3">

            <!-- Flashed messages - BEGIN ------------------------------------->
            <div class="container-flashed-messages">
            {%- with messages = get_flashed_messages(with_categories=true) %}
                {%- if messages %}
                    {%- for category, message in messages %}
                {%- call macros_site.render_alert(category) %}
                    {{ message }}
                {%- endcall %}
                    {%- endfor %}
                {%- endif %}
            {%- endwith %}
            </div>
            <!-- Flashed messsages - END -------------------------------------->

            <!-- Content - BEGIN ---------------------------------------------->
            {%- block content %}{% endblock content %}
            <!-- Content - END ------------------------------------------------>

        </div> <!-- /container-fluid -->
        <!-- Content container - END ------------------------------------------>

        <!-- Footer container - BEGIN ----------------------------------------->
        <div class="container-fluid" id="footer">
            <hr>
            <span data-bs-toggle="tooltip" title="{{ _('Page generated at: ') }}">{{ get_icon('clock') }}</span><span class="d-sm-none d-md-inline-block"> <em>{{ _('Page generated at: ') }}</em></span> {{ babel_format_datetime(current_datetime_utc) }} |
            <span data-bs-toggle="tooltip" title="{{ _('Page generated in: ') }}">{{ get_icon('stopwatch') }}</span><span class="d-sm-none d-md-inline-block"> <em>{{ _('Page generated in: ') }}</em></span> {{ get_timedelta(g.requeststart) }}
            <br>
            <span data-bs-toggle="tooltip" title="{{ hawat_bversion_full }}">
                {{ hawat_appname }} {{ hawat_version }}
            </span> |
            © {{ _('since') }} 2011 |
            <a data-bs-toggle="tooltip" title="Go to official web page of CESNET-CERTS, the CSIRT for CESNET2 network" href="https://csirt.cesnet.cz">
                CESNET-CERTS
            </a> |
            <a data-bs-toggle="tooltip" title="Go to official web page of CESNET organization, the NREN for Czech republic" href="https://www.cesnet.cz">
                {{ _('CESNET, a.l.e.') }}
            </a>
        </div>
        <!-- Footer container - END ------------------------------------------->

    {%- block bodyjs %}

        <!-- Optional JavaScript ---------------------------------------------->
        <script defer src="{{ url_for('static', filename='vendor/bootstrap/js/bootstrap.min.js') }}"></script>
        <script defer src="{{ url_for('static', filename='vendor/tom-select/js/tom-select.popular.min.js') }}"></script>

        <script defer src="{{ url_for('static', filename='vendor/@eonasdan/tempus-dominus/js/tempus-dominus.min.js') }}"></script>
        <script defer src="{{ url_for('static', filename='js/hawat-jquery.js') }}"></script>
    {%- endblock bodyjs %}

{%- endblock body %}
            </div>
        </div>
    </body>
</html>
