{% extends "admin/background_pages/base.html" %}

{% load bulb_static static compress %}

{% block title %}Gestion{% endblock title %}

{% block head %}
    <link href="https://fonts.googleapis.com/icon?family=Material+Icons" rel="stylesheet">

    {% if DEBUG %}
        {% if not BULB_REQUIRES_INITIAL_PATHS %}
            {% compress css %}
                <link rel="stylesheet" type="text/x-scss" href="{% static "logs/css/style/logs_page.scss" %}"/>
            {% endcompress %}

        {% else %}
            <link rel="stylesheet" type="text/x-scss" href="{% static 'logs/css/style/logs_page.scss' %}"/>

        {% endif %}

    {% elif not DEBUG %}
        {% if BULB_BUNDLED_FILES_VERSION != None %}
            {% with url='logs/bundle_logs_page&V='|add:BULB_BUNDLED_FILES_VERSION|add:'.css' %}
                <link rel="stylesheet" href="{% static_bundled_src url %}"/>
            {% endwith %}

        {% else %}
            <link rel="stylesheet" href="{% static_bundled_src "logs/bundle_logs_page.css" %}"/>

        {% endif %}
    {% endif %}
{% endblock head %}

{% block administration_part_name %}
    <i class="material-icons">keyboard_arrow_right</i>

    <a class="nav-link" href="{% url "logs" %}">Logs</a>
{% endblock administration_part_name %}

{% block content %}
    <div id="log-choice">
        <button id="all-button" class="log-button">All</button>
        <button id="errors-button" class="log-button">Errors</button>
    </div>

    <div id="all-log" class="log">
        {{ all_log }}
    </div>

    <div id="errors-log" class="log" style="display: none;">
        {{ errors_log }}
    </div>

    <script>
        const all_log_button = document.querySelector("div#log-choice button#all-button")
        const errors_log_button = document.querySelector("div#log-choice button#errors-button")
        const all_log = document.querySelector("#all-log")
        const errors_log = document.querySelector("#errors-log")
        let opened_log = "all"

        let errors_log_was_opened = false;

        all_log.scrollTo(0, all_log.scrollHeight)

        all_log_button.addEventListener("click", function () {
            if (opened_log === "errors") {
                all_log.style.display = "block";
                errors_log.style.display = "none";
                opened_log = "all";
            }
        })

        errors_log_button.addEventListener("click", function () {
            if (opened_log === "all") {
                all_log.style.display = "none";
                errors_log.style.display = "block";
                opened_log = "errors";
            }

            if (!errors_log_was_opened) {
                errors_log.scrollTo(0, errors_log.scrollHeight)
                errors_log_was_opened = true;
            }
        })
    </script>
{% endblock content %}

{% block scripts %}{% endblock scripts %}
