{% extends "wagtailadmin/base.html" %}
{% load wagtailadmin_tags i18n static %}
{% block titletag %}
    {% blocktrans trimmed with snippet_type_name=model_opts.verbose_name %}
        Editing {{ snippet_type_name }} - {{ object }}
    {% endblocktrans %}
{% endblock %}
{% block bodyclass %}
    {% if locked_for_user %}content-locked{% endif %}
{% endblock %}
{% block content %}
    {% include 'wagtailadmin/shared/headers/slim_header.html' %}
    {% include "wagtailadmin/shared/header.html" with title=object icon=header_icon merged=1 only %}
    <div class="row row-flush">
        <div class="{% if uc_enabled %}col10 divider-after{% else %}col12{% endif %}">
            <form action="{{ action_url }}"
                  method="POST"
                  novalidate
                  {% if form.is_multipart %}enctype="multipart/form-data"{% endif %}
                  data-edit-form>
                {% csrf_token %}
                <div class="nice-padding">
                    {{ panel.render_form_content }}
                    <div id="editor_root" data-menu-id="{{ object.pk }}"></div>
                    <div>
                        <p>
                            <button class="button button-small bicolor button--icon"
                                    type="button"
                                    id="exportButton">
                                <span class="icon-wrapper">
                                    <svg class="icon icon-upload icon" aria-hidden="true">
                                        <use href="#icon-upload"></use>
                                    </svg>
                                </span>Export
                            </button>
                            <button class="button button-small bicolor button--icon"
                                    type="button"
                                    id="importButton">
                                <span class="icon-wrapper">
                                    <svg class="icon icon-download icon" aria-hidden="true">
                                        <use href="#icon-download"></use>
                                    </svg>
                                </span>Import
                            </button>
                        </p>
                        <div id="export_content" style="display: none;">
                            <textarea></textarea>
                            <button class="button button-small bicolor button--icon"
                                    type="button"
                                    id="copyButton">
                                <span class="icon-wrapper">
                                    <svg class="icon icon-copy icon" aria-hidden="true">
                                        <use href="#icon-copy"></use>
                                    </svg>
                                </span>Copy
                            </button>
                        </div>
                        <div id="import_content" style="display: none;">
                            <textarea></textarea>
                            <button class="button button-small bicolor button--icon"
                                    type="button"
                                    id="doImportButton">
                                <span class="icon-wrapper">
                                    <svg class="icon icon-download icon" aria-hidden="true">
                                        <use href="#icon-download"></use>
                                    </svg>
                                </span>Import
                            </button>
                            <span class="import_error" style="color: var(--w-color-text-error);"></span>
                        </div>
                    </div>
                </div>
                <footer class="footer">
                    <nav aria-label="{% trans 'Actions' %}">
                        <ul>
                            <li class="actions actions--primary footer__container">
                                <div class="dropdown dropup dropdown-button match-width {% if view.view_name == 'revisions_revert' %}warning{% endif %}">{{ action_menu.render_html }}</div>
                            </li>
                        </ul>
                    </nav>
                </footer>
            </form>
        </div>
    </div>
{% endblock %}
{% block extra_css %}
    {{ block.super }}
    {{ media.css }}
    <link rel="stylesheet" href="{% static "egowagtailmenus/css/primeicons.css" %}">
    <link rel="stylesheet" href="{% static "egowagtailmenus/css/editor.css" %}">
{% endblock %}
{% block extra_js %}
    {{ block.super }}
    {% include "wagtailadmin/pages/_editor_js.html" %}
    {{ media.js }}
    <script>
        // Set wagtailConfig.ACTIVE_CONTENT_LOCALE if this is a translated page
        // This value may be used by JS widgets on the form
        {% if locale %}
            window.wagtailConfig = window.wagtailConfig || {};
            window.wagtailConfig.ACTIVE_CONTENT_LOCALE = '{{ locale.language_code|escapejs }}';
        {% endif %}
    </script>
    {% if workflow_enabled %}
        {% include "wagtailadmin/shared/_workflow_init.html" %}
    {% endif %}
    <script src="{% static "egowagtailmenus/js/editor.js" %}"></script>
{% endblock %}