{% load i18n %}
{% load image_tags %}
{% load currency_filters %}
{% load purchase_info_tags %}
{% load extra_purchase_info_tags %}
{% load widget_tweaks %}
{% load ocyanjson %}

{% if basket_warnings %}
<h5>{% trans "Important messages about items in your basket" %}</h5>
{% for warning in basket_warnings %}
<div class="alert alert-warning" aria-live="polite">{{ warning }}</div>
{% endfor %}
{% endif %}

{% if upsell_messages %}
<div class="card card-body" aria-live="polite">
    <h3>{% trans "You could be missing out on offers!" %}</h3>
{% for upsell in upsell_messages %}
{% blocktrans with message=upsell.message url=upsell.offer.get_absolute_url offer_name=upsell.offer.name %}<div class="warning">{{ message }} to qualify for the <a href="{{ url }}">{{ offer_name }}</a> special offer</div>{% endblocktrans %}
{% endfor %}
</div>
{% endif %}

{% if not basket.is_empty %}
<div class="row basket">
    {% block basket_form_main %}
    <div class="col-lg-7 basket-left">
        {% block basket_header %}
        <h3 class="basket-header">{% trans "Basket" %} ({{ request.basket.num_lines }} item{% if not request.basket.num_lines == 1 %}s{% endif %})</h3>
        {% endblock %}
        <form method="post" class="basket-summary" id="basket_formset">
            {% csrf_token %}
            {{ formset.management_form }}

            {% for form in formset %}
            {% with line=form.instance product=form.instance.product %}
            {% purchase_info_for_line request line as session %}
            <div class="basket-items">
                <div class="row">
                    {% block product_image %}
                    <div class="col-lg-2 col-3 basket-thumbnail-wrapper">
                        {{ form.id }}
                        {% with image=product.primary_image %}
                        {% oscar_thumbnail image.original "350x350" upscale=False as thumb %}
                        <a href="{{ product.get_absolute_url }}">
                            <img class="basket-thumbnail img-fluid" src="{{ thumb.url }}" alt="{{ product.get_title }}"/>
                        </a>
                        {% endwith %}
                    </div>
                    {% endblock %}
                    <div class="col-lg-10 col-9 basket-info">
                        <div class="row">
                            <div class="col-lg-7 basket-line-description">
                                {% block product_title %}
                                <h5><a href="{{ product.get_absolute_url }}" class="text-dark text-decoration-none">{{ line.product.title }}</a></h5>
                                {% endblock %}
                                {% block product_availability %}
                                <p class="availability {{ session.availability.code }}">{{ session.availability.message }}</p>
                                {% endblock %}

                                {% block product_description %}
                                <div class="line-description my-1 d-block">
                                    {{line.product.description|safe|striptags|truncatechars:100}}
                                </div>
                                {% endblock %}

                                {% block product_attributes %}
                                {% if line.attributes.exists %}
                                <div class="line-attributes">
                                    <div class="product-options mt-2">
                                        {% for option in line.attributes.all %}
                                        <div class="product-attr"><div><b>{{ option.option.name }}</b></div> <span class="option-value">{{ option.display_value }}</span></div>
                                        {% endfor %}
                                    </div>
                                </div>
                                {% endif %}
                                {% endblock %}
                            </div>
                            <div class="col-lg-5 col-6 basker-line-quantity">
                                <div class="price-quantity">
                                    <div class="checkout-quantity basket-item-quantity">
                                        <label for="{{ form.quantity.auto_id }}" aria-label="{{ form.quantity.label|slugify }}_{{line.product.title|slugify}}" class="small">{{ form.quantity.label }}</label>
                                        <div class="input-group{% if form.errors %} error{% endif %}">
                                            {% render_field form.quantity class+="form-control" %}
                                            <button class="btn btn-secondary" type="submit" data-loading-text="<i class='fa fa-sync-alt rotate-1'></i>"><i class="fa fa-sync-alt"></i></button>
                                        </div>
                                    </div>
                                </div>
                            </div>
                            {% block basket_line_actions %}
                            <div class="col-lg-7 col-6 basket-line-actions">
                                {% if user.is_authenticated %}
                                <a href="#" data-id="{{ forloop.counter0 }}" data-behaviours="save" class="inline"><span class="basket-line-action-text">{% trans "Save for later" %}</span><i class="fa fa-heart-solid"></i></a>
                                <span class="basket-line-actions-devider">|</span>
                                {% endif %}
                                <a href="#" data-id="{{ forloop.counter0 }}" data-behaviours="remove" class="inline"><span class="basket-line-action-text">{% trans "Remove" %}</span><i class="fa fa-trash-alt"></i></a>

                                <div style="display:none">
                                    {{ form.save_for_later }}
                                    {{ form.DELETE }}
                                </div>
                                {% for field_errors in form.errors.values %}
                                {% for error in field_errors %}
                                <span class="error-block"><i class="fa fa-exclamation"></i> {{ error }}</span>
                                {% endfor %}
                                {% endfor %}
                            </div>
                            {% endblock basket_line_actions %}
                            <div class="col-lg-5 basket-line-total">
                                <div class="basket-item-total">
                                {% if not line.line_price_incl_tax and not line_price_excl_tax %}
                                <p class="text-right">&mdash;</p>
                                {% else %}
                                <p class="stock_price price_color swap">
                                    {% total_purchase_info_for_line request line as session %}
                                    {% if session.price.from_price %}
                                        <span class="from_price">{{session.price.from_price.incl_tax|currency:session.price.currency}}</span>
                                    {% endif %}
                                    {% include "oscar/catalogue/partials/price.html" %}
                                </p>
                                {% endif %}
                                </div>
                            </div>
                        </div>
                    </div>
                </div>
            </div>
            {% endwith %}
            {% endfor %}
        </form>
        {% block savedbasket %}
        {% if user.is_authenticated and saved_formset %}
        <div class="saved-basket">
            <div class="sub-header">
                <h3>{% trans "Items to buy later" %}</h3>
            </div>
            <form class="saved-basket-items" action="{% url 'basket:saved' %}" method="post" id="saved_basket_formset">
                {% csrf_token %}
                {{ saved_formset.management_form }}
                {% for form in saved_formset %}
                {% with line=form.instance product=form.instance.product %}
                {% purchase_info_for_line request line as session %}
                <div class="basket-items">
                    <div class="row">
                        <div class="col-lg-2 col-3 basket-thumbnail-wrapper">
                            {{ form.id }}
                            {% with image=product.primary_image %}
                            {% oscar_thumbnail image.original "350x350" upscale=False as thumb %}
                            <a href="{{ product.get_absolute_url }}">
                                <img class="basket-thumbnail img-fluid" src="{{ thumb.url }}" alt="{{ product.get_title }}"/>
                            </a>
                            {% endwith %}
                        </div>
                        <div class="col-lg-10 col-9 basket-info">
                            <div class="row">
                                <div class="col-lg-7 basket-line-description">
                                    <h5><a href="{{ product.get_absolute_url }}" class="text-dark text-decoration-none">{{ line.product.title }}</a></h5>
                                    <p class="availability {{ session.availability.code }}">{{ session.availability.message }}</p>

                                    <div class="line-description my-1 d-block">
                                        {{line.product.description|safe|striptags|truncatechars:100}}
                                    </div>

                                    {% if line.attributes.exists %}
                                    <div class="line-attributes">
                                        <ul class="product-options mt-2">
                                            {% for option in line.attributes.all %}
                                            <li>{{ option.option.name }} <span class="option-value">{{ option.display_value }}</span></li>
                                            {% endfor %}
                                        </ul>
                                    </div>
                                    {% endif %}
                                </div>
                                <div class="col-lg-5 col-6 basker-line-quantity">
                                    <div class="basket-item-total">
                                    {% if not line.line_price_incl_tax and not line_price_excl_tax %}
                                    <p class="text-right">&mdash;</p>
                                    {% else %}
                                    <p class="stock_price price_color swap">
                                        {% if line.is_tax_known %}
                                        {{ line.line_price_incl_tax|currency:line.price_currency }}
                                        {% else %}
                                        {{ line.line_price_excl_tax|currency:line.price_currency }}
                                        {% endif %}
                                    </p>
                                    {% endif %}
                                    </div>
                                </div>
                                <div class="col-lg-12 col-12 basket-line-actions">
                                    {% if user.is_authenticated %}
                                    <a href="#" data-id="{{ forloop.counter0 }}" data-behaviours="move" class="inline"><span class="basket-line-action-text">{% trans "Move to basket" %}</span><i class="fa fa-heart-solid"></i></a>
                                    <span class="basket-line-actions-devider">|</span>
                                    {% endif %}
                                    <a href="#" data-id="{{ forloop.counter0 }}" data-behaviours="remove" class="inline"><span class="basket-line-action-text">{% trans "Remove" %}</span><i class="fa fa-trash-alt"></i></a>

                                    <div style="display:none">
                                        {{ form.move_to_basket }}
                                        {{ form.DELETE }}
                                    </div>
                                    {% for field_errors in form.errors.values %}
                                    {% for error in field_errors %}
                                    <span class="error-block"><i class="fa fa-exclamation"></i> {{ error }}</span>
                                    {% endfor %}
                                    {% endfor %}
                                </div>
                            </div>
                        </div>
                    </div>
                </div>
                {% endwith %}
                {% endfor %}
            </form>
        </div>
        {% endif %}
        {% endblock %}
    </div>
    {% endblock %}
    {% block basket_form_right_column %}
    <div class="col-lg-5 basket-right">
        <div class="sticky-basket">
            {% ocyanjson "oscar_checkout" "show_voucher_block" True as show_voucher_block %}
            
            {% if voucher_form and show_voucher_block %}
            <div class="basket-totals-wrapper basket-voucher-wrapper">
                <h3>{% trans "Voucher/promo code" %}</h3>
                {% block vouchers %}
                {# Hide the entire section if a custom BasketView doesn't pass in a voucher form #}
                
                {% trans "Voucher/promo code" as promo_code %}
                <div id="voucher_form_container" class="basket-voucher">
                    <form id="voucher_form" action="{% url 'basket:vouchers-add' %}" method="post">
                        {% csrf_token %}
                        <div class="input-group">
                            {% include "oscar/partials/form_field.html" with field=voucher_form.code nolabel=True placeholder=promo_code form_clean=True %}
                            <button type="submit" class="btn btn-primary" data-loading-text="{% trans 'Adding...' %}">{% trans "Add" %}</button>
                        </div>
                    </form>
                </div>
                {% endblock vouchers %}
            </div>
            {% endif %}

            <div class="basket-totals-wrapper">
                <h3>{% trans "Basket total" %}</h3>
                {% block baskettotals %}{% include 'oscar/basket/partials/basket_totals.html' with editable=1 %}{% endblock baskettotals %}

                {% block formactions %}
                <div class="form-group clearfix">
                    <div class="row">
                        <div class="col-12">
                            <a href="{% url 'checkout:index' %}" class="btn btn-lg btn-primary d-block">{% trans "Proceed to checkout" %}</a> 
                        </div>
                    </div>
                </div>
                {% endblock formactions %}
            </div>
        </div>
    </div>
    {% endblock %}
</div>
{% else %}
{% block emptybasket %}
<div class="emptybasket">
    <h2>
        {% trans "Your basket is empty." %}
    </h2>
    <a class="btn btn-primary" href="{{ homepage_url }}">{% trans "Continue shopping" %} <i class="fa fa-long-arrow-right"></i></a>
</div>
{% endblock %}
{% endif %}