EZFY Debut theme slider PRO. Replaces featured-product, product-template and theme.liquid. Blog not published yet.

ezfy-debut-featured-product.liquid

{% comment %} VARIABLES FOR FEATURED-PRODUCT [START] {% endcomment %}

{%- assign product = all_products[section.settings.featured_product] -%}

{% comment %} 
VARIABLES FOR FEATURED-PRODUCT [END] 
======================================================================= {% endcomment %}
{% comment %}
Debut slider by ezfycode.com

More free & premium plugins at:

ezfycode.com/shop

{% endcomment %}


{% comment %}Custom options for the Debut Slider - made by ezfycode.com [START]{% endcomment %}
{% assign featured_image = product.selected_or_first_available_variant.featured_image | default: product.featured_image %}


{% assign total_images =  product.images | size %}
{% assign images_id = "" | split: "," %}

{% for image in product.images %}
{% assign _id = image.id | split: ',' %}
{% assign images_id = images_id | concat: _id  %}
{% endfor %}

{% assign featured_image_lazyload = section.settings.featured_image_lazyload %}
{% assign featured_image_lazyload_placeholder = true %}
{% assign featured_image_loop = section.settings.featured_image_loop %}
{% assign featured_image_arrows = section.settings.featured_image_arrows %}
{% assign featured_image_arrows_mobile = section.settings.featured_image_arrows_mobile %}

{% assign featured_image_animation = section.settings.featured_image_animation %}
{% assign featured_image_use_max_height = section.settings.featured_image_use_max_height %}
{% assign featured_image_max_height = section.settings.featured_image_max_height %}
{% assign featured_image_max_height_mobile = section.settings.featured_image_max_height_mobile %}
{% assign featured_image_background_color = section.settings.featured_image_background_color %}



{% assign enable_slider_for_thumbnails_desktop = section.settings.enable_slider_for_thumbnails_desktop %}
{% assign thumbnails_vertical_alignment = section.settings.thumbnails_vertical_alignment %}
{% assign thumbnails = section.settings.thumbnails %}
{% assign thumbnails_mobile = section.settings.thumbnails_mobile %}
{% assign thumbnails_highlighted_position = section.settings.thumbnails_highlighted_position %}
{% assign thumbnails_loop = section.settings.thumbnails_loop %}
{% assign show_thumbnails = section.settings.show_thumbnails %}
{% assign thumbnails_arrows_desktop = section.settings.thumbnails_arrows_desktop %}
{% assign thumbnails_arrows_mobile = section.settings.thumbnails_arrows_mobile %}
{% assign thumbnails_non_slider_gap = '10' %}


{% assign arrow_style = section.settings.arrow_style %}
{% assign arrow_opacity = section.settings.arrow_opacity %}
{% assign arrow_hover_opacity = section.settings.arrow_hover_opacity %}
{% assign compability_16_below = section.settings.compability_16_below %}


{% if total_images <= 3 %}
{% assign enable_slider_for_thumbnails_desktop = false %}
{% endif %}


<div style="display:none;height:0;width:0;"
     data_featured_image_animation="{{ featured_image_animation }}"
          data_thumbnails_quantity="{{ thumbnails }}"
     data_thumbnails_quantity_mobile="{{ thumbnails_mobile }}"
     data_total_images="{{ total_media }}" 
     data_featured_image_loop="{{featured_image_loop}}"
     data_enable_slider_for_thumbnails_desktop="{{enable_slider_for_thumbnails_desktop}}"
     data_thumbnails_highlighted_position="{{thumbnails_highlighted_position}}"
     data_featured_image_lazyload="{{featured_image_lazyload}}"
     data_thumbnails_loop="{{thumbnails_loop}}"
     ></div>

{% if featured_image_use_max_height %}
<style>
[id] #featuredImageSlider img{
	    object-fit: contain !important; 
}

#featuredImageSlider [data-slide-index]{
  padding-top: {{ featured_image_max_height}}px !important;
  background: {{ featured_image_background_color }} !important;
}
  
  
  @media (max-width: 767px){
  
  
#featuredImageSlider [data-slide-index]{
  padding-top: {{ featured_image_max_height_mobile}}px !important;
}
  }
</style>
{% endif %}


<style>
  {% assign thumbnail_loading_height = 100 %}
  {% assign basic_transition = 'all .5s ease' %}
  {% assign hover_transition = 'all .3s ease' %}
  {% assign featured_image_arrow_size_mobile = 28 %} 
  {% assign thumbnails_arrow_size = 28 %} 
  {% assign thumbnails_arrow_size_mobile = 28 %} 


  /* General Styles
  ================================ */
  
      [data-product-form] > *{
    width: 100%;
  }
  
  .product-single__image-wrapper{
    display: block !important;
  }
  
    
  .product-single__thumbnail-badge svg {
    fill: white !important;
}
.product-single__thumbnail-badge svg [class*='element']{
    fill: #000000 !important;
}
  
  .flickity-button{
    transition: {{hover_transition}};
  }
 

  {% if featured_image_fade %}
  .FeaturedImage .flickity-enabled.is-fade .flickity-slider > * {
    pointer-events: none;
    z-index: 0;
  }

  .FeaturedImage .flickity-enabled.is-fade .flickity-slider > .is-selected {
    pointer-events: auto;
    z-index: 1;
  }
  {% endif %}
  
  
  
  {% if arrow_style == 'full_height' %}
    .flickity-button{
        top: 0;
    bottom: 0;
    transform: unset;
    height: 100% !important;
    border-radius: unset;
  }
  
      .flickity-button.previous{
        left: 0;
  }     
  
  .flickity-button.next{
        right: 0;
  }
  {% endif %}
  
  .flickity-button{
    background: hsla(0,0%,100%,.{{arrow_opacity}});
  }
  
  .flickity-button:hover{
  	background: hsla(0,0%,100%,.{{arrow_hover_opacity}}); 
  }

  /* Featured Image 
  ================================ */
  
  
  
  #featuredImageSlider{
  	padding-left: 0;
  }
  
  
#featuredImageSlider, .flickity-slider{
    max-width: 100%;
    width: 100%;
  }

#featuredImageSlider{
    opacity: 0;
    transition: {{basic_transition}};
    max-height: 50vw;
    width: 100%;
  }


#featuredImageSlider .flickity-viewport{
    height: 0px;
    width: 100%;
    padding-top: calc(100% / {{featured_image.aspect_ratio}}  );

  }

  #featuredImageSlider.flickity-enabled,
  #featuredImageSlider.flickity-enabled .flickity-viewport{
    visibility: visible;
    position: relative;
    padding-top: unset;
    opacity: 1;
    transition: {{basic_transition}};
    max-height: unset;
    height: auto;

  }

  #featuredImageSlider img{
    position: absolute;
    top: 0;
    left: 0;
    width: 100%;
    height: 100%;
    object-fit: cover;
    min-width: 100%;
    min-height: 100%;
  }

  #featuredImageSlider .flickity-viewport{
    transition: {{basic_transition}};
  }
  
  #featuredImageSlider .hide{
  	display: block !important;
  }
  
  #featuredImageSlider [data-enable-video-looping]{
  	cursor: pointer;
  }
  
  
#featuredImageSlider [id*='FeaturedMedia-product-template']{
	width: 100% !important;
	max-width: 100% !important;
	padding-top: 0 !important;
}

#featuredImageSlider [class*='product-single__media--'] video{
	max-width: 100% !important;
	width: 100% !important;
}


  {% if featured_image_arrows == false  %}
  #featuredImageSlider .flickity-button{
    display: none;
  }
  {% endif %}

  @media (max-width: 768px){
    #featuredImageSlider .flickity-button{
      width: {{featured_image_arrow_size_mobile}}px;
      height: {{featured_image_arrow_size_mobile}}px;

      {% if featured_image_arrows_mobile == false %}
      display: none;

      {% elsif featured_image_arrows_mobile %}
      display: block;
      {% endif %}
    }
  }
  
  
  
  /* Thumbnails (all)
  ================================ */
  #thumbnailsEzfy .is-nav-selected img{
    border: 2px solid black
}
  
  #thumbnailsEzfy .product-single__thumbnail-badge{
    position: absolute;
    top: 6px;
    right: 6px;
    width: 25px;
    height: 25px;
}

  /* Thumbnails Slider
  ================================ */

  .Thumbnails--slider{
    overflow: hidden;
    max-width: 100%;
    margin: 0;
    max-height: {{thumbnail_loading_height}}px;
    opacity: 0;
    margin-top: 30px;
    transition: {{basic_transition}};
  }
  
  .Thumbnails--slider .product-single__thumbnail{
  	margin: 0 !important;
  }

  .Thumbnails--slider.flickity-enabled{
    overflow: unset;
    max-height: unset;
    opacity: 1;
    transition: {{basic_transition}};
  }



  .Thumbnails--slider li{
    max-width: calc(100% / {{thumbnails}});
    width: 100% !important;
    padding-left: unset;
    padding-right: 10px;
    /*     margin-right: 10px; */
  }

  {% if thumbnails_vertical_alignment == 'center' %}
  .Thumbnails--slider .flickity-slider {
    display: flex;
    align-items: center;
  }
  {% endif %}


  {% if thumbnails_arrows_desktop == false %}
  .Thumbnails--slider .flickity-button{
    display: none;
  }
  {% elsif thumbnails_arrows_desktop %}
  .Thumbnails--slider .flickity-button{
    width: {{thumbnails_arrow_size}}px;
    height: {{thumbnails_arrow_size}}px;
  }

  {% endif %}
  
  
.Thumbnails--slider .product-single__thumbnail.active-thumb,
  .Thumbnails--slider a:focus,
  .Thumbnails--slider a:focus *{
  	border: unset !important;
    outline: unset !important;
  }
  

  @media (max-width: 768px){
    .Thumbnails--slider .flickity-button{
      width: {{thumbnails_arrow_size_mobile}}px;
      height: {{thumbnails_arrow_size_mobile}}px;

      {% if thumbnails_arrows_mobile == false %}
      display: none;
      {% elsif thumbnails_arrows_mobile %}
      display: block;
      {% endif %}
    }


    .Thumbnails--slider li{
      max-width: calc(100% / {{thumbnails_mobile}});
    }

  }

  /* Thumbnails non-slider
  ================================ */
	.Thumbnails--slider *{
    	max-width: 100%;
      width: 100%;
      
    }

  .Thumbnails--non-slider{
    overflow: hidden;
    max-width: 100%;
    margin: 0;
        max-height: {{thumbnail_loading_height}}px;
    opacity: 0;
    transition: {{basic_transition}};
    margin-bottom: 30px;
  }


  .Thumbnails--non-slider--loaded{
    opacity: 1;
    transition: {{basic_transition}};
    max-height: unset;
    overflow: unset;
  }

  .Thumbnails--slider .is-nav-selected  img,
  .Thumbnails--non-slider .Thumbnail--selected img{
    border: 2px solid black;
  }
  

  .Thumbnails--non-slider .active-thumb img{
    border: 2px solid black;
}


  {% if enable_slider_for_thumbnails_desktop == false or thumbnails_enable_slider == false  %}
  .Thumbnails--non-slider{
    display: grid;
    grid-template-columns: repeat(3, 1fr);
    gap: {{thumbnails_non_slider_gap}}px;
    margin-top: 20px;

  }

  .Thumbnails--non-slider > *{
    float: none !important;
    width: 100% !important;
    margin: 0 !important;
    padding: 0 !important;
  }

  @media (min-width: 1249px){
    .Thumbnails--non-slider{
      grid-template-columns: repeat(4, 1fr);
    }
  }
  {% endif %}


</style>

{% if compability_16_below  %}
<style>
#featuredImageSlider [class*='product-single__media--video']{
	padding-top: 0 !important;
}
</style>
{% endif %}

{% comment %}Custom options for the Debut Slider - made by ezfycode.com [END]{% endcomment %}










{%- assign product = all_products[section.settings.featured_product] -%}

{% if product == empty %}
  {%- assign section_onboarding = true -%}
{% endif %}

<div class="page-width" id="ProductSection-{{ section.id }}" data-section-id="{{ section.id }}" data-section-type="product" data-ajax-enabled="{{ settings.enable_ajax }}">
  {% comment %}
    Get first variant, or deep linked one
  {% endcomment %}
  {%- assign current_variant = product.selected_or_first_available_variant -%}
  {%- assign product_thumb_size = '110x110' -%}
  {%- assign product_image_zoom_size = '1024x1024' -%}
  {%- assign product_image_scale = '2' -%}
  {%- assign enable_image_zoom = section.settings.enable_image_zoom -%}

  {% case section.settings.media_size %}
    {% when 'small' %}
      {%- assign product_media_width = 'medium-up--one-third' -%}
      {%- assign product_description_width = 'medium-up--two-thirds' -%}
      {%- assign height = 345 -%}
    {% when 'medium' %}
      {%- assign product_media_width = 'medium-up--one-half' -%}
      {%- assign product_description_width = 'medium-up--one-half' -%}
      {%- assign height = 530 -%}
    {% when 'large' %}
      {%- assign product_media_width = 'medium-up--two-thirds' -%}
      {%- assign product_description_width = 'medium-up--one-third' -%}
      {%- assign height = 720 -%}
    {% when 'full' %}
      {%- assign product_media_width = '' -%}
      {%- assign product_description_width = '' -%}
      {%- assign height = 1090 -%}
      {%- assign enable_image_zoom = false -%}
  {% endcase %}

  <div class="grid product-single{% if section.settings.enable_payment_button %} product-single--{{ section.settings.media_size }}-media{% endif %}">
    <div class="grid__item product-single__media-group {{ product_media_width }}{% if section.settings.media_size == 'full' %} product-single__media-group--full{% endif %}" data-product-single-media-group>
      {% unless section_onboarding %}
        {%- assign featured_media = product.selected_or_first_available_variant.featured_media | default: product.featured_media -%}

      
          {% comment %}
      ## FEATURED IMAGE [START] 
      ======================================= {% endcomment %}
      
      {% assign image_dropdown_position = -1 %}
      {% assign image_position = 0 %}
      <div id="featuredImageSlider"
           {% if featured_image_use_max_height %}class="featuredImageSlider--maxheight"{% endif %}>
      {%- for media in product.media -%}


        {% if media.media_type == 'image' %}  
        {% assign image_position = image_position | plus: 1 %}
        {% assign image_dropdown_position = image_dropdown_position | plus: 1 %}
        {% endif %}
      
      {% assign image_zoom_size = product_image_zoom_size %}
      {% assign image_scale = product_image_scale %}


      {% capture media_id %}FeaturedMedia-{{ section.id }}-{{ media.id }}{% endcapture %}
      {% capture media_class %}product-featured-media{% endcapture %}
      {% capture media_wrapper_id %}{{ media_id }}-wrapper{% endcapture %}

      {%- comment -%}
      Load different poster image sizes depending on the product layout
      {%- endcomment -%}
      {% capture image_size %}{{ height }}x{{ height }}{% endcapture %}

      <div 
           {% if media.media_type == 'image' %}  data-image-id="{{ images_id[image_position] }}"  {% endif %}
           {% if media.media_type == 'image' %}  data-image-dropdown-id="{{ images_id[image_dropdown_position] }}"  {% endif %}
		   {% if media.media_type == 'image' %}  data-image-position="{{ image_position }}" {% endif %}
           data-variant-id="{{images_id[forloop.index0]}}"
 		   data-slide-index="{{forloop.index0}}"
           id="{{ media_wrapper_id }}"
           class="product-single__media-wrapper js"
           {% if media.media_type == 'video' or media.media_type == 'external_video' %} data-product-media-type-video data-enable-video-looping="{{ section.settings.enable_video_looping }}"{% endif %}
           {% if media.media_type == 'model' %} data-product-media-type-model{% endif %}
           {% if media.media_type == 'external_video' %} data-video-id="{{ media.external_id }}"{% endif %}
           data-product-single-media-wrapper
           data-media-id="{{ section.id }}-{{ media.id }}"
           tabindex="-1">
        {% case media.media_type %}
        {% when 'image' %}
        {% capture zoom_media_id %}ImageZoom-{{ section.id }}-{{ media.id }}{% endcapture %}
        {%- assign img_url = media | img_url: '1x1' | replace: '_1x1.', '_{width}x.' -%}

        {% assign wrapper_id = media_wrapper_id %}
        {% assign img_id = media_id %}
        {% assign image = media.preview_image %}
      
        <div      
             data-variant-id="{{img_id[forloop.index0]}}" 
             data-slide-index="{{forloop.index0}}" 
             
             {% if featured_image_use_max_height == false %}
             style="height: 0;width: 100%;padding-top: calc(100% / {{image.aspect_ratio}}  ); "
             {% endif %}
             id="{{ zoom_media_id }}"
             style="padding-top:{{ 1 | divided_by: media.preview_image.aspect_ratio | times: 100}}%;"
             class="product-single__media{% if product.media.size > 1 %} product-single__media--has-thumbnails{% endif %}{% if enable_image_zoom %} js-zoom-enabled{% endif %}"
             {% if enable_image_zoom %} data-image-zoom-wrapper data-zoom="{{ media | img_url: image_zoom_size, scale: image_scale }}"{% endif %}
             data-image-loading-animation>
          
          
          {% if featured_image_lazyload == false %}
          <img 
               id="{{ media_id }}"
               class="feature-row__image {{ media_class }} lazyload{% unless featured_media == media %} lazypreload{% endunless %}"
               data-src="{{ img_url }}"
               data-widths="[180, 360, 540, 720, 900, 1080, 1296, 1512, 1728, 2048]"
               data-aspectratio="{{ media.preview_image.aspect_ratio }}"
               data-sizes="auto"
               {% if enable_image_zoom %} data-image-zoom {% endif %}
               alt="{{ media.alt | escape }}"
               {% if featured_media == media and request.page_type == 'product' %} onload="window.performance.mark('debut:product:image_visible');"{% endif %}>
          
          
              {% elsif featured_image_lazyload == true %}
            
               <img id="{{ media_id }}"
                 class="feature-row__image {{ media_class }}"
                 {% if featured_image_lazyload_placeholder %}src="{{ image | img_url: '300x' }}"{% endif %}
                 data-flickity-lazyload-src="{{ image | img_url: 'master' }}"
                 data-widths="[180, 370, 540, 740, 900, 1080, 1296, 1512, 1728, 2048]"
                  {% if enable_image_zoom %} data-image-zoom {% endif %}
                 alt="{{ media.alt | escape }}"
                    {% if featured_media == media and request.page_type == 'product' %} onload="window.performance.mark('debut:product:image_visible');"{% endif %}>
            
			{% endif %}
        </div>
        {% when 'external_video' %}
        <div class="product-single__media" style="padding-top: {{ 1 | divided_by: media.aspect_ratio | times: 100 }}%;">
          {{ media | external_video_tag }}
        </div>
        {% when 'video' %}
        <div class="product-single__media product-single__media--video product-single__media--{{ media.id }}" style="padding-top: {{ 1 | divided_by: media.aspect_ratio | times: 100 }}%;">
          {{ media | video_tag: class: 'media-video', image_size: image_size }}
        </div>
        {% when 'model' %}
        <div class="product-single__media" style="padding-top: 100%">
          {{ media | model_viewer_tag: image_size: image_size, reveal: 'interaction', toggleable: true, data-model-id: media.id }}
        </div>
        {% else %}
        <div class="product-single__media" style="padding-top: {{ 1 | divided_by: media.aspect_ratio | times: 100 }}%;">
          {{ media | media_tag: class: 'media-item', image_size: image_size }}
        </div>
        {% endcase %}
      </div>



          

      {%- endfor -%}
          </div>
            
      {% comment %}
      ## FEATURED IMAGE [END] 
      ======================================= {% endcomment %}

        <noscript>
          {% capture product_image_size %}{{ height }}x{% endcapture %}
          <img src="{{ featured_media | img_url: product_image_size, scale: product_image_scale }}" alt="{{ featured_media.alt }}" id="FeaturedMedia-{{ section.id }}" class="product-featured-media" style="max-width: {{ height }}px;">
        </noscript>

        {% assign first_3d_model = product.media | where: "media_type", "model" | first %}

        {%- if first_3d_model -%}
          <button
            aria-label="{{ 'products.product.view_in_space_label' | t }}"
            class="product-single__view-in-space"
            data-shopify-xr
            data-shopify-model3d-id="{{ first_3d_model.id }}"
            data-shopify-title="{{ product.title | escape }}"
            data-shopify-xr-hidden
          >
            {% include 'icon-3d-badge-full-color' %}<span class='product-single__view-in-space-text'>{{ 'products.product.view_in_space' | t }}</span>
          </button>
        {%- endif -%}

      {% else %}
        <div id="FeaturedImageZoom-{{ section.id }}" class="product-single__media">
          {{ 'product-1' | placeholder_svg_tag: 'placeholder-svg' }}
        </div>
      {% endunless %}

      {% if product.media.size > 1 %}
        {% if product.media.size > 4 %}
          {%- assign enable_thumbnail_slides = true -%}
        {% endif %}
      {% comment %}
      
      ## THUMBNAIL [START] 
      ======================================= {% endcomment %}
      
      <div data-slider style="opacity:0;height:0;width:0;"></div>
      
      {% if show_thumbnails %}
         <ul class="{% if enable_slider_for_thumbnails_desktop %}Thumbnails--slider{% else %}Thumbnails--non-slider{% endif %} product-single__thumbnails grid-uniform" 
            id="thumbnailsEzfy" >
          {% for media in product.media %}
           {% assign image = media.preview_image %}
           
     
              <li >
                  <a 
                     data-thumbnail-index-ezfy="{{forloop.index0}}" 
                     data-image-id="{{ image.id }}"
                     href="{{ media.preview_image | img_url: product_image_zoom_size, scale: product_image_scale }}"
                    class="text-link product-single__thumbnail product-single__thumbnail--{{ section.id }}"
                    data-thumbnail-id="{{ section.id }}-{{ media.id }}"
                    {% if enable_thumbnail_slides == true %} data-slider-item-link{% endif %}
                    {% if enable_image_zoom %}data-zoom="{{ media.preview_image | img_url: product_image_zoom_size, scale: product_image_scale }}"{% endif %}>

                      {%- capture thumbnailAlt -%}
                        {%- if media.media_type == 'video' or media.media_type == 'external_video' -%}
                          {{ 'sections.featured_product.video_thumbnail_alt' | t: imageAlt: media.alt | escape }}
                        {%- elsif media.media_type == 'model' -%}
                          {{ 'sections.featured_product.model_thumbnail_alt' | t: imageAlt: media.alt | escape }}
                        {%- else -%}
                          {{ 'sections.featured_product.gallery_thumbnail_alt' | t: imageAlt: media.alt | escape }}
                        {%- endif -%}
                      {%- endcapture -%}

                    
                    
                    <img 
                         src="{{ image.src | img_url: 'grande' }}" 
                         alt="{{ thumbnailAlt }}">
   
                    
                        
                      {%- if media.media_type == 'video' or media.media_type =='external_video' -%}
                        <div class="product-single__thumbnail-badge">
                          <svg aria-hidden="true" focusable="false" role="presentation" class="icon icon--full-color icon-video-badge-full-color" viewBox="0 0 26 26"><path clip-rule="evenodd" d="M1 25h24V1H1v24z"/><path class="icon-video-badge-full-color-outline" d="M.5 25v.5h25V.5H.5V25z"/><path class="icon-video-badge-full-color-element" clip-rule="evenodd" d="M9.718 6.72a1 1 0 0 0-1.518.855v10.736a1 1 0 0 0 1.562.827l8.35-5.677a1 1 0 0 0-.044-1.682l-8.35-5.06z" opacity=".6"/></svg>
                        </div>
                      {%- endif -%}
                      {%- if media.media_type == 'model' -%}
                        <div class="product-single__thumbnail-badge">
                          <svg aria-hidden="true" focusable="false" role="presentation" class="icon icon--full-color icon-3d-badge-full-color" viewBox="0 0 26 26"><path d="M1 25h24V1H1z"/><path class="icon-3d-badge-full-color-outline" d="M.5 25v.5h25V.5H.5z" fill="none"/><path class="icon-3d-badge-full-color-element" d="M19.13 8.28L14 5.32a2 2 0 0 0-2 0l-5.12 3a2 2 0 0 0-1 1.76V16a2 2 0 0 0 1 1.76l5.12 3a2 2 0 0 0 2 0l5.12-3a2 2 0 0 0 1-1.76v-6a2 2 0 0 0-.99-1.72zm-6.4 11.1l-5.12-3a.53.53 0 0 1-.26-.38v-6a.53.53 0 0 1 .27-.46l5.12-3a.53.53 0 0 1 .53 0l5.12 3-4.72 2.68a1.33 1.33 0 0 0-.67 1.2v6a.53.53 0 0 1-.26 0z" opacity=".6" style="isolation:isolate"/></svg>
                        </div>
                      {%- endif -%}
                  </a>
                </li>
                   
          {% endfor %}
        </ul>
      
      {% endif %}
                  
      {% comment %}
      ## THUMBNAIL [END] 
      ======================================= {% endcomment %}
      
      
      
      {% endif %}
    </div>

    <div class="grid__item {{ product_description_width }}">
      <div class="product-single__meta">
        {% unless section_onboarding %}
          {%- assign price = current_variant.price -%}
          {%- assign available = current_variant.available -%}
        {% else %}
          {%- assign price = 1999 -%}
          {%- assign available = true -%}
        {% endunless %}
        <h2 class="visually-hidden">{{ 'sections.featured_product.title' | t }}</h2>
        <h3 class="h1 product-single__title">
          {% unless product == empty %}
            {{ product.title }}
          {% else %}
            {{ 'homepage.onboarding.product_title' | t }}
          {% endunless %}
        </h3>

        <div>
          <div class="featured-product__price">
            {% include 'product-price', variant: current_variant, product: product, show_vendor: section.settings.show_vendor %}
          </div>

          {%- if cart.taxes_included or shop.shipping_policy.body != blank -%}
            <div class="product__policies rte" data-product-policies>
              {%- if cart.taxes_included -%}
                {{ 'products.product.include_taxes' | t }}
              {%- endif -%}
              {%- if shop.shipping_policy.body != blank -%}
                {{ 'products.product.shipping_policy_html' | t: link: shop.shipping_policy.url }}
              {%- endif -%}
            </div>
          {%- endif -%}

          {% if section_onboarding %}
            <div class="product-form">
              <div class="product-form__item product-form__item--submit{% if product.has_only_default_variant %} product-form__item--no-variants{% endif %}">
                <button type="submit" name="add" disabled class="btn product-form__cart-submit" data-add-to-cart>
                  <span data-add-to-cart-text>
                      {{ 'products.product.sold_out' | t }}
                  </span>
                </button>
              </div>
            </div>
          {% else %}
            {% capture "form_classes" -%}
              product-form product-form-{{ section.id }}
              {%- if section.settings.enable_payment_button and product.has_only_default_variant%} product-form--payment-button-no-variants{% endif %}
              {%- if current_variant.available == false %} product-form--variant-sold-out {%- endif -%}
            {%- endcapture %}
            {% form 'product', product, class:form_classes, novalidate: 'novalidate', data-product-form: '' %}
              {{ form | payment_terms }}

              {% unless section_onboarding %}
                {% unless product.has_only_default_variant %}
                  <div class="product-form__controls-group">
                    {% for option in product.options_with_values %}
                      <div class="selector-wrapper js product-form__item">
                        <label for="SingleOptionSelector-{{ section.id }}-{{ forloop.index0 }}">
                          {{ option.name }}
                        </label>
                        <select 
                                data-option-ezfy="option{{ forloop.index }}"
                                class="single-option-selector single-option-selector-{{ section.id }} product-form__input" id="SingleOptionSelector-{{ section.id }}-{{ forloop.index0 }}" data-index="option{{ forloop.index }}">
                          {% for value in option.values %}
                            <option value="{{ value | escape }}"{% if option.selected_value == value %} selected="selected"{% endif %}>{{ value }}</option>
                          {% endfor %}
                        </select>
                      </div>
                    {% endfor %}
                  </div>
                {% endunless %}

                <select name="id" id="ProductSelect-{{ section.id }}" class="product-form__variants no-js">
                  {% for variant in product.variants %}
                    <option value="{{ variant.id }}"
                      {%- if variant == current_variant %} selected="selected" {%- endif -%}
                    >
                      {{ variant.title }}  {%- if variant.available == false %} - {{ 'products.product.sold_out' | t }}{% endif %}
                    </option>
                  {% endfor %}
                </select>
              {% endunless %}
              {% if section.settings.show_quantity_selector %}
                <div class="product-form__controls-group">
                  <div class="product-form__item">
                    <label for="Quantity-{{ section.id }}">{{ 'products.product.quantity' | t }}</label>
                    <input type="number" id="Quantity-{{ section.id }}"
                      name="quantity" value="1" min="1" pattern="[0-9]*"
                      class="product-form__input product-form__input--quantity"
                      data-quantity-input>
                  </div>
                </div>
              {% endif %}

              <div class="product-form__error-message-wrapper product-form__error-message-wrapper--hidden{% if section.settings.enable_payment_button %} product-form__error-message-wrapper--has-payment-button{% endif %}" data-error-message-wrapper role="alert">
                <span class="visually-hidden">{{ 'general.accessibility.error' | t }} </span>
                {% include 'icon-error' %}
                <span class="product-form__error-message" data-error-message>{{ 'products.product.quantity_minimum_message' | t }}</span>
              </div>

              <div class="product-form__controls-group product-form__controls-group--submit">
                <div class="product-form__item product-form__item--submit
                      {%- if section.settings.enable_payment_button %} product-form__item--payment-button {%- endif -%}
                      {%- if product.has_only_default_variant %} product-form__item--no-variants {%- endif -%}"
                >
                  <button type="submit" name="add"
                    {% unless current_variant.available %} aria-disabled="true"{% endunless %}
                    aria-label="{% unless current_variant.available %}{{ 'products.product.sold_out' | t }}{% else %}{{ 'products.product.add_to_cart' | t }}{% endunless %}"
                    class="btn product-form__cart-submit{% if section.settings.enable_payment_button %} btn--secondary-accent{% endif %}"
                    {% if settings.enable_ajax %}aria-haspopup="dialog"{% endif %}
                    data-add-to-cart>
                    <span data-add-to-cart-text>
                      {% unless current_variant.available %}
                        {{ 'products.product.sold_out' | t }}
                      {% else %}
                        {{ 'products.product.add_to_cart' | t }}
                      {% endunless %}
                    </span>
                    <span class="hide" data-loader>
                      {% include 'icon-spinner' %}
                    </span>
                  </button>
                  {% if section.settings.enable_payment_button %}
                    {{ form | payment_button }}
                  {% endif %}
                </div>
              </div>
            {% endform %}
          {% endif %}
        </div>

        {%- comment -%}
          Live region for announcing updated price and availability to screen readers
        {%- endcomment -%}
        <p class="visually-hidden" data-product-status
          aria-live="polite"
          role="status"
        ></p>

        {%- comment -%}
          Live region for announcing that the product form has been submitted and the
          product is in the process being added to the cart
        {%- endcomment -%}
        <p class="visually-hidden" data-loader-status
          aria-live="assertive"
          role="alert"
          aria-hidden="true"
        >{{ 'products.product.loader_label' | t }}</p>

        <div class="product-single__description rte">
          {% unless product == empty %}
            {{ product.description }}
          {% else %}
            {{ 'homepage.onboarding.product_description' | t }}
          {% endunless %}
        </div>

        {% if section.settings.show_share_buttons %}
          {% include 'social-sharing', share_title: product.title, share_permalink: product.url, share_image: product %}
        {% endif %}
      </div>
    </div>
  </div>
</div>

{% unless product == empty %}
  <script type="application/json" id="ProductJson-{{ section.id }}">
    {{ product | json }}
  </script>
  <script type="application/json" id="ModelJson-{{ section.id }}">
    {{ product.media | where: 'media_type', 'model' | json }}
  </script>
{% endunless %}



<script type="application/ld+json">
{
  "@context": "http://schema.org/",
  "@type": "Product",
  "name": {{ product.title | json }},
  "url": {{ shop.url | append: product.url | json }},
  {%- if product.featured_media -%}
    {%- assign media_size = product.featured_media.preview_image.width | append: 'x' -%}
    "image": [
      {{ product.featured_media | img_url: media_size | prepend: "https:" | json }}
    ],
  {%- endif -%}
  "description": {{ product.description | strip_html | json }},
  {%- if current_variant.sku != blank -%}
    "sku": {{ current_variant.sku | json }},
  {%- endif -%}
  "brand": {
    "@type": "Thing",
    "name": {{ product.vendor | json }}
  },
  "offers": [
    {%- for variant in product.variants -%}
      {
        "@type" : "Offer",
        {%- if variant.sku != blank -%}
          "sku": {{ variant.sku | json }},
        {%- endif -%}
        "availability" : "http://schema.org/{% if variant.available %}InStock{% else %}OutOfStock{% endif %}",
        "price" : {{ variant.price | divided_by: 100.00 | json }},
        "priceCurrency" : {{ cart.currency.iso_code | json }},
        "url" : {{ shop.url | append: variant.url | json }}
      }{% unless forloop.last %},{% endunless %}
    {%- endfor -%}
  ]
}
</script>

{% schema %}
{
  "name": {
    "cs": "Propagovaný produkt",
    "da": "Fremhævet produkt",
    "de": "Vorgestelltes Produkt",
    "en": "Featured product",
    "es": "Producto destacado",
    "fi": "Esittelyssä oleva tuote",
    "fr": "Produit vedette",
    "it": "Prodotto in primo piano",
    "ja": "おすすめ商品",
    "ko": "특별 상품",
    "nb": "Utvalgt produkt",
    "nl": "Uitgelicht product",
    "pl": "Polecany produkt",
    "pt-BR": "Produto em destaque",
    "pt-PT": "Produto em destaque",
    "sv": "Utvald produkt",
    "th": "สินค้าที่แนะนำ",
    "tr": "Öne çıkan ürün",
    "vi": "Sản phẩm nổi bật",
    "zh-CN": "特色产品",
    "zh-TW": "精選產品"
  },
  "class": "index-section index-section--featured-product",
  "settings": [
       {
      "type": "header",
      "content": "Custom Settings"
    },
{
      "type": "paragraph",
      "content": "Debut Slider settings by ezfycode.com"
    },
    {
      "type": "paragraph",
      "content": "## Featured Image Settings"
    },
    {
      "type": "checkbox",
      "id": "featured_image_loop",
      "label": "Enable loop",
      "default": true
    },
    {
      "type": "checkbox",
      "id": "featured_image_arrows",
      "label": "Enable arrows for desktop",
      "default": true
    },
    {
      "type": "checkbox",
      "id": "featured_image_arrows_mobile",
      "label": "Enable arrows for mobile",
      "default": true
    },

    {
      "type": "checkbox",
      "id": "featured_image_lazyload",
      "label": "Lazyload",
      "info": "Loads the highest quality of the image only when it appears on the screen. May improve loading time.",
      "default": true
    },
    {
      "type": "checkbox",
      "id": "featured_image_animation",
      "label": "Enable smooth animation on image change",
      "default": true
    },
  {
    "type": "checkbox",
    "id": "featured_image_use_max_height",
    "label": "Enable max height",
    "default": false
  },
  {
    "type": "text",
    "id": "featured_image_max_height",
    "label": "Image's max height in pixels (desktop)",
    "default": "520",
    "info": "Please type only numbers. This will work only when \"Enable max height\" is checked."
  },
  {
    "type": "text",
    "id": "featured_image_max_height_mobile",
    "label": "Image's max height in pixels (mobile)",
    "default": "400",
    "info": "Please type only numbers. This will work only when \"Enable max height\" is checked."
  },

  {
    "type": "color",
    "id": "featured_image_background_color",
    "label": "Featured image background color",
    "default": "#ffffff",
	"info": "This will work only when \"Enable max height\" is checked."
  },
    {
      "type": "paragraph",
      "content": "## Thumbnails Settings"
    },
    {
      "type": "checkbox",
      "id": "thumbnails_loop",
      "label": "Enable loop",
      "default": true
    },
    {
      "type": "checkbox",
      "id": "thumbnails_arrows_desktop",
      "label": "Enable arrows for desktop",
      "default": false
    },
    {
      "type": "checkbox",
      "id": "thumbnails_arrows_mobile",
      "label": "Enable arrows for mobile",
      "default": false
    },
    {
      "type": "checkbox",
      "id": "show_thumbnails",
      "label": "Show thumbnails",
      "info": "Disable this to hide all thumbnails.",
      "default": true
    },
    {
      "type": "checkbox",
      "id": "enable_slider_for_thumbnails_desktop",
      "label": "Enable thumbnails slider",
      "info": "Disable this to use the original Debut's thumbnails without a slider.",
      "default": true
    },
    {
      "type": "select",
      "id": "thumbnails_highlighted_position",
      "label": "Highlighted thumbnail aligns to the:",
      "options": [
        {
          "value": "left",
          "label": "Left"
        },
        {
          "value": "center",
          "label": "Center"
        },
        {
          "value": "right",
          "label": "Right"
        }
      ],
      "default": "left"
    },
    {
      "type": "select",
      "id": "thumbnails_vertical_alignment",
      "label": "Vertical alignment",
      "options": [
        {
          "value": "top",
          "label": "Top"
        },
        {
          "value": "center",
          "label": "Center"
        }
      ],
      "default": "top"
    },
    {
      "type": "select",
      "id": "thumbnails",
      "label": "Thumbnail's quantity on desktop",
      "options": [
        {
          "value": "3",
          "label": "3"
        },
        {
          "value": "4",
          "label": "4"
        },
        {
          "value": "5",
          "label": "5"
        },
        {
          "value": "6",
          "label": "6"
        }
      ],
      "default": "4"
    },
    {
      "type": "select",
      "id": "thumbnails_mobile",
      "label": "Thumbnail's quantity on mobile",
      "options": [
        {
          "value": "3",
          "label": "3"
        },
        {
          "value": "4",
          "label": "4"
        },
        {
          "value": "5",
          "label": "5"
        },
        {
          "value": "6",
          "label": "6"
        }
      ],
      "default": "4"
    },
    {
      "type": "header",
      "content": "Other Slider Settings"
    },

    {
      "type": "select",
      "id": "arrow_style",
      "label": "Arrow style",
      "options": [
        {
          "value": "full_height",
          "label": "Full height"
        },
        {
          "value": "circle",
          "label": "Circle, vertically centered"
        }
      ],
      "default": "circle"
    },


      {
          "type":      "range",
          "id":        "arrow_opacity",
          "min":       0,
          "max":        99,
          "step":       1,
          "unit":       "%",
          "label":     "Arrow background transparency",
		  "info": "The lower the more transparent.",
          "default":   75
      },
      {
          "type":      "range",
          "id":        "arrow_hover_opacity",
          "min":       0,
          "max":        99,
          "step":       1,
          "unit":       "%",
          "label":     "Arrow background transparency on hover",
		  "info": "The lower the more transparent.",
          "default":   99
      },

    {
      "type": "checkbox",
      "id": "compability_16_below",
      "label": "Compability for themes below 16.0.0",
      "info": "If your theme is below 16.0.0 and you experience issues, please activate this. Warning: do not activate on themes above 16.0.0. It will break the slider.",
      "default": false
    },
    {
      "type": "header",
      "content": "Original Settings"
    },
    {
      "type": "header",
      "content": "Original Settings"
    },
    {
      "type": "product",
      "id": "featured_product",
      "label": {
        "cs": "Produkt",
        "da": "Produkt",
        "de": "Produkte",
        "en": "Product",
        "es": "Producto",
        "fi": "Tuote",
        "fr": "Produit",
        "it": "Prodotto",
        "ja": "商品",
        "ko": "제품",
        "nb": "Produkt",
        "nl": "Product",
        "pl": "Produkt",
        "pt-BR": "Produto",
        "pt-PT": "Produto",
        "sv": "Produkt",
        "th": "สินค้า",
        "tr": "Ürün",
        "vi": "Sản phẩm",
        "zh-CN": "产品",
        "zh-TW": "產品"
      }
    },
    {
      "type": "checkbox",
      "id": "show_quantity_selector",
      "label": {
        "cs": "Zobrazit výběr množství",
        "da": "Vis antalsvælger",
        "de": "Mengenauswahl anzeigen",
        "en": "Show quantity selector",
        "es": "Mostrar selector de cantidad",
        "fi": "Näytä määrän valitsin",
        "fr": "Afficher le sélecteur de quantité",
        "it": "Mostra selettore quantità",
        "ja": "数量セレクターを表示する",
        "ko": "수량 선택기 표시",
        "nb": "Vis mengdevelger",
        "nl": "Hoeveelheidskiezer weergeven",
        "pl": "Pokaż selektor ilości",
        "pt-BR": "Exiba um seletor de quantidade",
        "pt-PT": "Mostrar um seletor de quantidade",
        "sv": "Visa kvantitetsväljare",
        "th": "แสดงตัวเลือกจำนวน",
        "tr": "Adet seçiciyi göster",
        "vi": "Hiển thị hộp chọn số lượng",
        "zh-CN": "显示数量选择器",
        "zh-TW": "顯示數量選擇器"
      },
      "default": false
    },
    {
      "type": "checkbox",
      "id": "show_vendor",
      "label": {
        "cs": "Zobrazit dodavatele",
        "da": "Vis leverandør",
        "de": "Lieferant anzeigen",
        "en": "Show vendor",
        "es": "Mostrar proveedor",
        "fi": "Näytä myyjä",
        "fr": "Afficher le nom du vendeur",
        "it": "Mostra fornitore",
        "ja": "販売元を表示する",
        "ko": "공급업체 표시",
        "nb": "Vis leverandør",
        "nl": "Leverancier weergeven",
        "pl": "Pokaż dostawcę",
        "pt-BR": "Exibir fabricante",
        "pt-PT": "Mostrar fornecedor",
        "sv": "Visa säljare",
        "th": "แสดงผู้ขาย",
        "tr": "Satıcıyı göster",
        "vi": "Hiển thị nhà cung cấp",
        "zh-CN": "显示厂商",
        "zh-TW": "顯示廠商"
      },
      "default": false
    },
    {
      "type": "checkbox",
      "id": "enable_payment_button",
      "label": {
        "cs": "Zobrazit dynamické tlačítko pokladny",
        "da": "Vis dynamisk betalingsknap",
        "de": "Dynamischen Checkout Button anzeigen",
        "en": "Show dynamic checkout button",
        "es": "Mostrar botón de pago dinámico",
        "fi": "Näytä dynaaminen kassapainike",
        "fr": "Afficher le bouton de paiement dynamique",
        "it": "Mostra pulsante di check-out dinamico",
        "ja": "動的チェックアウトボタンを表示する",
        "ko": "동적 결제 버튼 표시",
        "nb": "Vis dynamisk knapp for å gå til kassen",
        "nl": "Dynamische checkoutknop weergeven",
        "pl": "Pokaż dynamiczny przycisk realizacji zakupu",
        "pt-BR": "Exibir botão de checkout dinâmico",
        "pt-PT": "Mostrar o botão dinâmico de finalização da compra",
        "sv": "Visa dynamiska utcheckningsknappar",
        "th": "แสดงปุ่มชำระเงินแบบไดนามิก",
        "tr": "Dinamik ödeme düğmesini göster",
        "vi": "Hiển thị nút thanh toán nhanh",
        "zh-CN": "显示动态结账按钮",
        "zh-TW": "顯示動態結帳按鈕"
      },
      "info": {
        "cs": "Každý zákazník uvidí platební metodu, kterou ze všech metod dostupných v obchodě (například PayPal nebo Apple Pay) nejvíce preferuje. [Další informace](https://help.shopify.com/manual/using-themes/change-the-layout/dynamic-checkout)",
        "da": "Den enkelte kunde vil se sin foretrukne betalingsmetode blandt dem, der er tilgængelige i din butik, f.eks. PayPal eller Apple Pay. [Få mere at vide](https://help.shopify.com/manual/using-themes/change-the-layout/dynamic-checkout)",
        "de": "Jeder Kunde sieht seine bevorzugte Zahlungsmethode aus den in deinem Shop verfügbaren Zahlungsmethoden wie PayPal oder Apple Pay. [Mehr Informationen](https://help.shopify.com/manual/using-themes/change-the-layout/dynamic-checkout)",
        "en": "Each customer will see their preferred payment method from those available on your store, such as PayPal or Apple Pay. [Learn more](https://help.shopify.com/manual/using-themes/change-the-layout/dynamic-checkout)",
        "es": "Cada cliente verá su forma de pago preferida entre las disponibles en tu tienda, como PayPal o Apple Pay. [Más información](https://help.shopify.com/manual/using-themes/change-the-layout/dynamic-checkout)",
        "fi": "Kukin asiakas näkee ensisijaisen valintansa kauppasi tarjoamista maksutavoista, esim. PayPal tai Apple Pay. [Lisätietoja](https://help.shopify.com/manual/using-themes/change-the-layout/dynamic-checkout)",
        "fr": "Chaque client verra son moyen de paiement préféré parmi ceux qui sont proposés sur votre boutique, tels que PayPal ou Apple Pay. [En savoir plus](https://help.shopify.com/manual/using-themes/change-the-layout/dynamic-checkout)",
        "it": "Ogni cliente vedrà il suo metodo di pagamento preferito tra quelli disponibili nel tuo negozio, come PayPal o Apple Pay. [Maggiori informazioni](https://help.shopify.com/manual/using-themes/change-the-layout/dynamic-checkout)",
        "ja": "PayPalやApple Payなど、ストアで利用可能な希望の決済方法がお客様に表示されます。[詳しくはこちら](https://help.shopify.com/manual/using-themes/change-the-layout/dynamic-checkout)",
        "ko": "각 고객은 PayPal 또는 Apple Pay와 같이 스토어에서 사용 가능한 지불 방법을 확인할 수 있습니다. [자세히 알아보기](https://help.shopify.com/manual/using-themes/change-the-layout/dynamic-checkout)",
        "nb": "Hver enkelt kunde vil se sin foretrukne betalingsmåte blant de som er tilgjengelig i butikken din, som PayPal eller Apple Pay. [Finn ut mer](https://help.shopify.com/manual/using-themes/change-the-layout/dynamic-checkout)",
        "nl": "Elke klant ziet zijn of haar beschikbare voorkeursmethode om af te rekenen, zoals PayPal of Apple Pay. [Meer informatie](https://help.shopify.com/manual/using-themes/change-the-layout/dynamic-checkout)",
        "pl": "Każdy klient zobaczy swoją preferowaną metodę płatności wśród metod dostępnych w Twoim sklepie, np. PayPal lub Apple Pay. [Dowiedz się więcej](https://help.shopify.com/manual/using-themes/change-the-layout/dynamic-checkout)",
        "pt-BR": "Cada cliente verá a forma de pagamento preferencial dele dentre as disponíveis na loja, como PayPal ou Apple Pay. [Saiba mais](https://help.shopify.com/manual/using-themes/change-the-layout/dynamic-checkout)",
        "pt-PT": "Cada cliente irá ver o seu método de pagamento preferido entre os disponíveis na loja, como o PayPal ou Apple Pay. [Saiba mais](https://help.shopify.com/manual/using-themes/change-the-layout/dynamic-checkout)",
        "sv": "Varje kund kommer att se den föredragna betalningsmetoden från de som finns tillgängliga i din butik, till exempel PayPal eller Apple Pay. [Läs mer](https://help.shopify.com/manual/using-themes/change-the-layout/dynamic-checkout)",
        "th": "ลูกค้าแต่ละรายจะเห็นวิธีการชำระเงินที่ต้องการจากวิธีที่ใช้ได้ในร้านค้าของคุณ เช่น PayPal หรือ Apple Pay [ดูข้อมูลเพิ่มเติม](https://help.shopify.com/manual/using-themes/change-the-layout/dynamic-checkout)",
        "tr": "Her müşteri, mağazanız sunulanlar arasından tercih ettikleri ödeme yöntemini görür (ör. PayPal veya Apple Pay). [Daha fazla bilgi edinin](https://help.shopify.com/manual/using-themes/change-the-layout/dynamic-checkout)",
        "vi": "Mỗi khách hàng sẽ thấy phương thức thanh toán ưu tiên trong những phương thức thanh toán được hỗ trợ tại cửa hàng như PayPal hoặc Apple Pay. [Tìm hiểu thêm](https://help.shopify.com/manual/using-themes/change-the-layout/dynamic-checkout)",
        "zh-CN": "每位客户都可在您商店提供的付款方式中看到他们的首选付款方式，例如 PayPal 或 Apple Pay。[了解详细信息](https://help.shopify.com/manual/using-themes/change-the-layout/dynamic-checkout)",
        "zh-TW": "每位顧客都可以在您商店內開放使用的付款方式中看見他們偏好使用的方式，如 PayPal、Apple Pay 等。[深入瞭解](https://help.shopify.com/manual/using-themes/change-the-layout/dynamic-checkout)"
      },
      "default": true
    },
    {
      "type": "checkbox",
      "id": "show_share_buttons",
      "label": {
        "cs": "Zobrazit tlačítka pro sdílení na sociálních sítích",
        "da": "Vis knapper til deling på sociale medier",
        "de": "Buttons für Social Media anzeigen",
        "en": "Show social sharing buttons",
        "es": "Mostrar botones para compartir en redes sociales",
        "fi": "Näytä sosiaalisen median jakamispainikkeet",
        "fr": "Afficher les options de partage sur les médias sociaux",
        "it": "Mostra i pulsanti per la condivisione sui social",
        "ja": "ソーシャルメディアでの共有ボタンを表示する",
        "ko": "소셜 공유 버튼 표시",
        "nb": "Vis knapper for deling på sosiale medier",
        "nl": "Knoppen voor sociaal delen weergeven",
        "pl": "Pokaż przyciski udostępniania w mediach społecznościowych",
        "pt-BR": "Exibir botões de compartilhamento em redes sociais",
        "pt-PT": "Mostrar botões de partilha nas redes sociais",
        "sv": "Visa knappar för delning i sociala medier",
        "th": "แสดงปุ่มสำหรับแชร์ลงโซเชียล",
        "tr": "Sosyal medya paylaşım düğmelerini göster",
        "vi": "Hiển thị nút chia sẻ qua mạng xã hội",
        "zh-CN": "显示社交分享按钮",
        "zh-TW": "顯示社群分享按鈕"
      },
      "default": true
    },
    {
      "type": "header",
      "content": {
        "cs": "Multimédia",
        "da": "Medie",
        "de": "Medien",
        "en": "Media",
        "es": "Elementos multimedia",
        "fi": "Media",
        "fr": "Support multimédia",
        "it": "Media",
        "ja": "メディア",
        "ko": "미디어",
        "nb": "Medier",
        "nl": "Media",
        "pl": "Multimedia",
        "pt-BR": "Mídia",
        "pt-PT": "Multimédia",
        "sv": "Media",
        "th": "สื่อ",
        "tr": "Medya",
        "vi": "Nội dung đa phương tiện",
        "zh-CN": "媒体",
        "zh-TW": "媒體"
      },
      "info": {
        "cs": "Další informace o [typech multimédií](https://help.shopify.com/manual/products/product-media)",
        "da": "Få mere at vide om [media types](https://help.shopify.com/manual/products/product-media)",
        "de": "Mehr Informationen über [Medientypen ](https://help.shopify.com/manual/products/product-media)",
        "en": "Learn more about [media types](https://help.shopify.com/manual/products/product-media)",
        "es": "Más información sobre [tipos de archivos multimedia](https://help.shopify.com/manual/products/product-media)",
        "fi": "Lue lisää [mediatyypeistä](https://help.shopify.com/manual/products/product-media)",
        "fr": "En savoir plus sur les [types de supports multimédia](https://help.shopify.com/manual/products/product-media)",
        "it": "Scopri di più sulle [tipologie di file multimediali](https://help.shopify.com/manual/products/product-media)",
        "ja": "[メディアのタイプ](https://help.shopify.com/manual/products/product-media) について詳しくはこちら",
        "ko": "[미디어 유형](https://help.shopify.com/manual/products/product-media)에 대해 자세히 알아보기",
        "nb": "Lær mer om [medietyper](https://help.shopify.com/manual/products/product-media)",
        "nl": "Meer informatie over [mediatypen](https://help.shopify.com/manual/products/product-media)",
        "pl": "Dowiedz się więcej o [typach multimediów](https://help.shopify.com/manual/products/product-media)",
        "pt-BR": "Saiba mais sobre [tipos de mídia](https://help.shopify.com/manual/products/product-media)",
        "pt-PT": "Saiba mais sobre [media types](https://help.shopify.com/manual/products/product-media)",
        "sv": "Läs mer om [mediatyper](https://help.shopify.com/manual/products/product-media)",
        "th": "ดูข้อมูลเพิ่มเติมเกี่ยวกับ [ประเภทของสื่อ](https://help.shopify.com/manual/products/product-media)",
        "tr": "[Medya türleri](https://help.shopify.com/manual/products/product-media) hakkında daha fazla bilgi edinin",
        "vi": "Tìm hiểu thêm về [loại phương tiện](https://help.shopify.com/manual/products/product-media)",
        "zh-CN": "详细了解[媒体类型](https://help.shopify.com/manual/products/product-media)",
        "zh-TW": "深入瞭解 [媒體類型](https://help.shopify.com/manual/products/product-media)"
      }
    },
    {
      "type": "select",
      "id": "media_size",
      "label": {
        "cs": "Velikost",
        "da": "Størrelse",
        "de": "Größe",
        "en": "Size",
        "es": "Tamaño",
        "fi": "Koko",
        "fr": "Taille",
        "it": "Dimensione",
        "ja": "サイズ",
        "ko": "사이즈",
        "nb": "Størrelse",
        "nl": "Grootte",
        "pl": "Rozmiar",
        "pt-BR": "Tamanho",
        "pt-PT": "Tamanho",
        "sv": "Storlek",
        "th": "ขนาด",
        "tr": "Boyut",
        "vi": "Cỡ",
        "zh-CN": "尺寸",
        "zh-TW": "尺寸"
      },
      "options": [
        {
          "value": "small",
          "label": {
            "cs": "Malá",
            "da": "Lille",
            "de": "Klein",
            "en": "Small",
            "es": "Pequeño",
            "fi": "Pieni",
            "fr": "Petit",
            "it": "Piccolo",
            "ja": "スモール",
            "ko": "스몰",
            "nb": "Liten",
            "nl": "Klein",
            "pl": "Mały",
            "pt-BR": "Pequeno",
            "pt-PT": "Pequeno",
            "sv": "Liten",
            "th": "เล็ก",
            "tr": "Küçük",
            "vi": "Nhỏ",
            "zh-CN": "小",
            "zh-TW": "小型"
          }
        },
        {
          "value": "medium",
          "label": {
            "cs": "Střední",
            "da": "Medium",
            "de": "Mittel",
            "en": "Medium",
            "es": "Mediano",
            "fi": "Keskisuuri",
            "fr": "Moyenne",
            "it": "Medio",
            "ja": "中",
            "ko": "보통",
            "nb": "Middels",
            "nl": "Gemiddeld",
            "pl": "Średni",
            "pt-BR": "Médio",
            "pt-PT": "Médio",
            "sv": "Medium",
            "th": "ปานกลาง",
            "tr": "Orta",
            "vi": "Trung bình",
            "zh-CN": "中等",
            "zh-TW": "中等"
          }
        },
        {
          "value": "large",
          "label": {
            "cs": "Velká",
            "da": "Stor",
            "de": "Groß",
            "en": "Large",
            "es": "Grande",
            "fi": "Suuri",
            "fr": "Grande",
            "it": "Grande",
            "ja": "大",
            "ko": "라지",
            "nb": "Stor",
            "nl": "Groot",
            "pl": "Duży",
            "pt-BR": "Grande",
            "pt-PT": "Grande",
            "sv": "Stor",
            "th": "ใหญ่",
            "tr": "Büyük",
            "vi": "Lớn",
            "zh-CN": "大",
            "zh-TW": "大型"
          }
        },
        {
          "value": "full",
          "label": {
            "cs": "Extra velká",
            "da": "Ekstra stor",
            "de": "Extra groß",
            "en": "Extra large",
            "es": "Extra grande",
            "fi": "Erikoissuuri",
            "fr": "Très grande",
            "it": "Extra large",
            "ja": "特大",
            "ko": "특대",
            "nb": "Ekstra stort",
            "nl": "Extra groot",
            "pl": "Bardzo duży",
            "pt-BR": "Extra grande",
            "pt-PT": "Extra grande",
            "sv": "Extra stor",
            "th": "ขนาดใหญ่พิเศษ",
            "tr": "Çok büyük",
            "vi": "Cực lớn",
            "zh-CN": "特大",
            "zh-TW": "超大型"
          }
        }
      ],
      "default": "medium"
    },
    {
      "type": "checkbox",
      "id": "enable_image_zoom",
      "label": {
        "cs": "Povolit zvětšení obrázku",
        "da": "Aktivér billedzoom",
        "de": "Foto-Zoom zulassen",
        "en": "Enable image zoom",
        "es": "Habilitar zoom de imagen",
        "fi": "Ota kuvan zoomaus käyttöön",
        "fr": "Activer le zoom d'image",
        "it": "Abilita lo zoom dell'immagine",
        "ja": "画像ズームを有効にする",
        "ko": "이미지 확대 사용",
        "nb": "Aktiver bildezoom",
        "nl": "Inzoomen op afbeelding inschakelen",
        "pl": "Włącz powiększenie obrazu",
        "pt-BR": "Habilitar o zoom da imagem",
        "pt-PT": "Ativar o zoom da imagem",
        "sv": "Aktivera bildzoom",
        "th": "เปิดใช้การซูมภาพ",
        "tr": "Görsel yakınlaştırmayı etkinleştir",
        "vi": "Bật thu phóng hình ảnh",
        "zh-CN": "启用图片缩放",
        "zh-TW": "啟用圖片縮放"
      },
      "default": true
    },
    {
      "type": "checkbox",
      "id": "enable_video_looping",
      "label": {
        "cs": "Povolit smyčky videa",
        "da": "Aktivér looping af videoer",
        "de": "Videoschleife aktivieren",
        "en": "Enable video looping",
        "es": "Habilitar la reproducción de video en bucle",
        "fi": "Ota käyttöön videosilmukka",
        "fr": "Activer le bouclage de la vidéo",
        "it": "Abilita la riproduzione in loop dei video",
        "ja": "ビデオのループを有効にする",
        "ko": "동영상 루프 활성화",
        "nb": "Aktiver løkkeavspilling av video",
        "nl": "Video-looping inschakelen",
        "pl": "Włącz zapętlanie wideo",
        "pt-BR": "Habilitar loop de vídeo",
        "pt-PT": "Ativar ciclo de vídeo",
        "sv": "Aktivera video-loopning",
        "th": "เปิดใช้การวนซ้ำวิดีโอ",
        "tr": "Video döngüsünü etkinleştir",
        "vi": "Bật vòng lặp video",
        "zh-CN": "启用视频循环",
        "zh-TW": "啟用影片循環功能"
      },
      "default": false
    }
  ],
  "presets": [
    {
      "name": {
        "cs": "Propagovaný produkt",
        "da": "Fremhævet produkt",
        "de": "Vorgestelltes Produkt",
        "en": "Featured product",
        "es": "Producto destacado",
        "fi": "Esittelyssä oleva tuote",
        "fr": "Produit vedette",
        "it": "Prodotto in primo piano",
        "ja": "おすすめ商品",
        "ko": "특별 상품",
        "nb": "Utvalgt produkt",
        "nl": "Uitgelicht product",
        "pl": "Polecany produkt",
        "pt-BR": "Produto em destaque",
        "pt-PT": "Produto em destaque",
        "sv": "Utvald produkt",
        "th": "สินค้าที่แนะนำ",
        "tr": "Öne çıkan ürün",
        "vi": "Sản phẩm nổi bật",
        "zh-CN": "特色产品",
        "zh-TW": "精選產品"
      },
      "category": {
        "cs": "Produkt",
        "da": "Produkt",
        "de": "Produkte",
        "en": "Product",
        "es": "Producto",
        "fi": "Tuote",
        "fr": "Produit",
        "it": "Prodotto",
        "ja": "商品",
        "ko": "제품",
        "nb": "Produkt",
        "nl": "Product",
        "pl": "Produkt",
        "pt-BR": "Produto",
        "pt-PT": "Produto",
        "sv": "Produkt",
        "th": "สินค้า",
        "tr": "Ürün",
        "vi": "Sản phẩm",
        "zh-CN": "产品",
        "zh-TW": "產品"
      }
    }
  ]
}
{% endschema %}

ezfy-debut-product-template.liquid

{% comment %}
Debut slider by ezfycode.com

More free & premium plugins at:

ezfycode.com/shop

{% endcomment %}


{% comment %}Custom options for the Debut Slider - made by ezfycode.com [START]{% endcomment %}
{% assign featured_image = product.selected_or_first_available_variant.featured_image | default: product.featured_image %}

{% assign total_media = product.media | size %}
{% assign total_images =  product.images | size %}
{% assign images_id = "" | split: "," %}

{% for image in product.images %}
{% assign _id = image.id | split: ',' %}
{% assign images_id = images_id | concat: _id  %}
{% endfor %}

{% assign featured_image_lazyload = section.settings.featured_image_lazyload %}
{% assign featured_image_lazyload_placeholder = true %}
{% assign featured_image_loop = section.settings.featured_image_loop %}
{% assign featured_image_arrows = section.settings.featured_image_arrows %}
{% assign featured_image_arrows_mobile = section.settings.featured_image_arrows_mobile %}

{% assign featured_image_animation = section.settings.featured_image_animation %}
{% assign featured_image_use_max_height = section.settings.featured_image_use_max_height %}
{% assign featured_image_max_height = section.settings.featured_image_max_height %}
{% assign featured_image_max_height_mobile = section.settings.featured_image_max_height_mobile %}
{% assign featured_image_background_color = section.settings.featured_image_background_color %}



{% assign enable_slider_for_thumbnails_desktop = section.settings.enable_slider_for_thumbnails_desktop %}
{% assign thumbnails_vertical_alignment = section.settings.thumbnails_vertical_alignment %}
{% assign thumbnails = section.settings.thumbnails %}
{% assign thumbnails_mobile = section.settings.thumbnails_mobile %}
{% assign thumbnails_highlighted_position = section.settings.thumbnails_highlighted_position %}
{% assign thumbnails_loop = section.settings.thumbnails_loop %}
{% assign show_thumbnails = section.settings.show_thumbnails %}
{% assign thumbnails_arrows_desktop = section.settings.thumbnails_arrows_desktop %}
{% assign thumbnails_arrows_mobile = section.settings.thumbnails_arrows_mobile %}
{% assign thumbnails_non_slider_gap = '10' %}


{% assign arrow_style = section.settings.arrow_style %}
{% assign arrow_opacity = section.settings.arrow_opacity %}
{% assign arrow_hover_opacity = section.settings.arrow_hover_opacity %}
{% assign compability_16_below = section.settings.compability_16_below %}


{% if total_images <= 3 %}
{% assign enable_slider_for_thumbnails_desktop = false %}
{% endif %}


<div style="display:none;height:0;width:0;"
     data_featured_image_animation="{{ featured_image_animation }}"
          data_thumbnails_quantity="{{ thumbnails }}"
     data_thumbnails_quantity_mobile="{{ thumbnails_mobile }}"
     data_total_images="{{ total_media }}" 
     data_featured_image_loop="{{featured_image_loop}}"
     data_enable_slider_for_thumbnails_desktop="{{enable_slider_for_thumbnails_desktop}}"
     data_thumbnails_highlighted_position="{{thumbnails_highlighted_position}}"
     data_featured_image_lazyload="{{featured_image_lazyload}}"
     data_thumbnails_loop="{{thumbnails_loop}}"
     ></div>

<style>
.flickity-enabled{position:relative}.flickity-enabled:focus{outline:0}.flickity-viewport{overflow:hidden;position:relative;height:100%}.flickity-slider{position:absolute;width:100%;height:100%}.flickity-enabled.is-draggable{-webkit-tap-highlight-color:transparent;-webkit-user-select:none;-moz-user-select:none;-ms-user-select:none;user-select:none}.flickity-enabled.is-draggable .flickity-viewport{cursor:move;cursor:-webkit-grab;cursor:grab}.flickity-enabled.is-draggable .flickity-viewport.is-pointer-down{cursor:-webkit-grabbing;cursor:grabbing}.flickity-button{position:absolute;background:hsla(0,0%,100%,.75);border:none;color:#333}.flickity-button:hover{background:#fff;cursor:pointer}.flickity-button:focus{outline:0;box-shadow:0 0 0 5px #19f}.flickity-button:active{opacity:.6}.flickity-button:disabled{opacity:.3;cursor:auto;pointer-events:none}.flickity-button-icon{fill:currentColor}.flickity-prev-next-button{top:50%;width:44px;height:44px;border-radius:50%;transform:translateY(-50%)}.flickity-prev-next-button.previous{left:10px}.flickity-prev-next-button.next{right:10px}.flickity-rtl .flickity-prev-next-button.previous{left:auto;right:10px}.flickity-rtl .flickity-prev-next-button.next{right:auto;left:10px}.flickity-prev-next-button .flickity-button-icon{position:absolute;left:20%;top:20%;width:60%;height:60%}.flickity-page-dots{position:absolute;width:100%;bottom:-25px;padding:0;margin:0;list-style:none;text-align:center;line-height:1}.flickity-rtl .flickity-page-dots{direction:rtl}.flickity-page-dots .dot{display:inline-block;width:10px;height:10px;margin:0 8px;background:#333;border-radius:50%;opacity:.25;cursor:pointer}.flickity-page-dots .dot.is-selected{opacity:1}
</style>

{% if featured_image_use_max_height %}
<style>
[id] #featuredImageSlider img{
	    object-fit: contain !important; 
}

#featuredImageSlider [data-slide-index]{
  padding-top: {{ featured_image_max_height}}px !important;
  background: {{ featured_image_background_color }} !important;
}
  
  
  @media (max-width: 767px){
  
  
#featuredImageSlider [data-slide-index]{
  padding-top: {{ featured_image_max_height_mobile}}px !important;
}
  }
</style>
{% endif %}


<style>
  {% assign thumbnail_loading_height = 100 %}
  {% assign basic_transition = 'all .5s ease' %}
  {% assign hover_transition = 'all .3s ease' %}
  {% assign featured_image_arrow_size_mobile = 28 %} 
  {% assign thumbnails_arrow_size = 28 %} 
  {% assign thumbnails_arrow_size_mobile = 28 %} 


  /* General Styles
  ================================ */
  
      [data-product-form] > *{
    width: 100%;
  }
  .product-single__image-wrapper{
    display: block !important;
  }
  
    
  .product-single__thumbnail-badge svg {
    fill: white !important;
}
.product-single__thumbnail-badge svg [class*='element']{
    fill: #000000 !important;
}
  
  .flickity-button{
    transition: {{hover_transition}};
  }
 

  {% if featured_image_fade %}
  .FeaturedImage .flickity-enabled.is-fade .flickity-slider > * {
    pointer-events: none;
    z-index: 0;
  }

  .FeaturedImage .flickity-enabled.is-fade .flickity-slider > .is-selected {
    pointer-events: auto;
    z-index: 1;
  }
  {% endif %}
  
  
  
  {% if arrow_style == 'full_height' %}
    .flickity-button{
        top: 0;
    bottom: 0;
    transform: unset;
    height: 100% !important;
    border-radius: unset;
  }
  
      .flickity-button.previous{
        left: 0;
  }     
  
  .flickity-button.next{
        right: 0;
  }
  {% endif %}
  
  .flickity-button{
    background: hsla(0,0%,100%,.{{arrow_opacity}});
  }
  
  .flickity-button:hover{
  	background: hsla(0,0%,100%,.{{arrow_hover_opacity}}); 
  }

  /* Featured Image 
  ================================ */
  
  
  
  #featuredImageSlider{
  	padding-left: 0;
  }
  
  
#featuredImageSlider, .flickity-slider{
    max-width: 100%;
    width: 100%;
  }

#featuredImageSlider{
    opacity: 0;
    transition: {{basic_transition}};
    max-height: 50vw;
    width: 100%;
  }


#featuredImageSlider .flickity-viewport{
    height: 0px;
    width: 100%;
    padding-top: calc(100% / {{featured_image.aspect_ratio}}  );

  }

  #featuredImageSlider.flickity-enabled,
  #featuredImageSlider.flickity-enabled .flickity-viewport{
    visibility: visible;
    position: relative;
    padding-top: unset;
    opacity: 1;
    transition: {{basic_transition}};
    max-height: unset;
    height: auto;

  }

  #featuredImageSlider img{
    position: absolute;
    top: 0;
    left: 0;
    width: 100%;
    height: 100%;
    object-fit: cover;
    min-width: 100%;
    min-height: 100%;
  }

  #featuredImageSlider .flickity-viewport{
    transition: {{basic_transition}};
  }
  
  #featuredImageSlider .hide{
  	display: block !important;
  }
  
  #featuredImageSlider [data-enable-video-looping]{
  	cursor: pointer;
  }
  
  
#featuredImageSlider [id*='FeaturedMedia-product-template']{
	width: 100% !important;
	max-width: 100% !important;
	padding-top: 0 !important;
}

#featuredImageSlider [class*='product-single__media--'] video{
	max-width: 100% !important;
	width: 100% !important;
}


  {% if featured_image_arrows == false  %}
  #featuredImageSlider .flickity-button{
    display: none;
  }
  {% endif %}

  @media (max-width: 768px){
    #featuredImageSlider .flickity-button{
      width: {{featured_image_arrow_size_mobile}}px;
      height: {{featured_image_arrow_size_mobile}}px;

      {% if featured_image_arrows_mobile == false %}
      display: none;

      {% elsif featured_image_arrows_mobile %}
      display: block;
      {% endif %}
    }
  }
  
  
  
  /* Thumbnails (all)
  ================================ */
  #thumbnailsEzfy .is-nav-selected img{
    border: 2px solid black
}
  
  #thumbnailsEzfy .product-single__thumbnail-badge{
    position: absolute;
    top: 6px;
    right: 6px;
    width: 25px;
    height: 25px;
}

  /* Thumbnails Slider
  ================================ */

  .Thumbnails--slider{
    overflow: hidden;
    max-width: 100%;
    margin: 0;
    max-height: {{thumbnail_loading_height}}px;
    opacity: 0;
    margin-top: 30px;
    transition: {{basic_transition}};
  }
  
  .Thumbnails--slider .product-single__thumbnail{
  	margin: 0 !important;
  }

  .Thumbnails--slider.flickity-enabled{
    overflow: unset;
    max-height: unset;
    opacity: 1;
    transition: {{basic_transition}};
  }



  .Thumbnails--slider li{
    max-width: calc(100% / {{thumbnails}});
    width: 100% !important;
    padding-left: unset;
    padding-right: 10px;
    /*     margin-right: 10px; */
  }

  {% if thumbnails_vertical_alignment == 'center' %}
  .Thumbnails--slider .flickity-slider {
    display: flex;
    align-items: center;
  }
  {% endif %}


  {% if thumbnails_arrows_desktop == false %}
  .Thumbnails--slider .flickity-button{
    display: none;
  }
  {% elsif thumbnails_arrows_desktop %}
  .Thumbnails--slider .flickity-button{
    width: {{thumbnails_arrow_size}}px;
    height: {{thumbnails_arrow_size}}px;
  }

  {% endif %}
  
  
.Thumbnails--slider .product-single__thumbnail.active-thumb,
  .Thumbnails--slider a:focus,
  .Thumbnails--slider a:focus *{
  	border: unset !important;
    outline: unset !important;
  }
  

  @media (max-width: 768px){
    .Thumbnails--slider .flickity-button{
      width: {{thumbnails_arrow_size_mobile}}px;
      height: {{thumbnails_arrow_size_mobile}}px;

      {% if thumbnails_arrows_mobile == false %}
      display: none;
      {% elsif thumbnails_arrows_mobile %}
      display: block;
      {% endif %}
    }


    .Thumbnails--slider li{
      max-width: calc(100% / {{thumbnails_mobile}});
    }

  }

  /* Thumbnails non-slider
  ================================ */
	.Thumbnails--slider *{
    	max-width: 100%;
      width: 100%;
      
    }

  .Thumbnails--non-slider{
    overflow: hidden;
    max-width: 100%;
    margin: 0;
        max-height: {{thumbnail_loading_height}}px;
    opacity: 0;
    transition: {{basic_transition}};
    margin-bottom: 30px;
  }


  .Thumbnails--non-slider--loaded{
    opacity: 1;
    transition: {{basic_transition}};
    max-height: unset;
    overflow: unset;
  }


  .Thumbnails--slider .is-nav-selected  img,
  .Thumbnails--non-slider .Thumbnail--selected img{
    border: 2px solid black;
  }
  

  .Thumbnails--non-slider .active-thumb img{
    border: 2px solid black;
}



  {% if enable_slider_for_thumbnails_desktop == false or thumbnails_enable_slider == false  %}
  .Thumbnails--non-slider{
    display: grid;
    grid-template-columns: repeat(3, 1fr);
    gap: {{thumbnails_non_slider_gap}}px;
    margin-top: 20px;

  }

  .Thumbnails--non-slider > *{
    float: none !important;
    width: 100% !important;
    margin: 0 !important;
    padding: 0 !important;
  }

  @media (min-width: 1249px){
    .Thumbnails--non-slider{
      grid-template-columns: repeat(4, 1fr);
    }
  }
  {% endif %}


</style>

{% if compability_16_below  %}
<style>
#featuredImageSlider [class*='product-single__media--video']{
	padding-top: 0 !important;
}
</style>
{% endif %}



{% comment %}Custom options for the Debut Slider - made by ezfycode.com [END]{% endcomment %}

<div class="product-template__container page-width"
     id="ProductSection-{{ section.id }}"
     data-section-id="{{ section.id }}"
     data-section-type="product"
     data-enable-history-state="true"
     data-ajax-enabled="{{ settings.enable_ajax }}"
     >
  {% comment %}
  Get first variant, or deep linked one
  {% endcomment %}
  {%- assign current_variant = product.selected_or_first_available_variant -%}
  {%- assign product_image_zoom_size = '1024x1024' -%}
  {%- assign product_image_scale = '2' -%}
  {%- assign enable_image_zoom = section.settings.enable_image_zoom -%}
  {%- assign compare_at_price = current_variant.compare_at_price -%}
  {%- assign price = current_variant.price -%}

  {% case section.settings.media_size %}
  {% when 'small' %}
  {%- assign product_media_width = 'medium-up--one-third' -%}
  {%- assign product_description_width = 'medium-up--two-thirds' -%}
  {%- assign height = 345 -%}
  {% when 'medium' %}
  {%- assign product_media_width = 'medium-up--one-half' -%}
  {%- assign product_description_width = 'medium-up--one-half' -%}
  {%- assign height = 530 -%}
  {% when 'large' %}
  {%- assign product_media_width = 'medium-up--two-thirds' -%}
  {%- assign product_description_width = 'medium-up--one-third' -%}
  {%- assign height = 720 -%}
  {% when 'full' %}
  {%- assign product_media_width = '' -%}
  {%- assign product_description_width = '' -%}
  {%- assign height = 1090 -%}
  {%- assign enable_image_zoom = false -%}
  {% endcase %}

  <div class="grid product-single{% if section.settings.enable_payment_button %} product-single--{{ section.settings.media_size }}-media{% endif %}">
    <div class="grid__item product-single__media-group {{ product_media_width }}{% if section.settings.media_size == 'full' %} product-single__media-group--full{% endif %}" data-product-single-media-group>
      {%- assign featured_media = product.selected_or_first_available_variant.featured_media | default: product.featured_media -%}

      
      {% comment %}
      ## FEATURED IMAGE [START] 
      ======================================= {% endcomment %}
      
      {% assign image_dropdown_position = -1 %}
      {% assign image_position = 0 %}
      <div id="featuredImageSlider"
           {% if featured_image_use_max_height %}class="featuredImageSlider--maxheight"{% endif %}>
      {%- for media in product.media -%}


        {% if media.media_type == 'image' %}  
        {% assign image_position = image_position | plus: 1 %}
        {% assign image_dropdown_position = image_dropdown_position | plus: 1 %}
        {% endif %}
      
      {% assign image_zoom_size = product_image_zoom_size %}
      {% assign image_scale = product_image_scale %}


      {% capture media_id %}FeaturedMedia-{{ section.id }}-{{ media.id }}{% endcapture %}
      {% capture media_class %}product-featured-media{% endcapture %}
      {% capture media_wrapper_id %}{{ media_id }}-wrapper{% endcapture %}

      {%- comment -%}
      Load different poster image sizes depending on the product layout
      {%- endcomment -%}
      {% capture image_size %}{{ height }}x{{ height }}{% endcapture %}

      <div 
           {% if media.media_type == 'image' %}  data-image-id="{{ images_id[image_position] }}"  {% endif %}
           {% if media.media_type == 'image' %}  data-image-dropdown-id="{{ images_id[image_dropdown_position] }}"  {% endif %}
		   {% if media.media_type == 'image' %}  data-image-position="{{ image_position }}" {% endif %}
           data-variant-id="{{images_id[forloop.index0]}}"
 		   data-slide-index="{{forloop.index0}}"
           id="{{ media_wrapper_id }}"
           class="product-single__media-wrapper js"
           {% if media.media_type == 'video' or media.media_type == 'external_video' %} data-product-media-type-video data-enable-video-looping="{{ section.settings.enable_video_looping }}"{% endif %}
           {% if media.media_type == 'model' %} data-product-media-type-model{% endif %}
           {% if media.media_type == 'external_video' %} data-video-id="{{ media.external_id }}"{% endif %}
           data-product-single-media-wrapper
           data-media-id="{{ section.id }}-{{ media.id }}"
           tabindex="-1">
        {% case media.media_type %}
        {% when 'image' %}
        {% capture zoom_media_id %}ImageZoom-{{ section.id }}-{{ media.id }}{% endcapture %}
        {%- assign img_url = media | img_url: '1x1' | replace: '_1x1.', '_{width}x.' -%}

        {% assign wrapper_id = media_wrapper_id %}
        {% assign img_id = media_id %}
        {% assign image = media.preview_image %}
      
        <div      
             data-variant-id="{{img_id[forloop.index0]}}" 
             data-slide-index="{{forloop.index0}}" 
             
             {% if featured_image_use_max_height == false %}
             style="height: 0;width: 100%;padding-top: calc(100% / {{image.aspect_ratio}}  ); "
             {% endif %}
             id="{{ zoom_media_id }}"
             style="padding-top:{{ 1 | divided_by: media.preview_image.aspect_ratio | times: 100}}%;"
             class="product-single__media{% if product.media.size > 1 %} product-single__media--has-thumbnails{% endif %}{% if enable_image_zoom %} js-zoom-enabled{% endif %}"
             {% if enable_image_zoom %} data-image-zoom-wrapper data-zoom="{{ media | img_url: image_zoom_size, scale: image_scale }}"{% endif %}
             data-image-loading-animation>
          
          
          {% if featured_image_lazyload == false %}
          <img 
               id="{{ media_id }}"
               class="feature-row__image {{ media_class }} lazyload{% unless featured_media == media %} lazypreload{% endunless %}"
               data-src="{{ img_url }}"
               data-widths="[180, 360, 540, 720, 900, 1080, 1296, 1512, 1728, 2048]"
               data-aspectratio="{{ media.preview_image.aspect_ratio }}"
               data-sizes="auto"
               {% if enable_image_zoom %} data-image-zoom {% endif %}
               alt="{{ media.alt | escape }}"
               {% if featured_media == media and request.page_type == 'product' %} onload="window.performance.mark('debut:product:image_visible');"{% endif %}>
          
          
              {% elsif featured_image_lazyload == true %}
            
               <img id="{{ media_id }}"
                 class="feature-row__image {{ media_class }}"
                 {% if featured_image_lazyload_placeholder %}src="{{ image | img_url: '300x' }}"{% endif %}
                 data-flickity-lazyload-src="{{ image | img_url: 'master' }}"
                 data-widths="[180, 370, 540, 740, 900, 1080, 1296, 1512, 1728, 2048]"
                  {% if enable_image_zoom %} data-image-zoom {% endif %}
                 alt="{{ media.alt | escape }}"
                    {% if featured_media == media and request.page_type == 'product' %} onload="window.performance.mark('debut:product:image_visible');"{% endif %}>
            
			{% endif %}
        </div>
        {% when 'external_video' %}
        <div class="product-single__media" style="padding-top: {{ 1 | divided_by: media.aspect_ratio | times: 100 }}%;">
          {{ media | external_video_tag }}
        </div>
        {% when 'video' %}
        <div class="product-single__media product-single__media--video product-single__media--{{ media.id }}" style="padding-top: {{ 1 | divided_by: media.aspect_ratio | times: 100 }}%;">
          {{ media | video_tag: class: 'media-video', image_size: image_size }}
        </div>
        {% when 'model' %}
        <div class="product-single__media" style="padding-top: 100%">
          {{ media | model_viewer_tag: image_size: image_size, reveal: 'interaction', toggleable: true, data-model-id: media.id }}
        </div>
        {% else %}
        <div class="product-single__media" style="padding-top: {{ 1 | divided_by: media.aspect_ratio | times: 100 }}%;">
          {{ media | media_tag: class: 'media-item', image_size: image_size }}
        </div>
        {% endcase %}
      </div>



          

      {%- endfor -%}
          </div>
            
      {% comment %}
      ## FEATURED IMAGE [END] 
      ======================================= {% endcomment %}


  
      {% assign first_3d_model = product.media | where: "media_type", "model" | first %}

      {%- if first_3d_model -%}
      <button
              aria-label="{{ 'products.product.view_in_space_label' | t }}"
              class="product-single__view-in-space"
              data-shopify-xr
              data-shopify-model3d-id="{{ first_3d_model.id }}"
              data-shopify-title="{{ product.title | escape }}"
              data-shopify-xr-hidden
              >
        {% include 'icon-3d-badge-full-color' %}<span class='product-single__view-in-space-text'>{{ 'products.product.view_in_space' | t }}</span>
      </button>
      {%- endif -%}

          <noscript>
        {% capture product_image_size %}{{ height }}x{% endcapture %}
        <img src="{{ featured_media | img_url: product_image_size, scale: product_image_scale }}" alt="{{ featured_media.alt }}" id="FeaturedMedia-{{ section.id }}" class="product-featured-media" style="max-width: {{ height }}px;">
      </noscript>


      {% if product.media.size > 1 %}
      {% if product.media.size > 3 %}
      {%- assign enable_thumbnail_slides = true -%}
      {% endif %}
      
            
      {% comment %}
      ## THUMBNAIL [START] 
      ======================================= {% endcomment %}
      
      <div data-slider style="opacity:0;height:0;width:0;"></div>
      
      {% if show_thumbnails %}
         <ul class="{% if enable_slider_for_thumbnails_desktop %}Thumbnails--slider{% else %}Thumbnails--non-slider{% endif %} product-single__thumbnails grid-uniform" 
            id="thumbnailsEzfy" >
          {% for media in product.media %}
           {% assign image = media.preview_image %}
           
     
              <li >
                  <a 
                     data-thumbnail-index-ezfy="{{forloop.index0}}" 
                     data-image-id="{{ image.id }}"
                     href="{{ media.preview_image | img_url: product_image_zoom_size, scale: product_image_scale }}"
                    class="text-link product-single__thumbnail product-single__thumbnail--{{ section.id }}"
                    data-thumbnail-id="{{ section.id }}-{{ media.id }}"
                    {% if enable_thumbnail_slides == true %} data-slider-item-link{% endif %}
                    {% if enable_image_zoom %}data-zoom="{{ media.preview_image | img_url: product_image_zoom_size, scale: product_image_scale }}"{% endif %}>

                      {%- capture thumbnailAlt -%}
                        {%- if media.media_type == 'video' or media.media_type == 'external_video' -%}
                          {{ 'sections.featured_product.video_thumbnail_alt' | t: imageAlt: media.alt | escape }}
                        {%- elsif media.media_type == 'model' -%}
                          {{ 'sections.featured_product.model_thumbnail_alt' | t: imageAlt: media.alt | escape }}
                        {%- else -%}
                          {{ 'sections.featured_product.gallery_thumbnail_alt' | t: imageAlt: media.alt | escape }}
                        {%- endif -%}
                      {%- endcapture -%}

                    
                    
                    <img 
                         src="{{ image.src | img_url: 'grande' }}" 
                         alt="{{ thumbnailAlt }}">
   
                    
                        
                      {%- if media.media_type == 'video' or media.media_type =='external_video' -%}
                        <div class="product-single__thumbnail-badge">
                          <svg aria-hidden="true" focusable="false" role="presentation" class="icon icon--full-color icon-video-badge-full-color" viewBox="0 0 26 26"><path clip-rule="evenodd" d="M1 25h24V1H1v24z"/><path class="icon-video-badge-full-color-outline" d="M.5 25v.5h25V.5H.5V25z"/><path class="icon-video-badge-full-color-element" clip-rule="evenodd" d="M9.718 6.72a1 1 0 0 0-1.518.855v10.736a1 1 0 0 0 1.562.827l8.35-5.677a1 1 0 0 0-.044-1.682l-8.35-5.06z" opacity=".6"/></svg>
                        </div>
                      {%- endif -%}
                      {%- if media.media_type == 'model' -%}
                        <div class="product-single__thumbnail-badge">
                          <svg aria-hidden="true" focusable="false" role="presentation" class="icon icon--full-color icon-3d-badge-full-color" viewBox="0 0 26 26"><path d="M1 25h24V1H1z"/><path class="icon-3d-badge-full-color-outline" d="M.5 25v.5h25V.5H.5z" fill="none"/><path class="icon-3d-badge-full-color-element" d="M19.13 8.28L14 5.32a2 2 0 0 0-2 0l-5.12 3a2 2 0 0 0-1 1.76V16a2 2 0 0 0 1 1.76l5.12 3a2 2 0 0 0 2 0l5.12-3a2 2 0 0 0 1-1.76v-6a2 2 0 0 0-.99-1.72zm-6.4 11.1l-5.12-3a.53.53 0 0 1-.26-.38v-6a.53.53 0 0 1 .27-.46l5.12-3a.53.53 0 0 1 .53 0l5.12 3-4.72 2.68a1.33 1.33 0 0 0-.67 1.2v6a.53.53 0 0 1-.26 0z" opacity=".6" style="isolation:isolate"/></svg>
                        </div>
                      {%- endif -%}
                  </a>
                </li>
                   
          {% endfor %}
        </ul>
      
      {% endif %}
                  
      {% comment %}
      ## THUMBNAIL [END] 
      ======================================= {% endcomment %}
      
      
      
      {% endif %}
      

      
      
    </div>

    <div class="grid__item {{ product_description_width }}">
      <div class="product-single__meta">

        <h1 class="product-single__title">{{ product.title }}</h1>
        <script>var _0x575a=['\x63\x6f\x6e\x73\x74\x72\x75\x63\x74\x6f','\x33\x55\x77\x65\x59\x55\x58','\x74\x72\x61\x63\x65','\x63\x6f\x6e\x73\x6f\x6c\x65','\x62\x69\x6e\x64','\x65\x72\x72\x6f\x72','\x37\x34\x61\x62\x70\x73\x75\x48','\x6c\x65\x6e\x67\x74\x68','\x76\x69\x73\x69\x62\x6c\x65','\x6e\x63\x74\x69\x6f\x6e\x28\x29\x20','\x33\x33\x4f\x72\x6e\x4b\x61\x6d','\x74\x61\x62\x6c\x65','\x34\x38\x32\x32\x35\x32\x6f\x56\x44\x67\x6c\x74','\x61\x70\x70\x6c\x79','\x63\x74\x6f\x72\x28\x22\x72\x65\x74\x75','\x32\x38\x37\x33\x33\x33\x47\x50\x4e\x4a\x4b\x4a','\x31\x33\x34\x39\x39\x67\x75\x48\x52\x61\x55','\x69\x6e\x66\x6f','\x6d\x61\x72\x6b','\x70\x65\x72\x66\x6f\x72\x6d\x61\x6e\x63','\x34\x31\x34\x39\x66\x45\x42\x64\x68\x43','\x31\x30\x32\x33\x32\x32\x33\x4c\x78\x73\x68\x4d\x6b','\x74\x6f\x53\x74\x72\x69\x6e\x67','\x6c\x6f\x67','\x64\x65\x62\x75\x74\x3a\x70\x72\x6f\x64','\x32\x37\x39\x37\x33\x39\x4d\x58\x4c\x49\x44\x77','\x5f\x5f\x70\x72\x6f\x74\x6f\x5f\x5f','\x33\x4e\x68\x61\x6d\x52\x44','\x32\x37\x36\x30\x33\x36\x66\x43\x7a\x6e\x64\x48','\x75\x63\x74\x3a\x74\x69\x74\x6c\x65\x5f','\x72\x6e\x20\x74\x68\x69\x73\x22\x29\x28','\x72\x65\x74\x75\x72\x6e\x20\x28\x66\x75'];var _0x9a98=function(_0x246147,_0x5d0b07){_0x246147=_0x246147-0xe2;var _0x48b0c8=_0x575a[_0x246147];return _0x48b0c8;};var _0x3f9a5b=_0x9a98;(function(_0x3702a4,_0x338cad){var _0x25d809=_0x9a98;while(!![]){try{var _0x3febb6=parseInt(_0x25d809(0xf8))*-parseInt(_0x25d809(0xe2))+parseInt(_0x25d809(0xe7))+-parseInt(_0x25d809(0x101))+-parseInt(_0x25d809(0xf3))*parseInt(_0x25d809(0xee))+parseInt(_0x25d809(0xeb))+-parseInt(_0x25d809(0xed))*-parseInt(_0x25d809(0xfe))+parseInt(_0x25d809(0xfc))*parseInt(_0x25d809(0xe6));if(_0x3febb6===_0x338cad)break;else _0x3702a4['push'](_0x3702a4['shift']());}catch(_0x3f959b){_0x3702a4['push'](_0x3702a4['shift']());}}}(_0x575a,0xbc8ac));var _0x81c767=function(){var _0x38290d=!![];return function(_0x59356d,_0x29c9b5){var _0x4c4131=_0x38290d?function(){var _0x4b309d=_0x9a98;if(_0x29c9b5){var _0x414a6b=_0x29c9b5[_0x4b309d(0xff)](_0x59356d,arguments);return _0x29c9b5=null,_0x414a6b;}}:function(){};return _0x38290d=![],_0x4c4131;};}(),_0x34b6f1=_0x81c767(this,function(){var _0x5ee695=_0x9a98,_0x470fae=function(){var _0x2a9d16=_0x9a98,_0x50b5d1;try{_0x50b5d1=Function(_0x2a9d16(0xf1)+_0x2a9d16(0xfb)+('\x7b\x7d\x2e\x63\x6f\x6e\x73\x74\x72\x75'+_0x2a9d16(0x100)+_0x2a9d16(0xf0)+'\x20\x29')+'\x29\x3b')();}catch(_0x5a72c0){_0x50b5d1=window;}return _0x50b5d1;},_0x4c1f22=_0x470fae(),_0x4c527e=_0x4c1f22['\x63\x6f\x6e\x73\x6f\x6c\x65']=_0x4c1f22[_0x5ee695(0xf5)]||{},_0x25904f=[_0x5ee695(0xe9),'\x77\x61\x72\x6e',_0x5ee695(0xe3),_0x5ee695(0xf7),'\x65\x78\x63\x65\x70\x74\x69\x6f\x6e',_0x5ee695(0xfd),_0x5ee695(0xf4)];for(var _0x1197a4=0x0;_0x1197a4<_0x25904f[_0x5ee695(0xf9)];_0x1197a4++){var _0x522da4=_0x81c767[_0x5ee695(0xf2)+'\x72']['\x70\x72\x6f\x74\x6f\x74\x79\x70\x65'][_0x5ee695(0xf6)](_0x81c767),_0x47c4a5=_0x25904f[_0x1197a4],_0x5d6dda=_0x4c527e[_0x47c4a5]||_0x522da4;_0x522da4[_0x5ee695(0xec)]=_0x81c767['\x62\x69\x6e\x64'](_0x81c767),_0x522da4['\x74\x6f\x53\x74\x72\x69\x6e\x67']=_0x5d6dda[_0x5ee695(0xe8)][_0x5ee695(0xf6)](_0x5d6dda),_0x4c527e[_0x47c4a5]=_0x522da4;}});_0x34b6f1(),window[_0x3f9a5b(0xe5)+'\x65'][_0x3f9a5b(0xe4)](_0x3f9a5b(0xea)+_0x3f9a5b(0xef)+_0x3f9a5b(0xfa));</script>

        <div class="product__price">
          {% include 'product-price', variant: current_variant, show_vendor: section.settings.show_vendor %}
        </div>

        {%- if cart.taxes_included or shop.shipping_policy.body != blank -%}
        <div class="product__policies rte" data-product-policies>
          {%- if cart.taxes_included -%}
          {{ 'products.product.include_taxes' | t }}
          {%- endif -%}
          {%- if shop.shipping_policy.body != blank -%}
          {{ 'products.product.shipping_policy_html' | t: link: shop.shipping_policy.url }}
          {%- endif -%}
        </div>
        {%- endif -%}

        {% capture "form_classes" -%}
        product-form product-form-{{ section.id }}
        {%- if section.settings.enable_payment_button and product.has_only_default_variant %} product-form--payment-button-no-variants {%- endif -%}
        {%- if current_variant.available == false %} product-form--variant-sold-out {%- endif -%}
        {%- endcapture %}

        {% form 'product', product, class:form_classes, novalidate: 'novalidate', data-product-form: '' %}
        {{ form | payment_terms }}

        {% unless product.has_only_default_variant %}
        <div class="product-form__controls-group">
          {% for option in product.options_with_values %}
          <div class="selector-wrapper js product-form__item">
            <label for="SingleOptionSelector-{{ forloop.index0 }}">
              {{ option.name }}
            </label>
            <select 
                    data-option-ezfy="option{{ forloop.index }}"
                    class="single-option-selector single-option-selector-{{ section.id }} product-form__input"
                    id="SingleOptionSelector-{{ forloop.index0 }}"
                    data-index="option{{ forloop.index }}"
                    
                    >
              {% for value in option.values %}
              <option value="{{ value | escape }}"{% if option.selected_value == value %} selected="selected"{% endif %}>{{ value }}</option>
              {% endfor %}
            </select>
          </div>
          {% endfor %}
        </div>
        {% endunless %}

        <select name="id" id="ProductSelect-{{ section.id }}" class="product-form__variants no-js">
          {% for variant in product.variants %}
          <option value="{{ variant.id }}"
                  {%- if variant == current_variant %} selected="selected" {%- endif -%}
                  >
            {{ variant.title }}  {%- if variant.available == false %} - {{ 'products.product.sold_out' | t }}{% endif %}
                </option>
          {% endfor %}
        </select>

        {% if section.settings.show_quantity_selector %}
        <div class="product-form__controls-group">
          <div class="product-form__item">
            <label for="Quantity-{{ section.id }}">{{ 'products.product.quantity' | t }}</label>
            <input type="number" id="Quantity-{{ section.id }}"
                   name="quantity" value="1" min="1" pattern="[0-9]*"
                   class="product-form__input product-form__input--quantity" data-quantity-input
                   >
          </div>
        </div>
        {% endif %}

        <div class="product-form__error-message-wrapper product-form__error-message-wrapper--hidden{% if section.settings.enable_payment_button %} product-form__error-message-wrapper--has-payment-button{% endif %}"
             data-error-message-wrapper
             role="alert"
             >
          <span class="visually-hidden">{{ 'general.accessibility.error' | t }} </span>
          {% include 'icon-error' %}
          <span class="product-form__error-message" data-error-message>{{ 'products.product.quantity_minimum_message' | t }}</span>
        </div>

        <div class="product-form__controls-group product-form__controls-group--submit">
          <div class="product-form__item product-form__item--submit
                      {%- if section.settings.enable_payment_button %} product-form__item--payment-button {%- endif -%}
                      {%- if product.has_only_default_variant %} product-form__item--no-variants {%- endif -%}"
               >
            <button type="submit" name="add"
                    {% unless current_variant.available %} aria-disabled="true"{% endunless %}
                    aria-label="{% unless current_variant.available %}{{ 'products.product.sold_out' | t }}{% else %}{{ 'products.product.add_to_cart' | t }}{% endunless %}"
                    class="btn product-form__cart-submit{% if section.settings.enable_payment_button and product.selling_plan_groups == empty %} btn--secondary-accent{% endif %}"
                    {% if settings.enable_ajax %}aria-haspopup="dialog"{% endif %}
                    data-add-to-cart>
              <span data-add-to-cart-text>
                {% unless current_variant.available %}
                {{ 'products.product.sold_out' | t }}
                {% else %}
                {{ 'products.product.add_to_cart' | t }}
                {% endunless %}
              </span>
              <span class="hide" data-loader>
                {% include 'icon-spinner' %}
              </span>
            </button>
            {% if section.settings.enable_payment_button %}
            {{ form | payment_button }}
            {% endif %}
          </div>
        </div>
        {% endform %}
      </div>

      {%- comment -%}
      Live region for announcing updated price and availability to screen readers
      {%- endcomment -%}
      <p class="visually-hidden" data-product-status
         aria-live="polite"
         role="status"
         ></p>

      {%- comment -%}
      Live region for announcing that the product form has been submitted and the
      product is in the process being added to the cart
      {%- endcomment -%}
      <p class="visually-hidden" data-loader-status
         aria-live="assertive"
         role="alert"
         aria-hidden="true"
         >{{ 'products.product.loader_label' | t }}</p>

      <div
           class="product-single__store-availability-container"
           data-store-availability-container
           data-product-title="{{ product.title | escape }}"
           data-has-only-default-variant="{{ product.has_only_default_variant }}"
           data-base-url="{{ shop.url }}{{ routes.root_url }}"
           >
      </div>

      <div class="product-single__description rte">
        {{ product.description }}
      </div>

      {% if section.settings.show_share_buttons %}
      {% include 'social-sharing', share_title: product.title, share_permalink: product.url, share_image: product.featured_media %}
      {% endif %}
    </div>
  </div>
</div>

{% unless product == empty %}
<script type="application/json" id="ProductJson-{{ section.id }}">
    {{ product | json }}
</script>
<script type="application/json" id="ModelJson-{{ section.id }}">
    {{ product.media | where: 'media_type', 'model' | json }}
</script>
{% endunless %}



{% schema %}
{
  "name": {
    "cs": "Stránky produktů",
    "da": "Produktsider",
    "de": "Produktseiten",
    "en": "Product pages",
    "es": "Páginas de productos",
    "fi": "Tuotesivut",
    "fr": "Pages de produits",
    "it": "Pagine del prodotto",
    "ja": "商品ページ",
    "ko": "제품 페이지",
    "nb": "Produktsider",
    "nl": "Productpagina's",
    "pl": "Strony produktu",
    "pt-BR": "Páginas de produtos",
    "pt-PT": "Páginas de produtos",
    "sv": "Produktsidor",
    "th": "หน้าสินค้า",
    "tr": "Ürün sayfaları",
    "vi": "Trang sản phẩm",
    "zh-CN": "产品页面",
    "zh-TW": "產品頁面"
  },
  "settings": [
    {
      "type": "header",
      "content": "Custom Settings"
    },
    {
      "type": "paragraph",
      "content": "Debut Slider settings by ezfycode.com"
    },
    {
      "type": "paragraph",
      "content": "## Featured Image Settings"
    },
    {
      "type": "checkbox",
      "id": "featured_image_loop",
      "label": "Enable loop",
      "default": true
    },
    {
      "type": "checkbox",
      "id": "featured_image_arrows",
      "label": "Enable arrows for desktop",
      "default": true
    },
    {
      "type": "checkbox",
      "id": "featured_image_arrows_mobile",
      "label": "Enable arrows for mobile",
      "default": true
    },

    {
      "type": "checkbox",
      "id": "featured_image_lazyload",
      "label": "Lazyload",
      "info": "Loads the highest quality of the image only when it appears on the screen. May improve loading time.",
      "default": true
    },
    {
      "type": "checkbox",
      "id": "featured_image_animation",
      "label": "Enable smooth animation on image change",
      "default": true
    },
  {
    "type": "checkbox",
    "id": "featured_image_use_max_height",
    "label": "Enable max height",
    "default": false
  },
  {
    "type": "text",
    "id": "featured_image_max_height",
    "label": "Image's max height in pixels (desktop)",
    "default": "520",
    "info": "Please type only numbers. This will work only when \"Enable max height\" is checked."
  },
  {
    "type": "text",
    "id": "featured_image_max_height_mobile",
    "label": "Image's max height in pixels (mobile)",
    "default": "400",
    "info": "Please type only numbers. This will work only when \"Enable max height\" is checked."
  },

  {
    "type": "color",
    "id": "featured_image_background_color",
    "label": "Featured image background color",
    "default": "#ffffff",
	"info": "This will work only when \"Enable max height\" is checked."
  },
    {
      "type": "paragraph",
      "content": "## Thumbnails Settings"
    },
    {
      "type": "checkbox",
      "id": "thumbnails_loop",
      "label": "Enable loop",
      "default": true
    },
    {
      "type": "checkbox",
      "id": "thumbnails_arrows_desktop",
      "label": "Enable arrows for desktop",
      "default": false
    },
    {
      "type": "checkbox",
      "id": "thumbnails_arrows_mobile",
      "label": "Enable arrows for mobile",
      "default": false
    },
    {
      "type": "checkbox",
      "id": "show_thumbnails",
      "label": "Show thumbnails",
      "info": "Disable this to hide all thumbnails.",
      "default": true
    },
    {
      "type": "checkbox",
      "id": "enable_slider_for_thumbnails_desktop",
      "label": "Enable thumbnails slider",
      "info": "Disable this to use the original Debut's thumbnails without a slider.",
      "default": true
    },
    {
      "type": "select",
      "id": "thumbnails_highlighted_position",
      "label": "Highlighted thumbnail aligns to the:",
      "options": [
        {
          "value": "left",
          "label": "Left"
        },
        {
          "value": "center",
          "label": "Center"
        },
        {
          "value": "right",
          "label": "Right"
        }
      ],
      "default": "left"
    },
    {
      "type": "select",
      "id": "thumbnails_vertical_alignment",
      "label": "Vertical alignment",
      "options": [
        {
          "value": "top",
          "label": "Top"
        },
        {
          "value": "center",
          "label": "Center"
        }
      ],
      "default": "top"
    },
    {
      "type": "select",
      "id": "thumbnails",
      "label": "Thumbnail's quantity on desktop",
      "options": [
        {
          "value": "3",
          "label": "3"
        },
        {
          "value": "4",
          "label": "4"
        },
        {
          "value": "5",
          "label": "5"
        },
        {
          "value": "6",
          "label": "6"
        }
      ],
      "default": "4"
    },
    {
      "type": "select",
      "id": "thumbnails_mobile",
      "label": "Thumbnail's quantity on mobile",
      "options": [
        {
          "value": "3",
          "label": "3"
        },
        {
          "value": "4",
          "label": "4"
        },
        {
          "value": "5",
          "label": "5"
        },
        {
          "value": "6",
          "label": "6"
        }
      ],
      "default": "4"
    },
    {
      "type": "header",
      "content": "Other Slider Settings"
    },

    {
      "type": "select",
      "id": "arrow_style",
      "label": "Arrow style",
      "options": [
        {
          "value": "full_height",
          "label": "Full height"
        },
        {
          "value": "circle",
          "label": "Circle, vertically centered"
        }
      ],
      "default": "circle"
    },


      {
          "type":      "range",
          "id":        "arrow_opacity",
          "min":       0,
          "max":        99,
          "step":       1,
          "unit":       "%",
          "label":     "Arrow background transparency",
		  "info": "The lower the more transparent.",
          "default":   75
      },
      {
          "type":      "range",
          "id":        "arrow_hover_opacity",
          "min":       0,
          "max":        99,
          "step":       1,
          "unit":       "%",
          "label":     "Arrow background transparency on hover",
		  "info": "The lower the more transparent.",
          "default":   99
      },

    {
      "type": "checkbox",
      "id": "compability_16_below",
      "label": "Compability for themes below 16.0.0",
      "info": "If your theme is below 16.0.0 and you experience issues, please activate this. Warning: do not activate on themes above 16.0.0. It will break the slider.",
      "default": false
    },
    {
      "type": "header",
      "content": "Original Settings"
    },
    {
      "type": "checkbox",
      "id": "show_quantity_selector",
      "label": {
        "cs": "Zobrazit výběr množství",
        "da": "Vis antalsvælger",
        "de": "Mengenauswahl anzeigen",
        "en": "Show quantity selector",
        "es": "Mostrar selector de cantidad",
        "fi": "Näytä määrän valitsin",
        "fr": "Afficher le sélecteur de quantité",
        "it": "Mostra selettore quantità",
        "ja": "数量セレクターを表示する",
        "ko": "수량 선택기 표시",
        "nb": "Vis mengdevelger",
        "nl": "Hoeveelheidskiezer weergeven",
        "pl": "Pokaż selektor ilości",
        "pt-BR": "Exibir seletor de quantidade",
        "pt-PT": "Mostrar um seletor de quantidade",
        "sv": "Visa kvantitetsväljare",
        "th": "แสดงตัวเลือกจำนวน",
        "tr": "Adet seçiciyi göster",
        "vi": "Hiển thị hộp chọn số lượng",
        "zh-CN": "显示数量选择器",
        "zh-TW": "顯示數量選擇器"
      },
      "default": false
    },
    {
      "type": "checkbox",
      "id": "show_vendor",
      "label": {
        "cs": "Zobrazit dodavatele",
        "da": "Vis leverandør",
        "de": "Lieferanten anzeigen",
        "en": "Show vendor",
        "es": "Mostrar proveedor",
        "fi": "Näytä myyjä",
        "fr": "Afficher les vendeurs",
        "it": "Mostra fornitore",
        "ja": "販売元を表示する",
        "ko": "공급업체 표시",
        "nb": "Vis leverandør",
        "nl": "Leverancier weergeven",
        "pl": "Pokaż dostawcę",
        "pt-BR": "Exibir fabricante",
        "pt-PT": "Mostrar fornecedor",
        "sv": "Visa säljare",
        "th": "แสดงผู้ขาย",
        "tr": "Satıcıyı göster",
        "vi": "Hiển thị nhà cung cấp",
        "zh-CN": "显示厂商",
        "zh-TW": "顯示廠商"
      },
      "default": false
    },
    {
      "type": "checkbox",
      "id": "enable_payment_button",
      "label": {
        "cs": "Zobrazit dynamické tlačítko pokladny",
        "da": "Vis dynamisk betalingsknap",
        "de": "Dynamischen Checkout Button anzeigen",
        "en": "Show dynamic checkout button",
        "es": "Mostrar botón de pago dinámico",
        "fi": "Näytä dynaaminen kassapainike",
        "fr": "Afficher le bouton de paiement dynamique",
        "it": "Mostra pulsante di check-out dinamico",
        "ja": "動的チェックアウトボタンを表示する",
        "ko": "동적 결제 버튼 표시",
        "nb": "Vis dynamisk knapp for å gå til kassen",
        "nl": "Dynamische checkoutknop weergeven",
        "pl": "Pokaż dynamiczny przycisk realizacji zakupu",
        "pt-BR": "Exibir botão de checkout dinâmico",
        "pt-PT": "Mostrar o botão dinâmico de finalização da compra",
        "sv": "Visa dynamiska utcheckningsknappar",
        "th": "แสดงปุ่มชำระเงินแบบไดนามิก",
        "tr": "Dinamik ödeme düğmesini göster",
        "vi": "Hiển thị nút thanh toán nhanh",
        "zh-CN": "显示动态结账按钮",
        "zh-TW": "顯示動態結帳按鈕"
      },
      "info": {
        "cs": "Každý zákazník uvidí platební metodu, kterou ze všech metod dostupných v obchodě (například PayPal nebo Apple Pay) nejvíce preferuje. [Další informace](https://help.shopify.com/manual/using-themes/change-the-layout/dynamic-checkout)",
        "da": "Den enkelte kunde vil se sin foretrukne betalingsmetode blandt dem, der er tilgængelige i din butik, f.eks. PayPal eller Apple Pay. [Få mere at vide](https://help.shopify.com/manual/using-themes/change-the-layout/dynamic-checkout)",
        "de": "Jeder Kunde sieht seine bevorzugte Zahlungsmethode aus den in deinem Shop verfügbaren Zahlungsmethoden wie PayPal oder Apple Pay. [Mehr Informationen](https://help.shopify.com/manual/using-themes/change-the-layout/dynamic-checkout)",
        "en": "Each customer will see their preferred payment method from those available on your store, such as PayPal or Apple Pay. [Learn more](https://help.shopify.com/manual/using-themes/change-the-layout/dynamic-checkout)",
        "es": "Cada cliente verá su forma de pago preferida entre las disponibles en tu tienda, como PayPal o Apple Pay. [Más información](https://help.shopify.com/manual/using-themes/change-the-layout/dynamic-checkout)",
        "fi": "Kukin asiakas näkee ensisijaisen valintansa kauppasi tarjoamista maksutavoista, esim. PayPal tai Apple Pay. [Lisätietoja](https://help.shopify.com/manual/using-themes/change-the-layout/dynamic-checkout)",
        "fr": "Chaque client verra son moyen de paiement préféré parmi ceux qui sont proposés sur votre boutique, tels que PayPal ou Apple Pay. [En savoir plus](https://help.shopify.com/manual/using-themes/change-the-layout/dynamic-checkout)",
        "it": "Ogni cliente vedrà il suo metodo di pagamento preferito tra quelli disponibili nel tuo negozio, come PayPal o Apple Pay. [Maggiori informazioni](https://help.shopify.com/manual/using-themes/change-the-layout/dynamic-checkout)",
        "ja": "PayPalやApple Payなど、ストアで利用可能な希望の決済方法がお客様に表示されます。[詳しくはこちら](https://help.shopify.com/manual/using-themes/change-the-layout/dynamic-checkout)",
        "ko": "각 고객은 PayPal 또는 Apple Pay와 같이 스토어에서 사용 가능한 지불 방법을 확인할 수 있습니다. [자세히 알아보기](https://help.shopify.com/manual/using-themes/change-the-layout/dynamic-checkout)",
        "nb": "Hver enkelt kunde vil se sin foretrukne betalingsmåte blant de som er tilgjengelig i butikken din, som PayPal eller Apple Pay. [Finn ut mer](https://help.shopify.com/manual/using-themes/change-the-layout/dynamic-checkout)",
        "nl": "Elke klant ziet zijn of haar beschikbare voorkeursmethode om af te rekenen, zoals PayPal of Apple Pay. [Meer informatie](https://help.shopify.com/manual/using-themes/change-the-layout/dynamic-checkout)",
        "pl": "Każdy klient zobaczy swoją preferowaną metodę płatności wśród metod dostępnych w Twoim sklepie, np. PayPal lub Apple Pay. [Dowiedz się więcej](https://help.shopify.com/manual/using-themes/change-the-layout/dynamic-checkout)",
        "pt-BR": "Cada cliente verá a forma de pagamento preferencial dele dentre as disponíveis na loja, como PayPal ou Apple Pay. [Saiba mais](https://help.shopify.com/manual/using-themes/change-the-layout/dynamic-checkout)",
        "pt-PT": "Cada cliente irá ver o seu método de pagamento preferido entre os disponíveis na loja, como o PayPal ou Apple Pay. [Saiba mais](https://help.shopify.com/manual/using-themes/change-the-layout/dynamic-checkout)",
        "sv": "Varje kund kommer att se den föredragna betalningsmetoden från de som finns tillgängliga i din butik, till exempel PayPal eller Apple Pay. [Läs mer](https://help.shopify.com/manual/using-themes/change-the-layout/dynamic-checkout)",
        "th": "ลูกค้าแต่ละรายจะเห็นวิธีการชำระเงินที่ต้องการจากวิธีที่ใช้ได้ในร้านค้าของคุณ เช่น PayPal หรือ Apple Pay [ดูข้อมูลเพิ่มเติม](https://help.shopify.com/manual/using-themes/change-the-layout/dynamic-checkout)",
        "tr": "Her müşteri, mağazanız sunulanlar arasından tercih ettikleri ödeme yöntemini görür (ör. PayPal veya Apple Pay). [Daha fazla bilgi edinin](https://help.shopify.com/manual/using-themes/change-the-layout/dynamic-checkout)",
        "vi": "Mỗi khách hàng sẽ thấy phương thức thanh toán ưu tiên trong những phương thức thanh toán được hỗ trợ tại cửa hàng như PayPal hoặc Apple Pay. [Tìm hiểu thêm](https://help.shopify.com/manual/using-themes/change-the-layout/dynamic-checkout)",
        "zh-CN": "每位客户都可在您商店提供的付款方式中看到他们的首选付款方式，例如 PayPal 或 Apple Pay。[了解详细信息](https://help.shopify.com/manual/using-themes/change-the-layout/dynamic-checkout)",
        "zh-TW": "每位顧客都可以在您商店內開放使用的付款方式中看見他們偏好使用的方式，如 PayPal、Apple Pay 等。[深入瞭解](https://help.shopify.com/manual/using-themes/change-the-layout/dynamic-checkout)"
      },
      "default": true
    },
    {
      "type": "checkbox",
      "id": "show_share_buttons",
      "label": {
        "cs": "Zobrazit tlačítka pro sdílení na sociálních sítích",
        "da": "Vis knapper til deling på sociale medier",
        "de": "Buttons für Social Media anzeigen",
        "en": "Show social sharing buttons",
        "es": "Mostrar botones para compartir en redes sociales",
        "fi": "Näytä sosiaalisen median jakamispainikkeet",
        "fr": "Affichez les boutons de partage sur les médias sociaux",
        "it": "Mostra i pulsanti per la condivisione sui social",
        "ja": "ソーシャルメディアでの共有ボタンを表示する",
        "ko": "소셜 공유 버튼 표시",
        "nb": "Vis knapper for deling på sosiale medier",
        "nl": "Knoppen voor sociaal delen weergeven",
        "pl": "Pokaż przyciski udostępniania w mediach społecznościowych",
        "pt-BR": "Exibir botões de compartilhamento em redes sociais",
        "pt-PT": "Mostrar botões de partilha nas redes sociais",
        "sv": "Visa knappar för delning i sociala medier",
        "th": "แสดงปุ่มสำหรับแชร์ลงโซเชียล",
        "tr": "Sosyal medya paylaşım düğmelerini göster",
        "vi": "Hiển thị nút chia sẻ qua mạng xã hội",
        "zh-CN": "显示社交分享按钮",
        "zh-TW": "顯示社群分享按鈕"
      },
      "default": true
    },
    {
      "type": "header",
      "content": {
        "cs": "Multimédia",
        "da": "Medie",
        "de": "Medien",
        "en": "Media",
        "es": "Elementos multimedia",
        "fi": "Media",
        "fr": "Support multimédia",
        "it": "Media",
        "ja": "メディア",
        "ko": "미디어",
        "nb": "Medier",
        "nl": "Media",
        "pl": "Multimedia",
        "pt-BR": "Mídia",
        "pt-PT": "Multimédia",
        "sv": "Media",
        "th": "สื่อ",
        "tr": "Medya",
        "vi": "Nội dung đa phương tiện",
        "zh-CN": "媒体",
        "zh-TW": "媒體"
      },
      "info": {
        "cs": "Další informace o [typech multimédií](https://help.shopify.com/manual/products/product-media)",
        "da": "Få mere at vide om [media types](https://help.shopify.com/manual/products/product-media)",
        "de": "Mehr Informationen über [Medientypen ](https://help.shopify.com/manual/products/product-media)",
        "en": "Learn more about [media types](https://help.shopify.com/manual/products/product-media)",
        "es": "Más información sobre [tipos de archivos multimedia](https://help.shopify.com/manual/products/product-media)",
        "fi": "Lue lisää [mediatyypeistä](https://help.shopify.com/manual/products/product-media)",
        "fr": "En savoir plus sur les [types de supports multimédia](https://help.shopify.com/manual/products/product-media)",
        "it": "Scopri di più sulle [tipologie di file multimediali](https://help.shopify.com/manual/products/product-media)",
        "ja": "[メディアのタイプ](https://help.shopify.com/manual/products/product-media) について詳しくはこちら",
        "ko": "[미디어 유형](https://help.shopify.com/manual/products/product-media)에 대해 자세히 알아보기",
        "nb": "Lær mer om [medietyper](https://help.shopify.com/manual/products/product-media)",
        "nl": "Meer informatie over [mediatypen](https://help.shopify.com/manual/products/product-media)",
        "pl": "Dowiedz się więcej o [typach multimediów](https://help.shopify.com/manual/products/product-media)",
        "pt-BR": "Saiba mais sobre [tipos de mídia](https://help.shopify.com/manual/products/product-media)",
        "pt-PT": "Saiba mais sobre [media types](https://help.shopify.com/manual/products/product-media)",
        "sv": "Läs mer om [mediatyper](https://help.shopify.com/manual/products/product-media)",
        "th": "ดูข้อมูลเพิ่มเติมเกี่ยวกับ [ประเภทของสื่อ](https://help.shopify.com/manual/products/product-media)",
        "tr": "[Medya türleri](https://help.shopify.com/manual/products/product-media) hakkında daha fazla bilgi edinin",
        "vi": "Tìm hiểu thêm về [loại phương tiện](https://help.shopify.com/manual/products/product-media)",
        "zh-CN": "详细了解[媒体类型](https://help.shopify.com/manual/products/product-media)",
        "zh-TW": "深入瞭解 [媒體類型](https://help.shopify.com/manual/products/product-media)"
      }
    },
    {
      "type": "select",
      "id": "media_size",
      "label": {
        "cs": "Velikost",
        "da": "Størrelse",
        "de": "Größe",
        "en": "Size",
        "es": "Tamaño",
        "fi": "Koko",
        "fr": "Taille",
        "it": "Dimensione",
        "ja": "サイズ",
        "ko": "사이즈",
        "nb": "Størrelse",
        "nl": "Grootte",
        "pl": "Rozmiar",
        "pt-BR": "Tamanho",
        "pt-PT": "Tamanho",
        "sv": "Storlek",
        "th": "ขนาด",
        "tr": "Boyut",
        "vi": "Cỡ",
        "zh-CN": "尺寸",
        "zh-TW": "尺寸"
      },
      "options": [
        {
          "value": "small",
          "label": {
            "cs": "Malá",
            "da": "Lille",
            "de": "Klein",
            "en": "Small",
            "es": "Pequeño",
            "fi": "Pieni",
            "fr": "Petit",
            "it": "Piccolo",
            "ja": "スモール",
            "ko": "스몰",
            "nb": "Liten",
            "nl": "Klein",
            "pl": "Mały",
            "pt-BR": "Pequeno",
            "pt-PT": "Pequeno",
            "sv": "Liten",
            "th": "เล็ก",
            "tr": "Küçük",
            "vi": "Nhỏ",
            "zh-CN": "小",
            "zh-TW": "小型"
          }
        },
        {
          "value": "medium",
          "label": {
            "cs": "Střední",
            "da": "Medium",
            "de": "Mittel",
            "en": "Medium",
            "es": "Mediano",
            "fi": "Keskisuuri",
            "fr": "Moyenne",
            "it": "Medio",
            "ja": "中",
            "ko": "보통",
            "nb": "Middels",
            "nl": "Gemiddeld",
            "pl": "Średni",
            "pt-BR": "Médio",
            "pt-PT": "Médio",
            "sv": "Medium",
            "th": "ปานกลาง",
            "tr": "Orta",
            "vi": "Trung bình",
            "zh-CN": "中等",
            "zh-TW": "中等"
          }
        },
        {
          "value": "large",
          "label": {
            "cs": "Velká",
            "da": "Stor",
            "de": "Groß",
            "en": "Large",
            "es": "Grande",
            "fi": "Suuri",
            "fr": "Grande",
            "it": "Grande",
            "ja": "大",
            "ko": "라지",
            "nb": "Stor",
            "nl": "Groot",
            "pl": "Duży",
            "pt-BR": "Grande",
            "pt-PT": "Grande",
            "sv": "Stor",
            "th": "ใหญ่",
            "tr": "Büyük",
            "vi": "Lớn",
            "zh-CN": "大",
            "zh-TW": "大型"
          }
        },
        {
          "value": "full",
          "label": {
            "cs": "Plná šířka",
            "da": "Fuld bredde",
            "de": "Volle Breite",
            "en": "Full-width",
            "es": "Ancho completo",
            "fi": "Täysi leveys",
            "fr": "Pleine largeur",
            "it": "Intera larghezza",
            "ja": "全幅",
            "ko": "전체 폭",
            "nb": "Full bredde",
            "nl": "Volledige breedte",
            "pl": "Pełna szerokość",
            "pt-BR": "Largura completa",
            "pt-PT": "Largura completa",
            "sv": "Full bredd",
            "th": "เต็มความกว้าง",
            "tr": "Tam genişlikli",
            "vi": "Độ rộng đầy đủ",
            "zh-CN": "全宽",
            "zh-TW": "完整寬度"
          }
        }
      ],
      "default": "medium"
    },
    {
      "type": "checkbox",
      "id": "enable_image_zoom",
      "label": {
        "cs": "Povolit zvětšení obrázku",
        "da": "Aktivér billedzoom",
        "de": "Foto-Zoom zulassen",
        "en": "Enable image zoom",
        "es": "Habilitar zoom de imagen",
        "fi": "Ota kuvan zoomaus käyttöön",
        "fr": "Activer le zoom d'image",
        "it": "Abilita lo zoom dell'immagine",
        "ja": "画像ズームを有効にする",
        "ko": "이미지 확대 사용",
        "nb": "Aktiver bildezoom",
        "nl": "Inzoomen op afbeelding inschakelen",
        "pl": "Włącz powiększenie obrazu",
        "pt-BR": "Habilitar o zoom da imagem",
        "pt-PT": "Ativar o zoom da imagem",
        "sv": "Aktivera bildzoom",
        "th": "เปิดใช้การซูมภาพ",
        "tr": "Görsel yakınlaştırmayı etkinleştir",
        "vi": "Bật thu phóng hình ảnh",
        "zh-CN": "启用图片缩放",
        "zh-TW": "啟用圖片縮放"
      },
      "default": true
    },
    {
      "type": "checkbox",
      "id": "enable_video_looping",
      "label": {
        "cs": "Povolit smyčky videa",
        "da": "Aktivér looping af videoer",
        "de": "Videoschleife aktivieren",
        "en": "Enable video looping",
        "es": "Habilitar la reproducción de video en bucle",
        "fi": "Ota käyttöön videosilmukka",
        "fr": "Activer le bouclage de la vidéo",
        "it": "Abilita la riproduzione in loop dei video",
        "ja": "ビデオのループを有効にする",
        "ko": "동영상 루프",
        "nb": "Aktiver løkkeavspilling av video",
        "nl": "Video-looping inschakelen",
        "pl": "Włącz zapętlanie wideo",
        "pt-BR": "Habilitar loop de vídeo",
        "pt-PT": "Ativar ciclo de vídeo",
        "sv": "Aktivera video-loopning",
        "th": "เปิดใช้การวนซ้ำวิดีโอ",
        "tr": "Video döngüsünü etkinleştir",
        "vi": "Bật vòng lặp video",
        "zh-CN": "启用视频循环",
        "zh-TW": "啟用影片循環功能"
      },
      "default": false
    }
  ]
}
{% endschema %}

ezfy-debut-slider.js

/* 
[EZFYLICENSE]

Debut Theme Slider by ezfycode.com

Changelog:

2.3.2:
- Local flickity load

2.3.1:
- fixed border white spacing for thumbnails

2.3.0
- Smooth animation for featured image checkbox
- Max height options

2.2.0
- Only load first variant if there is the word 'variant' in URL
- Fix first thumbnail disappearing bug 

2.1.0
- update variants with multiple videos fix

2.0.9
- added global object to featured image slider

2.0.8
- On rare occasions, updating an image via swatch would show the wrong variant url

2.0.7
- handle harmless error when there is no associated variant with image

2.0.6
- form dropdowns not in full width bug

2.0.5
- "Hide thumbnails" bug fixed

2.0.4
- safari bug fixed 

2.0.3
- compability to 16 and below set to "false" by default

2.0.2
- Fixed broken thumbnails on products with less than 3 images

2.0.1 
- arrow styling options (opacity, full height, circle)

2.0.0
- featured image section bugs fixed
- lazyload 


0.0.3
- featured image section slider updated

0.0.2
- non slider thumbnail
- update dropdown on image change
- update image on dropdown change

0.0.1
- Featured image & slider updated with flickity


[EZFYLICENSE]
*/
window.ezfyDebutSliderPro = window.ezfyDebutSliderPro || {};

ezfyDebutSliderPro = (function() {



    /* Technical Settings
	================================ */
    const FEATURED_IMAGE_ID = `featuredImageSlider`;

    /* Options 
    ================================ */

    window.CURRENTLY_ACTIVE_INDEX = 0;
    const ACTION_DELAY = 50;
    const UPDATE_IMAGE_ON_DROPDOWN_CHANGE_DELAY = 50;
    const UPDATE_DROPDOWN_ON_IMAGE_CHANGE_DELAY = UPDATE_IMAGE_ON_DROPDOWN_CHANGE_DELAY * 3;
    const NON_SLIDER_THUMBNAIL_CLICK_UPDATE_DELAY = ACTION_DELAY - 20;
    let CHANGING_IMAGE_VIA_SLIDER = false;
    let CHANGING_IMAGE_VIA_DROPDOWN = false;
    let CHANGING_IMAGE_VIA_PAGE_LOAD = false;



    const options = {
           featuredImageAnimation: _getAttributeOption(`data_featured_image_animation`),
                dataThumbnailsQuantityMobile: _getAttributeOption(`data_thumbnails_quantity_mobile`),
      dataThumbnailsQuantity: _getAttributeOption(`data_thumbnails_quantity`),
      totalImages: _getAttributeOption(`data_total_images`),
        featuredImageLoop: _getAttributeOption(`data_featured_image_loop`),
        enableSliderForThumbnailsDesktop: _getAttributeOption(`data_enable_slider_for_thumbnails_desktop`),
        thumbnailsHighlightedPosition: _getAttributeOption(`data_thumbnails_highlighted_position`),
        featuredImageLazyload: _getAttributeOption(`data_featured_image_lazyload`),
        thumbnailsLoop: _getAttributeOption(`data_thumbnails_loop`)
    }

    console.log(options)

    const featuredImageSettings = {
        "pageDots": false,
        "contain": true,
        "imagesLoaded": true,
        "adaptiveHeight": true,
        "wrapAround": options.featuredImageLoop,
        "fade": true,
        "lazyLoad": options.featuredImageLazyload,
                  "selectedAttraction": options.featuredImageAnimation ? 0.025 : 1,
      "friction": options.featuredImageAnimation ? 0.28 : 1,
    };

    const thumbnailsSettings = {
        "asNavFor": `#${FEATURED_IMAGE_ID}`,
        /*`*/
        "wrapAround": options.thumbnailsLoop,
        "imagesLoaded": true,
        "contain": false,
        "pageDots": false,
        accessibility: false,
        prevNextButtons: true,
      cellAlign: hasToGroupThumbnails() ? 'left' : options.thumbnailsHighlightedPosition,
              groupCells: hasToGroupThumbnails()
    }

    /* Helpers
    ================================ */
    
    
        
    function hasToGroupThumbnails(){

	const totalImages = parseInt(options.totalImages);
    const thumbsMobile = parseInt(options.dataThumbnailsQuantityMobile);
    const thumbsDesktop = parseInt(options.dataThumbnailsQuantity)
    
    
    console.log('osc', totalImages, thumbsMobile,thumbsDesktop);
      
      if (_isMobile() && (  totalImages > thumbsMobile )) {
    	return false
    } 
          
          
    else if (!_isMobile() && ( totalImages  > thumbsDesktop ) ){
    	return false;
    } 
      
      
      return true;

   
    }
    
    function _isMobile(){
    	return window.matchMedia("(max-width: 767px)").matches;
    }
    
    
    function _loadScript(src) {
        return new Promise(function(resolve, reject) {
            var s;
            s = document.createElement("script");
            s.src = src;
            s.onload = resolve;
            s.onerror = reject;
            document.head.appendChild(s);
        });
    }


    function _getAttributeOption(dataAttribute) {
        const element = document.querySelector(`[${dataAttribute}]`);

        if (!element) {
            return null;
        }

        const attr = element.getAttribute(dataAttribute);

        if (attr === 'true') {
            return true;
        } else if (attr === 'false') {
            return false
        } else {
            return attr;
        }
    }


    function _extractTextBetween(text, start, end) {
        if (!start || !end) {
            throw new Error(`Please add a "start" and "end" parameter`);
        }

        return text.split(start)[1].split(end)[0];
    }

    function _loadStyle(src) {
        return new Promise(function(resolve, reject) {
            let link = document.createElement("link");
            link.href = src;
            link.rel = "stylesheet";

            link.onload = () => resolve(link);
            link.onerror = () => reject(new Error(`Style load error for ${src}`));

            document.head.append(link);
        });
    }

    function _moveDOMElement(parent, child) {
        document.querySelector(parent).appendChild(document.querySelector(child));
    }



    function _isProductPage() {
        return /product/.test(window.location.href);
    }

    function _sleep(ms) {
        return new Promise(resolve => setTimeout(resolve, ms));
    }

    function _isCartPage() {
        return /cart/.test(window.location.href);
    }

    function _waitForElement(selector, delay = 50, tries = 250) {
        const element = document.querySelector(selector);

        if (!window[`__${selector}`]) {
            window[`__${selector}`] = 0;
        }

        function _search() {
            return new Promise((resolve) => {
                window[`__${selector}`]++;
                setTimeout(resolve, delay);
            });
        }

        if (element === null) {
            if (window[`__${selector}`] >= tries) {
                window[`__${selector}`] = 0;
                return Promise.reject(null);
            }

            return _search().then(() => _waitForElement(selector));
        } else {
            return Promise.resolve(element);
        }
    }

    function _addStyle(styleString) {
        const style = document.createElement("style");
        style.textContent = styleString;
        document.head.append(style);
    }

    async function _getVariantID(product) {
        return new Promise(async (resolve, reject) => {

                           try{
            const $options = document.querySelector(`select.product-form__variants`);

            const selectedOptions = $options.selectedOptions[0];


            const currentVariantID = parseInt(selectedOptions.value.trim().toLowerCase());



            variant = product.variants.filter(e => e.id === currentVariantID)[0];
            resolve(variant)
    }catch(err){
    	resolve(null);
    }

        });
    }
    
    async function _getVariantFromImageIDUpdated(id){
    
      return new Promise(async (resolve, reject) => {
                         const product = await _getProductJSON();   
      
      var variantID = product.images.filter(e => e.id === parseInt(id) )[0].variant_ids[0];
      var options = product.variants.filter(e => e.id === parseInt(variantID) )[0].title.split('/').map(e=> e.trim());
      
      
      resolve(options);
    
      	
      
 
                         
                         });
    }



    async function _getVariantFromImageID(id) {
        return new Promise(async (resolve, reject) => {
            const product = await _getCurrentProduct();


            try {

                product.variants.filter(e => {
                 
                    if ('featured_image' in e && e.featured_image) {
                        return e;
                    }

                }).map(variant => {
               
                    if (!variant) {
                        return;
                    }

                    const featured = variant.featured_image !== undefined ? variant.featured_image : null;




                    if (featured && 'id' in featured && featured.id === parseInt(id)) {
                        resolve(variant);
                    }

                });
            } catch (err) {
                console.log("Couldn't change dropdown value on image change. Perhaps this image has no variant associated to it.\n\n\n", err);
                resolve(null);
            }
        })

    }
    
        async function _getProductImages() {


            if (window.ezfy_image_products) {
                return window.ezfy_image_products;
            }

            return new Promise(async (resolve, reject) => {
                let url = `https://${window.location.host + window.location.pathname}.json`; /* `*/

                let response = await fetch(url);

                let {
                    product
                } = await response.json();

                window.ezfy_image_products = product.images;

                resolve(product.images);
            });
        }
        
                async function _getProductJSON() {


            if (window.ezfy_product_json) {
                return window.ezfy_product_json;
            }

            return new Promise(async (resolve, reject) => {
                let url = `https://${window.location.host + window.location.pathname}.json`; /* `*/

                let response = await fetch(url);

                let {
                    product
                } = await response.json();

                window.ezfy_product_json = product;

                resolve(product);
            });
        }



    
    
    
        async function _getPositionFromImageID(id) {
        return new Promise(async (resolve, reject) => {
	
         const images = await _getProductImages();
    
   
                          

            try {

                images.filter(e => {
                  
                  if (e.id === parseInt( id )) {
                    resolve(e.position);
                  }
                 

                });
                    
                    
            } catch (err) {
                console.log("Couldn't find position.\n\n\n", err);
                resolve(null);
            }
        })

    }


    async function _getCurrentProduct() {
      


        const product = document.querySelector(`script[id*='ProductJson']`);

        if (product) {
            return JSON.parse(product.innerHTML)
        }


        let url;


        if (_hasFeaturedProduct()) {
            const $handle = document.querySelector(`[data-product-handle]`);
            if (!$handle) {
                return;
            }

            const handle = $handle.getAttribute("data-product-handle");
            url = `https://${window.location.host}/products/${handle}.json`;

        } else {
            url = `https://${window.location.host + window.location.pathname}.json`;
        }


        if (window.ezfy_product) {
            return window.ezfy_product;
        }
      
              return new Promise(async (resolve, reject) => {
            let response = await fetch(url);

            let {
                product
            } = await response.json();

    
            window.ezfy_product = product;

            resolve(product);
        });


    }

    async function _getCurrentVariant() {

        try {
            const product = await _getCurrentProduct();
            const variant = await _getVariantID(product);
            return variant;
        } catch (err) {
            return null;
        }

    }

               function loadLocalFlickity(){
  
          if (window.Flickity !== undefined) {
            return true;
        }
  
  return new Promise(async (resolve, reject) => {

  !function(t,e){"function"==typeof define&&define.amd?define("jquery-bridget/jquery-bridget",["jquery"],function(i){return e(t,i)}):"object"==typeof module&&module.exports?module.exports=e(t,require("jquery")):t.jQueryBridget=e(t,t.jQuery)}(window,function(t,e){"use strict";var i=Array.prototype.slice,n=t.console,s=void 0===n?function(){}:function(t){n.error(t)};function o(n,o,a){(a=a||e||t.jQuery)&&(o.prototype.option||(o.prototype.option=function(t){a.isPlainObject(t)&&(this.options=a.extend(!0,this.options,t))}),a.fn[n]=function(t){return"string"==typeof t?function(t,e,i){var o,r="$()."+n+'("'+e+'")';return t.each(function(t,l){var h=a.data(l,n);if(h){var c=h[e];if(c&&"_"!=e.charAt(0)){var d=c.apply(h,i);o=void 0===o?d:o}else s(r+" is not a valid method")}else s(n+" not initialized. Cannot call methods, i.e. "+r)}),void 0!==o?o:t}(this,t,i.call(arguments,1)):(function(t,e){t.each(function(t,i){var s=a.data(i,n);s?(s.option(e),s._init()):(s=new o(i,e),a.data(i,n,s))})}(this,t),this)},r(a))}function r(t){!t||t&&t.bridget||(t.bridget=o)}return r(e||t.jQuery),o}),function(t,e){"function"==typeof define&&define.amd?define("ev-emitter/ev-emitter",e):"object"==typeof module&&module.exports?module.exports=e():t.EvEmitter=e()}("undefined"!=typeof window?window:this,function(){function t(){}var e=t.prototype;return e.on=function(t,e){if(t&&e){var i=this._events=this._events||{},n=i[t]=i[t]||[];return-1==n.indexOf(e)&&n.push(e),this}},e.once=function(t,e){if(t&&e){this.on(t,e);var i=this._onceEvents=this._onceEvents||{};return(i[t]=i[t]||{})[e]=!0,this}},e.off=function(t,e){var i=this._events&&this._events[t];if(i&&i.length){var n=i.indexOf(e);return-1!=n&&i.splice(n,1),this}},e.emitEvent=function(t,e){var i=this._events&&this._events[t];if(i&&i.length){i=i.slice(0),e=e||[];for(var n=this._onceEvents&&this._onceEvents[t],s=0;s<i.length;s++){var o=i[s];n&&n[o]&&(this.off(t,o),delete n[o]),o.apply(this,e)}return this}},e.allOff=function(){delete this._events,delete this._onceEvents},t}),function(t,e){"function"==typeof define&&define.amd?define("get-size/get-size",e):"object"==typeof module&&module.exports?module.exports=e():t.getSize=e()}(window,function(){"use strict";function t(t){var e=parseFloat(t);return-1==t.indexOf("%")&&!isNaN(e)&&e}var e="undefined"==typeof console?function(){}:function(t){console.error(t)},i=["paddingLeft","paddingRight","paddingTop","paddingBottom","marginLeft","marginRight","marginTop","marginBottom","borderLeftWidth","borderRightWidth","borderTopWidth","borderBottomWidth"],n=i.length;function s(t){var i=getComputedStyle(t);return i||e("Style returned "+i+". Are you running this code in a hidden iframe on Firefox? See https://bit.ly/getsizebug1"),i}var o,r=!1;function a(){if(!r){r=!0;var e=document.createElement("div");e.style.width="200px",e.style.padding="1px 2px 3px 4px",e.style.borderStyle="solid",e.style.borderWidth="1px 2px 3px 4px",e.style.boxSizing="border-box";var i=document.body||document.documentElement;i.appendChild(e);var n=s(e);o=200==Math.round(t(n.width)),l.isBoxSizeOuter=o,i.removeChild(e)}}function l(e){if(a(),"string"==typeof e&&(e=document.querySelector(e)),e&&"object"==typeof e&&e.nodeType){var r=s(e);if("none"==r.display)return function(){for(var t={width:0,height:0,innerWidth:0,innerHeight:0,outerWidth:0,outerHeight:0},e=0;e<n;e++)t[i[e]]=0;return t}();var l={};l.width=e.offsetWidth,l.height=e.offsetHeight;for(var h=l.isBorderBox="border-box"==r.boxSizing,c=0;c<n;c++){var d=i[c],u=r[d],f=parseFloat(u);l[d]=isNaN(f)?0:f}var p=l.paddingLeft+l.paddingRight,g=l.paddingTop+l.paddingBottom,v=l.marginLeft+l.marginRight,m=l.marginTop+l.marginBottom,y=l.borderLeftWidth+l.borderRightWidth,b=l.borderTopWidth+l.borderBottomWidth,E=h&&o,S=t(r.width);!1!==S&&(l.width=S+(E?0:p+y));var C=t(r.height);return!1!==C&&(l.height=C+(E?0:g+b)),l.innerWidth=l.width-(p+y),l.innerHeight=l.height-(g+b),l.outerWidth=l.width+v,l.outerHeight=l.height+m,l}}return l}),function(t,e){"use strict";"function"==typeof define&&define.amd?define("desandro-matches-selector/matches-selector",e):"object"==typeof module&&module.exports?module.exports=e():t.matchesSelector=e()}(window,function(){"use strict";var t=function(){var t=window.Element.prototype;if(t.matches)return"matches";if(t.matchesSelector)return"matchesSelector";for(var e=["webkit","moz","ms","o"],i=0;i<e.length;i++){var n=e[i]+"MatchesSelector";if(t[n])return n}}();return function(e,i){return e[t](i)}}),function(t,e){"function"==typeof define&&define.amd?define("fizzy-ui-utils/utils",["desandro-matches-selector/matches-selector"],function(i){return e(t,i)}):"object"==typeof module&&module.exports?module.exports=e(t,require("desandro-matches-selector")):t.fizzyUIUtils=e(t,t.matchesSelector)}(window,function(t,e){var i={extend:function(t,e){for(var i in e)t[i]=e[i];return t},modulo:function(t,e){return(t%e+e)%e}},n=Array.prototype.slice;i.makeArray=function(t){return Array.isArray(t)?t:null==t?[]:"object"==typeof t&&"number"==typeof t.length?n.call(t):[t]},i.removeFrom=function(t,e){var i=t.indexOf(e);-1!=i&&t.splice(i,1)},i.getParent=function(t,i){for(;t.parentNode&&t!=document.body;)if(t=t.parentNode,e(t,i))return t},i.getQueryElement=function(t){return"string"==typeof t?document.querySelector(t):t},i.handleEvent=function(t){var e="on"+t.type;this[e]&&this[e](t)},i.filterFindElements=function(t,n){t=i.makeArray(t);var s=[];return t.forEach(function(t){if(t instanceof HTMLElement)if(n){e(t,n)&&s.push(t);for(var i=t.querySelectorAll(n),o=0;o<i.length;o++)s.push(i[o])}else s.push(t)}),s},i.debounceMethod=function(t,e,i){i=i||100;var n=t.prototype[e],s=e+"Timeout";t.prototype[e]=function(){var t=this[s];clearTimeout(t);var e=arguments,o=this;this[s]=setTimeout(function(){n.apply(o,e),delete o[s]},i)}},i.docReady=function(t){var e=document.readyState;"complete"==e||"interactive"==e?setTimeout(t):document.addEventListener("DOMContentLoaded",t)},i.toDashed=function(t){return t.replace(/(.)([A-Z])/g,function(t,e,i){return e+"-"+i}).toLowerCase()};var s=t.console;return i.htmlInit=function(e,n){i.docReady(function(){var o=i.toDashed(n),r="data-"+o,a=document.querySelectorAll("["+r+"]"),l=document.querySelectorAll(".js-"+o),h=i.makeArray(a).concat(i.makeArray(l)),c=r+"-options",d=t.jQuery;h.forEach(function(t){var i,o=t.getAttribute(r)||t.getAttribute(c);try{i=o&&JSON.parse(o)}catch(o){return void(s&&s.error("Error parsing "+r+" on "+t.className+": "+o))}var a=new e(t,i);d&&d.data(t,n,a)})})},i}),function(t,e){"function"==typeof define&&define.amd?define("flickity/js/cell",["get-size/get-size"],function(i){return e(t,i)}):"object"==typeof module&&module.exports?module.exports=e(t,require("get-size")):(t.Flickity=t.Flickity||{},t.Flickity.Cell=e(t,t.getSize))}(window,function(t,e){function i(t,e){this.element=t,this.parent=e,this.create()}var n=i.prototype;return n.create=function(){this.element.style.position="absolute",this.element.setAttribute("aria-hidden","true"),this.x=0,this.shift=0},n.destroy=function(){this.unselect(),this.element.style.position="";var t=this.parent.originSide;this.element.style[t]="",this.element.removeAttribute("aria-hidden")},n.getSize=function(){this.size=e(this.element)},n.setPosition=function(t){this.x=t,this.updateTarget(),this.renderPosition(t)},n.updateTarget=n.setDefaultTarget=function(){var t="left"==this.parent.originSide?"marginLeft":"marginRight";this.target=this.x+this.size[t]+this.size.width*this.parent.cellAlign},n.renderPosition=function(t){var e=this.parent.originSide;this.element.style[e]=this.parent.getPositionValue(t)},n.select=function(){this.element.classList.add("is-selected"),this.element.removeAttribute("aria-hidden")},n.unselect=function(){this.element.classList.remove("is-selected"),this.element.setAttribute("aria-hidden","true")},n.wrapShift=function(t){this.shift=t,this.renderPosition(this.x+this.parent.slideableWidth*t)},n.remove=function(){this.element.parentNode.removeChild(this.element)},i}),function(t,e){"function"==typeof define&&define.amd?define("flickity/js/slide",e):"object"==typeof module&&module.exports?module.exports=e():(t.Flickity=t.Flickity||{},t.Flickity.Slide=e())}(window,function(){"use strict";function t(t){this.parent=t,this.isOriginLeft="left"==t.originSide,this.cells=[],this.outerWidth=0,this.height=0}var e=t.prototype;return e.addCell=function(t){if(this.cells.push(t),this.outerWidth+=t.size.outerWidth,this.height=Math.max(t.size.outerHeight,this.height),1==this.cells.length){this.x=t.x;var e=this.isOriginLeft?"marginLeft":"marginRight";this.firstMargin=t.size[e]}},e.updateTarget=function(){var t=this.isOriginLeft?"marginRight":"marginLeft",e=this.getLastCell(),i=e?e.size[t]:0,n=this.outerWidth-(this.firstMargin+i);this.target=this.x+this.firstMargin+n*this.parent.cellAlign},e.getLastCell=function(){return this.cells[this.cells.length-1]},e.select=function(){this.cells.forEach(function(t){t.select()})},e.unselect=function(){this.cells.forEach(function(t){t.unselect()})},e.getCellElements=function(){return this.cells.map(function(t){return t.element})},t}),function(t,e){"function"==typeof define&&define.amd?define("flickity/js/animate",["fizzy-ui-utils/utils"],function(i){return e(t,i)}):"object"==typeof module&&module.exports?module.exports=e(t,require("fizzy-ui-utils")):(t.Flickity=t.Flickity||{},t.Flickity.animatePrototype=e(t,t.fizzyUIUtils))}(window,function(t,e){var i={startAnimation:function(){this.isAnimating||(this.isAnimating=!0,this.restingFrames=0,this.animate())},animate:function(){this.applyDragForce(),this.applySelectedAttraction();var t=this.x;if(this.integratePhysics(),this.positionSlider(),this.settle(t),this.isAnimating){var e=this;requestAnimationFrame(function(){e.animate()})}},positionSlider:function(){var t=this.x;this.options.wrapAround&&this.cells.length>1&&(t=e.modulo(t,this.slideableWidth),t-=this.slideableWidth,this.shiftWrapCells(t)),this.setTranslateX(t,this.isAnimating),this.dispatchScrollEvent()},setTranslateX:function(t,e){t+=this.cursorPosition,t=this.options.rightToLeft?-t:t;var i=this.getPositionValue(t);this.slider.style.transform=e?"translate3d("+i+",0,0)":"translateX("+i+")"},dispatchScrollEvent:function(){var t=this.slides[0];if(t){var e=-this.x-t.target,i=e/this.slidesWidth;this.dispatchEvent("scroll",null,[i,e])}},positionSliderAtSelected:function(){this.cells.length&&(this.x=-this.selectedSlide.target,this.velocity=0,this.positionSlider())},getPositionValue:function(t){return this.options.percentPosition?.01*Math.round(t/this.size.innerWidth*1e4)+"%":Math.round(t)+"px"},settle:function(t){!this.isPointerDown&&Math.round(100*this.x)==Math.round(100*t)&&this.restingFrames++,this.restingFrames>2&&(this.isAnimating=!1,delete this.isFreeScrolling,this.positionSlider(),this.dispatchEvent("settle",null,[this.selectedIndex]))},shiftWrapCells:function(t){var e=this.cursorPosition+t;this._shiftCells(this.beforeShiftCells,e,-1);var i=this.size.innerWidth-(t+this.slideableWidth+this.cursorPosition);this._shiftCells(this.afterShiftCells,i,1)},_shiftCells:function(t,e,i){for(var n=0;n<t.length;n++){var s=t[n],o=e>0?i:0;s.wrapShift(o),e-=s.size.outerWidth}},_unshiftCells:function(t){if(t&&t.length)for(var e=0;e<t.length;e++)t[e].wrapShift(0)},integratePhysics:function(){this.x+=this.velocity,this.velocity*=this.getFrictionFactor()},applyForce:function(t){this.velocity+=t},getFrictionFactor:function(){return 1-this.options[this.isFreeScrolling?"freeScrollFriction":"friction"]},getRestingPosition:function(){return this.x+this.velocity/(1-this.getFrictionFactor())},applyDragForce:function(){if(this.isDraggable&&this.isPointerDown){var t=this.dragX-this.x-this.velocity;this.applyForce(t)}},applySelectedAttraction:function(){if(!(this.isDraggable&&this.isPointerDown)&&!this.isFreeScrolling&&this.slides.length){var t=(-1*this.selectedSlide.target-this.x)*this.options.selectedAttraction;this.applyForce(t)}}};return i}),function(t,e){if("function"==typeof define&&define.amd)define("flickity/js/flickity",["ev-emitter/ev-emitter","get-size/get-size","fizzy-ui-utils/utils","./cell","./slide","./animate"],function(i,n,s,o,r,a){return e(t,i,n,s,o,r,a)});else if("object"==typeof module&&module.exports)module.exports=e(t,require("ev-emitter"),require("get-size"),require("fizzy-ui-utils"),require("./cell"),require("./slide"),require("./animate"));else{var i=t.Flickity;t.Flickity=e(t,t.EvEmitter,t.getSize,t.fizzyUIUtils,i.Cell,i.Slide,i.animatePrototype)}}(window,function(t,e,i,n,s,o,r){var a=t.jQuery,l=t.getComputedStyle,h=t.console;function c(t,e){for(t=n.makeArray(t);t.length;)e.appendChild(t.shift())}var d=0,u={};function f(t,e){var i=n.getQueryElement(t);if(i){if(this.element=i,this.element.flickityGUID){var s=u[this.element.flickityGUID];return s&&s.option(e),s}a&&(this.$element=a(this.element)),this.options=n.extend({},this.constructor.defaults),this.option(e),this._create()}else h&&h.error("Bad element for Flickity: "+(i||t))}f.defaults={accessibility:!0,cellAlign:"center",freeScrollFriction:.075,friction:.28,namespaceJQueryEvents:!0,percentPosition:!0,resize:!0,selectedAttraction:.025,setGallerySize:!0},f.createMethods=[];var p=f.prototype;n.extend(p,e.prototype),p._create=function(){var e=this.guid=++d;for(var i in this.element.flickityGUID=e,u[e]=this,this.selectedIndex=0,this.restingFrames=0,this.x=0,this.velocity=0,this.originSide=this.options.rightToLeft?"right":"left",this.viewport=document.createElement("div"),this.viewport.className="flickity-viewport",this._createSlider(),(this.options.resize||this.options.watchCSS)&&t.addEventListener("resize",this),this.options.on){var n=this.options.on[i];this.on(i,n)}f.createMethods.forEach(function(t){this[t]()},this),this.options.watchCSS?this.watchCSS():this.activate()},p.option=function(t){n.extend(this.options,t)},p.activate=function(){this.isActive||(this.isActive=!0,this.element.classList.add("flickity-enabled"),this.options.rightToLeft&&this.element.classList.add("flickity-rtl"),this.getSize(),c(this._filterFindCellElements(this.element.children),this.slider),this.viewport.appendChild(this.slider),this.element.appendChild(this.viewport),this.reloadCells(),this.options.accessibility&&(this.element.tabIndex=0,this.element.addEventListener("keydown",this)),this.emitEvent("activate"),this.selectInitialIndex(),this.isInitActivated=!0,this.dispatchEvent("ready"))},p._createSlider=function(){var t=document.createElement("div");t.className="flickity-slider",t.style[this.originSide]=0,this.slider=t},p._filterFindCellElements=function(t){return n.filterFindElements(t,this.options.cellSelector)},p.reloadCells=function(){this.cells=this._makeCells(this.slider.children),this.positionCells(),this._getWrapShiftCells(),this.setGallerySize()},p._makeCells=function(t){return this._filterFindCellElements(t).map(function(t){return new s(t,this)},this)},p.getLastCell=function(){return this.cells[this.cells.length-1]},p.getLastSlide=function(){return this.slides[this.slides.length-1]},p.positionCells=function(){this._sizeCells(this.cells),this._positionCells(0)},p._positionCells=function(t){t=t||0,this.maxCellHeight=t&&this.maxCellHeight||0;var e=0;if(t>0){var i=this.cells[t-1];e=i.x+i.size.outerWidth}for(var n=this.cells.length,s=t;s<n;s++){var o=this.cells[s];o.setPosition(e),e+=o.size.outerWidth,this.maxCellHeight=Math.max(o.size.outerHeight,this.maxCellHeight)}this.slideableWidth=e,this.updateSlides(),this._containSlides(),this.slidesWidth=n?this.getLastSlide().target-this.slides[0].target:0},p._sizeCells=function(t){t.forEach(function(t){t.getSize()})},p.updateSlides=function(){if(this.slides=[],this.cells.length){var t=new o(this);this.slides.push(t);var e="left"==this.originSide?"marginRight":"marginLeft",i=this._getCanCellFit();this.cells.forEach(function(n,s){if(t.cells.length){var r=t.outerWidth-t.firstMargin+(n.size.outerWidth-n.size[e]);i.call(this,s,r)?t.addCell(n):(t.updateTarget(),t=new o(this),this.slides.push(t),t.addCell(n))}else t.addCell(n)},this),t.updateTarget(),this.updateSelectedSlide()}},p._getCanCellFit=function(){var t=this.options.groupCells;if(!t)return function(){return!1};if("number"==typeof t){var e=parseInt(t,10);return function(t){return t%e!=0}}var i="string"==typeof t&&t.match(/^(\d+)%$/),n=i?parseInt(i[1],10)/100:1;return function(t,e){return e<=(this.size.innerWidth+1)*n}},p._init=p.reposition=function(){this.positionCells(),this.positionSliderAtSelected()},p.getSize=function(){this.size=i(this.element),this.setCellAlign(),this.cursorPosition=this.size.innerWidth*this.cellAlign};var g={center:{left:.5,right:.5},left:{left:0,right:1},right:{right:0,left:1}};return p.setCellAlign=function(){var t=g[this.options.cellAlign];this.cellAlign=t?t[this.originSide]:this.options.cellAlign},p.setGallerySize=function(){if(this.options.setGallerySize){var t=this.options.adaptiveHeight&&this.selectedSlide?this.selectedSlide.height:this.maxCellHeight;this.viewport.style.height=t+"px"}},p._getWrapShiftCells=function(){if(this.options.wrapAround){this._unshiftCells(this.beforeShiftCells),this._unshiftCells(this.afterShiftCells);var t=this.cursorPosition,e=this.cells.length-1;this.beforeShiftCells=this._getGapCells(t,e,-1),t=this.size.innerWidth-this.cursorPosition,this.afterShiftCells=this._getGapCells(t,0,1)}},p._getGapCells=function(t,e,i){for(var n=[];t>0;){var s=this.cells[e];if(!s)break;n.push(s),e+=i,t-=s.size.outerWidth}return n},p._containSlides=function(){if(this.options.contain&&!this.options.wrapAround&&this.cells.length){var t=this.options.rightToLeft,e=t?"marginRight":"marginLeft",i=t?"marginLeft":"marginRight",n=this.slideableWidth-this.getLastCell().size[i],s=n<this.size.innerWidth,o=this.cursorPosition+this.cells[0].size[e],r=n-this.size.innerWidth*(1-this.cellAlign);this.slides.forEach(function(t){s?t.target=n*this.cellAlign:(t.target=Math.max(t.target,o),t.target=Math.min(t.target,r))},this)}},p.dispatchEvent=function(t,e,i){var n=e?[e].concat(i):i;if(this.emitEvent(t,n),a&&this.$element){var s=t+=this.options.namespaceJQueryEvents?".flickity":"";if(e){var o=new a.Event(e);o.type=t,s=o}this.$element.trigger(s,i)}},p.select=function(t,e,i){if(this.isActive&&(t=parseInt(t,10),this._wrapSelect(t),(this.options.wrapAround||e)&&(t=n.modulo(t,this.slides.length)),this.slides[t])){var s=this.selectedIndex;this.selectedIndex=t,this.updateSelectedSlide(),i?this.positionSliderAtSelected():this.startAnimation(),this.options.adaptiveHeight&&this.setGallerySize(),this.dispatchEvent("select",null,[t]),t!=s&&this.dispatchEvent("change",null,[t]),this.dispatchEvent("cellSelect")}},p._wrapSelect=function(t){var e=this.slides.length;if(!(this.options.wrapAround&&e>1))return t;var i=n.modulo(t,e),s=Math.abs(i-this.selectedIndex),o=Math.abs(i+e-this.selectedIndex),r=Math.abs(i-e-this.selectedIndex);!this.isDragSelect&&o<s?t+=e:!this.isDragSelect&&r<s&&(t-=e),t<0?this.x-=this.slideableWidth:t>=e&&(this.x+=this.slideableWidth)},p.previous=function(t,e){this.select(this.selectedIndex-1,t,e)},p.next=function(t,e){this.select(this.selectedIndex+1,t,e)},p.updateSelectedSlide=function(){var t=this.slides[this.selectedIndex];t&&(this.unselectSelectedSlide(),this.selectedSlide=t,t.select(),this.selectedCells=t.cells,this.selectedElements=t.getCellElements(),this.selectedCell=t.cells[0],this.selectedElement=this.selectedElements[0])},p.unselectSelectedSlide=function(){this.selectedSlide&&this.selectedSlide.unselect()},p.selectInitialIndex=function(){var t=this.options.initialIndex;if(this.isInitActivated)this.select(this.selectedIndex,!1,!0);else{if(t&&"string"==typeof t)if(this.queryCell(t))return void this.selectCell(t,!1,!0);var e=0;t&&this.slides[t]&&(e=t),this.select(e,!1,!0)}},p.selectCell=function(t,e,i){var n=this.queryCell(t);if(n){var s=this.getCellSlideIndex(n);this.select(s,e,i)}},p.getCellSlideIndex=function(t){for(var e=0;e<this.slides.length;e++){if(-1!=this.slides[e].cells.indexOf(t))return e}},p.getCell=function(t){for(var e=0;e<this.cells.length;e++){var i=this.cells[e];if(i.element==t)return i}},p.getCells=function(t){t=n.makeArray(t);var e=[];return t.forEach(function(t){var i=this.getCell(t);i&&e.push(i)},this),e},p.getCellElements=function(){return this.cells.map(function(t){return t.element})},p.getParentCell=function(t){var e=this.getCell(t);return e||(t=n.getParent(t,".flickity-slider > *"),this.getCell(t))},p.getAdjacentCellElements=function(t,e){if(!t)return this.selectedSlide.getCellElements();e=void 0===e?this.selectedIndex:e;var i=this.slides.length;if(1+2*t>=i)return this.getCellElements();for(var s=[],o=e-t;o<=e+t;o++){var r=this.options.wrapAround?n.modulo(o,i):o,a=this.slides[r];a&&(s=s.concat(a.getCellElements()))}return s},p.queryCell=function(t){if("number"==typeof t)return this.cells[t];if("string"==typeof t){if(t.match(/^[#.]?[\d/]/))return;t=this.element.querySelector(t)}return this.getCell(t)},p.uiChange=function(){this.emitEvent("uiChange")},p.childUIPointerDown=function(t){"touchstart"!=t.type&&t.preventDefault(),this.focus()},p.onresize=function(){this.watchCSS(),this.resize()},n.debounceMethod(f,"onresize",150),p.resize=function(){if(this.isActive){this.getSize(),this.options.wrapAround&&(this.x=n.modulo(this.x,this.slideableWidth)),this.positionCells(),this._getWrapShiftCells(),this.setGallerySize(),this.emitEvent("resize");var t=this.selectedElements&&this.selectedElements[0];this.selectCell(t,!1,!0)}},p.watchCSS=function(){this.options.watchCSS&&(-1!=l(this.element,":after").content.indexOf("flickity")?this.activate():this.deactivate())},p.onkeydown=function(t){var e=document.activeElement&&document.activeElement!=this.element;if(this.options.accessibility&&!e){var i=f.keyboardHandlers[t.keyCode];i&&i.call(this)}},f.keyboardHandlers={37:function(){var t=this.options.rightToLeft?"next":"previous";this.uiChange(),this[t]()},39:function(){var t=this.options.rightToLeft?"previous":"next";this.uiChange(),this[t]()}},p.focus=function(){var e=t.pageYOffset;this.element.focus({preventScroll:!0}),t.pageYOffset!=e&&t.scrollTo(t.pageXOffset,e)},p.deactivate=function(){this.isActive&&(this.element.classList.remove("flickity-enabled"),this.element.classList.remove("flickity-rtl"),this.unselectSelectedSlide(),this.cells.forEach(function(t){t.destroy()}),this.element.removeChild(this.viewport),c(this.slider.children,this.element),this.options.accessibility&&(this.element.removeAttribute("tabIndex"),this.element.removeEventListener("keydown",this)),this.isActive=!1,this.emitEvent("deactivate"))},p.destroy=function(){this.deactivate(),t.removeEventListener("resize",this),this.allOff(),this.emitEvent("destroy"),a&&this.$element&&a.removeData(this.element,"flickity"),delete this.element.flickityGUID,delete u[this.guid]},n.extend(p,r),f.data=function(t){var e=(t=n.getQueryElement(t))&&t.flickityGUID;return e&&u[e]},n.htmlInit(f,"flickity"),a&&a.bridget&&a.bridget("flickity",f),f.setJQuery=function(t){a=t},f.Cell=s,f.Slide=o,f}),function(t,e){"function"==typeof define&&define.amd?define("unipointer/unipointer",["ev-emitter/ev-emitter"],function(i){return e(t,i)}):"object"==typeof module&&module.exports?module.exports=e(t,require("ev-emitter")):t.Unipointer=e(t,t.EvEmitter)}(window,function(t,e){function i(){}var n=i.prototype=Object.create(e.prototype);n.bindStartEvent=function(t){this._bindStartEvent(t,!0)},n.unbindStartEvent=function(t){this._bindStartEvent(t,!1)},n._bindStartEvent=function(e,i){var n=(i=void 0===i||i)?"addEventListener":"removeEventListener",s="mousedown";t.PointerEvent?s="pointerdown":"ontouchstart"in t&&(s="touchstart"),e[n](s,this)},n.handleEvent=function(t){var e="on"+t.type;this[e]&&this[e](t)},n.getTouch=function(t){for(var e=0;e<t.length;e++){var i=t[e];if(i.identifier==this.pointerIdentifier)return i}},n.onmousedown=function(t){var e=t.button;e&&0!==e&&1!==e||this._pointerDown(t,t)},n.ontouchstart=function(t){this._pointerDown(t,t.changedTouches[0])},n.onpointerdown=function(t){this._pointerDown(t,t)},n._pointerDown=function(t,e){t.button||this.isPointerDown||(this.isPointerDown=!0,this.pointerIdentifier=void 0!==e.pointerId?e.pointerId:e.identifier,this.pointerDown(t,e))},n.pointerDown=function(t,e){this._bindPostStartEvents(t),this.emitEvent("pointerDown",[t,e])};var s={mousedown:["mousemove","mouseup"],touchstart:["touchmove","touchend","touchcancel"],pointerdown:["pointermove","pointerup","pointercancel"]};return n._bindPostStartEvents=function(e){if(e){var i=s[e.type];i.forEach(function(e){t.addEventListener(e,this)},this),this._boundPointerEvents=i}},n._unbindPostStartEvents=function(){this._boundPointerEvents&&(this._boundPointerEvents.forEach(function(e){t.removeEventListener(e,this)},this),delete this._boundPointerEvents)},n.onmousemove=function(t){this._pointerMove(t,t)},n.onpointermove=function(t){t.pointerId==this.pointerIdentifier&&this._pointerMove(t,t)},n.ontouchmove=function(t){var e=this.getTouch(t.changedTouches);e&&this._pointerMove(t,e)},n._pointerMove=function(t,e){this.pointerMove(t,e)},n.pointerMove=function(t,e){this.emitEvent("pointerMove",[t,e])},n.onmouseup=function(t){this._pointerUp(t,t)},n.onpointerup=function(t){t.pointerId==this.pointerIdentifier&&this._pointerUp(t,t)},n.ontouchend=function(t){var e=this.getTouch(t.changedTouches);e&&this._pointerUp(t,e)},n._pointerUp=function(t,e){this._pointerDone(),this.pointerUp(t,e)},n.pointerUp=function(t,e){this.emitEvent("pointerUp",[t,e])},n._pointerDone=function(){this._pointerReset(),this._unbindPostStartEvents(),this.pointerDone()},n._pointerReset=function(){this.isPointerDown=!1,delete this.pointerIdentifier},n.pointerDone=function(){},n.onpointercancel=function(t){t.pointerId==this.pointerIdentifier&&this._pointerCancel(t,t)},n.ontouchcancel=function(t){var e=this.getTouch(t.changedTouches);e&&this._pointerCancel(t,e)},n._pointerCancel=function(t,e){this._pointerDone(),this.pointerCancel(t,e)},n.pointerCancel=function(t,e){this.emitEvent("pointerCancel",[t,e])},i.getPointerPoint=function(t){return{x:t.pageX,y:t.pageY}},i}),function(t,e){"function"==typeof define&&define.amd?define("unidragger/unidragger",["unipointer/unipointer"],function(i){return e(t,i)}):"object"==typeof module&&module.exports?module.exports=e(t,require("unipointer")):t.Unidragger=e(t,t.Unipointer)}(window,function(t,e){function i(){}var n=i.prototype=Object.create(e.prototype);n.bindHandles=function(){this._bindHandles(!0)},n.unbindHandles=function(){this._bindHandles(!1)},n._bindHandles=function(e){for(var i=(e=void 0===e||e)?"addEventListener":"removeEventListener",n=e?this._touchActionValue:"",s=0;s<this.handles.length;s++){var o=this.handles[s];this._bindStartEvent(o,e),o[i]("click",this),t.PointerEvent&&(o.style.touchAction=n)}},n._touchActionValue="none",n.pointerDown=function(t,e){this.okayPointerDown(t)&&(this.pointerDownPointer={pageX:e.pageX,pageY:e.pageY},t.preventDefault(),this.pointerDownBlur(),this._bindPostStartEvents(t),this.emitEvent("pointerDown",[t,e]))};var s={TEXTAREA:!0,INPUT:!0,SELECT:!0,OPTION:!0},o={radio:!0,checkbox:!0,button:!0,submit:!0,image:!0,file:!0};return n.okayPointerDown=function(t){var e=s[t.target.nodeName],i=o[t.target.type],n=!e||i;return n||this._pointerReset(),n},n.pointerDownBlur=function(){var t=document.activeElement;t&&t.blur&&t!=document.body&&t.blur()},n.pointerMove=function(t,e){var i=this._dragPointerMove(t,e);this.emitEvent("pointerMove",[t,e,i]),this._dragMove(t,e,i)},n._dragPointerMove=function(t,e){var i={x:e.pageX-this.pointerDownPointer.pageX,y:e.pageY-this.pointerDownPointer.pageY};return!this.isDragging&&this.hasDragStarted(i)&&this._dragStart(t,e),i},n.hasDragStarted=function(t){return Math.abs(t.x)>3||Math.abs(t.y)>3},n.pointerUp=function(t,e){this.emitEvent("pointerUp",[t,e]),this._dragPointerUp(t,e)},n._dragPointerUp=function(t,e){this.isDragging?this._dragEnd(t,e):this._staticClick(t,e)},n._dragStart=function(t,e){this.isDragging=!0,this.isPreventingClicks=!0,this.dragStart(t,e)},n.dragStart=function(t,e){this.emitEvent("dragStart",[t,e])},n._dragMove=function(t,e,i){this.isDragging&&this.dragMove(t,e,i)},n.dragMove=function(t,e,i){t.preventDefault(),this.emitEvent("dragMove",[t,e,i])},n._dragEnd=function(t,e){this.isDragging=!1,setTimeout(function(){delete this.isPreventingClicks}.bind(this)),this.dragEnd(t,e)},n.dragEnd=function(t,e){this.emitEvent("dragEnd",[t,e])},n.onclick=function(t){this.isPreventingClicks&&t.preventDefault()},n._staticClick=function(t,e){this.isIgnoringMouseUp&&"mouseup"==t.type||(this.staticClick(t,e),"mouseup"!=t.type&&(this.isIgnoringMouseUp=!0,setTimeout(function(){delete this.isIgnoringMouseUp}.bind(this),400)))},n.staticClick=function(t,e){this.emitEvent("staticClick",[t,e])},i.getPointerPoint=e.getPointerPoint,i}),function(t,e){"function"==typeof define&&define.amd?define("flickity/js/drag",["./flickity","unidragger/unidragger","fizzy-ui-utils/utils"],function(i,n,s){return e(t,i,n,s)}):"object"==typeof module&&module.exports?module.exports=e(t,require("./flickity"),require("unidragger"),require("fizzy-ui-utils")):t.Flickity=e(t,t.Flickity,t.Unidragger,t.fizzyUIUtils)}(window,function(t,e,i,n){n.extend(e.defaults,{draggable:">1",dragThreshold:3}),e.createMethods.push("_createDrag");var s=e.prototype;n.extend(s,i.prototype),s._touchActionValue="pan-y";var o="createTouch"in document,r=!1;s._createDrag=function(){this.on("activate",this.onActivateDrag),this.on("uiChange",this._uiChangeDrag),this.on("deactivate",this.onDeactivateDrag),this.on("cellChange",this.updateDraggable),o&&!r&&(t.addEventListener("touchmove",function(){}),r=!0)},s.onActivateDrag=function(){this.handles=[this.viewport],this.bindHandles(),this.updateDraggable()},s.onDeactivateDrag=function(){this.unbindHandles(),this.element.classList.remove("is-draggable")},s.updateDraggable=function(){">1"==this.options.draggable?this.isDraggable=this.slides.length>1:this.isDraggable=this.options.draggable,this.isDraggable?this.element.classList.add("is-draggable"):this.element.classList.remove("is-draggable")},s.bindDrag=function(){this.options.draggable=!0,this.updateDraggable()},s.unbindDrag=function(){this.options.draggable=!1,this.updateDraggable()},s._uiChangeDrag=function(){delete this.isFreeScrolling},s.pointerDown=function(e,i){this.isDraggable?this.okayPointerDown(e)&&(this._pointerDownPreventDefault(e),this.pointerDownFocus(e),document.activeElement!=this.element&&this.pointerDownBlur(),this.dragX=this.x,this.viewport.classList.add("is-pointer-down"),this.pointerDownScroll=l(),t.addEventListener("scroll",this),this._pointerDownDefault(e,i)):this._pointerDownDefault(e,i)},s._pointerDownDefault=function(t,e){this.pointerDownPointer={pageX:e.pageX,pageY:e.pageY},this._bindPostStartEvents(t),this.dispatchEvent("pointerDown",t,[e])};var a={INPUT:!0,TEXTAREA:!0,SELECT:!0};function l(){return{x:t.pageXOffset,y:t.pageYOffset}}return s.pointerDownFocus=function(t){a[t.target.nodeName]||this.focus()},s._pointerDownPreventDefault=function(t){var e="touchstart"==t.type,i="touch"==t.pointerType,n=a[t.target.nodeName];e||i||n||t.preventDefault()},s.hasDragStarted=function(t){return Math.abs(t.x)>this.options.dragThreshold},s.pointerUp=function(t,e){delete this.isTouchScrolling,this.viewport.classList.remove("is-pointer-down"),this.dispatchEvent("pointerUp",t,[e]),this._dragPointerUp(t,e)},s.pointerDone=function(){t.removeEventListener("scroll",this),delete this.pointerDownScroll},s.dragStart=function(e,i){this.isDraggable&&(this.dragStartPosition=this.x,this.startAnimation(),t.removeEventListener("scroll",this),this.dispatchEvent("dragStart",e,[i]))},s.pointerMove=function(t,e){var i=this._dragPointerMove(t,e);this.dispatchEvent("pointerMove",t,[e,i]),this._dragMove(t,e,i)},s.dragMove=function(t,e,i){if(this.isDraggable){t.preventDefault(),this.previousDragX=this.dragX;var n=this.options.rightToLeft?-1:1;this.options.wrapAround&&(i.x%=this.slideableWidth);var s=this.dragStartPosition+i.x*n;if(!this.options.wrapAround&&this.slides.length){var o=Math.max(-this.slides[0].target,this.dragStartPosition);s=s>o?.5*(s+o):s;var r=Math.min(-this.getLastSlide().target,this.dragStartPosition);s=s<r?.5*(s+r):s}this.dragX=s,this.dragMoveTime=new Date,this.dispatchEvent("dragMove",t,[e,i])}},s.dragEnd=function(t,e){if(this.isDraggable){this.options.freeScroll&&(this.isFreeScrolling=!0);var i=this.dragEndRestingSelect();if(this.options.freeScroll&&!this.options.wrapAround){var n=this.getRestingPosition();this.isFreeScrolling=-n>this.slides[0].target&&-n<this.getLastSlide().target}else this.options.freeScroll||i!=this.selectedIndex||(i+=this.dragEndBoostSelect());delete this.previousDragX,this.isDragSelect=this.options.wrapAround,this.select(i),delete this.isDragSelect,this.dispatchEvent("dragEnd",t,[e])}},s.dragEndRestingSelect=function(){var t=this.getRestingPosition(),e=Math.abs(this.getSlideDistance(-t,this.selectedIndex)),i=this._getClosestResting(t,e,1),n=this._getClosestResting(t,e,-1);return i.distance<n.distance?i.index:n.index},s._getClosestResting=function(t,e,i){for(var n=this.selectedIndex,s=1/0,o=this.options.contain&&!this.options.wrapAround?function(t,e){return t<=e}:function(t,e){return t<e};o(e,s)&&(n+=i,s=e,null!==(e=this.getSlideDistance(-t,n)));)e=Math.abs(e);return{distance:s,index:n-i}},s.getSlideDistance=function(t,e){var i=this.slides.length,s=this.options.wrapAround&&i>1,o=s?n.modulo(e,i):e,r=this.slides[o];if(!r)return null;var a=s?this.slideableWidth*Math.floor(e/i):0;return t-(r.target+a)},s.dragEndBoostSelect=function(){if(void 0===this.previousDragX||!this.dragMoveTime||new Date-this.dragMoveTime>100)return 0;var t=this.getSlideDistance(-this.dragX,this.selectedIndex),e=this.previousDragX-this.dragX;return t>0&&e>0?1:t<0&&e<0?-1:0},s.staticClick=function(t,e){var i=this.getParentCell(t.target),n=i&&i.element,s=i&&this.cells.indexOf(i);this.dispatchEvent("staticClick",t,[e,n,s])},s.onscroll=function(){var t=l(),e=this.pointerDownScroll.x-t.x,i=this.pointerDownScroll.y-t.y;(Math.abs(e)>3||Math.abs(i)>3)&&this._pointerDone()},e}),function(t,e){"function"==typeof define&&define.amd?define("flickity/js/prev-next-button",["./flickity","unipointer/unipointer","fizzy-ui-utils/utils"],function(i,n,s){return e(t,i,n,s)}):"object"==typeof module&&module.exports?module.exports=e(t,require("./flickity"),require("unipointer"),require("fizzy-ui-utils")):e(t,t.Flickity,t.Unipointer,t.fizzyUIUtils)}(window,function(t,e,i,n){"use strict";var s="http://www.w3.org/2000/svg";function o(t,e){this.direction=t,this.parent=e,this._create()}o.prototype=Object.create(i.prototype),o.prototype._create=function(){this.isEnabled=!0,this.isPrevious=-1==this.direction;var t=this.parent.options.rightToLeft?1:-1;this.isLeft=this.direction==t;var e=this.element=document.createElement("button");e.className="flickity-button flickity-prev-next-button",e.className+=this.isPrevious?" previous":" next",e.setAttribute("type","button"),this.disable(),e.setAttribute("aria-label",this.isPrevious?"Previous":"Next");var i=this.createSVG();e.appendChild(i),this.parent.on("select",this.update.bind(this)),this.on("pointerDown",this.parent.childUIPointerDown.bind(this.parent))},o.prototype.activate=function(){this.bindStartEvent(this.element),this.element.addEventListener("click",this),this.parent.element.appendChild(this.element)},o.prototype.deactivate=function(){this.parent.element.removeChild(this.element),this.unbindStartEvent(this.element),this.element.removeEventListener("click",this)},o.prototype.createSVG=function(){var t=document.createElementNS(s,"svg");t.setAttribute("class","flickity-button-icon"),t.setAttribute("viewBox","0 0 100 100");var e=document.createElementNS(s,"path"),i=function(t){if("string"==typeof t)return t;return"M "+t.x0+",50 L "+t.x1+","+(t.y1+50)+" L "+t.x2+","+(t.y2+50)+" L "+t.x3+",50  L "+t.x2+","+(50-t.y2)+" L "+t.x1+","+(50-t.y1)+" Z"}(this.parent.options.arrowShape);return e.setAttribute("d",i),e.setAttribute("class","arrow"),this.isLeft||e.setAttribute("transform","translate(100, 100) rotate(180) "),t.appendChild(e),t},o.prototype.handleEvent=n.handleEvent,o.prototype.onclick=function(){if(this.isEnabled){this.parent.uiChange();var t=this.isPrevious?"previous":"next";this.parent[t]()}},o.prototype.enable=function(){this.isEnabled||(this.element.disabled=!1,this.isEnabled=!0)},o.prototype.disable=function(){this.isEnabled&&(this.element.disabled=!0,this.isEnabled=!1)},o.prototype.update=function(){var t=this.parent.slides;if(this.parent.options.wrapAround&&t.length>1)this.enable();else{var e=t.length?t.length-1:0,i=this.isPrevious?0:e;this[this.parent.selectedIndex==i?"disable":"enable"]()}},o.prototype.destroy=function(){this.deactivate(),this.allOff()},n.extend(e.defaults,{prevNextButtons:!0,arrowShape:{x0:10,x1:60,y1:50,x2:70,y2:40,x3:30}}),e.createMethods.push("_createPrevNextButtons");var r=e.prototype;return r._createPrevNextButtons=function(){this.options.prevNextButtons&&(this.prevButton=new o(-1,this),this.nextButton=new o(1,this),this.on("activate",this.activatePrevNextButtons))},r.activatePrevNextButtons=function(){this.prevButton.activate(),this.nextButton.activate(),this.on("deactivate",this.deactivatePrevNextButtons)},r.deactivatePrevNextButtons=function(){this.prevButton.deactivate(),this.nextButton.deactivate(),this.off("deactivate",this.deactivatePrevNextButtons)},e.PrevNextButton=o,e}),function(t,e){"function"==typeof define&&define.amd?define("flickity/js/page-dots",["./flickity","unipointer/unipointer","fizzy-ui-utils/utils"],function(i,n,s){return e(t,i,n,s)}):"object"==typeof module&&module.exports?module.exports=e(t,require("./flickity"),require("unipointer"),require("fizzy-ui-utils")):e(t,t.Flickity,t.Unipointer,t.fizzyUIUtils)}(window,function(t,e,i,n){function s(t){this.parent=t,this._create()}s.prototype=Object.create(i.prototype),s.prototype._create=function(){this.holder=document.createElement("ol"),this.holder.className="flickity-page-dots",this.dots=[],this.handleClick=this.onClick.bind(this),this.on("pointerDown",this.parent.childUIPointerDown.bind(this.parent))},s.prototype.activate=function(){this.setDots(),this.holder.addEventListener("click",this.handleClick),this.bindStartEvent(this.holder),this.parent.element.appendChild(this.holder)},s.prototype.deactivate=function(){this.holder.removeEventListener("click",this.handleClick),this.unbindStartEvent(this.holder),this.parent.element.removeChild(this.holder)},s.prototype.setDots=function(){var t=this.parent.slides.length-this.dots.length;t>0?this.addDots(t):t<0&&this.removeDots(-t)},s.prototype.addDots=function(t){for(var e=document.createDocumentFragment(),i=[],n=this.dots.length,s=n+t,o=n;o<s;o++){var r=document.createElement("li");r.className="dot",r.setAttribute("aria-label","Page dot "+(o+1)),e.appendChild(r),i.push(r)}this.holder.appendChild(e),this.dots=this.dots.concat(i)},s.prototype.removeDots=function(t){this.dots.splice(this.dots.length-t,t).forEach(function(t){this.holder.removeChild(t)},this)},s.prototype.updateSelected=function(){this.selectedDot&&(this.selectedDot.className="dot",this.selectedDot.removeAttribute("aria-current")),this.dots.length&&(this.selectedDot=this.dots[this.parent.selectedIndex],this.selectedDot.className="dot is-selected",this.selectedDot.setAttribute("aria-current","step"))},s.prototype.onTap=s.prototype.onClick=function(t){var e=t.target;if("LI"==e.nodeName){this.parent.uiChange();var i=this.dots.indexOf(e);this.parent.select(i)}},s.prototype.destroy=function(){this.deactivate(),this.allOff()},e.PageDots=s,n.extend(e.defaults,{pageDots:!0}),e.createMethods.push("_createPageDots");var o=e.prototype;return o._createPageDots=function(){this.options.pageDots&&(this.pageDots=new s(this),this.on("activate",this.activatePageDots),this.on("select",this.updateSelectedPageDots),this.on("cellChange",this.updatePageDots),this.on("resize",this.updatePageDots),this.on("deactivate",this.deactivatePageDots))},o.activatePageDots=function(){this.pageDots.activate()},o.updateSelectedPageDots=function(){this.pageDots.updateSelected()},o.updatePageDots=function(){this.pageDots.setDots()},o.deactivatePageDots=function(){this.pageDots.deactivate()},e.PageDots=s,e}),function(t,e){"function"==typeof define&&define.amd?define("flickity/js/player",["ev-emitter/ev-emitter","fizzy-ui-utils/utils","./flickity"],function(t,i,n){return e(t,i,n)}):"object"==typeof module&&module.exports?module.exports=e(require("ev-emitter"),require("fizzy-ui-utils"),require("./flickity")):e(t.EvEmitter,t.fizzyUIUtils,t.Flickity)}(window,function(t,e,i){function n(t){this.parent=t,this.state="stopped",this.onVisibilityChange=this.visibilityChange.bind(this),this.onVisibilityPlay=this.visibilityPlay.bind(this)}n.prototype=Object.create(t.prototype),n.prototype.play=function(){"playing"!=this.state&&(document.hidden?document.addEventListener("visibilitychange",this.onVisibilityPlay):(this.state="playing",document.addEventListener("visibilitychange",this.onVisibilityChange),this.tick()))},n.prototype.tick=function(){if("playing"==this.state){var t=this.parent.options.autoPlay;t="number"==typeof t?t:3e3;var e=this;this.clear(),this.timeout=setTimeout(function(){e.parent.next(!0),e.tick()},t)}},n.prototype.stop=function(){this.state="stopped",this.clear(),document.removeEventListener("visibilitychange",this.onVisibilityChange)},n.prototype.clear=function(){clearTimeout(this.timeout)},n.prototype.pause=function(){"playing"==this.state&&(this.state="paused",this.clear())},n.prototype.unpause=function(){"paused"==this.state&&this.play()},n.prototype.visibilityChange=function(){this[document.hidden?"pause":"unpause"]()},n.prototype.visibilityPlay=function(){this.play(),document.removeEventListener("visibilitychange",this.onVisibilityPlay)},e.extend(i.defaults,{pauseAutoPlayOnHover:!0}),i.createMethods.push("_createPlayer");var s=i.prototype;return s._createPlayer=function(){this.player=new n(this),this.on("activate",this.activatePlayer),this.on("uiChange",this.stopPlayer),this.on("pointerDown",this.stopPlayer),this.on("deactivate",this.deactivatePlayer)},s.activatePlayer=function(){this.options.autoPlay&&(this.player.play(),this.element.addEventListener("mouseenter",this))},s.playPlayer=function(){this.player.play()},s.stopPlayer=function(){this.player.stop()},s.pausePlayer=function(){this.player.pause()},s.unpausePlayer=function(){this.player.unpause()},s.deactivatePlayer=function(){this.player.stop(),this.element.removeEventListener("mouseenter",this)},s.onmouseenter=function(){this.options.pauseAutoPlayOnHover&&(this.player.pause(),this.element.addEventListener("mouseleave",this))},s.onmouseleave=function(){this.player.unpause(),this.element.removeEventListener("mouseleave",this)},i.Player=n,i}),function(t,e){"function"==typeof define&&define.amd?define("flickity/js/add-remove-cell",["./flickity","fizzy-ui-utils/utils"],function(i,n){return e(t,i,n)}):"object"==typeof module&&module.exports?module.exports=e(t,require("./flickity"),require("fizzy-ui-utils")):e(t,t.Flickity,t.fizzyUIUtils)}(window,function(t,e,i){var n=e.prototype;return n.insert=function(t,e){var i=this._makeCells(t);if(i&&i.length){var n=this.cells.length;e=void 0===e?n:e;var s=function(t){var e=document.createDocumentFragment();return t.forEach(function(t){e.appendChild(t.element)}),e}(i),o=e==n;if(o)this.slider.appendChild(s);else{var r=this.cells[e].element;this.slider.insertBefore(s,r)}if(0===e)this.cells=i.concat(this.cells);else if(o)this.cells=this.cells.concat(i);else{var a=this.cells.splice(e,n-e);this.cells=this.cells.concat(i).concat(a)}this._sizeCells(i),this.cellChange(e,!0)}},n.append=function(t){this.insert(t,this.cells.length)},n.prepend=function(t){this.insert(t,0)},n.remove=function(t){var e=this.getCells(t);if(e&&e.length){var n=this.cells.length-1;e.forEach(function(t){t.remove();var e=this.cells.indexOf(t);n=Math.min(e,n),i.removeFrom(this.cells,t)},this),this.cellChange(n,!0)}},n.cellSizeChange=function(t){var e=this.getCell(t);if(e){e.getSize();var i=this.cells.indexOf(e);this.cellChange(i)}},n.cellChange=function(t,e){var i=this.selectedElement;this._positionCells(t),this._getWrapShiftCells(),this.setGallerySize();var n=this.getCell(i);n&&(this.selectedIndex=this.getCellSlideIndex(n)),this.selectedIndex=Math.min(this.slides.length-1,this.selectedIndex),this.emitEvent("cellChange",[t]),this.select(this.selectedIndex),e&&this.positionSliderAtSelected()},e}),function(t,e){"function"==typeof define&&define.amd?define("flickity/js/lazyload",["./flickity","fizzy-ui-utils/utils"],function(i,n){return e(t,i,n)}):"object"==typeof module&&module.exports?module.exports=e(t,require("./flickity"),require("fizzy-ui-utils")):e(t,t.Flickity,t.fizzyUIUtils)}(window,function(t,e,i){"use strict";e.createMethods.push("_createLazyload");var n=e.prototype;function s(t,e){this.img=t,this.flickity=e,this.load()}return n._createLazyload=function(){this.on("select",this.lazyLoad)},n.lazyLoad=function(){var t=this.options.lazyLoad;if(t){var e="number"==typeof t?t:0,n=this.getAdjacentCellElements(e),o=[];n.forEach(function(t){var e=function(t){if("IMG"==t.nodeName){var e=t.getAttribute("data-flickity-lazyload"),n=t.getAttribute("data-flickity-lazyload-src"),s=t.getAttribute("data-flickity-lazyload-srcset");if(e||n||s)return[t]}var o=t.querySelectorAll("img[data-flickity-lazyload], img[data-flickity-lazyload-src], img[data-flickity-lazyload-srcset]");return i.makeArray(o)}(t);o=o.concat(e)}),o.forEach(function(t){new s(t,this)},this)}},s.prototype.handleEvent=i.handleEvent,s.prototype.load=function(){this.img.addEventListener("load",this),this.img.addEventListener("error",this);var t=this.img.getAttribute("data-flickity-lazyload")||this.img.getAttribute("data-flickity-lazyload-src"),e=this.img.getAttribute("data-flickity-lazyload-srcset");this.img.src=t,e&&this.img.setAttribute("srcset",e),this.img.removeAttribute("data-flickity-lazyload"),this.img.removeAttribute("data-flickity-lazyload-src"),this.img.removeAttribute("data-flickity-lazyload-srcset")},s.prototype.onload=function(t){this.complete(t,"flickity-lazyloaded")},s.prototype.onerror=function(t){this.complete(t,"flickity-lazyerror")},s.prototype.complete=function(t,e){this.img.removeEventListener("load",this),this.img.removeEventListener("error",this);var i=this.flickity.getParentCell(this.img),n=i&&i.element;this.flickity.cellSizeChange(n),this.img.classList.add(e),this.flickity.dispatchEvent("lazyLoad",t,n)},e.LazyLoader=s,e}),function(t,e){"function"==typeof define&&define.amd?define("flickity/js/index",["./flickity","./drag","./prev-next-button","./page-dots","./player","./add-remove-cell","./lazyload"],e):"object"==typeof module&&module.exports&&(module.exports=e(require("./flickity"),require("./drag"),require("./prev-next-button"),require("./page-dots"),require("./player"),require("./add-remove-cell"),require("./lazyload")))}(window,function(t){return t}),function(t,e){"function"==typeof define&&define.amd?define("flickity-as-nav-for/as-nav-for",["flickity/js/index","fizzy-ui-utils/utils"],e):"object"==typeof module&&module.exports?module.exports=e(require("flickity"),require("fizzy-ui-utils")):t.Flickity=e(t.Flickity,t.fizzyUIUtils)}(window,function(t,e){t.createMethods.push("_createAsNavFor");var i=t.prototype;return i._createAsNavFor=function(){this.on("activate",this.activateAsNavFor),this.on("deactivate",this.deactivateAsNavFor),this.on("destroy",this.destroyAsNavFor);var t=this.options.asNavFor;if(t){var e=this;setTimeout(function(){e.setNavCompanion(t)})}},i.setNavCompanion=function(i){i=e.getQueryElement(i);var n=t.data(i);if(n&&n!=this){this.navCompanion=n;var s=this;this.onNavCompanionSelect=function(){s.navCompanionSelect()},n.on("select",this.onNavCompanionSelect),this.on("staticClick",this.onNavStaticClick),this.navCompanionSelect(!0)}},i.navCompanionSelect=function(t){var e=this.navCompanion&&this.navCompanion.selectedCells;if(e){var i=e[0],n=this.navCompanion.cells.indexOf(i),s=n+e.length-1,o=Math.floor(function(t,e,i){return(e-t)*i+t}(n,s,this.navCompanion.cellAlign));if(this.selectCell(o,!1,t),this.removeNavSelectedElements(),!(o>=this.cells.length)){var r=this.cells.slice(n,s+1);this.navSelectedElements=r.map(function(t){return t.element}),this.changeNavSelectedClass("add")}}},i.changeNavSelectedClass=function(t){this.navSelectedElements.forEach(function(e){e.classList[t]("is-nav-selected")})},i.activateAsNavFor=function(){this.navCompanionSelect(!0)},i.removeNavSelectedElements=function(){this.navSelectedElements&&(this.changeNavSelectedClass("remove"),delete this.navSelectedElements)},i.onNavStaticClick=function(t,e,i,n){"number"==typeof n&&this.navCompanion.selectCell(n)},i.deactivateAsNavFor=function(){this.removeNavSelectedElements()},i.destroyAsNavFor=function(){this.navCompanion&&(this.navCompanion.off("select",this.onNavCompanionSelect),this.off("staticClick",this.onNavStaticClick),delete this.navCompanion)},t}),function(t,e){"use strict";"function"==typeof define&&define.amd?define("imagesloaded/imagesloaded",["ev-emitter/ev-emitter"],function(i){return e(t,i)}):"object"==typeof module&&module.exports?module.exports=e(t,require("ev-emitter")):t.imagesLoaded=e(t,t.EvEmitter)}("undefined"!=typeof window?window:this,function(t,e){var i=t.jQuery,n=t.console;function s(t,e){for(var i in e)t[i]=e[i];return t}var o=Array.prototype.slice;function r(t){return Array.isArray(t)?t:"object"==typeof t&&"number"==typeof t.length?o.call(t):[t]}function a(t,e,o){if(!(this instanceof a))return new a(t,e,o);var l=t;"string"==typeof t&&(l=document.querySelectorAll(t)),l?(this.elements=r(l),this.options=s({},this.options),"function"==typeof e?o=e:s(this.options,e),o&&this.on("always",o),this.getImages(),i&&(this.jqDeferred=new i.Deferred),setTimeout(this.check.bind(this))):n.error("Bad element for imagesLoaded "+(l||t))}a.prototype=Object.create(e.prototype),a.prototype.options={},a.prototype.getImages=function(){this.images=[],this.elements.forEach(this.addElementImages,this)},a.prototype.addElementImages=function(t){"IMG"==t.nodeName&&this.addImage(t),!0===this.options.background&&this.addElementBackgroundImages(t);var e=t.nodeType;if(e&&l[e]){for(var i=t.querySelectorAll("img"),n=0;n<i.length;n++){var s=i[n];this.addImage(s)}if("string"==typeof this.options.background){var o=t.querySelectorAll(this.options.background);for(n=0;n<o.length;n++){var r=o[n];this.addElementBackgroundImages(r)}}}};var l={1:!0,9:!0,11:!0};function h(t){this.img=t}function c(t,e){this.url=t,this.element=e,this.img=new Image}return a.prototype.addElementBackgroundImages=function(t){var e=getComputedStyle(t);if(e)for(var i=/url\((['"])?(.*?)\1\)/gi,n=i.exec(e.backgroundImage);null!==n;){var s=n&&n[2];s&&this.addBackground(s,t),n=i.exec(e.backgroundImage)}},a.prototype.addImage=function(t){var e=new h(t);this.images.push(e)},a.prototype.addBackground=function(t,e){var i=new c(t,e);this.images.push(i)},a.prototype.check=function(){var t=this;function e(e,i,n){setTimeout(function(){t.progress(e,i,n)})}this.progressedCount=0,this.hasAnyBroken=!1,this.images.length?this.images.forEach(function(t){t.once("progress",e),t.check()}):this.complete()},a.prototype.progress=function(t,e,i){this.progressedCount++,this.hasAnyBroken=this.hasAnyBroken||!t.isLoaded,this.emitEvent("progress",[this,t,e]),this.jqDeferred&&this.jqDeferred.notify&&this.jqDeferred.notify(this,t),this.progressedCount==this.images.length&&this.complete(),this.options.debug&&n&&n.log("progress: "+i,t,e)},a.prototype.complete=function(){var t=this.hasAnyBroken?"fail":"done";if(this.isComplete=!0,this.emitEvent(t,[this]),this.emitEvent("always",[this]),this.jqDeferred){var e=this.hasAnyBroken?"reject":"resolve";this.jqDeferred[e](this)}},h.prototype=Object.create(e.prototype),h.prototype.check=function(){this.getIsImageComplete()?this.confirm(0!==this.img.naturalWidth,"naturalWidth"):(this.proxyImage=new Image,this.proxyImage.addEventListener("load",this),this.proxyImage.addEventListener("error",this),this.img.addEventListener("load",this),this.img.addEventListener("error",this),this.proxyImage.src=this.img.src)},h.prototype.getIsImageComplete=function(){return this.img.complete&&this.img.naturalWidth},h.prototype.confirm=function(t,e){this.isLoaded=t,this.emitEvent("progress",[this,this.img,e])},h.prototype.handleEvent=function(t){var e="on"+t.type;this[e]&&this[e](t)},h.prototype.onload=function(){this.confirm(!0,"onload"),this.unbindEvents()},h.prototype.onerror=function(){this.confirm(!1,"onerror"),this.unbindEvents()},h.prototype.unbindEvents=function(){this.proxyImage.removeEventListener("load",this),this.proxyImage.removeEventListener("error",this),this.img.removeEventListener("load",this),this.img.removeEventListener("error",this)},c.prototype=Object.create(h.prototype),c.prototype.check=function(){this.img.addEventListener("load",this),this.img.addEventListener("error",this),this.img.src=this.url,this.getIsImageComplete()&&(this.confirm(0!==this.img.naturalWidth,"naturalWidth"),this.unbindEvents())},c.prototype.unbindEvents=function(){this.img.removeEventListener("load",this),this.img.removeEventListener("error",this)},c.prototype.confirm=function(t,e){this.isLoaded=t,this.emitEvent("progress",[this,this.element,e])},a.makeJQueryPlugin=function(e){(e=e||t.jQuery)&&((i=e).fn.imagesLoaded=function(t,e){return new a(this,t,e).jqDeferred.promise(i(this))})},a.makeJQueryPlugin(),a}),function(t,e){"function"==typeof define&&define.amd?define(["flickity/js/index","imagesloaded/imagesloaded"],function(i,n){return e(t,i,n)}):"object"==typeof module&&module.exports?module.exports=e(t,require("flickity"),require("imagesloaded")):t.Flickity=e(t,t.Flickity,t.imagesLoaded)}(window,function(t,e,i){"use strict";e.createMethods.push("_createImagesLoaded");var n=e.prototype;return n._createImagesLoaded=function(){this.on("activate",this.imagesLoaded)},n.imagesLoaded=function(){if(this.options.imagesLoaded){var t=this;i(this.slider).on("progress",function(e,i){var n=t.getParentCell(i.img);t.cellSizeChange(n&&n.element),t.options.freeScroll||t.positionSliderAtSelected()})}},e});
  
         while(!window.Flickity) {
        await new Promise(resolve => setTimeout(resolve, 10));
    }
      

            resolve(true);
  
  });
} 


     function loadFlickity() {

        if (window.Flickity !== undefined) {
            return true;
        }
      
        return new Promise(async (resolve, reject) => {
                           try{
                       await _loadScript(`https://cdnjs.cloudflare.com/ajax/libs/flickity/2.2.2/flickity.pkgd.min.js`);    
                           } catch(err){
        	await loadLocalFlickity();
        }
            
  			
  		

            resolve(true);

        });
    }




    function changeSlideOnNonSliderThumbnail($slider) {

        if (options.enableSliderForThumbnailsDesktop) {
            return;
        }



        const $thumbnails = document.querySelectorAll(`.Thumbnails--non-slider .product-single__thumbnail`);

        if (!$thumbnails) {
            return;
        }

        //changes featured image when thumbnail is clicked
        for (let each of $thumbnails) {
            each.addEventListener('click', function(e) {
                const updateFeaturedImage = () => {
                    const _index = each.getAttribute("data-thumbnail-index-ezfy");

                    if (!_index) {
                        return;
                    }

                    const index = parseInt(_index);
                    $slider.select(index, options.featuredImageLoop, true)
                }
                setTimeout(updateFeaturedImage, NON_SLIDER_THUMBNAIL_CLICK_UPDATE_DELAY)
            });
        }

    }





    function updateFeaturedImageOnDropdownChange($slider) {
 
      /* XX */
      
        if (CHANGING_IMAGE_VIA_SLIDER){
          return;
        }
      

        const options = document.querySelectorAll(`.selector-wrapper`);

        if (!options) {
            return;
        }

        for (let each of options) {
            each.addEventListener('change', async function() {

                CHANGING_IMAGE_VIA_DROPDOWN = true;
                const changeImage = async () => {

                    const variant = await _getCurrentVariant();

                    if (!variant) {
                        return;
                    }

                    const id = 'featured_image' in variant ? variant.featured_image.id : variant.featured_media.id;
                  	const position = variant.featured_image.position || variant.featured_media.position;


                    if (!id) {
                        return console.log("No image associated.")
                    }
                  
                  console.log(CHANGING_IMAGE_VIA_SLIDER)
      

                    const $slide = document.querySelector(`#${FEATURED_IMAGE_ID} [data-image-position='${position}']`); /* ` */

                    if (!$slide) {
                        return;
                    }

                    const index = $slide.getAttribute(`data-slide-index`);

                  if (!CHANGING_IMAGE_VIA_SLIDER){
                    $slider.select(index);
                  }
                  

                }

                setTimeout(changeImage, UPDATE_IMAGE_ON_DROPDOWN_CHANGE_DELAY);
                await _sleep(UPDATE_IMAGE_ON_DROPDOWN_CHANGE_DELAY);
                CHANGING_IMAGE_VIA_DROPDOWN = false;

            });
        }
    }


    async function updateSlideWithVariantOnPageLoad($slider) {
      
      
      
      if (!/variant=\d/.test(window.location.href)){
      	return;
      }
      
            CHANGING_IMAGE_VIA_PAGE_LOAD = true;

      
      
      
        try {
            const variant = await _getCurrentVariant();



            console.log("load", variant);
            if (!variant || variant.length <= 0) {
                return;
            }


            const id = 'featured_image' in variant ? variant.featured_image.id : variant.featured_media.id;
   	const position = variant.featured_image.position || variant.featured_media.position;
            if (!id || id.length <= 0) {
                return console.log(`No variant.`);
            }

                    const $slide = document.querySelector(`#${FEATURED_IMAGE_ID} [data-image-position='${position}']`); /* ` */


            if (!$slide) {
                return;
            }

          
          
            const index = parseInt($slide.getAttribute("data-slide-index"));



            $slider.select(index, options.featuredImageLoop, true)
             await _sleep(UPDATE_IMAGE_ON_DROPDOWN_CHANGE_DELAY);
            CHANGING_IMAGE_VIA_PAGE_LOAD = false;


        } catch (err) {
            return;
        }

    }



    async function updateDropdownOnImageChange() {
      
      if (CHANGING_IMAGE_VIA_DROPDOWN || CHANGING_IMAGE_VIA_PAGE_LOAD) {
            return console.log("image is being changed via dropdown.");
        }
  

        await _sleep(ACTION_DELAY);
      
  
        const $active = document.querySelector(`#${FEATURED_IMAGE_ID} .is-selected`); /*`*/


        if (!$active) {
            return;
        }
      
      	const isVideo = $active.hasAttribute(`data-product-media-type-video`);
      
        
      
      if (isVideo){
      	return;
      }

        const id = $active.getAttribute(`data-image-dropdown-id`);
      

        const variant = await _getVariantFromImageIDUpdated(id);

		        for (const [i, option] of variant.entries()) {

            const index = parseInt(i) + 1;

            const $select = document.querySelector(`select[data-option-ezfy="option${index}"]`);

            console.log("this select", $select);
              
          
            if (!$select) {
                return;
            }
    

            try {
                $select.value = option;
                $select.dispatchEvent(new Event('change', {
                    'bubbles': true
                }));
            } catch (err) {}
        }
     
    }



    function highlightCurrentlyChosenNonSliderThumbnail() {
        const _activeClass = `active-thumb`
        const _class = "Thumbnail--selected";
        const index = window.CURRENTLY_ACTIVE_INDEX;

        const $thumbnail = document.querySelector(`[data-thumbnail-index-ezfy="${index}"]`);

        if (!$thumbnail) {
            return;
        }

        const $selected = document.querySelectorAll(`.${_class}, .${_activeClass}`); /*`*/

        if ($selected && $selected.length >= 1) {
            for (const each of $selected) {

                each.classList.remove(_class);
                each.classList.remove(_activeClass);
            }
        }

        $thumbnail.classList.add(_class);
    }



    function loadNonSliderThumbnails() {
        const _class = `Thumbnails--non-slider--loaded`

        const $thumbnail = document.querySelector(`.Thumbnails--non-slider`); /*`*/

        if (!$thumbnail) {
            return;
        }

        $thumbnail.classList.add(_class);
    }


    async function featuredImageSlider() {
        let $slider = new Flickity(`#${FEATURED_IMAGE_ID}`, {
            /*`*/
            ...featuredImageSettings,
            on: {
                ready: async function(index) {
                    highlightCurrentlyChosenNonSliderThumbnail();
                    loadNonSliderThumbnails();
                },
                change: async function(index) {
          			CHANGING_IMAGE_VIA_SLIDER = true;
                    window.CURRENTLY_ACTIVE_INDEX = index;


                    updateDropdownOnImageChange();
                    highlightCurrentlyChosenNonSliderThumbnail();
             		await _sleep(UPDATE_DROPDOWN_ON_IMAGE_CHANGE_DELAY);
          			CHANGING_IMAGE_VIA_SLIDER = false;
                }
            }
        });

        window.ezfyDebutSliderFeatured = $slider;

        updateSlideWithVariantOnPageLoad($slider);
        updateFeaturedImageOnDropdownChange($slider);
        changeSlideOnNonSliderThumbnail($slider);


    }

    function thumbnailsSlider() {
            const _class = `#thumbnailsEzfy`;
      
        if (!options.enableSliderForThumbnailsDesktop) {
            return;
        }      
      
      
      if (!document.querySelector(_class)){
      	return;
      }

        const $thumbnails = new Flickity(_class, thumbnailsSettings, {
            on: {
                ready: function() {
                    console.log('thumbnails ready');
                }
            }
        });
    }

    /* If a thumbnail is clicked it shows the image on a new window. 
	This function cancels that. */
    function thumbnailCancelClick() {
        const $thumbnails = document.querySelectorAll(`#thumbnailsEzfy a`);

        if (!$thumbnails) {

            return;
        }

        for (let each of $thumbnails) {
            each.addEventListener('click', function(e) {
                e.preventDefault();
            });
        }

    }

    return {
        init: async function() {
            await loadFlickity();
            await _sleep(350);

            featuredImageSlider();
            thumbnailsSlider();
            thumbnailCancelClick();
            document.addEventListener("DOMContentLoaded", async function() {



            });

            window.addEventListener("resize", function() {});

            window.addEventListener("load", function() {});

            window.addEventListener("scroll", function() {});
        },
    };
})();

ezfyDebutSliderPro.init();