{% extends "pretixpresale/event/base.html" %}
{% load i18n %}
{% load l10n %}
{% load eventurl %}
{% load thumbnail %}
{% load eventsignal %}
{% load rich_text %}
{% block title %}{% trans "Presale" %}{% endblock %}

{% block content %}

    {% autoescape off %}
        <script type="application/ld+json">
            {{ ev.event_microdata }}
        </script>
    {% endautoescape %}
    {% if show_cart %}
        <div class="panel panel-primary cart">
            <div class="panel-heading">
                <h3 class="panel-title">
                    <a class="collapsed" data-toggle="collapse" href="#cart">
                        <span>
                            <i class="fa fa-shopping-cart"></i>
                            <strong>{% trans "Your cart" %}</strong>
                        </span>
                        <span>
                            <strong id="cart-deadline-short" data-expires="{{ cart.first_expiry|date:"Y-m-d H:i:sO" }}">
                                {% if cart.minutes_left > 0 or cart.seconds_left > 0 %}
                                    {{ cart.minutes_left|stringformat:"02d" }}:{{ cart.seconds_left|stringformat:"02d" }}
                                {% else %}
                                    {% trans "Cart expired" %}
                                {% endif %}
                            </strong>
                            <i class="fa fa-angle-down collapse-indicator"></i>
                        </span>
                    </a>
                </h3>
            </div>
            <div class="panel-collapse collapse in" id="cart">
                <div class="panel-body">
                    {% include "pretixpresale/event/fragment_cart.html" with cart=cart event=request.event editable=True %}
                    <em id="cart-deadline" data-expires="{{ cart.first_expiry|date:"Y-m-d H:i:sO" }}">
                        {% if cart.minutes_left > 0 or cart.seconds_left > 0 %}
                            {% blocktrans trimmed with minutes=cart.minutes_left %}
                                The items in your cart are reserved for you for {{ minutes }} minutes.
                            {% endblocktrans %}
                        {% else %}
                            {% trans "The items in your cart are no longer reserved for you." %}
                        {% endif %}
                    </em>
                    <div class="row checkout-button-row">
                        <div class="col-md-4 col-xs-12">
                            <form method="post" data-asynctask action="{% eventurl request.event "presale:event.cart.clear" cart_namespace=cart_namespace %}">
                                {% csrf_token %}
                                <button class="btn btn-block btn-default btn-lg" type="submit">
                                    <i class="fa fa-close"></i> {% trans "Empty cart" %}</button>
                            </form>
                        </div>
                        <div class="col-md-4 col-md-offset-4 col-xs-12">
                            <a class="btn btn-block btn-primary btn-lg"
                                    href="{% eventurl request.event "presale:event.checkout.start" cart_namespace=cart_namespace  %}">
                                {% if has_addon_choices %}
                                    <i class="fa fa-shopping-cart"></i> {% trans "Continue" %}
                                    </a>
                                {% else %}
                                    <i class="fa fa-shopping-cart"></i> {% trans "Proceed with checkout" %}
                                {% endif %}
                            </a>
                        </div>
                        <div class="clearfix"></div>
                    </div>
                </div>
            </div>
        </div>
    {% endif %}

    {% if event.has_subevents and not cart_namespace %}
        {% if subevent %}
            <a class="subevent-toggle">
                {% trans "View other date" %}
            </a>
        {% else %}
            <h3>{% trans "Choose date to buy a ticket" %}</h3>
        {% endif %}
        <div class="subevent-list">
            {% if event.settings.event_list_type == "calendar" %}
                {% include "pretixpresale/event/fragment_subevent_calendar.html" %}
            {% else %}
                {% include "pretixpresale/event/fragment_subevent_list.html" %}
            {% endif %}
        </div>
        {% if subevent %}
            <h2 class="subevent-head">{{ subevent.name }}</h2>
        {% endif %}
    {% endif %}

    {% if frontpage_text and not cart_namespace %}
        <div>
            {{ frontpage_text|rich_text }}
        </div>
    {% endif %}

    {% if subevent or not event.has_subevents %}
        {% if not ev.presale_is_running %}
            <div class="alert alert-info">
                {% if ev.presale_has_ended %}
                    {% blocktrans trimmed %}
                        The presale period for this event is over.
                    {% endblocktrans %}
                {% elif event.settings.presale_start_show_date %}
                    {% blocktrans trimmed with date=ev.presale_start|date:"SHORT_DATE_FORMAT" time=ev.presale_start|time:"TIME_FORMAT" %}
                        The presale for this event will start on {{ date }} at {{ time }}.
                    {% endblocktrans %}
                {% else %}
                    {% blocktrans trimmed %}
                        The presale for this event has not yet started.
                    {% endblocktrans %}
                {% endif %}
            </div>
        {% endif %}
        {% if not cart_namespace %}
            <div>
                {% if ev.location %}
                    <div class="info-row">
                        <span class="fa fa-map-marker fa-fw"></span>
                        <p>
                            {{ ev.location|linebreaksbr }}
                        </p>
                    </div>
                {% endif %}
                <div class="info-row">
                    <span class="fa fa-clock-o fa-fw"></span>
                    <p>
                        {{ ev.get_date_range_display }}
                        {% if event.settings.show_times %}
                            <br>
                            {% blocktrans trimmed with time=ev.date_from|date:"TIME_FORMAT" %}
                                Begin: {{ time }}
                            {% endblocktrans %}
                            {% if event.settings.show_date_to %}
                                <br>
                                {% blocktrans trimmed with time=ev.date_to|date:"TIME_FORMAT" %}
                                    End: {{ time }}
                                {% endblocktrans %}
                            {% endif %}
                        {% endif %}
                        {% if ev.date_admission %}
                            <br>
                            {% if ev.date_admission|date:"SHORT_DATE_FORMAT" == ev.date_from|date:"SHORT_DATE_FORMAT" %}
                                {% blocktrans trimmed with time=ev.date_admission|date:"TIME_FORMAT" %}
                                    Admission: {{ time }}
                                {% endblocktrans %}
                            {% else %}
                                {% blocktrans trimmed with datetime=ev.date_admission|date:"SHORT_DATETIME_FORMAT" %}
                                    Admission: {{ datetime }}
                                {% endblocktrans %}
                            {% endif %}
                        {% endif %}
                        <br>
                        {% if subevent %}
                            <a href="{% eventurl event "presale:event.ical.download" subevent=subevent.pk %}">
                        {% else %}
                            <a href="{% eventurl event "presale:event.ical.download" %}">
                        {% endif %}
                            {% trans "Add to Calendar" %}
                        </a>
                    </p>
                </div>

            </div>

            {% eventsignal event "pretix.presale.signals.front_page_top" %}
        {% endif %}

        {% if ev.presale_is_running or event.settings.show_items_outside_presale_period %}
            <form method="post" data-asynctask
                    action="{% eventurl request.event "presale:event.cart.add" cart_namespace=cart_namespace %}?next={{ request.path|urlencode }}">
                {% csrf_token %}
                <input type="hidden" name="subevent" value="{{ subevent.id|default_if_none:"" }}" />
                {% for tup in items_by_category %}
                    <section>
                        {% if tup.0 %}
                            <h3>{{ tup.0.name }}</h3>
                            {% if tup.0.description %}
                                <p>{{ tup.0.description|localize|rich_text }}</p>
                            {% endif %}
                        {% endif %}
                        {% for item in tup.1 %}
                            {% if item.has_variations %}
                                <div class="item-with-variations">
                                    <div class="row-fluid product-row headline">
                                        <div class="col-md-8 col-xs-12">
                                            {% if item.picture %}
                                                <a href="{{ item.picture.url }}" class="productpicture"
                                                        data-title="{{ item.name|force_escape|force_escape }}"
                                                        {# Yes, double-escape to prevent XSS in lightbox #}
                                                        data-lightbox="{{ item.id }}">
                                                    <img src="{{ item.picture|thumbnail_url:'productlist' }}"
                                                            alt="{{ item.name }}"/>
                                                </a>
                                            {% endif %}
                                            <div class="product-description {% if item.picture %}with-picture{% endif %}">
                                                <a href="#" data-toggle="variations">
                                                    <strong>{{ item.name }}</strong>
                                                </a>
                                                {% if item.description %}
                                                    <div class="product-description">
                                                        {{ item.description|localize|rich_text }}
                                                    </div>
                                                {% endif %}
                                                {% if item.min_per_order and item.min_per_order > 1 %}
                                                    <p>
                                                        <small>
                                                            {% blocktrans trimmed with num=item.min_per_order %}
                                                                minimum amount to order: {{ num }}
                                                            {% endblocktrans %}
                                                        </small>
                                                    </p>
                                                {% endif %}
                                            </div>
                                        </div>
                                        <div class="col-md-2 col-xs-6 price">
                                            {% if item.min_price != item.max_price or item.free_price %}
                                                {% blocktrans trimmed with minprice=item.min_price|floatformat:2 currency=event.currency %}
                                                    from {{ currency }} {{ minprice }}
                                                {% endblocktrans %}
                                            {% elif not item.min_price and not item.max_price %}
                                                {% trans "FREE" context "price" %}
                                            {% else %}
                                                {{ event.currency }} {{ item.min_price|floatformat:2 }}
                                            {% endif %}
                                        </div>
                                        <div class="col-md-2 col-xs-6 availability-box">
                                            {% if not event.settings.show_variations_expanded %}
                                                <a href="#" data-toggle="variations" class="js-only">
                                                    {% trans "Show variants" %}
                                                </a>
                                            {% endif %}
                                        </div>
                                        <div class="clearfix"></div>
                                    </div>
                                    <div class="variations {% if not event.settings.show_variations_expanded %}variations-collapsed{% endif %}">
                                        {% for var in item.available_variations %}
                                            <div class="row-fluid product-row variation">
                                                <div class="col-md-8 col-xs-12">
                                                    {{ var }}
                                                    {% if var.description %}
                                                        <div class="variation-description">
                                                            {{ var.description|localize|rich_text }}
                                                        </div>
                                                    {% endif %}
                                                    {% if event.settings.show_quota_left %}
                                                        {% include "pretixpresale/event/fragment_quota_left.html" with avail=var.cached_availability %}
                                                    {% endif %}
                                                </div>
                                                <div class="col-md-2 col-xs-6 price">
                                                    {% if item.free_price %}
                                                        <div class="input-group input-group-price">
                                                            <span class="input-group-addon">{{ event.currency }}</span>
                                                            <input type="number" class="form-control input-item-price"
                                                                    placeholder="0"
                                                                    min="{% if event.settings.display_net_prices %}{{ var.display_price.net|stringformat:"0.2f" }}{% else %}{{ var.display_price.gross|stringformat:"0.2f" }}{% endif %}"
                                                                    name="price_{{ item.id }}_{{ var.id }}"
                                                                    step="any"
                                                                    value="{% if event.settings.display_net_prices %}{{var.display_price.net|stringformat:"0.2f" }}{% else %}{{ var.display_price.gross|stringformat:"0.2f" }}{% endif %}"
                                                            >
                                                        </div>
                                                    {% elif not var.display_price.gross %}
                                                        {% trans "FREE" context "price" %}
                                                    {% elif event.settings.display_net_prices %}
                                                        {{ event.currency }} {{ var.display_price.net|floatformat:2 }}
                                                    {% else %}
                                                        {{ event.currency }} {{ var.display_price.gross|floatformat:2 }}
                                                    {% endif %}
                                                    {% if var.display_price.rate and var.display_price.gross and event.settings.display_net_prices %}
                                                        <small>{% blocktrans trimmed with rate=var.display_price.rate name=var.display_price.name %}
                                                            <strong>plus</strong> {{ rate }}% {{ name }}
                                                        {% endblocktrans %}</small>
                                                    {% elif var.display_price.rate and var.display_price.gross %}
                                                        <small>{% blocktrans trimmed with rate=var.display_price.rate name=var.display_price.name %}
                                                            incl. {{ rate }}% {{ name }}
                                                        {% endblocktrans %}</small>
                                                    {% endif %}
                                                </div>
                                                {% if item.require_voucher %}
                                                    <div class="col-md-2 col-xs-6 availability-box unavailable">
                                                        <small>
                                                            {% trans "Enter a voucher code below to buy this ticket." %}
                                                        </small>
                                                    </div>
                                                {% elif var.cached_availability.0 == 100 %}
                                                    <div class="col-md-2 col-xs-6 availability-box available">
                                                        {% if item.max_per_order == 1 %}
                                                            <label class="item-checkbox-label">
                                                                <input type="checkbox" value="1"
                                                                        name="variation_{{ item.id }}_{{ var.id }}">
                                                            </label>
                                                        {% else %}
                                                            <input type="number" class="form-control input-item-count" placeholder="0" min="0"
                                                                    max="{{ var.order_max }}"
                                                                    name="variation_{{ item.id }}_{{ var.id }}">
                                                        {% endif %}
                                                    </div>
                                                {% else %}
                                                    {% include "pretixpresale/event/fragment_availability.html" with avail=var.cached_availability.0 event=event item=item var=var %}
                                                {% endif %}
                                                <div class="clearfix"></div>
                                            </div>
                                        {% endfor %}
                                    </div>
                                </div>
                            {% else %}
                                <div class="row-fluid product-row simple">
                                    <div class="col-md-8 col-xs-12">
                                        {% if item.picture %}
                                            <a href="{{ item.picture.url }}" class="productpicture"
                                                    data-title="{{ item.name|force_escape|force_escape }}"
                                                    {# Yes, double-escape to prevent XSS in lightbox #}
                                                    data-lightbox="{{ item.id }}">
                                                <img src="{{ item.picture|thumbnail_url:'productlist' }}"
                                                        alt="{{ item.name }}"/>
                                            </a>
                                        {% endif %}
                                        <div class="product-description {% if item.picture %}with-picture{% endif %}">
                                            <strong>{{ item.name }}</strong>
                                            {% if item.description %}
                                                <div class="product-description">
                                                    {{ item.description|localize|rich_text }}
                                                </div>
                                            {% endif %}
                                            {% if event.settings.show_quota_left %}
                                                {% include "pretixpresale/event/fragment_quota_left.html" with avail=item.cached_availability %}
                                            {% endif %}
                                            {% if item.min_per_order and item.min_per_order > 1 %}
                                                <p>
                                                    <small>
                                                        {% blocktrans trimmed with num=item.min_per_order %}
                                                            minimum amount to order: {{ num }}
                                                        {% endblocktrans %}
                                                    </small>
                                                </p>
                                            {% endif %}
                                        </div>
                                    </div>
                                    <div class="col-md-2 col-xs-6 price">
                                        {% if item.free_price %}
                                            <div class="input-group input-group-price">
                                                <span class="input-group-addon">{{ event.currency }}</span>
                                                <input type="number" class="form-control input-item-price" placeholder="0"
                                                        min="{% if event.settings.display_net_prices %}{{ item.display_price.net|stringformat:"0.2f" }}{% else %}{{ item.display_price.gross|stringformat:"0.2f" }}{% endif %}"
                                                        name="price_{{ item.id }}"
                                                        value="{% if event.settings.display_net_prices %}{{item.display_price.net|stringformat:"0.2f" }}{% else %}{{ item.display_price.gross|stringformat:"0.2f" }}{% endif %}"
                                                        step="any">
                                            </div>
                                        {% elif not item.display_price.gross %}
                                            {% trans "FREE" context "price" %}
                                        {% elif event.settings.display_net_prices %}
                                            {{ event.currency }} {{ item.display_price.net|floatformat:2 }}
                                        {% else %}
                                            {{ event.currency }} {{ item.display_price.gross|floatformat:2 }}
                                        {% endif %}
                                        {% if item.display_price.rate and item.display_price.gross and event.settings.display_net_prices %}
                                            <small>{% blocktrans trimmed with rate=item.display_price.rate name=item.display_price.name %}
                                                <strong>plus</strong> {{ rate }}% {{ name }}
                                            {% endblocktrans %}</small>
                                        {% elif item.display_price.rate and item.display_price.gross %}
                                            <small>{% blocktrans trimmed with rate=item.display_price.rate name=item.display_price.name %}
                                                incl. {{ rate }}% {{ name }}
                                            {% endblocktrans %}</small>
                                        {% endif %}
                                    </div>
                                    {% if item.require_voucher %}
                                        <div class="col-md-2 col-xs-6 availability-box unavailable">
                                            <small>
                                                {% trans "Enter a voucher code below to buy this ticket." %}
                                            </small>
                                        </div>
                                    {% elif item.cached_availability.0 == 100 %}
                                        <div class="col-md-2 col-xs-6 availability-box available">
                                            {% if item.max_per_order == 1 %}
                                                <label class="item-checkbox-label">
                                                    <input type="checkbox" value="1"
                                                            name="item_{{ item.id }}">
                                                </label>
                                            {% else %}
                                                <input type="number" class="form-control input-item-count" placeholder="0" min="0"
                                                        max="{{ item.order_max }}" name="item_{{ item.id }}">
                                            {% endif %}
                                        </div>
                                    {% else %}
                                        {% include "pretixpresale/event/fragment_availability.html" with avail=item.cached_availability.0 event=event item=item var=0 %}
                                    {% endif %}
                                    <div class="clearfix"></div>
                                </div>
                            {% endif %}
                        {% endfor %}
                    </section>
                {% endfor %}
                {% if ev.presale_is_running and display_add_to_cart %}
                    <section class="front-page">
                        <div class="row-fluid">
                            <div class="col-md-4 col-md-offset-8 col-xs-12">
                                <button class="btn btn-block btn-primary btn-lg" type="submit" id="btn-add-to-cart">
                                    <i class="fa fa-shopping-cart"></i> {% trans "Add to cart" %}
                                </button>
                            </div>
                            <div class="clearfix"></div>
                        </div>
                    </section>
                {% endif %}
            </form>
        {% endif %}
    {% endif %}
    {% if vouchers_exist %}
        <section class="front-page">
            <h3>{% trans "Redeem a voucher" %}</h3>
            <form method="get" action="{% eventurl event "presale:event.redeem" cart_namespace=cart_namespace %}">
                <div class="row-voucher">
                    <div class="col-md-8 col-sm-6 col-xs-12">
                        <div class="input-group">
                            <span class="input-group-addon"><i class="fa fa-ticket fa-fw"></i></span>
                            <input type="text" class="form-control" name="voucher" id="voucher"
                                    placeholder="{% trans "Voucher code" %}">
                        </div>
                    </div>
                    <input type="hidden" name="subevent" value="{{ subevent.id|default_if_none:"" }}" />
                    <div class="col-md-4 col-sm-6 col-xs-12">
                        <button class="btn btn-block btn-primary" type="submit">
                            {% trans "Redeem voucher" %}
                        </button>
                    </div>
                    <div class="clearfix"></div>
                </div>
            </form>
        </section>
    {% endif %}
    {% if not cart_namespace %}
        {% eventsignal event "pretix.presale.signals.front_page_bottom" %}
        <section class="front-page">
            <h3>{% trans "If you already ordered a ticket" %}</h3>
            <div>
                <div class="col-md-8 col-xs-12">
                    <p>
                        {% blocktrans trimmed %}
                            If you want to see or change the status and details of your order, click on the link in one of the
                            emails we sent you during the order process. If you cannot find the link, click on the
                            following button to request the link to your order to be sent to you again.
                        {% endblocktrans %}
                    </p>
                </div>
                <div class="col-md-4 col-xs-12 text-right">
                    <a class="btn btn-block btn-primary" href="{% eventurl event "presale:event.resend_link" %}">
                        {% trans "Resend order links" %}
                    </a>
                </div>
                <div class="clearfix"></div>
            </div>
        </section>
    {% endif %}
{% endblock %}
