From 1a9f6e49d4465350c65f80c0a8b8fb06c5377563 Mon Sep 17 00:00:00 2001
From: Raphael Michel <mail@raphaelmichel.de>
Date: Wed, 22 May 2019 09:48:07 +0200
Subject: [PATCH] Refactor product list into own template

---
 .../event/fragment_product_list.html          | 282 ++++++++++++++++++
 .../templates/pretixpresale/event/index.html  | 276 +----------------
 2 files changed, 283 insertions(+), 275 deletions(-)
 create mode 100644 src/pretix/presale/templates/pretixpresale/event/fragment_product_list.html

diff --git a/src/pretix/presale/templates/pretixpresale/event/fragment_product_list.html b/src/pretix/presale/templates/pretixpresale/event/fragment_product_list.html
new file mode 100644
index 000000000..c440ce4fc
--- /dev/null
+++ b/src/pretix/presale/templates/pretixpresale/event/fragment_product_list.html
@@ -0,0 +1,282 @@
+{% load i18n %}
+{% load l10n %}
+{% load eventurl %}
+{% load money %}
+{% load thumb %}
+{% load eventsignal %}
+{% load rich_text %}
+{% 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 %}
+                <details class="item-with-variations" {% if event.settings.show_variations_expanded %}open{% endif %}>
+                    <summary 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|thumb:'60x60^' }}"
+                                         alt="{{ item.name }}"/>
+                                </a>
+                            {% endif %}
+                            <div class="product-description {% if item.picture %}with-picture{% endif %}">
+                                <h4>
+                                    <a href="#" data-toggle="variations">
+                                        {{ item.name }}
+                                    </a>
+                                </h4>
+                                {% 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 %}
+                                {{ item.min_price|money:event.currency  }} – {{ item.max_price|money:event.currency  }}
+                            {% elif not item.min_price and not item.max_price %}
+                                {% trans "FREE" context "price" %}
+                            {% else %}
+                                {{ item.min_price|money:event.currency }}
+                            {% 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>
+                    </summary>
+                    <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">
+                                    <h5>
+                                        <label for="variation_{{ item.pk }}_{{ var.pk }}">
+                                            {{ var }}
+                                        </label>
+                                    </h5>
+                                    {% 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 var.original_price %}
+                                        {% if event.settings.display_net_prices %}
+                                            <del>{{ var.original_price.net|money:event.currency }}</del>
+                                        {% else %}
+                                            <del>{{ var.original_price.gross|money:event.currency }}</del>
+                                        {% endif %}
+                                        <ins>
+                                    {% endif %}
+                                    {% 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"
+                                                   {% if not ev.presale_is_running %}disabled{% endif %}
+                                                   placeholder="0"
+                                                   min="{% if event.settings.display_net_prices %}{{ var.display_price.net|money_numberfield:event.currency }}{% else %}{{ var.display_price.gross|money_numberfield:event.currency }}{% endif %}"
+                                                   name="price_{{ item.id }}_{{ var.id }}"
+                                                   title="{% blocktrans trimmed with item=var.value %}Modify price for {{ item }}{% endblocktrans %}"
+                                                   step="any"
+                                                   value="{% if event.settings.display_net_prices %}{{ var.display_price.net|money_numberfield:event.currency }}{% else %}{{ var.display_price.gross|money_numberfield:event.currency }}{% endif %}"
+                                            >
+                                        </div>
+                                    {% elif not var.display_price.gross %}
+                                        {% trans "FREE" context "price" %}
+                                        {% elif event.settings.display_net_prices %}
+                                        {{ var.display_price.net|money:event.currency }}
+                                    {% else %}
+                                        {{ var.display_price.gross|money:event.currency }}
+                                    {% endif %}
+                                    {% if item.original_price or var.original_price %}
+                                        </ins>
+                                    {% endif %}
+                                    {% if item.includes_mixed_tax_rate %}
+                                        {% if event.settings.display_net_prices %}
+                                            <small>{% trans "plus taxes" %}</small>
+                                        {% else %}
+                                            <small>{% trans "incl. taxes" %}</small>
+                                        {% endif %}
+                                    {% elif var.display_price.rate and var.display_price.gross and event.settings.display_net_prices %}
+                                        <small>{% blocktrans trimmed with rate=var.display_price.rate|floatformat:-2 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|floatformat:-2 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"
+                                                       {% if not ev.presale_is_running %}disabled{% endif %}
+                                                       id="variation_{{ item.id }}_{{ var.id }}"
+                                                       name="variation_{{ item.id }}_{{ var.id }}"
+                                                       title="{% blocktrans with item=item.name var=var.name %}Amount of {{ item }} – {{ var }} to order{% endblocktrans %}">
+                                            </label>
+                                        {% else %}
+                                            <input type="number" class="form-control input-item-count" placeholder="0" min="0"
+                                                   {% if not ev.presale_is_running %}disabled{% endif %}
+                                                   max="{{ var.order_max }}"
+                                                   pattern="\d*"
+                                                   id="variation_{{ item.id }}_{{ var.id }}"
+                                                   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>
+                </details>
+            {% 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|thumb:'60x60^' }}"
+                                     alt="{{ item.name }}"/>
+                            </a>
+                        {% endif %}
+                        <div class="product-description {% if item.picture %}with-picture{% endif %}">
+                            <h4>
+                                <label for="item_{{ item.pk }}">{{ item.name }}</label>
+                            </h4>
+                            {% 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.original_price %}
+                            {% if event.settings.display_net_prices %}
+                                <del>{{ item.original_price.net|money:event.currency }}</del>
+                            {% else %}
+                                <del>{{ item.original_price.gross|money:event.currency }}</del>
+                            {% endif %}
+                            <ins>
+                        {% endif %}
+                        {% 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"
+                                       {% if not ev.presale_is_running %}disabled{% endif %}
+                                       min="{% if event.settings.display_net_prices %}{{ item.display_price.net|money_numberfield:event.currency }}{% else %}{{ item.display_price.gross|money_numberfield:event.currency }}{% endif %}"
+                                       name="price_{{ item.id }}"
+                                       title="{% blocktrans trimmed with item=item.name %}Modify price for {{ item }}{% endblocktrans %}"
+                                       value="{% if event.settings.display_net_prices %}{{ item.display_price.net|money_numberfield:event.currency }}{% else %}{{ item.display_price.gross|money_numberfield:event.currency }}{% endif %}"
+                                       step="any">
+                            </div>
+                        {% elif not item.display_price.gross %}
+                            {% trans "FREE" context "price" %}
+                            {% elif event.settings.display_net_prices %}
+                            {{ item.display_price.net|money:event.currency }}
+                        {% else %}
+                            {{ item.display_price.gross|money:event.currency }}
+                        {% endif %}
+                        {% if item.original_price %}
+                            </ins>
+                        {% endif %}
+                        {% if item.includes_mixed_tax_rate %}
+                            {% if event.settings.display_net_prices %}
+                                <small>{% trans "plus taxes" %}</small>
+                            {% else %}
+                                <small>{% trans "incl. taxes" %}</small>
+                            {% endif %}
+                        {% elif item.display_price.rate and item.display_price.gross and event.settings.display_net_prices %}
+                            <small>{% blocktrans trimmed with rate=item.display_price.rate|floatformat:-2 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|floatformat:-2 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" {% if itemnum == 1 %}checked{% endif %}
+                                           {% if not ev.presale_is_running %}disabled{% endif %}
+                                           name="item_{{ item.id }}" id="item_{{ item.id }}">
+                                </label>
+                            {% else %}
+                                <input type="number" class="form-control input-item-count" placeholder="0" min="0"
+                                       {% if not ev.presale_is_running %}disabled{% endif %}
+                                       pattern="\d*" {% if itemnum == 1 %}value="1"{% endif %}
+                                       max="{{ item.order_max }}"
+                                       name="item_{{ item.id }}"
+                                       id="item_{{ item.id }}"
+                                       title="{% blocktrans with item=item.name %}Amount of {{ item }} to order{% endblocktrans %}">
+                            {% 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 %}
diff --git a/src/pretix/presale/templates/pretixpresale/event/index.html b/src/pretix/presale/templates/pretixpresale/event/index.html
index 1aa3bc8d1..96e3ce29a 100644
--- a/src/pretix/presale/templates/pretixpresale/event/index.html
+++ b/src/pretix/presale/templates/pretixpresale/event/index.html
@@ -203,281 +203,7 @@
                     action="{% eventurl request.event "presale:event.cart.add" cart_namespace=cart_namespace %}?next={{ cart_redirect|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 %}
-                                <details class="item-with-variations" {% if event.settings.show_variations_expanded %}open{% endif %}>
-                                    <summary 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|thumb:'60x60^' }}"
-                                                            alt="{{ item.name }}"/>
-                                                </a>
-                                            {% endif %}
-                                            <div class="product-description {% if item.picture %}with-picture{% endif %}">
-                                                <h4>
-                                                    <a href="#" data-toggle="variations">
-                                                        {{ item.name }}
-                                                    </a>
-                                                </h4>
-                                                {% 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 %}
-                                                {{ item.min_price|money:event.currency  }} – {{ item.max_price|money:event.currency  }}
-                                            {% elif not item.min_price and not item.max_price %}
-                                                {% trans "FREE" context "price" %}
-                                            {% else %}
-                                                {{ item.min_price|money:event.currency }}
-                                            {% 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>
-                                    </summary>
-                                    <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">
-                                                    <h5>
-                                                        <label for="variation_{{ item.pk }}_{{ var.pk }}">
-                                                            {{ var }}
-                                                        </label>
-                                                    </h5>
-                                                    {% 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 var.original_price %}
-                                                        {% if event.settings.display_net_prices %}
-                                                            <del>{{ var.original_price.net|money:event.currency }}</del>
-                                                        {% else %}
-                                                            <del>{{ var.original_price.gross|money:event.currency }}</del>
-                                                        {% endif %}
-                                                        <ins>
-                                                    {% endif %}
-                                                    {% 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"
-                                                                    {% if not ev.presale_is_running %}disabled{% endif %}
-                                                                    placeholder="0"
-                                                                    min="{% if event.settings.display_net_prices %}{{ var.display_price.net|money_numberfield:event.currency }}{% else %}{{ var.display_price.gross|money_numberfield:event.currency }}{% endif %}"
-                                                                    name="price_{{ item.id }}_{{ var.id }}"
-                                                                    title="{% blocktrans trimmed with item=var.value %}Modify price for {{ item }}{% endblocktrans %}"
-                                                                    step="any"
-                                                                    value="{% if event.settings.display_net_prices %}{{var.display_price.net|money_numberfield:event.currency }}{% else %}{{ var.display_price.gross|money_numberfield:event.currency }}{% endif %}"
-                                                            >
-                                                        </div>
-                                                    {% elif not var.display_price.gross %}
-                                                        {% trans "FREE" context "price" %}
-                                                    {% elif event.settings.display_net_prices %}
-                                                        {{ var.display_price.net|money:event.currency }}
-                                                    {% else %}
-                                                        {{ var.display_price.gross|money:event.currency }}
-                                                    {% endif %}
-                                                    {% if item.original_price or var.original_price %}
-                                                        </ins>
-                                                    {% endif %}
-                                                    {% if item.includes_mixed_tax_rate %}
-                                                        {% if event.settings.display_net_prices %}
-                                                            <small>{% trans "plus taxes" %}</small>
-                                                        {% else %}
-                                                            <small>{% trans "incl. taxes" %}</small>
-                                                        {% endif %}
-                                                    {% elif var.display_price.rate and var.display_price.gross and event.settings.display_net_prices %}
-                                                        <small>{% blocktrans trimmed with rate=var.display_price.rate|floatformat:-2 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|floatformat:-2 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"
-                                                                        {% if not ev.presale_is_running %}disabled{% endif %}
-                                                                        id="variation_{{ item.id }}_{{ var.id }}"
-                                                                        name="variation_{{ item.id }}_{{ var.id }}"
-                                                                        title="{% blocktrans with item=item.name var=var.name %}Amount of {{ item }} – {{ var }} to order{% endblocktrans %}">
-                                                            </label>
-                                                        {% else %}
-                                                            <input type="number" class="form-control input-item-count" placeholder="0" min="0"
-                                                                    {% if not ev.presale_is_running %}disabled{% endif %}
-                                                                    max="{{ var.order_max }}"
-                                                                    pattern="\d*"
-                                                                    id="variation_{{ item.id }}_{{ var.id }}"
-                                                                    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>
-                                </details>
-                            {% 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|thumb:'60x60^' }}"
-                                                        alt="{{ item.name }}"/>
-                                            </a>
-                                        {% endif %}
-                                        <div class="product-description {% if item.picture %}with-picture{% endif %}">
-                                            <h4>
-                                                <label for="item_{{ item.pk }}">{{ item.name }}</label>
-                                            </h4>
-                                            {% 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.original_price %}
-                                            {% if event.settings.display_net_prices %}
-                                                <del>{{ item.original_price.net|money:event.currency }}</del>
-                                            {% else %}
-                                                <del>{{ item.original_price.gross|money:event.currency }}</del>
-                                            {% endif %}
-                                            <ins>
-                                        {% endif %}
-                                        {% 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"
-                                                        {% if not ev.presale_is_running %}disabled{% endif %}
-                                                        min="{% if event.settings.display_net_prices %}{{ item.display_price.net|money_numberfield:event.currency }}{% else %}{{ item.display_price.gross|money_numberfield:event.currency }}{% endif %}"
-                                                        name="price_{{ item.id }}"
-                                                        title="{% blocktrans trimmed with item=item.name %}Modify price for {{ item }}{% endblocktrans %}"
-                                                        value="{% if event.settings.display_net_prices %}{{item.display_price.net|money_numberfield:event.currency }}{% else %}{{ item.display_price.gross|money_numberfield:event.currency }}{% endif %}"
-                                                        step="any">
-                                            </div>
-                                        {% elif not item.display_price.gross %}
-                                            {% trans "FREE" context "price" %}
-                                        {% elif event.settings.display_net_prices %}
-                                            {{ item.display_price.net|money:event.currency }}
-                                        {% else %}
-                                            {{ item.display_price.gross|money:event.currency }}
-                                        {% endif %}
-                                        {% if item.original_price %}
-                                            </ins>
-                                        {% endif %}
-                                        {% if item.includes_mixed_tax_rate %}
-                                            {% if event.settings.display_net_prices %}
-                                                <small>{% trans "plus taxes" %}</small>
-                                            {% else %}
-                                                <small>{% trans "incl. taxes" %}</small>
-                                            {% endif %}
-                                        {% elif item.display_price.rate and item.display_price.gross and event.settings.display_net_prices %}
-                                            <small>{% blocktrans trimmed with rate=item.display_price.rate|floatformat:-2 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|floatformat:-2 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" {% if itemnum == 1 %}checked{% endif %}
-                                                            {% if not ev.presale_is_running %}disabled{% endif %}
-                                                            name="item_{{ item.id }}" id="item_{{ item.id }}">
-                                                </label>
-                                            {% else %}
-                                                <input type="number" class="form-control input-item-count" placeholder="0" min="0"
-                                                        {% if not ev.presale_is_running %}disabled{% endif %}
-                                                        pattern="\d*" {% if itemnum == 1 %}value="1"{% endif %}
-                                                        max="{{ item.order_max }}"
-                                                        name="item_{{ item.id }}"
-                                                        id="item_{{ item.id }}"
-                                                        title="{% blocktrans with item=item.name %}Amount of {{ item }} to order{% endblocktrans %}">
-                                            {% 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 %}
+                {% include "pretixpresale/event/fragment_product_list.html" %}
                 {% if ev.presale_is_running and display_add_to_cart %}
                     <section class="front-page">
                         <div class="row-fluid">