{% extends 'base.html' %}
{% load static %}
{% load crispy_forms_tags %}
{% load products_filters %}

{% block content %}
    <div class="col-4 left-menu">
        {#        just form search #}
        {% if left_product_search_form %}
            <div class="left-menu__search">
                {% crispy left_product_search_form %}
            </div>
        {% endif %}

        {% block extra_left_menu_items %}
        {% endblock extra_left_menu_items %}

        {% if the_product_category or product_categories %}
            <div class="left-menu__category">
                {% if the_product_category and the_product_category.parent %}
                    <a class="left-menu__category-item"
                       href="{{ the_product_category.parent.get_absolute_url }}">
                        {% if category.image %}
                            <span class="category-item__image">
                            <img src="{{ category.image.url }}" alt="{{ category.name }}">
                        </span>
                        {% endif %}
                        <span class="category-item__name">Вернуться в {{ the_product_category.parent.name }}</span>
                    </a>
                {% elif the_product_category %}
                    <a class="left-menu__category-item"
                       href="{% url 'products:product_list' %}">
                        <span class="category-item__name">Вернуться в Каталог</span>
                    </a>
                {% endif %}
                {% if product_categories %}
                    {% for category in product_categories %}
                        <a class="left-menu__category-item"
                           href="{{ category.get_absolute_url }}">
                            {% if category.image %}
                                <span class="category-item__image">
                                    <img src="{{ category.image.url }}" alt="{{ category.name }}">
                                </span>
                            {% endif %}
                            <span class="category-item__name">{{ category.name }}</span>
                        </a>
                    {% endfor %}
                {% endif %}
            </div>
        {% endif %}
        {% if left_contact_us_form %}
            <div class="left-menu__contact">
                <div class="left-menu__title">
                    Не нашли нужную программу или разработчика?
                    Заполните форму и с Вами свяжется наш специалист.
                </div>
                {% if contact_us_form_message %}
                    <div class="text-{% if "success" in contact_us_form_message.tags %}success{% elif "error" in contact_us_form_message.tags %}danger{% endif %}">
                        {{ contact_us_form_message }}
                    </div>
                {% endif %}
                {% crispy left_contact_us_form %}
            </div>
        {% endif %}
    </div>
    <div class="col-lg-8 col-md-12">
        <div class="content">
            <div class="content__menu">
                <div class="row">
                    <div class="col-5 d-flex justify-content-start align-items-center">
                        <button id="content__category-btn" class="content__menu-btn">Разделы сайта</button>
                    </div>
                    {% if content_product_search_form %}
                        <div class="col-7 justify-content-center">
                            <div class="content__search">
                                {% crispy content_product_search_form %}
                            </div>
                        </div>
                    {% endif %}
                </div>
            </div>
            {% if hasCategories %}
                <div class="content__category">
                    <ul class="content__category-list">
                        {% if the_product_category and the_product_category.parent %}
                            <a class="category-item"
                               href="{{ the_product_category.parent.get_absolute_url }}">
                                {% if category.image %}
                                    <span class="category-item__image">
                                    <img src="{{ category.image.url }}" alt="{{ category.name }}">
                                </span>
                                {% endif %}
                                <span class="category-item__name">Вернуться в {{ the_product_category.parent.name }}</span>
                            </a>
                        {% elif the_product_category %}
                            <a class="left-menu__category-item"
                               href="{% url 'products:product_list' %}">
                                <span class="category-item__name">Вернуться в Каталог</span>
                            </a>
                        {% endif %}
                        {% if product_categories %}
                            {% for category in product_categories %}
                                <li>
                                    <a href="{{ category.get_absolute_url }}">
                                        {% if category.image %}
                                            <span class="category-item__image">
                                            <img src="{{ category.image.url }}" alt="{{ category.name }}">
                                         </span>
                                        {% endif %}
                                        <span class="category-item__name">{{ category.name }}</span>
                                    </a>
                                </li>
                            {% endfor %}
                        {% endif %}
                    </ul>
                </div>
            {% endif %}

            <ul class="breadcrumbs">
                {% block breadcrumbs %}
                {% endblock breadcrumbs %}
            </ul>
            {% block right_common_content %}
            {% endblock right_common_content %}
            {% if content_contact_us_form %}
                <div class="contact">
                    <div class="content__title">
                        Не нашли нужную программу или разработчика?
                        Заполните форму и с Вами свяжется наш специалист.
                    </div>
                    {% if contact_us_form_message %}
                        <div class="text-{% if "success" in contact_us_form_message.tags %}success{% elif "error" in contact_us_form_message.tags %}danger{% endif %}">
                            {{ contact_us_form_message }}
                        </div>
                    {% endif %}
                    {% crispy content_contact_us_form %}
                </div>
            {% endif %}
        </div>
    </div>
{% endblock content %}