{{ header }}
<div id="product-product" class="container product">
  <ul class="breadcrumb">
    {% for breadcrumb in breadcrumbs %}
    <li><a href="{{ breadcrumb.href }}">{{ breadcrumb.text }}</a></li>
    {% endfor %}
  </ul>
  <div class="row">{{ column_left }}
    {% if column_left and column_right %}
    {% set class = 'col-sm-6' %}
    {% elseif column_left or column_right %}
    {% set class = 'col-sm-9' %}
    {% else %}
    {% set class = 'col-sm-12' %}
    {% endif %}
    <div id="content" class="productpage {{ class }}">{{ content_top }}
      <div class="row">{% if column_left or column_right %}
        {% set class = 'col-sm-6 left' %}
        {% else %}
        {% set class = 'col-sm-6 col-md-5 left' %}
        {% endif %}
        <div class="{{ class }}">
         {% if thumb or images %}
          <div class="thumbnails">
            {% if thumb %}
            <div class="image"><a class="thumbnail" href="{{ popup }}" title="{{ heading_title }}"><img id="zoom" src="{{ thumb }}" data-zoom-image="{{ popup }}" title="{{ heading_title }}" alt="{{ heading_title }}" /></a></div>
             {% endif %}
            {% if images %}
             {% set sliderFor = 5 %}
{% set imageCount = images|length %}
            <div class="product-additional-block swiper-viewport">
              {% if imageCount >= sliderFor %}
              {% endif %}

              <div class="image-additional{% if imageCount >= sliderFor %} owl-carousel{% endif %}">

    			<div class="item">
                  <div class="product-thumb"> <a href="{{ popup }}" title="{{ heading_title }}" class="elevatezoom-gallery" data-image="{{ thumb }}" data-zoom-image="{{ popup }}"><img src="{{ thumb }}" width="126" height="151" title="{{ heading_title }}" alt="{{ heading_title }}" /></a> </div>
                </div>
               {% for image in images %}
                <div class="item">
                  <div class="product-thumb"> <a href="{{ image.popup }}" title="{{ heading_title }}" class="elevatezoom-gallery" data-image="{{ image.thumb }}" data-zoom-image="{{ image.popup }}"><img src="{{ image.thumb }}" width="126" height="151" title="{{ heading_title }}" alt="{{ heading_title }}" /></a> </div>
                </div>
                {% endfor %}
              </div>

            </div>
            {% endif %}


           </div>
            {% endif %}
          </div>
         {% if column_left or column_right %}
        {% set class = 'col-sm-6 right' %}
        {% else %}
        {% set class = 'col-sm-6 col-md-7 right' %}
        {% endif %}
        <div class="{{ class }}">
         <h1>{{ heading_title }}</h1>
         <h2 class="product-title">{{ heading_title }}</h2>
         {% if price %}
          <ul class="list-unstyled price">
            {% if not special %}
            <li>
              <h2 class="product-price"><span class="{{ module_live_options.module_live_options_price_container }}">{{ price }}</span></h2>
            </li>
            {% else %}
            <li class="oldprice"><span class="old-price" style="text-decoration: line-through;">{{ price }}</span></li>
            <li>
              <h2 class="special-price"><span class="{{ module_live_options.module_live_options_special_container }}">{{ special }}</span></h2>
            </li>
            {% endif %}
          </ul>
          {% endif %}
          {% if review_status %}
          <div class="rating">
            <p>{% for i in 1..5 %}
              {% if rating < i %}<span class="fa fa-stack"><i class="fa fa-star fa-stack-2x blank"></i></span>{% else %}<span class="fa fa-stack"><i class="fa fa-star fa-stack-1x"></i>
        </span>{% endif %}
               {% endfor %} <a class="ratings-link" href="" onclick="$('a[href=\'#tab-review\']').trigger('click'); return false;">{{ reviews }}</a> </p>
               </div>
          {% endif %}
		  <ul class="list-unstyled detail">
            {% if manufacturer %}
            <li class="manufacturer">
              <div class="label">{{ text_manufacturer }}</div>
              <a href="{{ manufacturers }}">{{ manufacturer }}</a></li>
            {% endif %}
            <li class="model">
              <div class="label">{{ text_model }} </div>
              {{ model }}</li>



            {% if reward %}
            <li class="reward">
              <div class="label">{{ text_reward }}</div>
              <span class="{{ module_live_options.module_live_options_reward_container }}">{{ reward }}</span></li>
            {% endif %}
            <li class="stock">

              {{ stock }}</li>

                <!--<li class="quantity">
                <div class="label">{{ text_quntity }} </div>
              {{ quantity }}</li>-->
          </ul>
		  {% if price %}
          <ul class="list-unstyled price2">
            {% if tax %}
            <li class="tax">{{ text_tax }}<span> <span class="{{ module_live_options.module_live_options_tax_container }}">{{ tax }}</span></span></li>
            {% endif %}
            {% if points %}
            <li class="point">{{ text_points }}<span class="{{ module_live_options.module_live_options_points_container }}">{{ points }}</span></li>
            {% endif %}
            {% if discounts %}
            {% for discount in discounts %}
            <li class="discount">{{ discount.quantity }}{{ text_discount }}{{ discount.price }}</li>
            {% endfor %}
            {% endif %}
          </ul>
          {% endif %}

          <div id="product">

           {% if options %}


            {{ prodoptimg_module }}
		{% for option in options %}
            {% if option.type == 'select' %}
             <div class="form-group{% if option.required %} required {% endif %}">
              <label class="control-label">{{ option.name }}</label>
              <div id="input-option{{ option.product_option_id }}"> {% for option_value in option.product_option_value %}
                <div class="radio">
                  <label>
                    <input type="radio" name="option[{{ option.product_option_id }}]" value="{{ option_value.product_option_value_id }}" />
                    {% if option_value.image %} <img src="{{ option_value.image }}" alt="{{ option_value.name }} {% if option_value.price %} {{ option_value.price_prefix }} {{ option_value.price }} {% endif %}" class="img-thumbnail" /> {% endif %}
                    {{ option_value.name }}
                    {% if option_value.price %}
                    <span class="pull-right">{{ option_value.price_prefix }}{{ option_value.price }}</span>
                    {% endif %} </label>
                </div>
                {% endfor %} </div>
            </div>
            {% endif %}
            {% if option.type == 'radio' %}
            <div class="form-group{% if option.required %} required {% endif %}">
              <label class="control-label">{{ option.name }}</label>
              <div id="input-option{{ option.product_option_id }}"> {% for option_value in option.product_option_value %}
                <div class="radio">
                  <label>
                    <input type="radio" name="option[{{ option.product_option_id }}]" value="{{ option_value.product_option_value_id }}" />
                    {% if option_value.image %} <img src="{{ option_value.image }}" alt="{{ option_value.name }} {% if option_value.price %} {{ option_value.price_prefix }} {{ option_value.price }} {% endif %}" class="img-thumbnail" /> {% endif %}
                    {{ option_value.name }}
                    {% if option_value.price %}
                    ({{ option_value.price_prefix }}{{ option_value.price }})
                    {% endif %} </label>
                </div>
                {% endfor %} </div>
            </div>
            {% endif %}
            {% if option.type == 'checkbox' %}
            <div class="form-group{% if option.required %} required {% endif %}">
              <label class="control-label">{{ option.name }}</label>
              <div id="input-option{{ option.product_option_id }}"> {% for option_value in option.product_option_value %}
                <div class="checkbox">
                  <label>
                    <input type="checkbox" name="option[{{ option.product_option_id }}][]" value="{{ option_value.product_option_value_id }}" />
                    {% if option_value.image %} <img src="{{ option_value.image }}" alt="{{ option_value.name }} {% if option_value.price %} {{ option_value.price_prefix }} {{ option_value.price }} {% endif %}" class="img-thumbnail" /> {% endif %}
                    {{ option_value.name }}
                    {% if option_value.price %}
                    ({{ option_value.price_prefix }}{{ option_value.price }})
                    {% endif %} </label>
                </div>
                {% endfor %} </div>
            </div>
            {% endif %}
            {% if option.type == 'text' %}
            <div class="form-group{% if option.required %} required {% endif %}">
              <label class="control-label" for="input-option{{ option.product_option_id }}">{{ option.name }}</label>
              <input type="text" name="option[{{ option.product_option_id }}]" value="{{ option.value }}" placeholder="{{ option.name }}" id="input-option{{ option.product_option_id }}" class="form-control" />
            </div>
            {% endif %}
            {% if option.type == 'textarea' %}
            <div class="form-group{% if option.required %} required {% endif %}">
              <label class="control-label" for="input-option{{ option.product_option_id }}">{{ option.name }}</label>
              <textarea name="option[{{ option.product_option_id }}]" rows="5" placeholder="{{ option.name }}" id="input-option{{ option.product_option_id }}" class="form-control">{{ option.value }}</textarea>
            </div>
            {% endif %}
            {% if option.type == 'file' %}
            <div class="form-group{% if option.required %} required {% endif %}">
              <label class="control-label">{{ option.name }}</label>
              <button type="button" id="button-upload{{ option.product_option_id }}" data-loading-text="{{ text_loading }}" class="btn btn-default btn-block"><i class="fa fa-upload"></i> {{ button_upload }}</button>
              <input type="hidden" name="option[{{ option.product_option_id }}]" value="" id="input-option{{ option.product_option_id }}" />
            </div>
            {% endif %}
            {% if option.type == 'date' %}
            <div class="form-group{% if option.required %} required {% endif %}">
              <label class="control-label" for="input-option{{ option.product_option_id }}">{{ option.name }}</label>
              <div class="input-group date">
                <input type="text" name="option[{{ option.product_option_id }}]" value="{{ option.value }}" data-date-format="YYYY-MM-DD" id="input-option{{ option.product_option_id }}" class="form-control" />
                <span class="input-group-btn">
                <button class="btn btn-default" type="button"><i class="fa fa-calendar"></i></button>
                </span></div>
            </div>
            {% endif %}
            {% if option.type == 'datetime' %}
            <div class="form-group{% if option.required %} required {% endif %}">
              <label class="control-label" for="input-option{{ option.product_option_id }}">{{ option.name }}</label>
              <div class="input-group datetime">
                <input type="text" name="option[{{ option.product_option_id }}]" value="{{ option.value }}" data-date-format="YYYY-MM-DD HH:mm" id="input-option{{ option.product_option_id }}" class="form-control" />
                <span class="input-group-btn">
                <button type="button" class="btn btn-default"><i class="fa fa-calendar"></i></button>
                </span></div>
            </div>
            {% endif %}
            {% if option.type == 'time' %}
            <div class="form-group{% if option.required %} required {% endif %}">
              <label class="control-label" for="input-option{{ option.product_option_id }}">{{ option.name }}</label>
              <div class="input-group time">
                <input type="text" name="option[{{ option.product_option_id }}]" value="{{ option.value }}" data-date-format="HH:mm" id="input-option{{ option.product_option_id }}" class="form-control" />
                <span class="input-group-btn">
                <button type="button" class="btn btn-default"><i class="fa fa-calendar"></i></button>
                </span></div>
            </div>
            {% endif %}
            {% endfor %}
            {% endif %}
            {% if recurrings %}
            <hr>
            <h3>{{ text_payment_recurring }}</h3>
            <div class="form-group required">
              <select name="recurring_id" class="form-control">
                <option value="">{{ text_select }}</option>
                {% for recurring in recurrings %}
                <option value="{{ recurring.recurring_id }}">{{ recurring.name }}</option>
                {% endfor %}
              </select>
              <div class="help-block" id="recurring-description"></div>
            </div>
            {% endif %}
           <div class="form-group">
              <label class="control-label" for="input-quantity">{{ entry_qty }}</label>
              <input type="text" name="quantity" value="{{ minimum }}" size="2" id="input-quantity" class="form-control" />
              <input type="hidden" name="product_id" value="{{ product_id }}" />
              <button type="button" id="button-cart" data-loading-text="{{ text_loading }}" class="btn btn-primary btn-lg btn-block addtocart">{{ button_cart }}</button>
               <div class="btn-group">
               <button type="button" data-toggle="tooltip" class="btn btn-default wishlist" title="{{ button_wishlist }}" onclick="wishlist.add('{{ product_id }}');"><i class="fa fa-heart"></i>{{ button_wishlist }}</button>
                <button type="button" data-toggle="tooltip" class="btn btn-default compare" title="{{ button_compare }}" onclick="compare.add('{{ product_id }}');"><i class="fa fa-exchange"></i>{{ button_compare }}</button>
              </div>

            </div>
            {% if minimum > 1 %}
            <div class="alert alert-info"><i class="fa fa-info-circle"></i> {{ text_minimum }}</div>
            {% endif %}</div>
          {% if review_status %}


                <!-- Go to www.addthis.com/dashboard to customize your tools -->
                <div class="addthis_inline_share_toolbox"></div>


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


        {% if column_left and column_right %}
        {% set class = 'col-sm-6' %}
        {% elseif column_left or column_right %}
        {% set class = 'col-sm-12 producttab' %}
        {% else %}
        {% set class = 'col-sm-12 producttab' %}
        {% endif %}
        <div class="{{ class }}">
	  <ul class="nav nav-tabs">
            <li class="active"><a href="#tab-description" data-toggle="tab">{{ tab_description }}</a></li>
            {% if attribute_groups %}
            <li><a href="#tab-specification" data-toggle="tab">{{ tab_attribute }}</a></li>
            {% endif %}
            {% if review_status %}
            <li><a href="#tab-review" data-toggle="tab">{{ tab_review }}</a></li>
            {% endif %}
          </ul>
          <div class="tab-content">
            <div class="tab-pane active" id="tab-description">{{ description }}</div>
            {% if attribute_groups %}
            <div class="tab-pane" id="tab-specification">
              <table class="table table-bordered">
                {% for attribute_group in attribute_groups %}
                <thead>
                  <tr>
                    <td colspan="2"><strong>{{ attribute_group.name }}</strong></td>
                  </tr>
                </thead>
                <tbody>
                {% for attribute in attribute_group.attribute %}
                <tr>
                  <td>{{ attribute.name }}</td>
                  <td>{{ attribute.text }}</td>
                </tr>
                {% endfor %}
                  </tbody>
                {% endfor %}
              </table>
            </div>
            {% endif %}
            {% if review_status %}
            <div class="tab-pane" id="tab-review">
              <form class="form-horizontal" id="form-review">
                <div id="review"></div>
                <h2>{{ text_write }}</h2>
                {% if review_guest %}
                <div class="form-group required">
                  <div class="col-sm-12">
                    <label class="control-label" for="input-name">{{ entry_name }}</label>
                    <input type="text" name="name" value="{{ customer_name }}" id="input-name" class="form-control" />
                  </div>
                </div>
                <div class="form-group required">
                  <div class="col-sm-12">
                    <label class="control-label" for="input-review">{{ entry_review }}</label>
                    <textarea name="text" rows="5" id="input-review" class="form-control"></textarea>
                    <div class="help-block">{{ text_note }}</div>
                  </div>
                </div>
                <div class="form-group required">
                  <div class="col-sm-12">
                    <label class="control-label">{{ entry_rating }}</label>
                    &nbsp;&nbsp;&nbsp; {{ entry_bad }}&nbsp;
                    <input type="radio" name="rating" value="1" />
                    &nbsp;
                    <input type="radio" name="rating" value="2" />
                    &nbsp;
                    <input type="radio" name="rating" value="3" />
                    &nbsp;
                    <input type="radio" name="rating" value="4" />
                    &nbsp;
                    <input type="radio" name="rating" value="5" />
                    &nbsp;{{ entry_good }}</div>
                </div>
                {{ captcha }}
                <div class="buttons clearfix">
                  <div class="pull-right">
                    <button type="button" id="button-review" data-loading-text="{{ text_loading }}" class="btn btn-primary">{{ button_continue }}</button>
                  </div>
                </div>
                {% else %}
                {{ text_login }}
                {% endif %}
              </form>
            </div>
            {% endif %}</div>
        </div>




      {% if products %}
   <div class="section related wow fadeInUp" data-wow-duration="0.5s" data-wow-delay="0.5s">
<div class="section-heading">{{ text_related }}</div>
{% set sliderFor = 5 %}
{% set productCount = products|length %}

<div class="section-block">
<div class="section-product {% if productCount >= sliderFor %}section-product product-carousel{% else %} grid {% endif %}">
{% for product in products %}

<div class="{% if productCount >= sliderFor %} slider-item {% else %} product-items col-xs-4 col-sm-4 col-md-3 col-lg-3{% endif %}">
<div class="product-thumb transition">
     {% if product.tag_per  %}
      <p class="tag">{{ product.tag_per }}<br/> % <br/> <i>off</i></p>
      {% endif %}
<div class="image">
    {% if product.thumb_swap %}
    <div class="first_image"> <a href="{{ product.href }}"> <img src="{{ product.thumb }}" alt="{{ product.name }}" title="{{ product.name }}" class="img-responsive" /> </a> </div>
    <div class="swap_image"> <a href="{{ product.href }}"> <img src="{{ product.thumb_swap }}" alt="{{ product.name }}" title="{{ product.name }}" class="img-responsive" /> </a></div>
  {% else %}
  <a href="{{ product.href }}"> <img src="{{ product.thumb }}" alt="{{ product.name }}" title="{{ product.name }}" /> </a>
  {% endif %}

  {% if not product.special %}
  {% else %}
  <div class="saleback"> <span class="sale">{{ text_sale }}</span> </div>
  {% endif %}

  {% if product.rating %}
  <div class="rating">
  {% for i in 1..5 %}
  {% if product.rating < i %} <span class="fa fa-stack">
  <i class="fa fa-star fa-stack-2x blank"></i></span>
  {% else %} <span class="fa fa-stack"><i class="fa fa-star fa-stack-2x"></i></span> {% endif %}
  {% endfor %}
  </div>
  {% endif %}

</div>
<div class="product-details">
<div class="caption">

  <h4><a href="{{ product.href }}">{{ product.name }}</a></h4>
  {% if product.price %}
  <p class="price">
  {% if not product.special %}
  {{ product.price }}
  {% else %}
  <span class="price-new">{{ product.special }}</span> <span class="price-old">{{ product.price }}</span>
  {% endif %}
  {% if product.tax %}
  <span class="price-tax">{{ text_tax }} {{ product.tax }}</span>
  {% endif %}
  </p>
  {% endif %}
   <div id="product-{{ product.product_id }}" class="product_option"> {% if options %}


        {% for option in product.options %}
           {% if option.type == 'select' %}
            <div class="form-group{% if option.required %} required {% endif %}">
              <select name="option[{{ option.product_option_id }}]" id="input-option{{ option.product_option_id }}" class="form-control">
                <option value="">{{ text_select }}</option>
                {% for option_value in option.product_option_value %}
                <option value="{{ option_value.product_option_value_id }}">{{ option_value.name }}
                {% if option_value.price %}
                ({{ option_value.price_prefix }}{{ option_value.price }})
                {% endif %} </option>
                {% endfor %}
              </select>

            </div>
            {% endif %}
            {% if option.type == 'radio' %}
            <div class="form-group{% if option.required %} required {% endif %}">
               <div id="input-option{{ option.product_option_id }}"> {% for option_value in option.product_option_value %}
                <div class="radio">
                  <label>
                    <input type="radio" name="option[{{ option.product_option_id }}]" value="{{ option_value.product_option_value_id }}" />
                    {% if option_value.image %} <img src="{{ option_value.image }}" alt="{{ option_value.name }} {% if option_value.price %} {{ option_value.price_prefix }} {{ option_value.price }} {% endif %}" class="img-thumbnail" /> {% endif %}
                    {{ option_value.name }}
                    {% if option_value.price %}
                    ({{ option_value.price_prefix }}{{ option_value.price }})
                    {% endif %} </label>
                </div>
                {% endfor %} </div>
            </div>
            {% endif %}
            {% if option.type == 'checkbox' %}
            <div class="form-group{% if option.required %} required {% endif %}">
              <div id="input-option{{ option.product_option_id }}"> {% for option_value in option.product_option_value %}
                <div class="checkbox">
                  <label>
                    <input type="checkbox" name="option[{{ option.product_option_id }}][]" value="{{ option_value.product_option_value_id }}" />
                    {% if option_value.image %} <img src="{{ option_value.image }}" alt="{{ option_value.name }} {% if option_value.price %} {{ option_value.price_prefix }} {{ option_value.price }} {% endif %}" class="img-thumbnail" /> {% endif %}
                    {{ option_value.name }}
                    {% if option_value.price %}
                    ({{ option_value.price_prefix }}{{ option_value.price }})
                    {% endif %} </label>
                </div>
                {% endfor %} </div>
            </div>
            {% endif %}
            {% if option.type == 'text' %}
            <div class="form-group{% if option.required %} required {% endif %}">
              <input type="text" name="option[{{ option.product_option_id }}]" value="{{ option.value }}" placeholder="{{ option.name }}" id="input-option{{ option.product_option_id }}" class="form-control" />
            </div>
            {% endif %}
            {% if option.type == 'textarea' %}
            <div class="form-group{% if option.required %} required {% endif %}">
              <textarea name="option[{{ option.product_option_id }}]" rows="5" placeholder="{{ option.name }}" id="input-option{{ option.product_option_id }}" class="form-control">{{ option.value }}</textarea>
            </div>
            {% endif %}
            {% if option.type == 'file' %}
            <div class="form-group{% if option.required %} required {% endif %}">
              <button type="button" id="button-upload{{ option.product_option_id }}" data-loading-text="{{ text_loading }}" class="btn btn-default btn-block"><i class="fa fa-upload"></i> {{ button_upload }}</button>
              <input type="hidden" name="option[{{ option.product_option_id }}]" value="" id="input-option{{ option.product_option_id }}" />
            </div>
            {% endif %}
            {% if option.type == 'date' %}
            <div class="form-group{% if option.required %} required {% endif %}">
              <div class="input-group date">
                <input type="text" name="option[{{ option.product_option_id }}]" value="{{ option.value }}" data-date-format="YYYY-MM-DD" id="input-option{{ option.product_option_id }}" class="form-control" />
                <span class="input-group-btn">
                <button class="btn btn-default" type="button"><i class="fa fa-calendar"></i></button>
                </span></div>
            </div>
            {% endif %}
            {% if option.type == 'datetime' %}
            <div class="form-group{% if option.required %} required {% endif %}">
              <div class="input-group datetime">
                <input type="text" name="option[{{ option.product_option_id }}]" value="{{ option.value }}" data-date-format="YYYY-MM-DD HH:mm" id="input-option{{ option.product_option_id }}" class="form-control" />
                <span class="input-group-btn">
                <button type="button" class="btn btn-default"><i class="fa fa-calendar"></i></button>
                </span></div>
            </div>
            {% endif %}
            {% if option.type == 'time' %}
            <div class="form-group{% if option.required %} required {% endif %}">
              <div class="input-group time">
                <input type="text" name="option[{{ option.product_option_id }}]" value="{{ option.value }}" data-date-format="HH:mm" id="input-option{{ option.product_option_id }}" class="form-control" />
                <span class="input-group-btn">
                <button type="button" class="btn btn-default"><i class="fa fa-calendar"></i></button>
                </span></div>
            </div>
            {% endif %}
            {% endfor %}
            {% endif %}

           <div class="input-group col-xs-12 col-sm-12 button-group">

              <label class="control-label col-sm-2 col-xs-2">{{ entry_qty }}</label>

              <input type="number" name="quantity" min="1" value="{{ minimum }}" size="1" step="1" id="input-quantity{{ product.product_id }}" class="qty form-control col-sm-2 col-xs-9" />
              <input type="hidden" name="product_id" value="{{ product.product_id }}" />
              <button type="button" class="addtocart col-sm-4 pull-right" id="add-cart-{{ product.product_id }}" onclick="var xqty='input-quantity{{ product.product_id }}';
  var aqty = parseInt(document.getElementById(xqty).value); addtoCart({{ product.product_id }},aqty);">{{ button_cart }}</button>

            </div>

            </div>

                </div>
            </div>
          </div>


</div>
{% endfor %}

</div>
</div>


</div>

	  {% endif %}
        {% if tags %}
        <p>{{ text_tags }}
        {% for i in 0..tags|length %}
        {% if i < (tags|length - 1) %} <a href="{{ tags[i].href }}">{{ tags[i].tag }}</a>,
        {% else %} <a href="{{ tags[i].href }}">{{ tags[i].tag }}</a> {% endif %}
        {% endfor %} </p>
        {% endif %}</div>
      {{ content_bottom }}</div>
    {{ column_right }}
</div>
<script><!--
$('select[name=\'recurring_id\'], input[name="quantity"]').change(function(){
	$.ajax({
		url: 'index.php?route=product/product/getRecurringDescription',
		type: 'post',
		data: $('input[name=\'product_id\'], input[name=\'quantity\'], select[name=\'recurring_id\']'),
		dataType: 'json',
		beforeSend: function() {
			$('#recurring-description').html('');
		},
		success: function(json) {
			$('.alert-dismissible, .text-danger').remove();

			if (json['success']) {
				$('#recurring-description').html(json['success']);
			}
		}
	});
});
//--></script>
<script><!--
$('#button-cart').on('click', function() {
	$.ajax({
		url: 'index.php?route=checkout/cart/add',
		type: 'post',
		data: $('#product input[type=\'text\'], #product input[type=\'hidden\'], #product input[type=\'radio\']:checked, #product input[type=\'checkbox\']:checked, #product select, #product textarea'),
		dataType: 'json',
		beforeSend: function() {
			$('#button-cart').button('loading');
		},
		complete: function() {
			$('#button-cart').button('reset');
		},
		success: function(json) {
			$('.alert-dismissible, .text-danger').remove();
			$('.form-group').removeClass('has-error');

			if (json['error']) {
				if (json['error']['option']) {
					for (i in json['error']['option']) {
						var element = $('#input-option' + i.replace('_', '-'));

						if (element.parent().hasClass('input-group')) {
							element.parent().after('<div class="text-danger">' + json['error']['option'][i] + '</div>');
						} else {
							element.after('<div class="text-danger">' + json['error']['option'][i] + '</div>');
						}
					}
				}

				if (json['error']['recurring']) {
					$('select[name=\'recurring_id\']').after('<div class="text-danger">' + json['error']['recurring'] + '</div>');
				}

				// Highlight any found errors
				$('.text-danger').parent().addClass('has-error');
			}

			if (json['success']) {
				$('.breadcrumb').after('<div class="alertmsg"><div class="alert alert-success alert-dismissible">' + json['success'] + '<button type="button" class="close" data-dismiss="alert">&times;</button></div></div>');

        $('#cart > .btn').addClass('active');
        $('#cart > .btn').html('<span class="cart-text">My basket</span><span class="cart-total">Item ' + json['total'] + '</span><span class="cart-total-res">' + json['total'] +'</span>');

      $('.alertmsg').delay(2500).fadeOut();
        //$('html, body').animate({ scrollTop: 0 }, 'slow');

				$('#cart > ul').load('index.php?route=common/cart/info ul li');
        $("button.close").click(function() {
                        $(".alertmsg").remove()
                    })
			}
		},
        error: function(xhr, ajaxOptions, thrownError) {
            alert(thrownError + "\r\n" + xhr.statusText + "\r\n" + xhr.responseText);
        }
	});
});
//--></script>
<script><!--
$('.date').datetimepicker({
	language: '{{ datepicker }}',
	pickTime: false
});

$('.datetime').datetimepicker({
	language: '{{ datepicker }}',
	pickDate: true,
	pickTime: true
});

$('.time').datetimepicker({
	language: '{{ datepicker }}',
	pickDate: false
});

$('button[id^=\'button-upload\']').on('click', function() {
	var node = this;

	$('#form-upload').remove();

	$('body').prepend('<form enctype="multipart/form-data" id="form-upload" style="display: none;"><input type="file" name="file" /></form>');

	$('#form-upload input[name=\'file\']').trigger('click');

	if (typeof timer != 'undefined') {
    	clearInterval(timer);
	}

	timer = setInterval(function() {
		if ($('#form-upload input[name=\'file\']').val() != '') {
			clearInterval(timer);

			$.ajax({
				url: 'index.php?route=tool/upload',
				type: 'post',
				dataType: 'json',
				data: new FormData($('#form-upload')[0]),
				cache: false,
				contentType: false,
				processData: false,
				beforeSend: function() {
					$(node).button('loading');
				},
				complete: function() {
					$(node).button('reset');
				},
				success: function(json) {
					$('.text-danger').remove();

					if (json['error']) {
						$(node).parent().find('input').after('<div class="text-danger">' + json['error'] + '</div>');
					}

					if (json['success']) {
						alert(json['success']);

						$(node).parent().find('input').val(json['code']);
					}
				},
				error: function(xhr, ajaxOptions, thrownError) {
					alert(thrownError + "\r\n" + xhr.statusText + "\r\n" + xhr.responseText);
				}
			});
		}
	}, 500);
});
//--></script>
<script><!--
$('#review').delegate('.pagination a', 'click', function(e) {
    e.preventDefault();

    $('#review').fadeOut('slow');

    $('#review').load(this.href);

    $('#review').fadeIn('slow');
});

$('#review').load('index.php?route=product/product/review&product_id={{ product_id }}');

$('#button-review').on('click', function() {
	$.ajax({
		url: 'index.php?route=product/product/write&product_id={{ product_id }}',
		type: 'post',
		dataType: 'json',
		data: $("#form-review").serialize(),
		beforeSend: function() {
			$('#button-review').button('loading');
		},
		complete: function() {
			$('#button-review').button('reset');
		},
		success: function(json) {
			$('.alert-dismissible').remove();

			if (json['error']) {
				$('#review').after('<div class="alert alert-danger alert-dismissible"><i class="fa fa-exclamation-circle"></i> ' + json['error'] + '</div>');
			}

			if (json['success']) {
				$('#review').after('<div class="alert alert-success alert-dismissible"><i class="fa fa-check-circle"></i> ' + json['success'] + '</div>');

				$('input[name=\'name\']').val('');
				$('textarea[name=\'text\']').val('');
				$('input[name=\'rating\']:checked').prop('checked', false);
			}
		}
	});
});

$(document).ready(function() {
if ($(window).width() > 767) {
		$("#zoom").elevateZoom({

				gallery:'product-additional-block',
				//inner zoom
				zoomType : "window",
				cursor: "crosshair"
			});
		var z_index = 0;

     			    		$(document).on('click', '.thumbnail', function () {
     			    		  $('.thumbnails').magnificPopup('open', z_index);
     			    		  return false;
     			    		});

     			    		$('.product-additional-block a').on('mouseover', function() {
     			    			var smallImage = $(this).attr('data-image');
     			    			var largeImage = $(this).attr('data-zoom-image');
     			    			var ez =   $('#zoom').data('elevateZoom');
     			    			$('.thumbnail').attr('href', largeImage);
     			    			ez.swaptheimage(smallImage, largeImage);
     			    			z_index = $(this).index('.product-additional-block a');
     			    			return false;
     			    		});

	}else{
		$(document).on('click', '.thumbnail', function () {
		$('.thumbnails').magnificPopup('open', 0);
		return false;
		});
	}
});
$(document).ready(function() {
	$('.thumbnails').magnificPopup({
		delegate: 'a.elevatezoom-gallery',
		type: 'image',
		tLoading: 'Loading image #%curr%...',
		mainClass: 'mfp-with-zoom',
		gallery: {
			enabled: true,
			navigateByImgClick: true,
			preload: [0,1] // Will preload 0 - before current, and 1 after the current image
		},
		image: {
			tError: '<a href="%url%">The image #%curr%</a> could not be loaded.',
			titleSrc: function(item) {
				return item.el.attr('title');
			}
		}
	});

	  $('.image-additional').owlCarousel({

    items: 4,

    navigation: true,

    pagination: false,

    itemsDesktop : [1199, 3],

    itemsDesktopSmall : [991, 3],

    itemsTablet : [767, 3],

    itemsTabletSmall : [479, 2],

    itemsMobile : [319, 1]

  });

$('.product-carousel').owlCarousel({
		    items: 5,
    autoPlay: false,
    singleItem: false,
    navigation: true,
    pagination: false,
    itemsDesktop : [1199,4],
    itemsDesktopSmall : [991,3],
    itemsTablet : [479,2],
    itemsMobile : [319,1]
	});



});

//--></script>
<script src="{{ module_live_options.module_live_options_js }}"></script>
{{ footer }}
