{% load i18n %}
{% load wagtailcore_tags ocyanjson %}

{% with settings.cookie_jar.CookieSettings as cookie_settings %}
    {% with request.LANGUAGE_CODE|default:'nl' as language_code %}
    {% with language_code|slice:':2' as lang %}
    {% if cookie_jar.needs_approval or cookie_jar.site_settings.strict_cookies %}
        {% if cookie_jar.needs_display or cookie_jar.cookie is None %}
        <div id="cookie_popup_body" class="cookie-consent-overlay" role="region" aria-label="{% if lang == 'ru' %}Настройки cookie{% elif lang == 'de' %}Cookie-Einstellungen{% elif lang == 'fr' %}Paramètres des cookies{% elif lang == 'es' %}Configuración de cookies{% elif lang == 'it' %}Impostazioni cookie{% elif lang == 'pt' %}Definições de cookies{% elif lang == 'en' %}Cookie settings{% else %}Cookie instellingen{% endif %}">
            <div class="cookie-consent-modal" role="dialog" aria-modal="true" aria-labelledby="cookie-consent-title">
                <div class="cookie-consent-panel is-active" id="cookie-consent-main-panel">
                    <div class="cookie-banner-title" id="cookie-consent-title">
                        <i class="fa fa-shield-halved" aria-hidden="true"></i>
                        <span>{% if lang == 'ru' %}Конфиденциальность и файлы cookie{% elif lang == 'de' %}Datenschutz & Cookies{% elif lang == 'fr' %}Confidentialité & Cookies{% elif lang == 'es' %}Privacidad y Cookies{% elif lang == 'it' %}Privacy e Cookie{% elif lang == 'pt' %}Privacidade & Cookies{% else %}Privacy & Cookies{% endif %}</span>
                    </div>
                    <div id="cookie_popup_content">
                        {% if lang == 'en' and cookie_settings.cookie_message_en %}
                            {{ cookie_settings.cookie_message_en|richtext }}
                        {% elif lang == 'de' and cookie_settings.cookie_message_de %}
                            {{ cookie_settings.cookie_message_de|richtext }}
                        {% elif lang == 'fr' and cookie_settings.cookie_message_fr %}
                            {{ cookie_settings.cookie_message_fr|richtext }}
                        {% elif lang == 'es' and cookie_settings.cookie_message_es %}
                            {{ cookie_settings.cookie_message_es|richtext }}
                        {% elif lang == 'it' and cookie_settings.cookie_message_it %}
                            {{ cookie_settings.cookie_message_it|richtext }}
                        {% elif lang == 'pt' and cookie_settings.cookie_message_pt %}
                            {{ cookie_settings.cookie_message_pt|richtext }}
                        {% elif lang == 'ru' and cookie_settings.cookie_message_ru %}
                            {{ cookie_settings.cookie_message_ru|richtext }}
                        {% elif cookie_settings.cookie_message %}
                            {{ cookie_settings.cookie_message|richtext }}
                        {% else %}
                            <p>
                                {% blocktrans %}
                                We use cookies to make sure our website works as well as possible. If you continue using this website, we assume you agree.
                                {% endblocktrans %}
                            </p>
                        {% endif %}
                    </div>
                    <div id="cookie_buttons" class="cookie-consent-actions">
                        <button type="button" id="cookie_popup_acceptButton" data-cookie-key="{{ cookie_jar.cookie_key }}">{% if lang == 'ru' %}Принять{% elif lang == 'de' %}Akzeptieren{% elif lang == 'fr' %}Accepter{% elif lang == 'es' %}Aceptar{% elif lang == 'it' %}Accetta{% elif lang == 'pt' %}Aceitar{% elif lang == 'en' %}Accept{% else %}Accepteer{% endif %}</button>
                        <button type="button" id="cookie_popup_settingsToggle">{% if lang == 'ru' %}Настройки{% elif lang == 'de' %}Einstellungen{% elif lang == 'fr' %}Paramètres{% elif lang == 'es' %}Configuración{% elif lang == 'it' %}Impostazioni{% elif lang == 'pt' %}Definições{% elif lang == 'en' %}Settings{% else %}Instellingen{% endif %}</button>
                    </div>
                    <div class="cookie-consent-hint">
                        {% if lang == 'ru' %}Вы можете изменить свои настройки cookie в любое время.{% elif lang == 'de' %}Sie können Ihre Cookie-Einstellungen jederzeit aktualisieren.{% elif lang == 'fr' %}Vous pouvez mettre à jour vos préférences de cookies à tout moment.{% elif lang == 'es' %}Puede actualizar sus preferencias de cookies en cualquier momento.{% elif lang == 'it' %}Puoi aggiornare le tue preferenze sui cookie in qualsiasi momento.{% elif lang == 'pt' %}Pode atualizar as suas preferências de cookies a qualquer momento.{% elif lang == 'en' %}You can update your cookie preferences at any time.{% else %}U kunt uw cookievoorkeuren op elk moment aanpassen.{% endif %}
                    </div>
                </div>

                <div class="cookie-consent-panel" id="cookie-consent-settings-panel">
                    <button type="button" class="cookie-consent-back" id="cookie_popup_backButton">
                        <i class="fa fa-arrow-left" aria-hidden="true"></i>
                        <span>{% if lang == 'ru' %}Назад{% elif lang == 'de' %}Zurück{% elif lang == 'fr' %}Retour{% elif lang == 'es' %}Volver{% elif lang == 'it' %}Indietro{% elif lang == 'pt' %}Voltar{% elif lang == 'en' %}Back{% else %}Terug{% endif %}</span>
                    </button>
                    <div class="cookie-banner-title">
                        <i class="fa fa-sliders" aria-hidden="true"></i>
                        <span>{% if lang == 'ru' %}Настройки cookie{% elif lang == 'de' %}Cookie-Einstellungen{% elif lang == 'fr' %}Paramètres des cookies{% elif lang == 'es' %}Configuración de cookies{% elif lang == 'it' %}Impostazioni cookie{% elif lang == 'pt' %}Definições de cookies{% elif lang == 'en' %}Cookie settings{% else %}Cookie instellingen{% endif %}</span>
                    </div>
                    <div id="cookie_popup_content_modal">
                        {% if lang == 'en' and cookie_settings.popup_cookie_message_en %}
                            {{ cookie_settings.popup_cookie_message_en|richtext }}
                        {% elif lang == 'de' and cookie_settings.popup_cookie_message_de %}
                            {{ cookie_settings.popup_cookie_message_de|richtext }}
                        {% elif lang == 'fr' and cookie_settings.popup_cookie_message_fr %}
                            {{ cookie_settings.popup_cookie_message_fr|richtext }}
                        {% elif lang == 'es' and cookie_settings.popup_cookie_message_es %}
                            {{ cookie_settings.popup_cookie_message_es|richtext }}
                        {% elif lang == 'it' and cookie_settings.popup_cookie_message_it %}
                            {{ cookie_settings.popup_cookie_message_it|richtext }}
                        {% elif lang == 'pt' and cookie_settings.popup_cookie_message_pt %}
                            {{ cookie_settings.popup_cookie_message_pt|richtext }}
                        {% elif lang == 'ru' and cookie_settings.popup_cookie_message_ru %}
                            {{ cookie_settings.popup_cookie_message_ru|richtext }}
                        {% elif cookie_settings.popup_cookie_message %}
                            {{ cookie_settings.popup_cookie_message|richtext }}
                        {% else %}
                            <p>
                                {% blocktrans %}
                                Choose which cookie categories you allow. Functional cookies are always enabled because they are required for the website to work.
                                {% endblocktrans %}
                            </p>
                        {% endif %}
                    </div>
                    {% include "cookie_jar/partials/cookie_checkboxes.html" %}
                    <div class="cookie-consent-actions cookie-consent-actions-settings">
                        <button type="button" id="cookie_popup_acceptButton_settings">{% if lang == 'ru' %}Принять{% elif lang == 'de' %}Akzeptieren{% elif lang == 'fr' %}Accepter{% elif lang == 'es' %}Aceptar{% elif lang == 'it' %}Accetta{% elif lang == 'pt' %}Aceitar{% elif lang == 'en' %}Accept{% else %}Accepteer{% endif %}</button>
                        <button type="button" id="cookie_model_saveButton" data-cookie-key="{{ cookie_jar.cookie_key }}">{% if lang == 'ru' %}Сохранить настройки{% elif lang == 'de' %}Einstellungen speichern{% elif lang == 'fr' %}Enregistrer les préférences{% elif lang == 'es' %}Guardar preferencias{% elif lang == 'it' %}Salva preferenze{% elif lang == 'pt' %}Guardar preferências{% elif lang == 'en' %}Save preferences{% else %}Voorkeuren opslaan{% endif %}</button>
                    </div>
                </div>
            </div>
        </div>
        {% endif %}
    {% endif %}
    {% endwith %}
    {% endwith %}
{% endwith %}

<script>
  (function () {
    function byId(id) {
      return document.getElementById(id);
    }

    function showSettings(event) {
      if (event) {
        event.preventDefault();
        event.stopPropagation();
      }
      var main = byId("cookie-consent-main-panel");
      var settings = byId("cookie-consent-settings-panel");
      if (main && settings) {
        main.classList.remove("is-active");
        settings.classList.add("is-active");
      }
    }

    function showMain(event) {
      if (event) {
        event.preventDefault();
      }
      var main = byId("cookie-consent-main-panel");
      var settings = byId("cookie-consent-settings-panel");
      if (main && settings) {
        settings.classList.remove("is-active");
        main.classList.add("is-active");
      }
    }

    document.addEventListener("DOMContentLoaded", function () {
      var settingsBtn = byId("cookie_popup_settingsToggle");
      var backBtn = byId("cookie_popup_backButton");
      var acceptSettingsBtn = byId("cookie_popup_acceptButton_settings");
      var acceptBtn = byId("cookie_popup_acceptButton");

      if (settingsBtn) {
        settingsBtn.addEventListener("click", showSettings);
      }
      if (backBtn) {
        backBtn.addEventListener("click", showMain);
      }
      if (acceptSettingsBtn && acceptBtn) {
        acceptSettingsBtn.addEventListener("click", function (event) {
          event.preventDefault();
          acceptBtn.click();
        });
      }
    });
  })();
</script>