<commit_before>{# See shuup/front/macros/macros.jinja for inheritance ordering #}
{% extends "shuup/front/macros/product_information.jinja" %}

{% macro render_product_image_section(product, product_images=[]) %}
    {% if product|is_discounted %}
        <div class="badge product-badge sale">
            {% set discount_percent = product|discount_percent %}
            {{- _("Save %(discount_percent)s", discount_percent=discount_percent) -}}
        </div>
    {% endif %}
    {% set image_medias = product_images if product_images else images %}
    {% set sp = product.get_shop_instance(request.shop) %}
    {% set rel = "gallery%s" % product.id %}
    {% set product_primary_image = product.primary_image %}
    <div id="carousel_product_{{ product.id }}" class="product-carousel carousel fade" data-ride="carousel" data-interval="false">
        <div class="carousel-inner">
            {% for product_image in image_medias %}
                <div class="item{% if ((not product_primary_image and loop.index == 1) or product_image == product_primary_image) %} active{% endif %}">
                    {% set product_image_cropped = product_image|thumbnail(size=(700, 700)) %}
                    {% if loop|count > 1 %}
                        <a data-imagelightbox="image-multiple" href="{{ product_image.url }}" rel="{{ rel }}" class="thumbnail">
                            <div class="image"
                                 style="background-image:url('{{ product_image_cropped }}')"
                                 data-title="{% if product_image.title %}{{ product_image.title }}{% endif %}"
                                 data-description="{% if product_image.description %}{{ product_image.description }}{% endif %}">
                            </div>
                        </a>
                    {% else %}
                        <a data-imagelightbox="image" href="{{ product_image.url }}" rel="{{ rel }}" class="thumbnail">
                            <div class="image"
                                 style="background-image:url('{{ product_image_cropped }}')"
                                 data-title="{% if product_image.title %}{{ product_image.title }}{% endif %}"
                                 data-description="{% if product_image.description %}{{ product_image.description }}{% endif %}">
                            </div>
                        </a>
                    {% endif %}
                </div>
            {% else %}
                <div class="item active">
                    <div class="thumbnail" rel="{{ rel }}1">
                        <img class="img-responsive no-image"
                             alt="{{ product.name }}"
                             src="{{ STATIC_URL }}shuup/front/img/no_image.png">
                    </div>
                </div>
            {% endfor %}
        </div>
    </div>
    <div class="wrap-thumbnails">
        <div class="carousel-thumbnails owl-carousel">
            {% for product_image in image_medias %}
                {% if loop|count > 1 %}
                    {% set product_image_thumbnail = product_image|thumbnail(size=(300, 300)) %}
                    <a href="#carousel_product_{{ product.id }}" class="thumbnail" data-slide-to="{{ loop.index0 }}">
                        <div class="image" style="background-image:url('{{ product_image_thumbnail }}')"></div>
                    </a>
                {% endif %}
            {% endfor %}
        </div>
    </div>
{% endmacro %}

{% macro render_product_image_js() %}
    <script>
        {{ render_owl_carousel_js() }}
        {{ render_lightbox_js() }}
    </script>
{% endmacro %}

{% macro render_owl_carousel_js() %}
    // Set up owl carousel for product page's slider thumbnails.
    $(".owl-carousel.carousel-thumbnails").owlCarousel({
        margin: 10,
        nav: $(".carousel-thumbnails .thumbnail").length > 4,
        navText: [
            "<i class='fa fa-chevron-left'></i>",
            "<i class='fa fa-chevron-right'></i>"
        ],
        responsiveClass: true,
        items: 4
    });
{% endmacro %}

{% macro render_lightbox_js() %}
    // Enable lightbox for products with multiple images. Uses arrows to
    // navigate through images.
    var selector_multiple = "a[data-imagelightbox='image-multiple']";
    if ($(selector).length > 0) {
        var instance_multiple = $(selector_multiple).simpleLightbox();
    }

    // Enable lightbox for products with only one image.
    var selector = "a[data-imagelightbox='image']";
    if ($(selector).length > 0) {
        var instance = $(selector).simpleLightbox();
    }
{% endmacro %}
<commit_msg>Front: fix bug with imagelightbox<commit_after>{# See shuup/front/macros/macros.jinja for inheritance ordering #}
{% extends "shuup/front/macros/product_information.jinja" %}

{% macro render_product_image_section(product, product_images=[]) %}
    {% if product|is_discounted %}
        <div class="badge product-badge sale">
            {% set discount_percent = product|discount_percent %}
            {{- _("Save %(discount_percent)s", discount_percent=discount_percent) -}}
        </div>
    {% endif %}
    {% set image_medias = product_images if product_images else images %}
    {% set sp = product.get_shop_instance(request.shop) %}
    {% set rel = "gallery%s" % product.id %}
    {% set product_primary_image = product.primary_image %}
    <div id="carousel_product_{{ product.id }}" class="product-carousel carousel fade" data-ride="carousel" data-interval="false">
        <div class="carousel-inner">
            {% for product_image in image_medias %}
                <div class="item{% if ((not product_primary_image and loop.index == 1) or product_image == product_primary_image) %} active{% endif %}">
                    {% set product_image_cropped = product_image|thumbnail(size=(700, 700)) %}
                    {% if loop|count > 1 %}
                        <a data-imagelightbox="image-multiple" href="{{ product_image.url }}" rel="{{ rel }}" class="thumbnail">
                            <div class="image"
                                 style="background-image:url('{{ product_image_cropped }}')"
                                 data-title="{% if product_image.title %}{{ product_image.title }}{% endif %}"
                                 data-description="{% if product_image.description %}{{ product_image.description }}{% endif %}">
                            </div>
                        </a>
                    {% else %}
                        <a data-imagelightbox="image" href="{{ product_image.url }}" rel="{{ rel }}" class="thumbnail">
                            <div class="image"
                                 style="background-image:url('{{ product_image_cropped }}')"
                                 data-title="{% if product_image.title %}{{ product_image.title }}{% endif %}"
                                 data-description="{% if product_image.description %}{{ product_image.description }}{% endif %}">
                            </div>
                        </a>
                    {% endif %}
                </div>
            {% else %}
                <div class="item active">
                    <div class="thumbnail" rel="{{ rel }}1">
                        <img class="img-responsive no-image"
                             alt="{{ product.name }}"
                             src="{{ STATIC_URL }}shuup/front/img/no_image.png">
                    </div>
                </div>
            {% endfor %}
        </div>
    </div>
    <div class="wrap-thumbnails">
        <div class="carousel-thumbnails owl-carousel">
            {% for product_image in image_medias %}
                {% if loop|count > 1 %}
                    {% set product_image_thumbnail = product_image|thumbnail(size=(300, 300)) %}
                    <a href="#carousel_product_{{ product.id }}" class="thumbnail" data-slide-to="{{ loop.index0 }}">
                        <div class="image" style="background-image:url('{{ product_image_thumbnail }}')"></div>
                    </a>
                {% endif %}
            {% endfor %}
        </div>
    </div>
{% endmacro %}

{% macro render_product_image_js() %}
    <script>
        {{ render_owl_carousel_js() }}
        {{ render_lightbox_js() }}
    </script>
{% endmacro %}

{% macro render_owl_carousel_js() %}
    // Set up owl carousel for product page's slider thumbnails.
    $(".owl-carousel.carousel-thumbnails").owlCarousel({
        margin: 10,
        nav: $(".carousel-thumbnails .thumbnail").length > 4,
        navText: [
            "<i class='fa fa-chevron-left'></i>",
            "<i class='fa fa-chevron-right'></i>"
        ],
        responsiveClass: true,
        items: 4
    });
{% endmacro %}

{% macro render_lightbox_js() %}
    // Enable lightbox for products with multiple images. Uses arrows to
    // navigate through images.
    var selector_multiple = "a[data-imagelightbox='image-multiple']";
    if ($(selector_multiple).length > 0) {
        var instance_multiple = $(selector_multiple).simpleLightbox();
    }

    // Enable lightbox for products with only one image.
    var selector = "a[data-imagelightbox='image']";
    if ($(selector).length > 0) {
        var instance = $(selector).simpleLightbox();
    }
{% endmacro %}

{'fraction_non_alphanumeric': 0.14842996463401564, 'fraction_numerical': 0.004929803879541314, 'mean_word_length': 1.9026438569206843, 'pattern_counts': {'":': 0, '<': 73, '<?xml version=': 0, '>': 83, 'https://': 0, 'lorem ipsum': 0, 'www.': 0, 'xml': 0}, 'pii_count': 0, 'substrings_counts': 0, 'word_list_counts': {'cursed_substrings.json': 12, 'profanity_word_list.json': 0, 'sexual_word_list.json': 0, 'zh_pornsignals.json': 0}}
{'dir': 'git-commits-cleaned', 'id': '5010367', 'n_tokens_mistral': 2779, 'n_tokens_neox': 2506, 'n_words': 522}