<div class="tt_product_module{% if config_module.row >=2 %}{{ ' multi-rows' }}{% endif %}" id="product_module{{ config_module.module_id }}">
    <div class="module-title">
        <h2>
            {% if config_module.title_lang[code].title %}
                {{ config_module.title_lang[code].title }}
            {% else %}
                {{ heading_title }}
            {% endif %}
        </h2>
        {% if module_description %}
            <div class="module-description">
                {{ module_description }}
            </div>
        {% endif %}
    </div>
    {% if config_module.slider %}
        {% set class_slider = ' owl-carousel owl-theme ' %}
    {% else %}
        {% set class_slider = '' %}
    {% endif %}
    {% if config_module.nrow == 0 %}
        {% set class = 'two_items col-lg-6 col-md-6 col-sm-6 col-xs-12' %}
    {% elseif config_module.nrow == 1 %}
        {% set class = 'three_items col-lg-4 col-md-4 col-sm-4 col-xs-12' %}
    {% elseif config_module.nrow == 2 %}
        {% set class = 'four_items col-lg-3 col-md-3 col-sm-3 col-xs-12' %}
    {% else %}
        {% set class = 'six_items col-lg-2 col-md-2 col-sm-2 col-xs-12' %}
    {% endif %}
    {% if products|length > 0 %}
        {% if config_module.row %}
            {% set rows = config_module.row %}
        {% else %}
            {% set rows = 1 %}
        {% endif %}
        {% set count = 0 %}
        <div class="tt-product {{ class_slider }}">
            {% for product in products %}
                {% if count % rows == 0 %}
                    <div class="row_items {% if not config_module.slider %}{{ class }}{% endif %}">
                {% endif %}
                {% set count = count + 1 %}
                {% if config_module.type == 0 %}
                    <div class="product-layout product-grid">
                        <div class="product-thumb transition">
                            <div class="image">
                                <a href="{{ product.href }}">
                                    {% if config_module.rotator and product.rotator_image %}<img class="img-r" src="{{ product.rotator_image }}" />{% endif %}
                                    <img src="{{ product.thumb }}" alt="{{ product.name }}" title="{{ product.name }}" class="img-responsive"/>
                                </a>
                                {% if config_module.salelabel %}
                                    {% if product.special %}
                                        <div class="label-product label_sale">-{{ ((product.price - product.special)*100 /product.price)|round }}%</div>
                                    {% endif %}
                                {% endif %}
                                {% if config_module.newlabel %}
                                    {% if product.is_new %}
                                        <div class="label-product label_new">{{ text_label_new }}</div>
                                    {% endif %}
                                {% endif %}

                                <div class="action-links">
                                    {% if use_catalog %}
                                        <button class="btn-cart" type="button" data-toggle="tooltip" title="{{ button_cart }}" onclick="cart.add('{{ product.product_id }}');"><i class="ion-bag"></i><span>{{ button_cart }}</span></button>
                                    {% endif %}
                                    <button class="btn-wishlist" type="button" data-toggle="tooltip" title="{{ button_wishlist }}" onclick="wishlist.add('{{ product.product_id }}');"><i class="ion-android-favorite-outline"></i><span>{{ button_wishlist }}</span></button>
                                    {% if use_quickview %}
                                        <button class="btn-quickview" type="button" data-toggle="tooltip" title="{{ button_quickview }}" onclick="ocquickview.ajaxView('{{ product.href }}')"><i class="ion-android-open"></i><span>{{ button_quickview }}</span></button>
                                    {% endif %}
                                </div>

                            </div>
                            <div class="caption">
                                {% if product.manufacturer %}
                                    <p class="manufacture-product">
                                        <a href="{{ product.manufacturers }}">{{ product.manufacturer }}</a>
                                    </p>
                                {% endif %}
                                {% if product.rating %}
                                    <div class="ratings">
                                        <div class="rating-box">
                                            {% for i in 1..5 %}
                                                {% if product.rating == i %}
                                                    {% set class_r = "rating"~i %}
                                                    <div class="{{ class_r }}">rating</div>
                                                {% endif %}
                                            {% endfor %}
                                        </div>
                                    </div>
                                {% endif %}
                                <h4 class="product-name"><a href="{{ product.href }}">{{ product.name }}</a></h4>
                                {% if config_module.description %}
                                    <p class="product-des">{{ product.description }}</p>
                                {% endif %}
                                {% if use_catalog %}
                                    {% if product.price %}
                                        <p class="price">
                                            {% if not product.special %}
                                                {{ product.price }}
                                            {% else %}
                                                <span class="price-old">{{ product.price }}</span><span class="price-new">{{ product.special }}</span>
                                            {% endif %}
                                            {% if product.tax %}
                                                <span class="price-tax">{{ text_tax }} {{ product.tax }}</span>
                                            {% endif %}
                                        </p>
                                    {% endif %}
                                {% endif %}
                            </div>
                            {% if config_module.countdown %}
                                <div id="Countdown{{ product.product_id }}-{{ i }}" class="box-timer"></div> {% endif %}
                        </div>
                        {% if product.date_end and config_module.countdown %}
                            <script type="text/javascript">
                                $(document).ready(function () {
                                    $('#Countdown{{ product.product_id }}-{{ i }}').countdown({
                                        until: new Date({{ product.date_end|date("Y") }}, {{ product.date_end|date("m") }}-1, {{ product.date_end|date("d") }}, {{ product.date_end|date("H") }}, {{ product.date_end|date("i") }}, {{ product.date_end|date("s") }}),
                                        labels: ['{{ text_years }}', '{{ text_months }} ', '{{ text_weeks }}', '{{ text_days }}', '{{ text_hrs }}', '{{ text_mins }}', '{{ text_secs }}'],
                                        labels1: ['{{ text_year }}', '{{ text_month }} ', '{{ text_week }}', '{{ text_day }}', '{{ text_hr }}', '{{ text_min }}', '{{ text_sec }}'],
                                    });
                                });
                            </script>
                        {% endif %}
                    </div>
                {% elseif config_module.type == 1 %}
                    <div class="product-layout list-style">
                        <div class="product-thumb transition">
                            <div class="image">
                                <a href="{{ product.href }}">
                                    {% if config_module.rotator and product.rotator_image %}<img class="img-r" src="{{ product.rotator_image }}" />{% endif %}
                                    <img src="{{ product.thumb }}" alt="{{ product.name }}" title="{{ product.name }}" class="img-responsive"/>
                                </a>
                                {% if config_module.salelabel %}
                                    {% if product.special %}
                                        <div class="label-product label_sale">-{{ ((product.price - product.special)*100 /product.price)|round }}%</div>
                                    {% endif %}
                                {% endif %}
                                {% if config_module.newlabel %}
                                    {% if product.is_new %}
                                        <div class="label-product label_new">{{ text_label_new }}</div>
                                    {% endif %}
                                {% endif %}
                            </div>
                            <div class="caption">
                                {% if product.manufacturer %}
                                    <p class="manufacture-product">
                                        <a href="{{ product.manufacturers }}">{{ product.manufacturer }}</a>
                                    </p>
                                {% endif %}
                                {% if product.rating %}
                                    <div class="ratings">
                                        <div class="rating-box">
                                            {% for i in 1..5 %}
                                                {% if product.rating == i %}
                                                    {% set class_r = "rating"~i %}
                                                    <div class="{{ class_r }}">rating</div>
                                                {% endif %}
                                            {% endfor %}
                                        </div>
                                    </div>
                                {% endif %}
                                <h4 class="product-name"><a href="{{ product.href }}">{{ product.name }}</a></h4>
                                {% if config_module.description %}
                                    <p class="product-des">{{ product.description }}</p>
                                {% endif %}
                                {% if use_catalog %}
                                    {% if product.price %}
                                        <p class="price">
                                            {% if not product.special %}
                                                {{ product.price }}
                                            {% else %}
                                                <span class="price-old">{{ product.price }}</span><span class="price-new">{{ product.special }}</span>
                                            {% endif %}
                                            {% if product.tax %}
                                                <span class="price-tax">{{ text_tax }} {{ product.tax }}</span>
                                            {% endif %}
                                        </p>
                                    {% endif %}
                                {% endif %}
                                <div class="action-links">
                                    {% if use_catalog %}
                                        <button class="btn-cart" type="button" data-toggle="tooltip" title="{{ button_cart }}" onclick="cart.add('{{ product.product_id }}');"><i class="ion-bag"></i><span>{{ button_cart }}</span></button>
                                    {% endif %}
                                    <button class="btn-wishlist" type="button" data-toggle="tooltip" title="{{ button_wishlist }}" onclick="wishlist.add('{{ product.product_id }}');"><i class="ion-android-favorite-outline"></i><span>{{ button_wishlist }}</span></button>
                                    {% if use_quickview %}
                                        <button class="btn-quickview" type="button" data-toggle="tooltip" title="{{ button_quickview }}" onclick="ocquickview.ajaxView('{{ product.href }}')"><i class="ion-android-open"></i><span>{{ button_quickview }}</span></button>
                                    {% endif %}
                                </div>
                            </div>
                            {% if config_module.countdown %}
                                <div id="Countdown{{ product.product_id }}-{{ i }}" class="box-timer"></div> {% endif %}
                        </div>
                        {% if product.date_end and config_module.countdown %}
                            <script type="text/javascript">
                                $(document).ready(function () {
                                    $('#Countdown{{ product.product_id }}-{{ i }}').countdown({
                                        until: new Date({{ product.date_end|date("Y") }}, {{ product.date_end|date("m") }}-1, {{ product.date_end|date("d") }}, {{ product.date_end|date("H") }}, {{ product.date_end|date("i") }}, {{ product.date_end|date("s") }}),
                                        labels: ['{{ text_years }}', '{{ text_months }} ', '{{ text_weeks }}', '{{ text_days }}', '{{ text_hrs }}', '{{ text_mins }}', '{{ text_secs }}'],
                                        labels1: ['{{ text_year }}', '{{ text_month }} ', '{{ text_week }}', '{{ text_day }}', '{{ text_hr }}', '{{ text_min }}', '{{ text_sec }}'],
                                    });
                                });
                            </script>
                        {% endif %}
                    </div>
                {% else %}
                    <div class="product-layout product-customize">
                        <div class="product-thumb transition">
                            <div class="image">
                                <a href="{{ product.href }}">
                                    {% if config_module.rotator and product.rotator_image %}<img class="img-r" src="{{ product.rotator_image }}" />{% endif %}
                                    <img src="{{ product.thumb }}" alt="{{ product.name }}" title="{{ product.name }}" class="img-responsive"/>
                                </a>
                                {% if config_module.salelabel %}
                                    {% if product.special %}
                                        <div class="label-product label_sale">-{{ ((product.price - product.special)*100 /product.price)|round }}%</div>
                                    {% endif %}
                                {% endif %}
                                {% if config_module.newlabel %}
                                    {% if product.is_new %}
                                        <div class="label-product label_new">{{ text_label_new }}</div>
                                    {% endif %}
                                {% endif %}

                                <div class="action-links">
                                    {% if use_catalog %}
                                        <button class="btn-cart" type="button" data-toggle="tooltip" title="{{ button_cart }}" onclick="cart.add('{{ product.product_id }}');"><i class="ion-bag"></i><span>{{ button_cart }}</span></button>
                                    {% endif %}
                                    <button class="btn-wishlist" type="button" data-toggle="tooltip" title="{{ button_wishlist }}" onclick="wishlist.add('{{ product.product_id }}');"><i class="ion-android-favorite-outline"></i><span>{{ button_wishlist }}</span></button>
                                    {% if use_quickview %}
                                        <button class="btn-quickview" type="button" data-toggle="tooltip" title="{{ button_quickview }}" onclick="ocquickview.ajaxView('{{ product.href }}')"><i class="ion-android-open"></i><span>{{ button_quickview }}</span></button>
                                    {% endif %}
                                </div>

                            </div>
                            <div class="caption">
                                {% if product.manufacturer %}
                                    <p class="manufacture-product">
                                        <a href="{{ product.manufacturers }}">{{ product.manufacturer }}</a>
                                    </p>
                                {% endif %}
                                {% if product.rating %}
                                    <div class="ratings">
                                        <div class="rating-box">
                                            {% for i in 1..5 %}
                                                {% if product.rating == i %}
                                                    {% set class_r = "rating"~i %}
                                                    <div class="{{ class_r }}">rating</div>
                                                {% endif %}
                                            {% endfor %}
                                        </div>
                                    </div>
                                {% endif %}
                                <h4 class="product-name"><a href="{{ product.href }}">{{ product.name }}</a></h4>
                                {% if config_module.description %}
                                    <p class="product-des">{{ product.description }}</p>
                                {% endif %}
                                {% if use_catalog %}
                                    {% if product.price %}
                                        <p class="price">
                                            {% if not product.special %}
                                                {{ product.price }}
                                            {% else %}
                                                <span class="price-old">{{ product.price }}</span><span class="price-new">{{ product.special }}</span>
                                            {% endif %}
                                            {% if product.tax %}
                                                <span class="price-tax">{{ text_tax }} {{ product.tax }}</span>
                                            {% endif %}
                                        </p>
                                    {% endif %}
                                {% endif %}
                            </div>
                            {% if config_module.countdown %}
                                <div id="Countdown{{ product.product_id }}-{{ i }}" class="box-timer"></div> {% endif %}
                        </div>
                        {% if product.date_end and config_module.countdown %}
                            <script type="text/javascript">
                                $(document).ready(function () {
                                    $('#Countdown{{ product.product_id }}-{{ i }}').countdown({
                                        until: new Date({{ product.date_end|date("Y") }}, {{ product.date_end|date("m") }}-1, {{ product.date_end|date("d") }}, {{ product.date_end|date("H") }}, {{ product.date_end|date("i") }}, {{ product.date_end|date("s") }}),
                                        labels: ['{{ text_years }}', '{{ text_months }} ', '{{ text_weeks }}', '{{ text_days }}', '{{ text_hrs }}', '{{ text_mins }}', '{{ text_secs }}'],
                                        labels1: ['{{ text_year }}', '{{ text_month }} ', '{{ text_week }}', '{{ text_day }}', '{{ text_hr }}', '{{ text_min }}', '{{ text_sec }}'],
                                    });
                                });
                            </script>
                        {% endif %}
                    </div>
                {% endif %}
                {% if (count % rows == 0) or (count == products|length ) %}
                    </div>
                {% endif %}
            {% endfor %}
        </div>
    {% else %}
        <p class="text_empty">{{ text_no_results }}</p>
    {% endif %}
</div>
{% if config_module.slider %}
    <script type="text/javascript">
        $(document).ready(function () {
            $("#product_module{{ config_module.module_id }} .tt-product").owlCarousel({
                loop: {% if config_module.loop %} true {% else %} false {% endif %},
                margin: {% if config_module.margin %} {{ config_module.margin }} {% else %} 20 {% endif %},
                nav: {% if config_module.navigation %} true {% else %} false {% endif %},
                dots: {% if config_module.pagination %} true {% else %} false {% endif %},
                autoplay:  {% if config_module.auto %} true {% else %} false {% endif %},
                autoplayTimeout: {% if config_module.time %} {{ config_module.time }} {% else %} 2000 {% endif %},
                autoplayHoverPause: true,
                autoplaySpeed: {% if config_module.speed %} {{ config_module.speed }} {% else %} 3000 {% endif %},
                navSpeed: {% if config_module.speed %} {{ config_module.speed }} {% else %} 3000 {% endif %},
                dotsSpeed: {% if config_module.speed %} {{ config_module.speed }} {% else %} 3000 {% endif %},
                lazyLoad: true,
                navText: ['<i class="ion-chevron-left"></i>', '<i class="ion-chevron-right"></i>'],
                responsive: {
                    0: {
                        items: {{ config_module.smobile }}
                    },
                    481: {
                        items: {{ config_module.mobile }}
                    },
                    769: {
                        items: {{ config_module.tablet }}
                    },
                    1024: {
                        items: {{ config_module.desktop }}
                    },
                    1200: {
                        items: {{ config_module.items }}
                    },
                }
            });

        });
    </script>
{% endif %}
