{% load i18n cms_admin admin_urls %}

{# INFO: columns are defined in base.html options #}
{% spaceless %}
<li class="cms-tree-node {{ css_class }}
    {% if follow_descendants %}{% if descendants %} jstree-open{% elif node.is_branch %} jstree-closed{% endif %}{% endif %}
    {% if page.reverse_id == 'page_types' %} cms-tree-node-pagetype{% endif %}
    {% if node.depth == 0 %} cms-tree-node-top{% endif %}
    {% if filtered %} cms-tree-node-filtered{% endif %}
    {% if has_add_permission %} cms-tree-node-root-allow-children{% endif %}
    {% block extra_class %}
        {% if is_shared_page %}
            cms-tree-node-shared-true
        {% else %}
            cms-tree-node-shared-false
        {% endif %}
    {% endblock %}
    "
    {% if is_popup %}onclick="opener.dismissRelatedLookupPopup(window, {{ page.id }}); return false;"{% endif %}
    data-id="{{ page.pk }}"
    data-node-id="{{ node.pk }}"
    data-slug="{{ page_content.slug }}"
    data-is-home="{{ page.is_home|yesno:"true,false" }}"
    data-move-permission="{{ has_move_page_permission|yesno:"true,false" }}"
    data-add-permission="{{ has_add_page_permission|yesno:"true,false" }}"
    {% block extra_data %}
        {% if is_shared_page %}
            data-shared-page="-true"
        {% else %}
            data-shared-page="-false"
        {% endif %}
    {% endblock %}
    data-colview='
        <div class="cms-tree-col">
            <div class="cms-tree-item-wrapper">
                {% block row_icon %}
                    {% if page.is_home %}
                        <div class="cms-tree-item cms-tree-item-icons">
                            <div class="cms-tree-item-inner">
                                <div class="cms-hover-tooltip cms-hover-tooltip-left cms-hover-tooltip-delay"
                                    data-cms-tooltip="{% autoescape on %}{% trans 'Home' %}{% endautoescape %}">
                                    <span class="cms-icon cms-icon-home"></span>
                                </div>
                            </div>
                        </div>
                    {% endif %}
                    {% if page_content.soft_root and is_concrete %}
                        <div class="cms-tree-item cms-tree-item-icons">
                            <div class="cms-tree-item-inner">
                                <div class="cms-hover-tooltip cms-hover-tooltip-left cms-hover-tooltip-delay"
                                    data-cms-tooltip="{% autoescape on %}{% trans 'Softroot' %}{% endautoescape %}">
                                    <a href="{% url opts|admin_urlname:'change' page_content.pk %}">
                                        <span class="cms-icon cms-icon-sitemap"></span>
                                    </a>
                                </div>
                            </div>
                        </div>
                    {% endif %}
                    {% if page.application_urls %}
                        <div class="cms-tree-item cms-tree-item-icons">
                            <div class="cms-tree-item-inner">
                                <div class="cms-hover-tooltip cms-hover-tooltip-left cms-hover-tooltip-delay"
                                    data-cms-tooltip="{% autoescape on %}{% blocktrans with page.application_urls as apphook%}Application: {{ apphook }}{% endblocktrans %}{% endautoescape %}">
                                    <a href="{% url 'admin:cms_page_advanced' page.pk %}">
                                        <span class="cms-icon cms-icon-apphook"></span>
                                    </a>
                                </div>
                            </div>
                        </div>
                    {% endif %}
                {% endblock %}
            </div>
        </div>
    '
    data-colpreview='
        <div class="cms-tree-col">
            <div class="cms-tree-item cms-tree-item-preview
                {# INFO: highlight active icon when in sidebar mode #}
                {% if page.id|slugify == request.GET.page_id|slugify %} cms-tree-preview-active{% endif %}">
                <div class="cms-tree-item-inner cms-hover-tooltip cms-hover-tooltip-left cms-hover-tooltip-delay" data-cms-tooltip="{% autoescape on %}{% trans "View on site" %}{% endautoescape %}">
                    {% if page_content %}
                        <a class="js-cms-pagetree-page-view cms-icon-view" href="{% get_preview_url page_content %}"{% if lang in page_languages %} target="_top"{% endif %}">
                            <span class="sr-only">{% autoescape on %}{% trans "View on site" %}{% endautoescape %}</span>
                        </a>
                    {% endif %}
                </div>
            </div>
        </div>
    '
    data-col{{ preview_language|lower|cut:'-' }}='
        <div class="cms-tree-col">
            <div class="cms-tree-item cms-tree-item-lang">
                <div class="cms-tree-item-inner cms-pagetree-dropdown js-cms-pagetree-dropdown">
                    {% tree_publish_row_menu page preview_language as dropdown_menu %}
                    {% if dropdown_menu %}
                        <a href="#" class="cms-pagetree-dropdown-trigger js-cms-pagetree-dropdown-trigger">
                    {% endif %}
                        <span class="cms-tree-lang-container">
                            {% tree_publish_row page preview_language %}
                        </span>
                    {% if dropdown_menu %}
                        </a>
                        {{ dropdown_menu }}
                    {% endif %}
                </div>
            </div>
        </div>
    '
    data-colmenu='
        <div class="cms-tree-col">
            <div class="cms-tree-item cms-tree-item-menu{% if not has_change_permission %} cms-tree-item-disabled{% endif %} js-cms-tree-item-menu">
                <div class="cms-tree-item-inner">
                    {% if page_content and is_concrete and has_change_permission %}
                        <a href="{% url opts|admin_urlname:'change_innavigation' page_content.pk %}">
                    {% endif %}
                    {% if is_concrete and page_content.in_navigation %}
                        <div class="cms-hover-tooltip cms-hover-tooltip-left cms-hover-tooltip-delay"
                            data-cms-tooltip="{% autoescape on %}{% trans "in menu" %}{% endautoescape %}">
                            <span class="cms-icon cms-icon-check-square"></span>
                        </div>
                    {% else %}
                        <div class="cms-hover-tooltip cms-hover-tooltip-left cms-hover-tooltip-delay"
                            data-cms-tooltip="{% autoescape on %}{% trans "not in menu" %}{% endautoescape %}">
                            <span class="cms-icon cms-icon-minus-square"></span>
                        </div>
                    {% endif %}
                    {% if has_change_permission %}
                        </a>
                    {% endif %}
                </div>
            </div>
        </div>
    '
    data-coloptions='
        <div class="cms-tree-col cms-tree-col-padding-sm">
            <div class="cms-tree-item-wrapper">
                <div class="cms-tree-item cms-tree-item-button">
                    {% get_admin_url_for_language page preview_language as content_admin_url %}
                    <div{% if has_change_permission and has_change_advanced_settings_permission and content_admin_url %} class="cms-hover-tooltip cms-hover-tooltip-left cms-hover-tooltip-delay"
                        data-cms-tooltip="{% trans "Page settings (SHIFT click for advanced settings)" %}"{% endif %}>
                        {% if content_admin_url and page_content %}
                        <a href="{{ content_admin_url }}"
                            class="cms-btn cms-btn-default js-cms-tree-advanced-settings cms-icon cms-icon-settings"
                            {% if has_change_advanced_settings_permission %}
                            data-url="{% url 'admin:cms_page_advanced' page.id %}"
                            {% endif %}
                            >
                        {% else %}
                            <span class="cms-btn cms-btn-default cms-btn-disabled js-cms-tree-advanced-settings cms-icon cms-icon-settings">
                        {% endif %}
                            <span class="sr-only">{% trans "Page settings (SHIFT click for advanced settings)" %}</span>
                        {% if has_change_permission and content_admin_url or has_change_advanced_settings_permission %}
                        </a>
                        {% endif %}
                    </div>
                </div>
                <div class="cms-tree-item cms-tree-item-button">
                    <div{% if has_add_page_permission %} class="cms-hover-tooltip cms-hover-tooltip-left cms-hover-tooltip-delay"
                        data-cms-tooltip="{% autoescape on %}{% trans 'New sub page' %}{% endautoescape %}"{% endif %}>
                        {% if has_add_page_permission %}
                            <a href="{% url opts|admin_urlname:'add' %}?parent_node={{ node.pk }}&language={{ lang }}"
                                class="js-cms-pagetree-add-page cms-btn cms-btn-default cms-icon cms-icon-plus">
                        {% else %}
                            <span class="cms-btn cms-btn-default cms-btn-disabled cms-icon cms-icon-plus">
                        {% endif %}
                                <span class="sr-only">{% autoescape on %}{% trans 'New sub page' %}{% endautoescape %}</span>
                        {% if has_add_page_permission %}
                            </a>
                        {% else %}
                            </span>
                        {% endif %}
                    </div>
                </div>
                <div class="js-cms-pagetree-actions-dropdown cms-tree-item cms-tree-item-button cms-pagetree-dropdown js-cms-pagetree-dropdown" data-lazy-url="{% url 'admin:cms_page_actions_menu' page.pk %}">
                    <a data-node-id="{{ node.pk }}" data-id="{{ page.pk }}" href="#" class="js-cms-pagetree-dropdown-trigger js-cms-pagetree-options cms-pagetree-dropdown-trigger cms-btn cms-btn-default cms-btn-no-border cms-icon cms-icon-menu">
                        <span class="sr-only">{% autoescape on %}{% trans "Options" %}{% endautoescape %}</span>
                    </a>

                    <div class="js-cms-pagetree-dropdown-menu cms-pagetree-dropdown-menu cms-pagetree-dropdown-menu-arrow-right-top">
                        <div class="js-cms-pagetree-dropdown-loader cms-pagetree-dropdown-loader">
                        </div>
                        {# dummy structure #}
                        <ul class="cms-pagetree-dropdown-menu-inner">
                            <li>
                                <a class="cms-pagetree-dropdown-item-disabled" href="#" title="{% autoescape on %}{% trans 'Copy' %}{% endautoescape %}">
                                    <span class="cms-icon cms-icon-copy"></span>
                                    <span>{% autoescape on %}{% trans 'Copy' %}{% endautoescape %}<span>
                                </a>
                            </li>
                            <li class="">
                                <a href="#" class="cms-pagetree-dropdown-item-disabled" title="{% autoescape on %}{% trans 'Cut' %}{% endautoescape %}">
                                    <span class="cms-icon cms-icon-cut"></span>
                                    <span>{% autoescape on %}{% trans 'Cut' %}{% endautoescape %}<span>
                                </a>
                            </li>
                            <li>
                                <a href="#" data-node-id="{{ node.pk }}" data-id="{{ page.pk }}" class="cms-pagetree-dropdown-item-disabled">
                                    <span class="cms-icon cms-icon-paste"></span>
                                    <span>{% autoescape on %}{% trans "Paste" %}{% endautoescape %}</span>
                                </a>
                            </li>
                            <li>
                                <a class="cms-pagetree-dropdown-item-disabled" href="#" title="{% autoescape on %}{% trans 'Delete' %}{% endautoescape %}">
                                    <span class="cms-icon cms-icon-bin"></span>
                                    <span>{% autoescape on %}{% trans 'Delete' %}...{% endautoescape %}</span>
                                </a>
                            </li>
                            <li>
                                <a class="cms-pagetree-dropdown-item-disabled" href="#" title="{% autoescape on %}{% trans "Advanced settings" %}{% endautoescape %}">
                                    <span class="cms-icon cms-icon-advanced-settings"></span>
                                    <span>{% autoescape on %}{% trans "Advanced settings" %}{% endautoescape %}</span>
                                </a>
                            </li>
                            {% if CMS_PERMISSION %}
                                <li>
                                    <a href="#" class="cms-pagetree-dropdown-item-disabled">
                                        <span class="cms-icon cms-icon-lock"></span>
                                        <span>{% autoescape on %}{% trans "Permissions" %}{% endautoescape %}</span>
                                    </a>
                                </li>
                            {% endif %}
                        </ul>
                    </div>
                </div>
            </div>
        </div>
    '
    {% block extra_cols %}{% endblock %}
    >

    {% language LANGUAGE_CODE %}
        {% get_page_display_name page %}
    {% endlanguage %}

    {# INFO render children #}
    {% if descendants %}
        <ul>
            {% show_admin_menu_for_pages descendants depth=node.depth|add:1 %}
        </ul>
    {% endif %}
</li>
{% endspaceless %}
