{% extends 'dashboard/layout.html' %}
{% load i18n %}
{% load currency_filters %}
{% load thumbnail %}


{% block body_class %}create-page catalogue{% endblock %}

{% block title %}
{{ title }} | {% trans "Product management" %} | {{ block.super }}
{% endblock %}

{% block breadcrumbs %}
<ul class="breadcrumb">
    <li>
        <a href="{% url dashboard:index %}">{% trans "Dashboard" %}</a>
        <span class="divider">/</span>
    </li>
    <li>
        <a href="{% url dashboard:catalogue-product-list %}">{% trans "Product management" %}</a>
        <span class="divider">/</span>
    </li>
    <li class="active">{{ title }}</li>

</ul>
{% endblock %}

{% block headertext %}{{ title }}{% endblock %}

{% block dashboard_content %}
<form action="{% if request.GET.urlencode %}?{{ request.GET.urlencode }}{% endif %}" method="post" class="form-stacked wysiwyg fixed-actions" enctype="multipart/form-data" data-behaviour="affix-nav-errors" autocomplete="off">
    {% csrf_token %}
    <div class="row-fluid">
        <div class="span3">
            <div data-spy="affix" class="affix-top" data-offset-top="200">
                <div class="table-header">
                    <h3>{% trans "Sections" %}</h3>
                </div>
                <ul class="nav nav-list bs-docs-sidenav" id="product_update_tabs">
                    {% if product %}
                    <li class="active"><a href="#overview" data-toggle="tab">{% trans 'Overview' %}</a></li>
                    {% endif %}
                    <li{% if not product %} class="active"{% endif %}><a href="#product_details" data-toggle="tab">{% trans 'Product details' %}</a></li>
                    <li><a href="#product_recommended" data-toggle="tab">{% trans 'Recommended Products' %}</a></li>
                    {% with variants=product.variants.all %}
                    {% if variants|length > 0 %}
                    <li><a href="#product_variants" data-toggle="tab">{% trans 'Product variants' %}</a></li>
                    {% endif %}
                    {% endwith %}
                    <li><a href="#product_attributes" data-toggle="tab">{% trans 'Product attributes' %}</a></li>
                    <li><a href="#product_category" data-toggle="tab">{% trans 'Product category' %}</a></li>
                    <li><a href="#product_images" data-toggle="tab">{% trans 'Product images' %}</a></li>
                    <li><a href="#product_stock" data-toggle="tab">{% trans 'Product stock' %}</a></li>
                </ul>
            </div>
        </div>
        <div class="span9">
            <div class="tab-content">
                {% if product %}
                <div class="tab-pane active" id="overview">
                    <div class="table-header">
                        <h3>{% trans "Overview" %}</h3>
                    </div>
                    <div class="well">
                        <h3>{{ product.get_title }}</h3>
                        <hr />
                        <div class="row-fluid">
                            <div class="pull-left">
                             {% if product.primary_image.original.url %}
                                {% with image=product.primary_image %}
                                    {% thumbnail image.original "250x250" upscale=False as thumb %}
                                        <a href="{{ image.original.url }}" rel="lightbox_{{ product.upc|default:"-" }}">
                                            <img src="{{ thumb.url }}" alt="{{ product.get_title }}" class="img-polaroid" data-description="{% if image.caption %}{{ image.caption }}{% endif %}">
                                        </a>
                                    {% endthumbnail %}
                                {% endwith %}
                                {% endif %}
                            </div>
                            <div class="span9">
                                <p>
                                    <strong>{% trans "Fulfilment partner" %}</strong> <br />
                                    <span class="product-count">
                                        {% if product.has_stockrecord %}
                                            {{ product.stockrecord.partner.name }}
                                        {% else %}
                                            {% trans "Out of stock" %}
                                        {% endif %}
                                    </span>
                                </p>
                                <p><strong>{% trans "Description" %}</strong><br /> {{ product.description|safe }}</p>

                                {% with stats=product.stats %}
                                <table class="table table-striped table-bordered">
                                    <tbody>
                                        <tr>
                                            <th>{% trans "Views" %}</th>
                                            <td>{{ stats.num_views|default:0 }}</td>
                                        </tr>
                                        <tr>
                                            <th>{% trans "Baskets" %}</th>
                                            <td>{{ stats.num_basket_additions|default:0 }}</td>
                                        </tr>
                                        <tr>
                                            <th>{% trans "Purchases" %}</th>
                                            <td>{{ stats.num_purchases|default:0 }}</td>
                                        </tr>
                                    </tbody>
                                </table>
                                {% endwith %}
                            </div>
                        </div>
                    </div>
                    <div class="row-fluid">
                        <div class="span4">
                            <div class="table-header">
                                <h3>{% trans "Categories" %}</h3>
                            </div>
                            <table class="table table-striped table-bordered">
                                {% if product.categories %}
                                {% for category in product.categories.all %}
                                <tr><td>{{ category.full_name }}</tr>
                                {% endfor %}
                                {% else %}
                                <tr><td>{% trans "No categories setup for this product" %}</td></tr>
                                {% endif %}
                            </table>
                        </div>
                        <div class="span4">
                            <div class="table-header">
                                <h3>{% trans "Ranges" %}</h3>
                            </div>
                            <table class="table table-striped table-bordered">
                                {% if ranges.count > 0 %}
                                {% for range in ranges %}
                                <tr><td><a href="{% url dashboard:range-update range.id %}" alt="{{ range.name }}">{{ range.name }}</a></td></tr>
                                {% endfor %}
                                {% else %}
                                <tr><td>{% trans "No ranges currently include this product for this product" %}</td></tr>
                                {% endif %}
                            </table>
                        </div>
                        <div class="span4">
                            <div class="table-header">
                                <h3>{% trans "Offers" %}</h3>
                            </div>
                            <table class="table table-striped table-bordered">
                                {% if offers.count > 0 %}
                                    {% for offer in offers %}
                                <tr><td>{{ offer.name }}</td></tr>
                                {% endfor %}
                                {% else %}
                                <tr><td>{% trans "No offers currently include this product" %}</td></tr>
                                {% endif %}
                            </table>
                        </div>
                    </div>
                </div>
                {% endif %}
                <div class="tab-pane {% if not product %}active{% endif %}" id="product_details">
                    <div class="table-header">
                        <h3>{% trans "Product Details" %}</h3>
                    </div>
                    <div class="well product-details">
                        <span class="help-block">{{ form.non_field_errors }}</span>
                        {% for field in form %}
                        {% if field.is_hidden %}
                        {{ field }}
                        {% endif %}
                        {% if 'attr' not in field.id_for_label %}
                        <div class="control-group {% for error in field.errors %}error{% endfor %}">
                            {% if field.is_hidden %}
                            {{ field }}
                            {% else %}
                            <label for="{{ field.auto_id }}" class="control-label {% if field.field.required %}required{% endif %}">{{ field.label }}{% if field.field.required %} <span>*</span>{% endif %}</label>
                            <div class="controls">
                                {{ field }}
                                {% for error in field.errors %}
                                <span class="help-block">
                                    {{ error }}
                                </span>
                                {% endfor %}
                                {% if field.help_text %}
                                <span class='help-block'>
                                    {{ field.help_text }}
                                </span>
                                {% endif %}
                            </div>
                            {% endif %}
                        </div>
                        {% endif %}
                        {% endfor %}

                        {% with parent=product.parent %}
                        {% if parent %}
                        <div class="control-group">
                            <label class="control-label">{% trans "Parent" %}</label>
                            <div class="controls">
                                <a href="{% url dashboard:catalogue-product parent.id %}" title="Edit {{ parent.title }}">{{ parent.title }}</a>
                            </div>
                        </div>
                        {% endif %}
                        {% endwith %}
                    </div>
                </div>

                {% with variants=product.variants.all %}
                {% if variants|length > 0 %}
                <div class="tab-pane" id="product_variants">
                    <table class='table table-striped table-bordered'>
                        <caption>{% trans "Variants" %}</caption>
                        {% with parent=product.parent %}
                        {% if parent %}
                        <tr>
                            <th>{% trans "Parent" %}</th>
                            <th></th>
                        </tr>
                        <tr>
                            <td>{{ parent.title }}</td>
                            <td><a href="{% url dashboard:catalogue-product parent.id %}" class="btn btn-primary" title="Edit {{ parent.title }}">{% trans "Edit" %}</a></td>
                        </tr>
                        {% endif %}
                        {% endwith %}
                        <tr>
                            <th>{% trans "Children" %}</th>
                            <th></th>
                        </tr>

                        {% for variant in variants %}
                        <tr>
                            <td>{{ variant.title }}</td>
                            <td><a href="{% url dashboard:catalogue-product variant.id %}" class="btn btn-primary">{% trans "Edit" %}</a></td>
                        </tr>
                        {% endfor %}
                    </table>
                </div>
                {% endif %}
                {% endwith %}


                <div class="tab-pane" id="product_attributes">
                    <table class="table table-striped table-bordered">
                        <caption>
                            {% trans "Product Attributes" %}  <span class="label label-success">{% trans "Product class:" %} {{ product.product_class }}</span>
                        </caption>
                        <tr>
                            <th width="20%">{% trans "Attribute name" %}</th>
                            <th>{% trans "Attribute option" %}</th>
                        </tr>
                        {% for field in form %}
                        {% if 'attr' in field.id_for_label %}
                        <tr>
                            <td>
                                {{ field.label }}{% if field.field.required %} <span>*</span>{% endif %}
                            </td>
                            <td>
                                {% if field.is_hidden %}
                                {{ field }}
                                {% else %}
                                {{ field }}
                                {% for error in field.errors %}
                                <span class="help-block">
                                    {{ error }}
                                </span>
                                {% endfor %}
                                {% if field.help_text %}
                                <span class='help-block'>
                                    {{ field.help_text }}
                                </span>
                                {% endif %}
                                {% endif %}
                            </td>
                        </tr>
                        {% endif %}
                        {% endfor %}
                    </table>
                </div>

                <div class="tab-pane" id="product_category">
                    <table class="table table-striped table-bordered form-inline">
                        <caption>{% trans "Category" %}</caption>
                        {{ category_formset.management_form }}
                        {{ category_formset.non_form_errors }}
                        {% for category_form in category_formset %}
                        <tr>
                            <td>
                                {% include "partials/form_fields_inline.html" with form=category_form %}
                            </td>
                        </tr>
                        {% endfor %}
                    </table>
                </div>

                <div class="tab-pane" id="product_images">
                    <div class="table-header">
                        <h3>{% trans "Upload, change or remove images" %}</h3>
                    </div>
                    <div class="well">
                        {{ image_formset.management_form }}
                        {{ image_formset.non_form_errors }}
                        <ol class='upload-image'>
                            {% for image_form in image_formset %}
                            {% include "dashboard/partials/product_images.html" with form=image_form %}
                            {% endfor %}
                        </ol>
                    </div>
                </div>

                <div class="tab-pane" id="product_stock">
                    {{ stockrecord_form.non_field_errors }}
                    <table class="table table-striped table-bordered">
                        <caption>{% trans "Stock and price information" %}</caption>
                        <tr>
                            {% for field in stockrecord_form %}
                                {% if "partner" in field.id_for_label %}
                                    <th width="20%">{{ field.label }}{% if field.field.required %} <span>*</span>{% endif %}</th>
                                {% endif %}
                                {% if "price" in field.id_for_label %}
                                    <th>{{ field.label }}{% if field.field.required %} <span>*</span>{% endif %}</th>
                                {% endif %}
                                {% if "stock" in field.id_for_label %}
                                    <th>{{ field.label }}{% if field.field.required %} <span>*</span>{% endif %}</th>
                                {% endif %}
                            {% endfor %}
                        </tr>
                        <tr>
                            {% for field in stockrecord_form %}
                                {% if "partner" in field.id_for_label %}
                                    <td>
                                        {{ field }}
                                        {{ field.errors }}
                                    </td>
                                {% endif %}
                                {% if "price" in field.id_for_label %}
                                    <td>
                                        {{ field }}
                                        {{ field.errors }}
                                    </td>
                                {% endif %}
                                {% if "stock" in field.id_for_label %}
                                    <td>
                                        {{ field }}
                                        {{ field.errors }}
                                    </td>
                                {% endif %}
                            {% endfor %}
                        </tr>
                    </table>
                </div>

                <div class="tab-pane" id="product_recommended">
                    <table class="table table-striped table-bordered form-inline">
                        <caption>{% trans "Recommended products" %}</caption>
                        {{ recommended_formset.management_form }}
                        {{ recommended_formset.non_form_errors }}
                        {% for recommended_form in recommended_formset %}
                        <tr>
                            <td>
                                {% include "partials/form_fields_inline.html" with form=recommended_form %}
                            </td>
                        </tr>
                        {% endfor %}
                    </table>
                </div>

            </div>
        </div>
    </div>

    <div class="fixed-actions-group">
        <div class="form-actions">
            <div class="pull-right">
                <a href="{% url dashboard:catalogue-product-list %}">{% trans "Cancel" %}</a>
                {% trans "or" %}
                <button class="btn btn-secondary btn-large" name="action" type="submit" value="continue">{% trans "Save and continue editing" %}</button>
                <button class="btn btn-primary btn-large" name="action" type="submit" value="save">{% trans "Save" %}</button>
            </div>
            {% if product %}
            <a class="btn btn-success btn-large" href="{{ product.get_absolute_url }}">{% trans "View on site" %}</a>
            {% endif %}
        </div>
    </div>
</form>
{% endblock dashboard_content %}
