{% load coderedcms_tags wagtailcore_tags wagtailimages_tags %}

{% block menu_item %}
    {% if value.page.live or value.link or value.document %}
    {% is_menu_item_dropdown value as has_dropdown %}
    <li class="{{liclass}} {% if has_dropdown %}dropdown{% endif %}">
        {% is_active_page page value.page as is_active_url %}
        <a href="{% block url %}#{% endblock %}"
        {% if value.settings.custom_id %}id="{{value.settings.custom_id}}"{% endif %}
        class="{{aclass}} {% if has_dropdown %}dropdown-toggle{% endif %} {% if is_active_url %}active{% endif %} {{value.settings.custom_css_class}}"
        {% if has_dropdown %}data-toggle="dropdown"
        role="button"
        aria-haspopup="true"
        aria-expanded="false"
        {% endif %}
        {% if ga_event_label %}
        data-ga-event-label="{{ ga_event_label }}"
        {% endif %}
        {% if ga_event_category %}
        data-ga-event-category="{{ ga_event_category }}"
        {% endif %}
        >
            {% if value.image %}
                {% image value.image max-200x200 as img %}
                <img src="{{img.url}}" class="w-100" alt="{{img.image.title}}"/>
            {% elif value.display_text %}
                {{value.display_text|safe}}
            {% elif value.page %}
                {{value.page.title}}
            {% elif value.document %}
                {{value.document.title}}
            {% endif %}
        </a>


        {% if has_dropdown %}
        <ul class="dropdown-menu">
            {% for sub_link in value.sub_links %}
                {% include_block sub_link with liclass="" aclass="dropdown-item" %}
            {% endfor %}
            {% if value.show_child_links %}
                {% for child in value.page.specific.get_index_children %}
                    {% is_active_page page child as is_active_child %}
                    <li><a class="dropdown-item {% if is_active_child %}active{% endif %}" href="{% pageurl child %}">{{child.title}}</a></li>
                {% endfor %}
            {% endif %}
        </ul>
        {% endif %}
    </li>
    {% endif %}

{% endblock %}