{% extends "pages/page.html" %}

{% load mezzanine_tags shop_tags i18n %}
{% block body_id %}category{% endblock %}

{% block main %}{{ block.super }}

{% editable page.category.content %}
{{ page.category.content|safe }}
{% endeditable %}

{% if child_categories %}
<ul class="thumbnails categories">
{% if settings.SHOP_CATEGORY_USE_FEATURED_IMAGE %}
    {% for category in child_categories %}
    <li><a href="{{ category.get_absolute_url }}" class="thumbnail">
        {% if category.featured_image %}
        <img src="{{ MEDIA_URL }}{% thumbnail category.featured_image 100 100 %}" />
        {% else %}
        <div class="placeholder"></div>
        {% endif %}
        <h6>{{ category.title }}</h6>
    </a></li>
    {% endfor %}
{% else %}
    {% for category in child_categories %}
    <li><a href="{{ category.get_absolute_url }}">
        {{ category.title }}
    </a></li>
    {% endfor %}
{% endif %}
</ul>
{% endif %}

{% if products.paginator.count != 0 %}

<form class="product-sorting">
    <label>{% trans "Sort by" %}</label>
    <select onchange="location.href = this[this.selectedIndex].value;">
    {% for name, option in settings.SHOP_PRODUCT_SORT_OPTIONS %}
    {% if "rating" not in option or settings.SHOP_USE_RATINGS %}
    <option{% if option == products.sort_by %} selected{% endif %}
        value="{{ category.get_absolute_url }}?sort={{ option }}{{ querystring }}">
        {{ name }}
    </option>
    {% endif %}
    {% endfor %}
    </select>
</form>

<ul class="thumbnails">
{% for product in products.object_list %}
<li>
    <a href="{{ product.get_absolute_url }}" class="thumbnail">
        {% if product.image %}
        <img src="{{ MEDIA_URL }}{% thumbnail product.image 100 100 %}">
        {% else %}
        <div class="placeholder"></div>
        {% endif %}
        <h6>{{ product }}</h6>
        {% if product.has_price %}
            {% if product.on_sale %}
            <span class="old-price">{{ product.unit_price|currency }}</span>
            {% trans "On sale:" %}
            {% endif %}
            <span class="price">{{ product.price|currency }}</span>
        {% else %}
        {% trans "Coming soon" %}
        {% endif %}
    </a>
</li>
{% endfor %}
</ul>

{% pagination_for products %}

{% endif %}

{% endblock %}

