{% extends "oscar/customer/baseaccountpage.html" %}
{% load image_tags %}
{% load i18n %}
{% load widget_tweaks %}

{% block breadcrumbs %}
    <nav aria-label="breadcrumb">
        <ol class="breadcrumb">
            <li class="breadcrumb-item">
                <a href="{{ homepage_url }}">{% trans 'Home' %}</a>
            </li>
            <li class="breadcrumb-item">
                <a href="{% url 'customer:summary' %}">{% trans 'Account' %}</a>
            </li>
            <li class="breadcrumb-item">
                <a href="{% url 'customer:wishlists-list' %}">{% trans 'Wish Lists' %}</a>
            </li>
            <li class="breadcrumb-item active" aria-current="page">
                {{ wishlist.name }}
            </li>
        </ol>
    </nav>
{% endblock %}

{% block tabcontent %}
    {% if form.total_form_count %}
        <form method="post">
            {{ form.management_form }}
            {% csrf_token %}
            <table class="table table-striped table-bordered">
                <tbody>
                    <tr>
                        <th colspan="2">{% trans 'Product' %}</th>
                        <th>{% trans 'Quantity' %}</th>
                        <th>{% trans 'Action' %}</th>
                    </tr>

                    {% for subform in form %}
                        {% with line=subform.instance product=subform.instance.product %}
                            <tr>
                                <td>
                                    {% if product %}
                                        {% with image=product.primary_image %}
                                            {% oscar_thumbnail image.original "100x100" upscale=False as thumb %}
                                            {% if product.is_public %}
                                                <a href="{{ product.get_absolute_url }}">
                                                    <img class="img-thumbnail" src="{{ thumb.url }}" alt="{{ product.get_title }}" />
                                                </a>
                                            {% else %}
                                                <img class="img-thumbnail" src="{{ thumb.url }}" alt="{{ product.get_title }}" />
                                            {% endif %}
                                        {% endwith %}
                                    {% endif %}
                                </td>
                                <td>
                                    {% if product and product.is_public %}
                                        <a href="{{ line.product.get_absolute_url }}">{{ line.get_title }}</a>
                                    {% else %}
                                        <em>{{ line.get_title }} ({% trans 'Not available anymore' %})</em>
                                    {% endif %}
                                </td>
                                <td>
                                    {% for field in subform %}
                                        {% render_field field class+="form-control" %}
                                        {% for error in field.errors %}
                                            <ul class="error-block">
                                                <li>{{ error }}</li>
                                            </ul>
                                        {% endfor %}
                                    {% endfor %}
                                </td>
                                <td>
                                    <div class="btn-group">
                                        {% if product %}
                                            <a class="btn btn-secondary" href="{{ line.product.get_absolute_url }}">{% trans 'View product' %}</a>
                                            <button class="btn btn-secondary dropdown-toggle" data-toggle="dropdown"></button>
                                        {% else %}
                                            <a class="btn btn-secondary dropdown-toggle" data-toggle="dropdown" href="#">
                                                {% trans 'Actions' %}
                                            </a>
                                        {% endif %}
                                        <ul class="dropdown-menu dropdown-menu-right">
                                            <li>
                                                <a href="{% url 'customer:wishlists-remove-product' key=wishlist.key line_pk=line.pk %}" class="dropdown-item">
                                                    {% trans 'Remove' %}
                                                </a>
                                            </li>
                                            {% for other_wishlist in other_wishlists %}
                                                <li>
                                                    <a href="{% url 'customer:wishlists-move-product-to-another' key=wishlist.key line_pk=line.pk to_key=other_wishlist.key %}" class="dropdown-item">
                                                        {% blocktrans with name=other_wishlist.name %}
                                                            Move to '{{ name }}' wish list
                                                        {% endblocktrans %}
                                                    </a>
                                                </li>
                                            {% endfor %}
                                        </ul>
                                    </div>
                                </td>
                            </tr>
                        {% endwith %}
                    {% endfor %}
                    <tr>
                        <td colspan="2"></td>
                        <td>
                            <button class="btn btn-primary" type="submit" data-loading-text="{% trans 'Updating...' %}">{% trans "Update quantities" %}</button>
                        </td>
                        <td></td>
                    </tr>
                </tbody>
            </table>
        </form>

    {% else %}
        {% trans "Your wish list is empty." %}
    {% endif %}

{% endblock tabcontent %}
