templates/AtechNetCoreBundle/Homepage/index.html.twig line 1

Open in your IDE?
  1. {% extends 'AtechNetCoreBundle/base.html.twig' %}
  3. {% import "AtechNetCoreBundle/macros.html.twig" as macros %}
  5. {% block head %}
  6.     {{ parent() }}
  7.     {% if banners.items|length > 1 %}
  8.         {% for bannerItem in banners.items %}
  9.             <link rel="preload" as="image" href="{{ bannerItem.image }}">
  10.         {% endfor %}
  11.     {% endif %}
  12. {% endblock %}
  14. {% block content %}
  15.     {% set defaultLocale = app.request.session.get('defaultLocale') %}
  17.     {% if banners is not null and banners.items|length > 0 %}
  18.         <div class="promotions px-0 px-xl-0">
  19.             <div class="container">
  20.                 {% for message in app.flashes('pastPayResult') %}
  21.                     <div class="alert alert-info" role="alert">
  22.                         {{ message }}
  23.                     </div>
  24.                 {% endfor %}
  25.                 <div class="grid-wrapper">
  26.                     {% if banners.items|length > 1 %}
  27.                         <div id="bannersCarouselIndicators" class="banner carousel slide" data-bs-ride="carousel">
  28.                             <div class="carousel-indicators">
  29.                                 {% for banner in banners.items %}
  30.                                     <button
  31.                                         type="button"
  32.                                         data-bs-target="#bannersCarouselIndicators"
  33.                                         data-bs-slide-to="{{ loop.index - 1 }}"
  34.                                         class="active"
  35.                                         {% if loop.index == 1 %}
  36.                                             aria-current="true"
  37.                                         {% endif %}
  38.                                         aria-label="Slide {{ loop.index }}">
  39.                                     </button>
  40.                                 {% endfor %}
  41.                             </div>
  42.                             <div class="carousel-inner">
  43.                                 {% for bannerItem in banners.items %}
  44.                                     <div class="carousel-item{% if loop.index == 1 %} active{% endif %}" data-bs-interval="{{ banners.interval }}">
  45.                                         <a href="{{ bannerItem.link }}" onclick="gtag('event','select_promotion',{creative_name:'homepage-tab-banner',promotion_name:'homepage-tab-banner', promotion_id: '{{ bannerItem.parentId }}_{{ bannerItem.itemId }}', promotion_name: '{{ bannerItem.link }}', items: [
  46.                                             {%- for item in banners.gtagEventItems  -%}
  47.                                                 {item_id: '{{ item.item_id }}',item_name: '{{ item.item_name }}',index: '{{ item.index }}',promotion_id: '{{ item.promotion_id }}',promotion_name: '{{ item.promotion_name }}'},
  48.                                             {%- endfor -%}
  49.                                         ]})">
  50.                                             <img decoding="async" src="{{ bannerItem.image }}" class="d-block w-100" alt="#{{ loop.index }}" width="820" height="340" >
  51.                                         </a>
  52.                                     </div>
  53.                                 {% endfor %}
  54.                             </div>
  55.                             <button class="carousel-control-prev" type="button" data-bs-target="#bannersCarouselIndicators" data-bs-slide="prev">
  56.                                 <img  loading="lazy" decoding="async" src="{{ asset('theme/images/icon/arrow-left.svg') }}" alt="{{ 'Arrow left'|trans }}">
  57.                                 <span class="visually-hidden">{{ 'Previous slide'|trans }}</span>
  58.                             </button>
  59.                             <button class="carousel-control-next" type="button" data-bs-target="#bannersCarouselIndicators" data-bs-slide="next">
  60.                                 <img loading="lazy" decoding="async" src="{{ asset('theme/images/icon/arrow-right.svg') }}" alt="{{ 'Arrow right'|trans }}">
  61.                                 <span class="visually-hidden">{{ 'Next slide'|trans }}</span>
  62.                             </button>
  63.                             <div id="carousel-loader">
  64.                                 <div class="current-percent"></div>
  65.                             </div>
  66.                         </div>
  67.                     {% else %}
  68.                         <div class="banner">
  69.                             <a href="{{ banners.items[0].link }}" onclick="gtag('event','select_promotion',{creative_name:'homepage-tab-banner',promotion_name:'homepage-tab-banner', items:[]})" id="homepage-tab-banner">
  70.                                 <picture>
  71.                                     <img loading="lazy" decoding="async" src="{{ banners.items[0].image }}" alt="banner" width="820" height="340" />
  72.                                 </picture>
  73.                             </a>
  74.                         </div>
  75.                     {% endif %}
  76.                     {% if smallBanners is not empty %}
  77.                         {% if smallBanners.upper.image is defined and smallBanners.upper is not empty %}
  78.                             <div class="small-banner upper">
  79.                                 <a href="{{ smallBanners.upper.link }}" onclick="gtag('event','select_promotion',{creative_name:'homepage-featured-category',promotion_name:'homepage-featured-category',items:[]})" id="homepage-featured-category">
  80.                                     <img loading="lazy" decoding="async" src="{{ smallBanners.upper.image }}" alt="{{ smallBanners.upper.title }}" width="550" height="244">
  81.                                 </a>
  82.                             </div>
  83.                         {% else %}
  84.                             {% if smallBanners.upper.display == const('Banner::BANNER_DISPLAY_TYPE_CATEGORY_GROUP') and featuredCategory.upper is defined and featuredCategory.upper is not empty %}
  85.                                 <div class="featured-category-box{% if featuredCategory.upper.isWizard is defined and featuredCategory.upper.isWizard %} wizard{% endif %} upper">
  86.                                     <a href="{{ featuredCategory.upper.href }}" onclick="gtag('event','select_promotion',{creative_name:'homepage-featured-category',promotion_name:'homepage-featured-category',items:[]})" id="homepage-featured-category">
  87.                                         <img loading="lazy" decoding="async" src="{{ featuredCategory.upper.image }}" alt="{{ featuredCategory.upper.title }}" width="376" height="210">
  88.                                         <div class="description">
  89.                                             <h3 class="mb-1 mb-md-2 mb-xl-3"><strong>{{ featuredCategory.upper.title }}</strong></h3>
  90.                                             <p class="mb-1">{{ featuredCategory.upper.description }}</p>
  91.                                             <span>{{ 'Featured category view'|trans }}</span>
  92.                                         </div>
  93.                                     </a>
  94.                                 </div>
  95.                             {% elseif smallBanners.upper.display == const('Banner::BANNER_DISPLAY_TYPE_PRODUCT') and featuredProduct.upper is defined and featuredProduct.upper is not empty %}
  96.                                 <div class="featured-product-box upper">
  97.                                     <div class="recommendation-label">
  98.                                         <span>{{ 'Recommended'|trans }}</span>
  99.                                     </div>
  100.                                     <a href="{{ featuredProduct.upper.href }}" class="featured-product-wrapper" onclick="gtag('event','select_promotion',{creative_name:'homepage-featured-product',promotion_name:'homepage-featured-product',items:[{item_id:'{{ featuredProduct.upper.code }}',item_name:'{{ featuredProduct.upper.title }}',discount:{{ featuredProduct.upper.special|number_format(2, '.', '') }},index:0,item_brand:'{{ featuredProduct.upper.vendor }}',price:{{ featuredProduct.upper.price|number_format(2, '.', '') }},quantity:1}]})" id="homepage-featured-product">
  101.                                         <div class="product-image me-3">
  102.                                             {% if featuredProduct.upper.carouselImages is defined %}
  103.                                                 <div id="featuredProduct-upper-carousel" class="carousel slide" data-bs-ride="carousel">
  104.                                                     <div class="carousel-inner">
  105.                                                         {% for image in featuredProduct.upper.carouselImages %}
  106.                                                             <div class="carousel-item {% if loop.first %}active{% endif %}"  data-bs-interval="8000">
  107.                                                                 <img loading="lazy" decoding="async" src="{{ image }}" class="d-block w-100" alt="{{ featuredProduct.upper.vendor }} {{ featuredProduct.upper.title }}">
  108.                                                             </div>
  109.                                                         {% endfor %}
  110.                                                     </div>
  111.                                                 </div>
  112.                                             {% else %}
  113.                                                 <img loading="lazy" decoding="async" src="{{ featuredProduct.upper.image }}" alt="{{ featuredProduct.upper.vendor }} {{ featuredProduct.upper.title }}">
  114.                                             {% endif %}
  115.                                         </div>
  116.                                         <div class="product-info">
  117.                                             <div class="product-title mb-1 mb-md-2 mb-xl-3">{% if featuredProduct.upper.isCustomTitle is defined %} {{- featuredProduct.upper.title -}} {% else  %}{{- featuredProduct.upper.vendor }} {{ featuredProduct.upper.title -}} {% endif %}</div>
  118.                                             <p class="product-description mb-2 mb-md-3">{{- featuredProduct.upper.attributesListTxt|raw -}}</p>
  119.                                             <div class="prices">
  120.                                                 {% if featuredProduct.upper.isDiscounted %}
  121.                                                     <span class="discounted">
  122.                                                 {{- featuredProduct.upper.special|price(currency, precision) -}}
  123.                                             </span>
  124.                                                 {% endif %}
  125.                                                 <span class="price{{ featuredProduct.upper.isDiscounted ? ' discounted-on' : '' }}">
  126.                                             {{- featuredProduct.upper.price|price(currency, precision) -}}
  127.                                         </span>
  128.                                             </div>
  129.                                         </div>
  130.                                     </a>
  131.                                     <script>
  132.                                         gtag("event", "view_promotion", {
  133.                                             creative_name: "homepage-tab-banner",
  134.                                             promotion_name: "homepage-tab-banner",
  135.                                             {% if banners.items|length > 1 -%}
  136.                                             items: [
  137.                                                 {% for item in banners.gtagEventItems  %}
  138.                                                 {
  139.                                                     "item_id": "{{ item.item_id }}",
  140.                                                     "item_name": "{{ item.item_name }}",
  141.                                                     "index": "{{ item.index }}",
  142.                                                     "promotion_id": "{{ item.promotion_id }}",
  143.                                                     "promotion_name": "{{ item.promotion_name }}"
  144.                                                 },
  145.                                                 {% endfor %}
  146.                                             ]
  147.                                             {% else -%}
  148.                                             items: []
  149.                                             {% endif -%}
  150.                                         });
  151.                                         gtag("event", "view_promotion", {
  152.                                             creative_name: "homepage-featured-category",
  153.                                             promotion_name: "homepage-featured-category",
  154.                                             items: []
  155.                                         });
  156.                                         gtag("event", "view_promotion", {
  157.                                             creative_name: "homepage-featured-product",
  158.                                             promotion_name: "homepage-featured-product",
  159.                                             items: [
  160.                                                 {
  161.                                                     item_id: "{{ featuredProduct.upper.code }}",
  162.                                                     item_name: "{{ featuredProduct.upper.title }}",
  163.                                                     discount: {{ featuredProduct.upper.special|number_format(2, '.', '') }},
  164.                                                     index: 0,
  165.                                                     item_brand: "{{ featuredProduct.upper.vendor }}",
  166.                                                     price: {{ featuredProduct.upper.price|number_format(2, '.', '') }},
  167.                                                     quantity: 1
  168.                                                 }
  169.                                             ]
  170.                                         });
  171.                                     </script>
  172.                                 </div>
  173.                             {% else %}
  174.                                 <div class="small-banner upper"></div>
  175.                             {% endif %}
  176.                         {% endif %}
  177.                         {% if smallBanners.lower.image is defined and  smallBanners.lower is not empty %}
  178.                             <div class="small-banner lower">
  179.                                 <a href="{{ smallBanners.lower.link }}" onclick="gtag('event','select_promotion',{creative_name:'homepage-featured-category',promotion_name:'homepage-featured-category',items:[]})" id="homepage-featured-category">
  180.                                     <img loading="lazy" decoding="async" src="{{ smallBanners.lower.image }}" alt="{{ smallBanners.lower.title }}" width="550" height="244">
  181.                                 </a>
  182.                             </div>
  183.                         {% else %}
  184.                             {% if smallBanners.lower.display == const('Banner::BANNER_DISPLAY_TYPE_CATEGORY_GROUP') and featuredCategory.lower is defined and featuredCategory.lower is not empty %}
  185.                                 <div class="featured-category-box{% if featuredCategory.lower.isWizard is defined and featuredCategory.lower.isWizard %} wizard{% endif %} lower">
  186.                                     <a href="{{ featuredCategory.lower.href }}" onclick="gtag('event','select_promotion',{creative_name:'homepage-featured-category',promotion_name:'homepage-featured-category',items:[]})" id="homepage-featured-category">
  187.                                         <img loading="lazy" decoding="async" src="{{ featuredCategory.lower.image }}" alt="{{ featuredCategory.lower.title }}" width="376" height="210">
  188.                                         <div class="description">
  189.                                             <h3 class="mb-1 mb-md-2 mb-xl-3"><strong>{{ featuredCategory.lower.title }}</strong></h3>
  190.                                             <p class="mb-1">{{ featuredCategory.lower.description }}</p>
  191.                                             <span>{{ 'Featured category view'|trans }}</span>
  192.                                         </div>
  193.                                     </a>
  194.                                 </div>
  195.                             {% elseif smallBanners.lower.display == const('Banner::BANNER_DISPLAY_TYPE_PRODUCT') and featuredProduct.lower is defined and featuredProduct.lower is not empty %}
  197.                                 <div class="featured-product-box lower">
  198.                                     <div class="recommendation-label">
  199.                                         <span>{{ 'Recommended'|trans }}</span>
  200.                                     </div>
  201.                                     <a href="{{ featuredProduct.lower.href }}" class="featured-product-wrapper" onclick="gtag('event','select_promotion',{creative_name:'homepage-featured-product',promotion_name:'homepage-featured-product',items:[{item_id:'{{ featuredProduct.lower.code }}',item_name:'{{ featuredProduct.lower.title }}',discount:{{ featuredProduct.lower.special|number_format(2, '.', '') }},index:0,item_brand:'{{ featuredProduct.lower.vendor }}',price:{{ featuredProduct.lower.price|number_format(2, '.', '') }},quantity:1}]})" id="homepage-featured-product">
  202.                                         <div class="product-image me-3">
  203.                                             {% if featuredProduct.lower.carouselImages is defined %}
  204.                                                 <div id="featuredProduct-lower-carousel" class="carousel slide" data-bs-ride="carousel">
  205.                                                     <div class="carousel-inner">
  206.                                                         {% for image in featuredProduct.lower.carouselImages %}
  207.                                                             <div class="carousel-item {% if loop.first %}active{% endif %}">
  208.                                                                 <img loading="lazy" decoding="async" src="{{ image }}" class="d-block w-100" alt="{{ featuredProduct.lower.vendor }} {{ featuredProduct.lower.title }}">
  209.                                                             </div>
  210.                                                         {% endfor %}
  211.                                                     </div>
  212.                                                 </div>
  213.                                             {% else %}
  214.                                                 <img loading="lazy" decoding="async" src="{{ featuredProduct.lower.image }}" alt="{{ featuredProduct.lower.vendor }} {{ featuredProduct.lower.title }}">
  215.                                             {% endif %}
  216.                                         </div>
  217.                                         <div class="product-info">
  218.                                             <div class="product-title mb-1 mb-md-2 mb-xl-3">{% if featuredProduct.lower.isCustomTitle is defined %} {{- featuredProduct.lower.title -}} {% else  %}{{- featuredProduct.lower.vendor }} {{ featuredProduct.lower.title -}} {% endif %}</div>
  219.                                             <p class="product-description mb-2 mb-md-3">{{- featuredProduct.lower.attributesListTxt|raw -}}</p>
  220.                                             <div class="prices">
  221.                                                 {% if featuredProduct.lower.isDiscounted %}
  222.                                                     <span class="discounted">
  223.                                                 {{- featuredProduct.lower.special|price(currency, precision) -}}
  224.                                             </span>
  225.                                                 {% endif %}
  226.                                                 <span class="price{{ featuredProduct.lower.isDiscounted ? ' discounted-on' : '' }}">
  227.                                             {{- featuredProduct.lower.price|price(currency, precision) -}}
  228.                                         </span>
  229.                                             </div>
  230.                                         </div>
  231.                                     </a>
  232.                                     <script>
  233.                                         gtag("event", "view_promotion", {
  234.                                             creative_name: "homepage-tab-banner",
  235.                                             promotion_name: "homepage-tab-banner",
  236.                                             {% if banners.items|length > 1 -%}
  237.                                             items: [
  238.                                                 {% for item in banners.gtagEventItems  %}
  239.                                                 {
  240.                                                     "item_id": "{{ item.item_id }}",
  241.                                                     "item_name": "{{ item.item_name }}",
  242.                                                     "index": "{{ item.index }}",
  243.                                                     "promotion_id": "{{ item.promotion_id }}",
  244.                                                     "promotion_name": "{{ item.promotion_name }}"
  245.                                                 },
  246.                                                 {% endfor %}
  247.                                             ]
  248.                                             {% else -%}
  249.                                             items: []
  250.                                             {% endif -%}
  251.                                         });
  252.                                         gtag("event", "view_promotion", {
  253.                                             creative_name: "homepage-featured-category",
  254.                                             promotion_name: "homepage-featured-category",
  255.                                             items: []
  256.                                         });
  257.                                         gtag("event", "view_promotion", {
  258.                                             creative_name: "homepage-featured-product",
  259.                                             promotion_name: "homepage-featured-product",
  260.                                             items: [
  261.                                                 {
  262.                                                     item_id: "{{ featuredProduct.lower.code }}",
  263.                                                     item_name: "{{ featuredProduct.lower.title }}",
  264.                                                     discount: {{ featuredProduct.lower.special|number_format(2, '.', '') }},
  265.                                                     index: 0,
  266.                                                     item_brand: "{{ featuredProduct.lower.vendor }}",
  267.                                                     price: {{ featuredProduct.lower.price|number_format(2, '.', '') }},
  268.                                                     quantity: 1
  269.                                                 }
  270.                                             ]
  271.                                         });
  272.                                     </script>
  273.                                 </div>
  274.                             {% else %}
  275.                                 <div class="small-banner lower"></div>
  276.                             {% endif %}
  277.                         {% endif %}
  278.                     {% endif %}
  279.                 </div>
  280.             </div>
  281.         </div>
  282.     {% endif %}
  284.     {% include 'AtechNetCoreBundle/Module/advantages.html.twig' with {'warrantyYear': warrantyYear, 'reviewCount': reviewCount, 'lang': lang} %}
  286.     {% if featuredCategories %}
  287.         <section class="featured-categories">
  288.             <div class="container">
  289.                 {% for category in featuredCategories %}
  290.                     <div class="link-item">
  291.                         <a href="{{ category.href }}">
  292.                             <div class="image-wrapper">
  293.                                 <img loading="lazy" decoding="async" src="{{ asset('theme/images/category/' ~ category.image) }}" alt="{{ category.title }}">
  294.                             </div>
  295.                             <div class="featured-category-title"><span>{{ category.title }}</span></div>
  296.                             <div class="arrow-right"></div>
  297.                         </a>
  298.                     </div>
  299.                 {% endfor %}
  300.             </div>
  301.         </section>
  302.     {% endif %}
  304.     <div class="main-content">
  305.         <div class="container">
  306.             {{ include(template_from_string(content_top)) }}
  308.             <!-- Product selection tab -->
  309.             <section class="main-products-carousel">
  310.                 <h3>{{ 'Popular product list'|trans }}</h3>
  311.                 <div class="owl-carousel" id="main-products-carousel">
  312.                     {% if mainProducts %}
  313.                         {{ macros.printProducts(mainProducts, currency, precision, 12, true, true, false) }}
  314.                     {% endif %}
  315.                 </div>
  316.                 <script>
  317.                     if ( window.dataLayer ) {
  318.                         window.dataLayer.push({ ecommerce: null });  // Clear the previous ecommerce object.
  319.                         window.dataLayer.push({
  320.                             event: "view_item_list",
  321.                             ecommerce: {
  322.                                 item_list_id: "homepage-popular-products",
  323.                                 item_list_name: "homepage-popular-products",
  324.                                 items: [
  325.                                 {% for mainProduct in mainProducts %}{% if loop.index > 1 %},{% endif %}{
  326.                                         item_id: "{{ mainProduct.id }}",
  327.                                         item_name: "{{ mainProduct.title }}",
  328.                                         discount: {{ mainProduct.rawDiscountPrice }},
  329.                                         index: {{ loop.index }},
  330.                                         item_brand: "{{ mainProduct.vendor }}",
  331.                                         price: {{ mainProduct.rawPrice }},
  332.                                         quantity: 1
  333.                                     }
  334.                                 {% endfor %}
  335.                                 ]
  336.                             }
  337.                         });
  338.                     }
  339.                 </script>
  340.             </section>
  341.         </div>
  343.         <div class="testimonial-wrapper{% if domainId == const('Domain::DOMAIN_ID_RT_EU') %} eu-trustindex{% endif %}">
  344.             <div class="container">
  345.                 {%- if domainId == const('Domain::DOMAIN_ID_RT_EU') -%}
  346.                     <script defer async src='https://cdn.trustindex.io/loader.js?757dc6b28849419b02269e1ac4f'></script>
  347.                 {% else %}
  348.                     {{ include(template_from_string(content_reviews)) }}
  349.                 {%- endif -%}
  350.             </div>
  351.         </div>
  353.         <div id="preload-content-center">
  354.             <div class="category-selection">
  355.                 <div class="row preload">
  356.                     <div class="col-md-6">
  357.                         <div class="category-selection-item">
  358.                             <div class="category-selection-desc">
  359.                             {% for i in 1..4 %}
  360.                                 <div class="row">
  361.                                     <div class="col-3 col-sm-2"></div>
  362.                                     <div class="col-9 col-sm-10"></div>
  363.                                 </div>
  364.                             {% endfor %}
  365.                             </div>
  366.                         </div>
  367.                     </div>
  368.                     <div class="col-md-6">
  369.                         <div class="row wrapper">
  370.                             {% for i in 1..4 %}
  371.                                 <div class="col-sm-6"></div>
  372.                             {% endfor %}
  373.                         </div>
  374.                     </div>
  375.                 </div>
  376.             </div>
  378.             <div class="bazar-product-list">
  379.                 <div class="row preload">
  380.                     {% for i in 1..4 %}
  381.                         <div class="col-6 col-sm-4 col-lg-3">
  382.                             <div class="preload-item">
  383.                                 <div class="image"></div>
  384.                                 <div class="title1"></div>
  385.                                 <div class="title2"></div>
  386.                                 <div class="description"></div>
  387.                                 <div class="prices"></div>
  388.                                 <div class="button"></div>
  389.                             </div>
  390.                         </div>
  391.                     {% endfor %}
  392.                 </div>
  393.             </div>
  395.             <div class="blog-list" style="border: 0;">
  396.                 <div class="row preload">
  397.                     {% for i in 1..4 %}
  398.                         <div class="col-sm-12 col-lg-3">
  399.                             <div class="preload-item">
  400.                                 <div class="image"></div>
  401.                                 <div class="title1"></div>
  402.                                 <div class="title2"></div>
  403.                                 <div class="description"></div>
  404.                             </div>
  405.                         </div>
  406.                     {% endfor %}
  407.                 </div>
  408.             </div>
  410.             <div class="heureka-list">
  411.                 <div class="row preload">
  412.                     <div class="col-sm-3">
  413.                         <div class="preload-item heureka-logo">
  414.                             <div class="image" style="border-radius: 200px;"></div>
  415.                             <div class="title1"></div>
  416.                         </div>
  417.                     </div>
  418.                     {% for i in 1..3 %}
  419.                         <div class="col-sm-3">
  420.                             <div class="preload-item">
  421.                                 <div class="image"></div>
  422.                                 <div class="title1"></div>
  423.                                 <div class="title2"></div>
  424.                             </div>
  425.                         </div>
  426.                     {% endfor %}
  427.                 </div>
  428.             </div>
  429.         </div>
  431.         <div id="content-center"></div>
  432.         {{ include(template_from_string(content_bottom)) }}
  433.     </div>
  434. {% endblock %}
  436. {% block stylesheets %}
  437.     <link rel="stylesheet" href="{{ asset('theme/owl-carousel/assets/owl.carousel.min.css'|appendAssetCache) }}">
  438.     {{ parent() }}
  439. {% endblock %}
  441. {% block javascripts %}
  442.     {{ parent() }}
  443.     <script type="text/javascript" src="{{ asset('theme/owl-carousel/owl.carousel.min.js'|appendAssetCache) }}"></script>
  444.     <script>
  445.         var mainProductsOwlObject = {
  446.             loop: false,
  447.             startPosition: 0,
  448.             dots: true,
  449.             checkVisibility: false,
  450.             nav: true,
  451.             navText: [
  452.                 `<i class="fas fa-chevron-left"></i><span class="visually-hidden">{{ 'Previous slide'|trans }}</span>`,
  453.                 `<i class="fas fa-chevron-right"></i><span class="visually-hidden">{{ 'Next slide'|trans }}</span>`
  454.             ],
  455.             responsive: {
  456.                 1330: {
  457.                     nav: true,
  458.                     items: 4,
  459.                     stagePadding: 10,
  460.                     margin: 0
  461.                 },
  462.                 990: {
  463.                     items: 4,
  464.                     nav: false,
  465.                     stagePadding: 10,
  466.                     margin: 20
  467.                 },
  468.                 576: {
  469.                     items: 3,
  470.                     nav: false,
  471.                     dots: true,
  472.                     stagePadding: 0
  473.                 },
  474.                 0: {
  475.                     items: 2,
  476.                     nav: false,
  477.                     dots: true,
  478.                     stagePadding: 0,
  479.                     mergeFit: true
  480.                 }
  481.             }
  482.         };
  484.         $(document).ready(function() {
  485.             $("#main-products-carousel").owlCarousel(mainProductsOwlObject);
  486.             $('#main-products-carousel').equation({
  487.                 carousel: true, 
  488.                 selectors: [
  489.                     '.product-list-item .product-list-details .product-list-name', 
  490.                     '.product-list-item .product-list-details .product-list-attributes'
  491.                 ]
  492.             });
  494.             $('#main-products-carousel .owl-dot').each(function(index) {
  495.                 $(this).attr('aria-label', "{{ 'Go to slide'|trans }}" + (index + 1));
  496.             });
  498.             $.ajax({
  499.                 method: 'GET',
  500.                 url: '{{ path("homepage_bottom_content_ajax") }}',
  501.                 success: function(response) {
  502.                     let result = response.replace(/\s/g,' ');
  504.                     $('#content-center').html(result).show();
  505.                     setCarousels();
  506.                     $('#preload-content-center').hide();
  507.                 }
  508.             });
  509.         });
  511.         function owlInitialized () {
  512.             $(".product-list .row.preload").remove();
  513.         }
  515.         function setCarousels () {
  516.             $('#categorySelection .carousel-inner').owlCarousel({
  517.                 items: 1,
  518.                 dots: false,
  519.                 nav: true,
  520.                 loop: true,
  521.                 navText: [
  522.                     '<i class="fas fa-chevron-left"></i>',
  523.                     '<i class="fas fa-chevron-right"></i>'
  524.                 ]
  525.             });
  527.             $("#homepage-blog-carousel").owlCarousel({
  528.                 items: 3,
  529.                 loop: false,
  530.                 startPosition: 0,
  531.                 nav: false,
  532.                 dots: true,
  533.                 responsive: {
  534.                     990: {
  535.                         items: 3,
  536.                         dots: false,
  537.                         stagePadding: 0
  538.                     },
  539.                     590: {
  540.                         items: 2,
  541.                         dots: true,
  542.                         stagePadding: 0
  543.                     },
  544.                     0: {
  545.                         items: 1,
  546.                         dots: true,
  547.                         stagePadding: 0
  548.                     }
  549.                 }
  550.             });
  552.             $("#under-amount-products-carousel").owlCarousel({
  553.                 loop: false,
  554.                 startPosition: 0,
  555.                 checkVisibility: false,
  556.                 margin: 20,
  557.                 navText: [
  558.                     '<i class="fas fa-chevron-left"></i>', 
  559.                     '<i class="fas fa-chevron-right"></i>'
  560.                 ],
  561.                 responsive: {
  562.                     1330: {
  563.                         nav: true,
  564.                         dots: true,
  565.                         items: 3
  566.                     },
  567.                     767: {
  568.                         items: 3,
  569.                         nav: false,
  570.                         dots: true
  571.                     },
  572.                     670: {
  573.                         items: 2,
  574.                         nav: false,
  575.                         dots: true,
  576.                         margin: 10,
  577.                         stagePadding: 40
  578.                     },
  579.                     380: {
  580.                         items: 1,
  581.                         nav: false,
  582.                         dots: true,
  583.                         mergeFit: true,
  584.                         margin: 10,
  585.                         stagePadding: 12
  586.                     },
  587.                     0: {
  588.                         items: 1,
  589.                         nav: false,
  590.                         dots: true,
  591.                         mergeFit: true,
  592.                         margin: 10,
  593.                         stagePadding: 12
  594.                     }
  595.                 }
  596.             });
  597.         }
  599.         {% if banners is not null and  banners.items|length > 1 %}
  600.             const myCarousel = document.getElementById("bannersCarouselIndicators");
  601.             const carouselIndicator = myCarousel.querySelector("#carousel-loader .current-percent");
  602.             let intervalID;
  604.             const carousel = new bootstrap.Carousel(myCarousel);
  606.             const carouselUpper = document.getElementById("featuredProduct-upper-carousel")
  607.                     ? new bootstrap.Carousel(document.getElementById("featuredProduct-upper-carousel"))
  608.                     : null;
  610.             const carouselLower = document.getElementById("featuredProduct-lower-carousel")
  611.                 ? new bootstrap.Carousel(document.getElementById("featuredProduct-lower-carousel"))
  612.                 : null;
  614.             window.addEventListener("load", function () {
  615.                 fillCarouselIndicator();
  616.             });
  618.             myCarousel.addEventListener("slid.bs.carousel", function (e) {
  619.                 fillCarouselIndicator();
  620.             });
  622.             function fillCarouselIndicator() {
  623.                 carouselIndicator.style.width = 0;
  624.                 clearInterval(intervalID);
  625.                 carousel.pause();
  626.                 if (carouselUpper)
  627.                 {
  628.                     carouselUpper.pause();
  629.                 }
  631.                 if (carouselLower)
  632.                 {
  633.                     carouselLower.pause();
  634.                 }
  636.                 let i = 0;
  638.                 intervalID = setInterval(function () {
  639.                     i++;
  641.                     myCarousel.querySelector(".current-percent").style.width = i + "%";
  643.                     if (i >= 100) {
  644.                         carousel.next();
  646.                         if (carouselUpper)
  647.                         {
  648.                             carouselUpper.next();
  649.                         }
  651.                         if (carouselLower)
  652.                         {
  653.                             carouselLower.next();
  654.                         }
  655.                     }
  656.                 }, {{ banners.interval > 0 ? banners.interval : 3 }} * 10);
  657.             }
  658.         {% endif %}
  659.     </script>
  660. {% endblock %}
  662. {% block title %}{{ 'default page title' | trans }} - {{ parent() }}{% endblock %}
  664. {% block meta %}
  665.     {% set domainTLD = app.request.session.get('defaultLocale') %}
  667.     {% if domainTLD == 'en' %}
  668.         {% set domainTLD = 'eu' %}
  669.     {% endif %}
  671.     <meta name="description" content="{{ 'default page description' | trans }}" />
  672.     <meta property="og:url" content="{{ app.request.uri }}" />
  673.     <meta property="og:type" content="website" />
  674.     <meta property="og:locale" content="{{ app.request.locale |ogLocale }}" />
  675.     <meta property="og:title" content="{{ 'default page title' | trans }}" />
  676.     <meta property="og:description" content="{{ 'default page description' | trans }}" />
  677.     <meta property="og:image" content="https://www.furbify.{{ domainTLD }}/theme/images/furbify-share-image.png" />
  678. {% endblock %}
  680. {% block header %}
  681.     {{ include(template_from_string(header)) }}
  682. {% endblock %}
  684. {% block footer %}
  685.     {{ include(template_from_string(footer)) }}
  686. {% endblock %}
  688. {% block schema %}
  689. {{ parent() }}
  690. {% set _baseUrl = app.request.schemeAndHttpHost %}
  691. <script type="application/ld+json">
  692. {
  693.     "@context": "https://schema.org",
  694.     "@type": "OnlineStore",
  695.     "@id": "{{ _baseUrl }}/#store",
  696.     "name": "Furbify Online Store",
  697.     "url": "{{ _baseUrl }}",
  698.     "priceRange": "€€",
  699.     "currenciesAccepted": "EUR",
  700.     "paymentAccepted": ["Credit Card", "PayPal", "Bank Transfer"],
  701.     "hasReturnPolicy": {
  702.         "@type": "MerchantReturnPolicy",
  703.         "applicableCountry": "EU",
  704.         "returnPolicyCategory": "https://schema.org/MerchantReturnFiniteReturnWindow",
  705.         "merchantReturnDays": 14,
  706.         "returnMethod": "https://schema.org/ReturnByMail",
  707.         "returnFees": "https://schema.org/FreeReturn"
  708.     },
  709.     "shippingDetails": {
  710.         "@type": "OfferShippingDetails",
  711.         "shippingRate": {"@type": "MonetaryAmount", "value": "0", "currency": "EUR"},
  712.         "shippingDestination": {
  713.             "@type": "DefinedRegion",
  714.             "addressCountry": ["AT", "BE", "BG", "HR", "CY", "CZ", "DK", "EE", "FI", "FR", "DE", "GR", "HU", "IE", "IT", "LV", "LT", "LU", "MT", "NL", "PL", "PT", "RO", "SK", "SI", "ES", "SE"]
  715.         },
  716.         "deliveryTime": {
  717.             "@type": "ShippingDeliveryTime",
  718.             "handlingTime": {"@type": "QuantitativeValue", "minValue": 1, "maxValue": 2, "unitCode": "DAY"},
  719.             "transitTime": {"@type": "QuantitativeValue", "minValue": 2, "maxValue": 7, "unitCode": "DAY"}
  720.         }
  721.     },
  722.     "parentOrganization": {"@id": "{{ _baseUrl }}/#organization"}
  723. }
  724. </script>
  725. <script type="application/ld+json">
  726. {
  727.     "@context": "https://schema.org",
  728.     "@type": "BreadcrumbList",
  729.     "itemListElement": [{
  730.         "@type": "ListItem",
  731.         "position": 1,
  732.         "name": "{{ 'Home'|trans|e('js') }}",
  733.         "item": "{{ _baseUrl }}"
  734.     }]
  735. }
  736. </script>
  737. {% endblock %}