{{ 'jquery.elevateZoom.min.js' | asset_url | script_tag }}
{{ 'option_selection.js' | shopify_asset_url | script_tag }}

{%- assign thumbnai_position = "none" -%}
{%- assign product_reviews = section.settings.display_product_reviews -%}
{%- assign product_vendor = section.settings.show_vendor -%}
{%- assign product_type = section.settings.show_product_type -%}
{%- assign product_ccountdown = section.settings.show_product_countdown -%}
{%- assign product_colorswatch = section.settings.use_color_swatch -%}
{%- assign product_subtotal = section.settings.show_price_subtotal -%}
{%- assign product_quantity = section.settings.show_quantity_selector -%}
{%- assign product_share = section.settings.show_share_buttons -%}
{%- assign product_tags = section.settings.show_tag -%}
{%- assign product_brand = section.settings.show_brand -%}
{%- assign product_category = section.settings.show_category -%}
{%- assign pt_item = section.settings.pt_item -%}

{% assign pp_grid = settings.pp_grid %}
{% case pp_grid %}
{% when '2' %}
{% assign g_col_left = 'col-lg-3 col-md-12 col-sm-12 col-12' %}
{% assign g_col_right = 'col-lg-9 col-md-12 col-sm-12 col-12' %}

{% when '3' %}
{% assign g_col_left = 'col-lg-4 col-md-12 col-sm-12 col-12' %}
{% assign g_col_right = 'col-lg-8 col-md-12 col-sm-12 col-12' %}

{% when '4' %}
{% assign g_col_left = 'col-lg-5 col-md-12 col-sm-12 col-12' %}
{% assign g_col_right = 'col-lg-7 col-md-12 col-sm-12 col-12' %}

{% when '5' %}
{% assign g_col_left = 'col-lg-6 col-md-12 col-sm-12 col-12' %}
{% assign g_col_right = 'col-lg-6 col-md-12 col-sm-12 col-12' %}

{% when '6' %}
{% assign g_col_left = 'col-lg-7 col-md-12 col-sm-12 col-12' %}
{% assign g_col_right = 'col-lg-5 col-md-12 col-sm-12 col-12' %}

{% when '7' %}
{% assign g_col_left = 'col-lg-8 col-md-12 col-sm-12 col-12' %}
{% assign g_col_right = 'col-lg-4 col-md-12 col-sm-12 col-12' %}

{% when '8' %}

{% assign g_col_left = 'col-lg-9 col-md-12 col-sm-12 col-12' %}
{% assign g_col_right = 'col-lg-3 col-md-12 col-sm-12 col-12' %}

{% else %}
{% assign g_col_left = 'col-lg-6 col-md-12 col-sm-12 col-12' %}
{% assign g_col_right = 'col-lg-6 col-md-12 col-sm-12 col-12' %}
{% endcase %}

{% assign swp_nav = false %}
{% assign pSize = product.images | size %}
{% assign pSize = pSize | times: 1 %}
{% assign pt_item = pt_item | times: 1 %}

{% if pSize > pt_item %}
{% assign swp_nav = true %}
{% endif %}

{% assign direction = "horizontal" %}
{% if section.settings.pt_position contains "left" or section.settings.pt_position contains "right" %}
{% assign direction = "vertical" %}
{% endif %}

{% 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_zoom = section.settings.enable_zoom %}
{% assign vertical = section.settings.media_slide_layout %}
{% assign zoom = section.settings.zoom_mode %}
{% if settings.product_layout == '1col' %}
{% include 'product-layout-scroll'%}
{% else %}
<div id="ProductSection-{{ section.id }}" class="product-template__containe product" itemscope itemtype="http://schema.org/Product">
<meta itemprop="name" content="{{ product.title }}">
<meta itemprop="url" content="{{ shop.url }}{{ product.url }}">
<meta itemprop="image" content="{{ product.featured_image.src | img_url: '800x' }}">

<div class="product-single {% if section.settings.enable_sevicer %}oneCol{% endif %}">
<div class="row font-ct">
<div class="{{ g_col_left }} {% if section.settings.pt_position == 'bottom' %} horizontal{% else %} vertical{% endif %}">
<div class=" product-media thumbnais-{{ section.settings.pt_position }}">

<div class="product-photo-container slider-for{% if section.settings.pt_position == 'bottom' %} horizontal{% else %} vertical{% endif %}">

{% for image in product.images %}
<div class="thumb">
<a class="fancybox" rel="nofollow" href=''1024x' }}" >
<img id="product-featured-image-{{image.id}}" class="product-featured-img" src="{{ image | img_url: 'original' }}" alt="{{ image.alt | escape }}" data-zoom-image="{{ image.src | img_url: 'original' }}"/>
</a>
</div>
{% endfor %}

</div>

<div class="slider-nav{% if section.settings.pt_position == 'bottom' %} horizontal{% else %} vertical{% endif %}" id="gallery_01">
{% for image in product.images %}
<div class="item">
<a class ="thumb" href='' data-image="{{ image.src | product_img_url: 'original' }}" data-zoom-image="{{ image.src | product_img_url: 'original' }}">
<img src="{{ image.src | product_img_url: '100x100' }}" alt="{{ image.alt | escape }}">
</a>
</div>
{% endfor %}
</div>
</div>
</div>
<div class="{{ g_col_right }} product-single__detail grid__item {{ product_description_width }}">
<div class="product-single__meta">
<h1 itemprop="name" class="product-single__title">{{ product.title }}</h1>
{% if product_reviews %}
<div class="custom-reviews a-left hidden-xs">
<span class="shopify-product-reviews-badge" data-id="{{ product.id }}"></span>
</div>
{% endif %}
<div class="clearfix" itemprop="offers" itemscope itemtype="http://schema.org/Offer">
<meta itemprop="priceCurrency" content="{{ shop.currency }}">
<link itemprop="availability" href="https://justpaste.it/redirect/4j54j/http%3A%2F%2Fschema.org%2F%7B%25%20if%20product.available%20%25%7DInStock%7B%25%20else%20%25%7DOutOfStock%7B%25%20endif%20%25%7D">
</div>
<div class="clearfix product-price" itemprop="offers" itemscope itemtype="http://schema.org/Offer">
<meta itemprop="priceCurrency" content="{{ shop.currency }}">
<link itemprop="availability" href="https://justpaste.it/redirect/4j54j/http%3A%2F%2Fschema.org%2F%7B%25%20if%20product.available%20%25%7DInStock%7B%25%20else%20%25%7DOutOfStock%7B%25%20endif%20%25%7D">
<p class="price-box product-single__price-{{ section.id }}{% unless current_variant.available %} product-price--sold-out{% endunless %}">
{% if current_variant.compare_at_price > current_variant.price %}
<span class="special-price product-price__price product-price__price-{{ section.id }} product-price__sale product-price__sale--single">
<span id="ProductPrice-{{ section.id }}"
itemprop="price" content="{{ current_variant.price | divided_by: 100.00 }}">
{{ current_variant.price | money }}
</span>
</span>
<s class="old-price" id="ComparePrice-{{ section.id }}">{{ current_variant.compare_at_price | money }}</s>
{% else %}
<span class="visually-hidden">{{ 'products.product.regular_price' | t }}</span>
<span class="product-price__price product-price__price-{{ section.id }} price">
<span id="ProductPrice-{{ section.id }}" itemprop="price" content="{{ current_variant.price | divided_by: 100.00 }}">
{{ current_variant.price | money }}
</span>
</span>
<s id="ComparePrice-{{ section.id }}" class="hide">{{ current_variant.compare_at_price | money }}</s>

{% endif %}
</p>
</div>
<div class="product-info">
{% if product.available %}
<p class="product-single__alb instock"><label>{{ 'products.product.availability' | t }}</label>: <i class="fa fa-check"></i> {{'products.product.available' | t }}</p>
{% else %}
<p class="product-single__alb outstock"><label>{{ 'products.product.availability' | t }}</label>: {{'products.product.unavailable' | t }}</p>
{% endif %}
{% if product_type %}
<p class="product-single__type"><label>{{ 'products.product.type' | t }}</label>: {{ product.type }}</p>
{% endif %}
{% if product_vendor %}
<p itemprop="brand" class="product-single__vendor"><label>{{ 'products.product.vendor' | t }}</label>: {{ product.vendor | link_to_vendor }}</p>
{% endif %}

</div>

{% if section.settings.show_desc == 'short' %}
{% if product.description != blank %}
{% assign content = product.description %}
{% if content contains "[shortcode]" %}
{% assign str = content | split: "[/shortcode]" | first %}
{% assign str = str | split: "[shortcode]" | last %}
{% assign str = "[shortcode]" | append: str | append: "[/shortcode]" %}
{% assign content = content | remove: str %}
{% endif %}
<div class="rte product-description short">
<label class="d-none">{{ 'products.product.overview' | t }}</label>
{{ content | strip_html | truncatewords: 22}}
</div>
{% endif %}

{% elsif section.settings.show_desc == 'full' %}
{% if product.description != blank %}
{% assign content = product.description %}
{% if content contains "[shortcode]" %}
{% assign str = content | split: "[/shortcode]" | first %}
{% assign str = str | split: "[shortcode]" | last %}
{% assign str = "[shortcode]" | append: str | append: "[/shortcode]" %}
{% assign content = content | remove: str %}
{% endif %}
<div class="rte product-description full">
<label class="d-none">{{ 'products.product.overview' | t }}</label>
{{ content }}
</div>
{% endif %}
{% endif %}

<div itemprop="offers" itemscope itemtype="http://schema.org/Offer">
<meta itemprop="priceCurrency" content="{{ shop.currency }}">
<link itemprop="availability" href="https://justpaste.it/redirect/4j54j/http%3A%2F%2Fschema.org%2F%7B%25%20if%20product.available%20%25%7DInStock%7B%25%20else%20%25%7DOutOfStock%7B%25%20endif%20%25%7D">
<form action="/cart/add" method="post" enctype="multipart/form-data" class="product-form product-form-{{ section.id }}{% unless section.settings.show_variant_labels %} product-form--hide-variant-labels{% endunless %}" data-section="{{ section.id }}">
<div id="product-variants">
{% assign variantCount = product.variants | size %}
{% if product.available %}
{% if variantCount > 1 %}
<div class="{% if section.settings.use_color_swatch %}d-none{% else %}row no-swatch{% endif%}">
<select id="product-selectors" name="id" class="hidden box-sellect" style="display:none">
{% for variant in product.variants %}
<option {% if variant == product.selected_or_first_available_variant %} selected="selected" {% endif %} value="{{ variant.id }}">{{ variant.title }} - {{ variant.price | money }}</option>
{% endfor %}
</select>
</div>
{% if product_colorswatch %}
{% for option in product.options %}
{% include 'swatch' with option %}
{% endfor %}
{% endif %}
{% else %}
<input type="hidden" name="id" value="{{ product.variants[0].id }}" />
{% endif %}
{% endif %}

</div>
{% if product_subtotal %}
<div class="total-price">
<label>{{ 'cart.general.subtotal' | t }}: </label><span class="money">{{ product.price | money }}</span>
</div>
{% endif %}
<div class="product-options-bottom">
{% if product_quantity %}
<div class="product-form__item product-form__item--quantity">
<label for="Quantity" class="quantity-selector">{{ 'products.product.quantity' | t }}:</label>
<div class="form_qty">

<div class="reduced items" onclick="var result = document.getElementById('qty'); var qty = result.value; if( !isNaN( qty ) &amp;&amp; qty > 1 ) result.value--; updatePricing(); return false;">
<i class="fa fa-minus"></i>
</div>
<input type="text" id="qty" name="quantity" value="1" min="1" class="quantity-selector">
<div class="increase items" onclick="var result = document.getElementById('qty'); var qty = result.value; if( !isNaN( qty )) result.value++; updatePricing(); return false;">
<i class="fa fa-plus"></i>
</div>

</div>
</div>
{% endif %}

<div class="product-form__item product-form__item--submit">
<button type="submit" name="add" id="AddToCart-{{ section.id }}" {% unless current_variant.available %}disabled="disabled"{% endunless %} class="btn product-form__cart-submit{% if product.options.size == 1 and product.variants[0].title == 'Default Title' %} product-form__cart-submit--small{% endif %}">
<span id="AddToCartText-{{ section.id }}">
{% unless current_variant.available %}
<i class="fa fa-shopping-basket"></i>
{{ 'products.product.sold_out' | t }}
{% else %}
<i class="fa fa-shopping-basket"></i>
{{ 'products.product.add_to_cart' | t }}
{% endunless %}
</span>
</button>
</div>
</div>
</form>
{% include 'product-wishlist' %}
</div>
<div class="product-wrap">
{% if product_share %}
<div class="wrap__social social_share_detail clearfix">
<label class="">{{ 'general.social.share' | t }}:</label>
<ul>
<div class="addthis_inline_share_toolbox"></div>
<script type="text/javascript" src="//s7.addthis.com/js/300/addthis_widget.js#pubid=ra-529be2200cc72db5"></script>
</ul>
</div>

{% endif %}
{% if product_category %}
<div class="wrap__category detail_category">
<h2>Category: </h2>
<ul class="category_content">
{% unless product.collections == blank %}
{% for c in product.collections limit: 2 %}
<li>{{ c.title | link_to:c.url }}</li>{% unless forloop.last %}, {% endunless %}
{% endfor %}
{% endunless %}
</ul>
</div>
{% endif %}
{% if product_tags %}
<div class="wrap__tag detail_tag">
<h2>Tags: </h2>
<ul id="details" class="hlist">

{% for tag in product.tags limit: 3 %}
<li>{{ tag | link_to_tag: tag }}</li>{% unless forloop.last %}, {% endunless %}
{% endfor %}
</ul>
</div>
{% endif %}
{% if product_brand %}
<div class="wrap__brand">
<label class="">Guaranteed safe checkout:</label>
<div class="wrap__brand_content">
{% if section.settings.product_brand != blank %}
<img src="{{ section.settings.product_brand | img_url: "master" }}" alt="{{ section.settings.product_brand }}" />
{% else %}
<img class="img-responsive" alt="{{ shop.name }}" src="//placehold.it/280x25" />
{% endif %}
</div>
</div>
{% endif %}
</div>
</div>
{% if section.settings.enable_sevicer %}
<div class="product-single__services">
<div class="banner-policy">
<div class="inner">
<div class="policy policy1">
<a title="90 days money back" href=''>
{% if section.settings.sv_icon !=blank %}
<span class="ico-policy">
<i class="fa fa-{{ section.settings.sv_icon }}"></i>
</span>
{% endif %}
{% if section.settings.sv_title != blank %}
<h3 class="des">{{ section.settings.sv_title }}</h3>
{% endif %}
</a>
</div>
<div class="policy policy2">
<a title="90 days money back" href=''>
{% if section.settings.sv_icon_2 !=blank %}
<span class="ico-policy">
<i class="fa fa-{{ section.settings.sv_icon_2 }}"></i>
</span>
{% endif %}
{% if section.settings.sv_title_2 != blank %}
<h3 class="des">{{ section.settings.sv_title_2 }}</h3>
{% endif %}
</a>
</div>
<div class="policy policy3">
<a title="90 days money back" href=''>
{% if section.settings.sv_icon_3 !=blank %}
<span class="ico-policy">
<i class="fa fa-{{ section.settings.sv_icon_3 }}"></i>
</span>
{% endif %}
{% if section.settings.sv_title_3 != blank %}
<h3 class="des">{{ section.settings.sv_title_3 }}</h3>
{% endif %}
</a>
</div>
<div class="policy policy3">
<a title="90 days money back" href=''>
{% if section.settings.sv_icon_4 !=blank %}
<span class="ico-policy">
<i class="fa fa-{{ section.settings.sv_icon_4 }}"></i>
</span>
{% endif %}
{% if section.settings.sv_title_4 != blank %}
<h3 class="des">{{ section.settings.sv_title_4 }}</h3>
{% endif %}
</a>
</div>
</div>
</div>
</div>
{% endif %}
</div>
<div class="rte product-description full">
{% include 'single-product-tab' %}
</div>
</div>
<div class="panel-group detail-bottom font-ct">
{% if section.settings.product_tab_type == 'protab' %}
<div class="tab-vertical">
<ul class="nav nav-tabs">
{% if section.settings.product_tab1_enable %}
<li class="nav-item"><a class="nav-link active" href='' data-toggle="tab">{{ section.settings.product_tab1_title }}</a></li>
{% endif %}
{% if section.settings.product_tab2_enable %}
<li class="nav-item"><a class="nav-link" href='' data-toggle="tab">{{ section.settings.product_tab2_title }}</a></li>
{% endif %}
{% if section.settings.product_tab3_enable %}
<li class="nav-item"><a class="nav-link" href='' data-toggle="tab">{{ section.settings.product_tab3_title }}</a></li>
{% endif %}
{% if section.settings.product_tab4_enable %}
<li class="nav-item"><a class="nav-link" href='' data-toggle="tab">{{ section.settings.product_tab4_title }}</a></li>
{% endif %}
</ul>
<div class="tab-content">
{% if section.settings.product_tab1_enable %}
<div class="tab-pane active" id="tabs1">
{% if product.description != blank %}
{% assign content = product.description %}
{% if content contains "[shortcode]" %}
{% assign str = content | split: "[/shortcode]" | first %}
{% assign str = str | split: "[shortcode]" | last %}
{% assign str = "[shortcode]" | append: str | append: "[/shortcode]" %}
{% assign content = content | remove: str %}
{% endif %}
<div class="rte description">
<label class="d-none">{{ 'products.product.overview' | t }}</label>
{{ content }}
</div>
{% endif %}
</div>
{% endif %}
{% if section.settings.product_tab2_enable %}
<div class="tab-pane" id="tabs2">{{ section.settings.product_tab2_content }}</div>
{% endif %}
{% if section.settings.product_tab3_enable %}
<div class="tab-pane" id="tabs3">
{% if section.settings.custom_size_chart != blank %}
<img src="{{ section.settings.custom_size_chart | img_url: "master" }}" alt="{{ section.settings.custom_size_chart_title }}" />
{% else %}
<div class="placeholder-bg">
{% include 'placeholder-svg' %}
</div>
{% endif %}
</div>
{% endif %}
{% if section.settings.product_tab4_enable %}
<div class="tab-pane" id="tabs4">
<div id="shopify-product-reviews" data-id="{{product.id}}">{{ product.metafields.spr.reviews }}</div>
</div>
{% endif %}
</div>
</div>
{% elsif section.settings.product_tab_type == 'protab_hozizoltal' %}
<div class="tab-hozizoltal">
<ul class="nav nav-tabs font-ct">
{% if section.settings.product_tab1_enable %}
<li class="nav-item"><a class="nav-link active" href='' data-toggle="tab">{{ section.settings.product_tab1_title }}</a></li>
{% endif %}
{% if section.settings.product_tab2_enable %}
<li class="nav-item"><a class="nav-link" href='' data-toggle="tab">{{ section.settings.product_tab2_title }}</a></li>
{% endif %}
{% if section.settings.product_tab3_enable %}
<li class="nav-item"><a class="nav-link" href='' data-toggle="tab">{{ section.settings.product_tab3_title }}</a></li>
{% endif %}
{% if section.settings.product_tab4_enable %}
<li class="nav-item"><a class="nav-link" href='' data-toggle="tab">{{ section.settings.product_tab4_title }}</a></li>
{% endif %}
</ul>
<div class="tab-content">
{% if section.settings.product_tab1_enable %}
<div class="tab-pane active" id="tabs1">
{% if product.description != blank %}
{% assign content = product.description %}
{% if content contains "[shortcode]" %}
{% assign str = content | split: "[/shortcode]" | first %}
{% assign str = str | split: "[shortcode]" | last %}
{% assign str = "[shortcode]" | append: str | append: "[/shortcode]" %}
{% assign content = content | remove: str %}
{% endif %}
<div class="rte description">
<label class="d-none">{{ 'products.product.overview' | t }}</label>
{{ content }}
</div>
{% endif %}
</div>
{% endif %}
{% if section.settings.product_tab2_enable %}
<div class="tab-pane" id="tabs2">{{ section.settings.product_tab2_content }}</div>
{% endif %}
{% if section.settings.product_tab3_enable %}
<div class="tab-pane" id="tabs3">
{% if section.settings.custom_size_chart != blank %}
<img src="{{ section.settings.custom_size_chart | img_url: "master" }}" alt="{{ section.settings.custom_size_chart_title }}" />
{% else %}
<div class="placeholder-bg">
{% include 'placeholder-svg' %}
</div>
{% endif %}
</div>
{% endif %}
{% if section.settings.product_tab4_enable %}
<div class="tab-pane" id="tabs4">
<div id="shopify-product-reviews" data-id="{{product.id}}">{{ product.metafields.spr.reviews }}</div>
</div>
{% endif %}

</div>
</div>
{% elsif section.settings.product_tab_type == 'propanel' %}
<div class="panel-group panel-accor" id="panel-accordion">
{% if section.settings.product_tab1_enable %}
<div class="panel">
<div class="panel-heading" id="headingOne">
<h4 class="panel-title">
<a data-toggle="collapse" data-parent="#panel-accordion" href=''>{{ section.settings.product_tab1_title }}</a>
</h4>
</div>
<div id="tab1" class="panel-collapse collapse">
<div class="panel-body">
{% if product.description != blank %}
{% assign content = product.description %}
{% if content contains "[shortcode]" %}
{% assign str = content | split: "[/shortcode]" | first %}
{% assign str = str | split: "[shortcode]" | last %}
{% assign str = "[shortcode]" | append: str | append: "[/shortcode]" %}
{% assign content = content | remove: str %}
{% endif %}
<div class="rte description">
<label class="d-none">{{ 'products.product.overview' | t }}</label>
{{ content }}
</div>
{% endif %}
</div>
</div>
</div>
{% endif %}
{% if section.settings.product_tab2_enable %}
<div class="panel">
<div class="panel-heading" id="headingTwo">
<h4 class="panel-title">
<a data-toggle="collapse" data-parent="#panel-accordion" href=''>{{ section.settings.product_tab2_title }}</a>
</h4>
</div>
<div id="tab2" class="panel-collapse collapse">
<div class="panel-body">{{ section.settings.product_tab2_content }}</div>
</div>
</div>
{% endif %}
{% if section.settings.product_tab3_enable %}
<div class="panel">
<div class="panel-heading" id="headingThree">
<h4 class="panel-title">
<a data-toggle="collapse" data-parent="#panel-accordion" href=''>{{ section.settings.product_tab3_title }}</a>
</h4>
</div>
<div id="tab3" class="panel-collapse collapse">
<div class="panel-body">
{% if section.settings.custom_size_chart != blank %}
<img src="{{ section.settings.custom_size_chart | img_url: "master" }}" alt="{{ section.settings.custom_size_chart_title }}" />
{% else %}
<div class="placeholder-backgrounds">
{% include 'placeholder-svg' %}
</div>
{% endif %}
</div>
</div>
</div>
{% endif %}
{% if section.settings.product_tab4_enable %}
<div class="panel">
<div class="panel-heading" id="headingFour">
<h4 class="panel-title">
<a data-toggle="collapse" data-parent="#panel-accordion" href=''>{{ section.settings.product_tab4_title }}</a>
</h4>
</div>
<div id="tab4" class="panel-collapse collapse">
<div class="panel-body">
<div id="shopify-product-reviews" data-id="{{product.id}}">{{ product.metafields.spr.reviews }}</div>
</div>
</div>
</div>
{% endif %}
</div>
{% else %}
<div class="reviewOnly">
{% if settings.product_reviews_enable %}
<div id="shopify-product-reviews" data-id="{{product.id}}">{{ product.metafields.spr.reviews }}</div>
{% endif %}
</div>
{% endif %}
</div>
{% if section.settings.product_related_enable %}
{% if section.settings.related_products_type == "tags" %}
{% include 'product-related-tag' %}
{% else %}
{% include 'product-related' %}
{% endif %}
{% endif %}
</div>
</div>
<script>
var slider = function() {
if (!$('.slider-for').hasClass('slick-initialized') && !$('.slider-nav').hasClass('slick-initialized')) {
$('.slider-for').slick({
slidesToShow: 1,
slidesToScroll: 1,
nextArrow: '<div class="slick-next"><i class="fa fa-angle-right"></i></div>',
prevArrow: '<div class="slick-prev"><i class="fa fa-angle-left"></i></div>',
fade: true,
accessibility:false,
verticalSwiping: false,
arrows : false,
{% if settings.enable_rtl %}rtl: true,{% endif %}
asNavFor: '.slider-nav'
});

$('.slider-nav').slick({
infinite: true,
slidesToShow: {{ pt_item }},
{% if section.settings.pt_position == 'bottom' %}
{% else %}
vertical: true,
{% endif %}
slidesToScroll: 1,
asNavFor: '.slider-for',
verticalSwiping: false,
dots: false,
{% if settings.enable_rtl %}rtl: true,{% endif %}
accessibility:false,
focusOnSelect: true,

{% if section.settings.pt_position == 'bottom' %}
nextArrow: '<div class="slick-next"><i class="fa fa-angle-right"></i></div>',
prevArrow: '<div class="slick-prev"><i class="fa fa-angle-left"></i></div>',
{% else %}

nextArrow: '<div class="slick-next"><i class="fa fa-angle-down"></i></div>',
prevArrow: '<div class="slick-prev"><i class="fa fa-angle-up"></i></div>',
{% endif %}

responsive: [
{
breakpoint: 1200,
settings: {
slidesToShow: 5,
slidesToScroll: 1
}
},
{% if section.settings.pt_position == 'bottom' %}
{
breakpoint: 1024,
settings: {
slidesToShow: 5,
slidesToScroll: 1
}
},

{
breakpoint: 768,
settings: {
slidesToShow: 4,
slidesToScroll: 1,
dots: false
}
},
{
breakpoint: 321,
settings: {
slidesToShow: 3,
slidesToScroll: 2,
dots: false
}
},
{% else %}
{
breakpoint: 1224,
settings: {
slidesToShow:5,
slidesToScroll: 1
}
},
{
breakpoint: 1025,
settings: {
slidesToShow:3,
slidesToScroll: 1
}
},

{
breakpoint: 767,
settings: {
slidesToShow: 4,
slidesToScroll: 2,
dots: false
}
},
{
breakpoint: 421,
settings: {
slidesToShow: 2,
slidesToScroll: 2,
dots: false
}
},
{
breakpoint: 321,
settings: {
slidesToShow: 1,
slidesToScroll: 2,
dots: false
}
}
{% endif %}
]

});
}
};

$(window).load(function() {
slider();
if ($(window).width() >= 992 && $('.zoomContainer').length === 0) {
$(".fancybox").fancybox();
var zoomOptions = {
cursor: "crosshair",
galleryActiveClass: 'active',
imageCrossfade: false,
scrollZoom: false,

onImageSwapComplete: function() {
$(".zoomWrapper div").hide();
},
loadingIcon: window.loading_url
};
$(".slider-for .slick-current img").elevateZoom(zoomOptions);

$(".slider-for ").on("beforeChange", function(event, slick, currentSlide, nextSlide) {
$.removeData(currentSlide, "elevateZoom");
$(".zoomContainer").remove();
});
$(".slider-for ").on("afterChange", function() {
$(".slider-for .slick-current img").elevateZoom(zoomOptions);
});
}
});

var timer;
var winW = $(window).width();

$(window).on('resize.refreshSlick', function() {
clearTimeout(timer);
timer = setTimeout(function() {
var curW = $(window).width();
if (curW >= 768 && winW < 768) {
$('.slider-for').slick('unslick');
$('.slider-nav').slick('unslick');
$('.slider-nav').find('.slick-list').removeAttr('style');
$('.slider-nav').find('.slick-track').removeAttr('style');
$('.slider-nav').find('.slick-slide').removeAttr('style');
$('.slider-nav').find('button.slick-arrow').remove();

slider();
}
winW = curW;
}, 500);
});

$(".tab-vertical>ul>li").on('click', function () {
$(".tab-vertical>ul>li").removeClass("active");
$(this).addClass("active");
});

</script>
<script>
{% if product.available %}
function updatePricing() {
var regex = /([0-9]+[.|,][0-9]+[.|,][0-9]+)/g;
var unitPriceTextMatch = jQuery('.product .product-price__price span.money').text().match(regex);

if (!unitPriceTextMatch) {
regex = /([0-9]+[.|,][0-9]+)/g;
unitPriceTextMatch = jQuery('.product .product-price__price span.money').text().match(regex);
}

if (unitPriceTextMatch) {
var unitPriceText = unitPriceTextMatch[0];
var unitPrice = unitPriceText.replace(/[.|,]/g,'');
var quantity = parseInt(jQuery('#qty').val());
var totalPrice = unitPrice * quantity;

var totalPriceText = Shopify.formatMoney(totalPrice, window.money_format);
regex = /([0-9]+[.|,][0-9]+[.|,][0-9]+)/g;
if (!totalPriceText.match(regex)) {
regex = /([0-9]+[.|,][0-9]+)/g;
}
totalPriceText = totalPriceText.match(regex)[0];

var regInput = new RegExp(unitPriceText, "g");
var totalPriceHtml = jQuery('.product .product-price__price span.money').html().replace(regInput ,totalPriceText);

jQuery('.product .total-price span.money').html(totalPriceHtml);
}
}
jQuery('#qty').on('change', updatePricing);
{% endif %}

var selectCallback = function(variant, selector) {
var addToCart = jQuery('#AddToCart-product-template'),
productPrice = jQuery('.product .product-price__price span.money'),
comparePrice = jQuery('span#ComparePrice-product-template');
if (variant) {
if (variant.available) {
addToCart.removeClass('disabled').removeAttr('disabled').val('Add to Cart');
} else {
addToCart.val(window.inventory_text.sold_out).addClass('disabled').attr('disabled', 'disabled');
}

productPrice.html(Shopify.formatMoney(variant.price, "{{ shop.money_format }}"));

if (variant.compare_at_price > variant.price) {
comparePrice.html(Shopify.formatMoney(variant.compare_at_price, "{{ shop.money_format }}"));
}

 

{% if section.settings.use_color_swatch %}
// BEGIN SWATCHES
var form = jQuery('#' + selector.domIdPrefix).parents('form');
for (var i=0,length=variant.options.length; i<length; i++) {
var radioButton = form.find('.swatch[data-option-index="' + i + '"] :radio[value="' + variant.options[i] +'"]');
if (radioButton.size()) {
radioButton.get(0).checked = true;
}
}
// END SWATCHES
{% endif %}

{% if product.available %}
updatePricing();
{% endif %}

{% if settings.show_multiple_currencies %}
Currency.convertAll(window.shop_currency, jQuery('select[name=currencies] option:selected').val(), 'span.money', 'money_format');
{% endif %}
}

/* VARIANT IMAGE */
if (variant && variant.featured_image) {
var originalImage = $("img[id|='product-featured-image']");
var newImage = variant.featured_image;
var element = originalImage[0];

Shopify.Image.switchImage(newImage, element, function (newImageSizedSrc, newImage, element) {
// $(element).data('zoom-image', newImageSizedSrc).elevateZoom({
// gallery: 'slider-nav',
// galleryActiveClass: 'active',
// });

jQuery('.slider-nav img').each(function() {
var grandSize = jQuery(this).attr('src');
grandSize = grandSize.replace('100x100','1024x1024');
if (grandSize == newImageSizedSrc) {
jQuery(this).closest('.item').trigger('click');
return false;
}
});
});
}

};

jQuery(function($) {
{% if product.available and product.variants.size > 1 %}
new Shopify.OptionSelectors('product-selectors', {
product: {{ product | json }},
onVariantSelected: selectCallback,
enableHistoryState: true
});

{% comment %}
Use color swatch and linked options (copyright by @carolineschnapp)
{% endcomment %}
{% if section.settings.use_color_swatch and product.available and product.options.size > 1 %}
Shopify.linkOptionSelectors({{ product | json }});
{% endif %}

{% if section.settings.use_color_swatch != true %}
jQuery('.single-option-selector').selectize();
jQuery('.selectize-input input').attr("disabled","disabled");
{% endif %}

{% endif %}
{% if product.options.size == 1 and product.options.first != 'Title' %}
$('.selector-wrapper:eq(0)').prepend('<label>{{ product.options.first }}</label>');
{% endif %}
{% if product.variants.size == 1 and product.variants.first.title contains 'Default' %}
$('.selector-wrapper').hide();
{% endif %}

{% assign found_one_in_stock = false %}
{% for variant in product.variants %}
{% if variant.available and found_one_in_stock == false %}
{% assign found_one_in_stock = true %}
{% for option in product.options %}
$('.single-option-selector:eq({{ forloop.index0 }})').val({{ variant.options[forloop.index0] | json }}).trigger('change');
{% endfor %}
{% endif %}
{% endfor %}
});

</script>

{% unless product == empty %}
<script type="application/json" id="ProductJson-{{ section.id }}">
{{ product | json }}
</script>
{% endunless %}
{% endif %}

 

{% schema %}
{
"name": "Product Detail",
"class": "main-product",
"settings": [
{
"type": "header",
"content": "Product info"
},
{
"type": "checkbox",
"id": "display_product_reviews",
"label": "Show Reviews",
"default": true
},
{
"type": "checkbox",
"id": "show_vendor",
"label": "Show vendor",
"default": true
},
{
"type": "checkbox",
"id": "show_product_type",
"label": "Show Product Type",
"default": true
},
{
"type": "radio",
"id": "show_desc",
"label": "Short description",
"options": [
{
"value": "no-show",
"label": "No"
},
{
"value": "short",
"label": "Yes"
},
{
"value": "full",
"label": "Show Full Description"
}
],
"default": "short"
},
{
"type": "checkbox",
"id": "show_product_countdown",
"label": "Show Product Countdown",
"default": true
},
{
"type": "checkbox",
"id": "use_color_swatch",
"label": "Use Color Swatch?",
"default": true
},
{
"type": "checkbox",
"id": "show_price_subtotal",
"label": "Show Price Subtotal",
"default": false
},
{
"type": "checkbox",
"id": "show_quantity_selector",
"label": "Show quantity selector",
"default": false
},
{
"type": "checkbox",
"id": "show_share_buttons",
"label": "Show social sharing buttons",
"default": true
},
{
"type": "checkbox",
"id": "show_category",
"label": "Show Category Product",
"default": true
},
{
"type": "checkbox",
"id": "show_tag",
"label": "Show Tags Product",
"default": true
},
{
"type": "checkbox",
"id": "show_brand",
"label": "Show Image Brand",
"default": true
},
{
"type": "image_picker",
"id": "product_brand",
"label": "Upload Brand Image"
},
{
"type": "header",
"content": "Product thumbnais"
},
{
"type": "select",
"id": "pt_position",
"label": "Position",
"default": "bottom",
"options": [
{
"value": "left",
"label": "Vertical Left"
},
{
"value": "right",
"label": "Vertical Right"
},
{
"value": "bottom",
"label": "Horizontal Bottom"
}
]
},
{
"type": "text",
"id": "pt_item",
"label": "Item",
"default": "4"
},
{
"type": "header",
"content": "Box Sevicer Detail",
"info": "Used for Detail 1 Coluom"
},
{
"type": "checkbox",
"id": "enable_sevicer",
"label": "Show Box Sevicer",
"default": false
},
{
"type": "text",
"id": "sv_title",
"label": "Title Box Sevicer 1",
"placeholder": "Title"
},
{
"type": "text",
"id": "sv_icon",
"label": "Icon name (Font Awesome)",
"info": "[Use Font Awesome](http:\/\/fontawesome.io\/4.7.0\/icons\/)"
},
{
"type": "text",
"id": "sv_title_2",
"label": "Title Box Sevicer 2",
"placeholder": "Title"
},
{
"type": "text",
"id": "sv_icon_2",
"label": "Icon name (Font Awesome)",
"info": "[Use Font Awesome](http:\/\/fontawesome.io\/4.7.0\/icons\/)"
},
{
"type": "text",
"id": "sv_title_3",
"label": "Title Box Sevicer 3",
"placeholder": "Title"
},
{
"type": "text",
"id": "sv_icon_3",
"label": "Icon name (Font Awesome)",
"info": "[Use Font Awesome](http:\/\/fontawesome.io\/4.7.0\/icons\/)"
},
{
"type": "text",
"id": "sv_title_4",
"label": "Title Box Sevicer 4",
"placeholder": "Title"
},
{
"type": "text",
"id": "sv_icon_4",
"label": "Icon name (Font Awesome)",
"info": "[Use Font Awesome](http:\/\/fontawesome.io\/4.7.0\/icons\/)"
},
{
"type": "header",
"content": "Product More Info"
},
{
"type": "select",
"id": "product_tab_type",
"label": "Product more info type",
"default": "protab_hozizoltal",
"options": [
{
"value": "disable",
"label": "Don't show"
},
{
"value": "protab",
"label": "Tab vertical"
},
{
"value": "protab_hozizoltal",
"label": "Tab hozizoltal"
},
{
"value": "propanel",
"label": "Tab accordion"
}
]
},
{
"type": "checkbox",
"id": "product_tab1_enable",
"label": "Display Tab Description?",
"default": true
},
{
"type": "text",
"id": "product_tab1_title",
"label": "Product Description Title",
"default": "Product Description"
},
{
"type": "checkbox",
"id": "product_tab2_enable",
"label": "Display Custom Tab?"
},
{
"type": "text",
"id": "product_tab2_title",
"label": "Custom Tab Title",
"default": "Shipping Returns"
},
{
"type": "textarea",
"id": "product_tab2_content",
"label": "Custom Tab HTML Code"
},
{
"type": "checkbox",
"id": "product_tab3_enable",
"label": "Display Size Chart?"
},
{
"type": "text",
"id": "product_tab3_title",
"label": "Custom Size Chart Title",
"default": "Size Chart"
},
{
"type": "image_picker",
"id": "custom_size_chart",
"label": "Size Chart Image"
},
{
"type": "checkbox",
"id": "product_tab4_enable",
"label": "Products Reviews",
"default": true
},
{
"type": "text",
"id": "product_tab4_title",
"label": "Reviews Title tab",
"default": "Reviews"
},
{
"type": "header",
"content": "Related Products"
},
{
"type": "checkbox",
"id": "product_related_enable",
"label": "Enable product related"
},
{
"type": "text",
"id": "product_related_title",
"placeholder": "Title for Block",
"label": "Block title"
},
{
"type": "text",
"id": "product_related_des",
"placeholder": "Title for block",
"label": "Description for block"
},
{
"type": "radio",
"id": "related_products_type",
"label": "Type of related products",
"options": [
{
"value": "tags",
"label": "By Tags"
},
{
"value": "collection",
"label": "By Collection"
}
],
"default": "collection"
},
{
"type": "text",
"id": "product_related_limit",
"placeholder": "Number. Ex: 6",
"label": "Limit of Related Product"
},
{
"type": "checkbox",
"id": "navigation",
"label": "Show navigation",
"default": true
},
{
"type": "text",
"id": "margin-rl",
"label": "Margin Item"
},
{
"type": "select",
"id": "column1",
"label": "#Column 1",
"default": "4",
"info": "For Large desktops have screen > 1200px",
"options":[
{
"value": "1",
"label": "1"
},
{
"value": "2",
"label": "2"
},
{
"value": "3",
"label": "3"
},
{
"value": "4",
"label": "4"
},
{
"value": "5",
"label": "5"
},
{
"value": "6",
"label": "6"
}
]
},
{
"type": "select",
"id": "column2",
"label": "#Column 2",
"default": "3",
"info": "For Tablets have screen 991px to 1199px.",
"options":[
{
"value": "1",
"label": "1"
},
{
"value": "2",
"label": "2"
},
{
"value": "3",
"label": "3"
},
{
"value": "4",
"label": "4"
},
{
"value": "5",
"label": "5"
}
]
},
{
"type": "select",
"id": "column3",
"label": "#Column 3",
"info": "For Tablets have screen 768px to 991px.",
"default": "2",
"options":[
{
"value": "1",
"label": "1"
},
{
"value": "2",
"label": "2"
},
{
"value": "3",
"label": "3"
},
{
"value": "4",
"label": "4"
},
{
"value": "5",
"label": "5"
}
]
},
{
"type": "select",
"id": "column4",
"label": "#Column 4",
"default": "2",
"info": "For Smartphones landscape have screen 480px to 767px",
"options":[
{
"value": "1",
"label": "1"
},
{
"value": "2",
"label": "2"
},
{
"value": "3",
"label": "3"
},
{
"value": "4",
"label": "4"
},
{
"value": "5",
"label": "5"
}
]
},
{
"type": "select",
"id": "column5",
"label": "#Column 5",
"default": "1",
"info": "For Smartphones have screen 0px to 479px",
"options":[
{
"value": "1",
"label": "1"
},
{
"value": "2",
"label": "2"
}
]
}

]
}
{% endschema %}