{{ header }} 
{% set theme_options = registry.get('theme_options') %}
{% set config = registry.get('config') %}
{% set page_direction = theme_options.get( 'page_direction' ) %} 
{% set language_id = config.get( 'config_language_id' ) %} 
{% set background_status = constant('false') %}
{% set product_page = constant('true') %}
{% include 'fastor/template/new_elements/wrapper_top.twig' %}

<div itemscope itemtype="http://schema.org/Product">
  <span itemprop="name" class="hidden">{{ heading_title }}</span>
  <div class="product-info">
  	<div class="row">
  		
  	     {% set product_custom_block = theme_options.getModules('product_custom_block') %} 
  		
  		<div class="col-md-{% if (theme_options.get( 'custom_block', 'product_page', config.get( 'config_language_id' ), 'status' ) == 1 or product_custom_block|length > 0) %}9{% else %}12{% endif %} col-sm-12">
  			<div class="row" id="quickview_product">
			    {% if (theme_options.get( 'product_image_zoom' ) != 2) %} 
			    <script>
			    	$(document).ready(function(){
			    	     if($(window).width() > 992) {
     			    		{% if (theme_options.get( 'product_image_zoom' ) == 1) %} 
     			    			$('#image').elevateZoom({
     			    				zoomType: "inner",
     			    				cursor: "pointer",
     			    				zoomWindowFadeIn: 500,
     			    				zoomWindowFadeOut: 750
     			    			});
     			    		{% else %} 
     				    		$('#image').elevateZoom({
     								zoomWindowFadeIn: 500,
     								zoomWindowFadeOut: 500,
     								zoomWindowOffetx: 20,
     								zoomWindowOffety: -1,
     								cursor: "pointer",
     								lensFadeIn: 500,
     								lensFadeOut: 500,
     								zoomWindowWidth: 500,
     								zoomWindowHeight: 500
     				    		});
     			    		{% endif %} 
     			    		
     			    		var z_index = 0;
     			    		
     			    		$(document).on('click', '.open-popup-image', function () {
     			    		  $('.popup-gallery').magnificPopup('open', z_index);
     			    		  return false;
     			    		});
			    		
     			    		$('.thumbnails a, .thumbnails-carousel a').click(function() {
     			    			var smallImage = $(this).attr('data-image');
     			    			var largeImage = $(this).attr('data-zoom-image');
     			    			var ez =   $('#image').data('elevateZoom');	
     			    			$('#ex1').attr('href', largeImage);  
     			    			ez.swaptheimage(smallImage, largeImage); 
     			    			z_index = $(this).index('.thumbnails a, .thumbnails-carousel a');
     			    			return false;
     			    		});
			    		} else {
			    			$(document).on('click', '.open-popup-image', function () {
			    			  $('.popup-gallery').magnificPopup('open', 0);
			    			  return false;
			    			});
			    		}
			    	});
			    </script>
			    {% endif %} 
			    {% set image_grid = 7 %} {% set product_center_grid = 5 %} 
			 {% if (theme_options.get( 'product_image_size' ) == 1) %}
			 	{% set image_grid = 4 %} {% set product_center_grid = 8 %}
			 {% endif %}
			 
			 {% if (theme_options.get( 'product_image_size' ) == 3) %}
			 	{% set image_grid = 8 %} {% set product_center_grid = 4 %}
			 {% endif %}
			 
			    <div class="col-sm-{{ image_grid }} popup-gallery">
			      
			 {% set product_image_top = theme_options.getModules('product_image_top') %}
			 {% if ( product_image_top|length > 0 ) %} 
			 	{% for module in product_image_top %} 
			 		{{ module }}
			 	{% endfor %}
			 {% endif %} 
			         
			      <div class="row">
			      	  {% if ((images or theme_options.get( 'product_image_zoom' ) != 2) and theme_options.get( 'position_image_additional' ) == 2) %} 
			      	  <div class="col-sm-2">
						<div class="thumbnails thumbnails-left clearfix">
							<ul>
							  {% if (theme_options.get( 'product_image_zoom' ) != 2 and thumb) %} 
						      <li><p><a href="{{ popup }}" class="popup-image" data-image="{{ thumb }}" data-zoom-image="{{ popup }}"><img src="{{ theme_options.productImageThumb(product_id, config.get('theme_default_image_additional_width'), config.get('theme_default_image_additional_height')) }}" title="{{ heading_title }}" alt="{{ heading_title }}" /></a></p></li>
							  {% endif %} 
						      {% for image in images %} 
						      <li><p><a href="{{ image['popup'] }}" class="popup-image" data-image="{{ image['popup'] }}" data-zoom-image="{{ image['popup'] }}"><img src="{{ image['thumb'] }}" title="{{ heading_title }}" alt="{{ heading_title }}" /></a></p></li>
						      {% endfor %} 
						  </ul>
						</div>
			      	  </div>
			      	  {% endif %} 
			      	  
				      <div class="col-sm-{% if (theme_options.get( 'position_image_additional' ) == 2) %}{{ 10 }}{% else %}{{ 12 }}{% endif %}">
				      	{% if (thumb) %} 
					      <div class="product-image {% if (theme_options.get( 'product_image_zoom' ) != 2) %} {% if (theme_options.get( 'product_image_zoom' ) == 1) %} {{ 'inner-cloud-zoom' }} {% else %} {{ 'cloud-zoom' }} {% endif %} {% endif %}">
					      	 {% if (special and theme_options.get( 'display_text_sale' ) != '0') %} 
					      	 	{% set text_sale = 'Sale' %}
					 	 	{% if (theme_options.get( 'sale_text', config.get( 'config_language_id' ) ) != '') %}
					 	 		{% set text_sale = theme_options.get( 'sale_text', config.get( 'config_language_id' ) ) %}
					 	 	{% endif %} 
					      	 	{% if (theme_options.get( 'type_sale' ) == '1') %} 
					      	 	{% set product_detail = theme_options.getDataProduct( product_id ) %}
					 	 	{% set roznica_ceny = product_detail['price']-product_detail['special'] %}
					 	 	{% set procent = roznica_ceny*100/product_detail['price'] %} 
					      	 	<div class="sale">-{{ procent|round }}%</div>
					      	 	{% else %} 
					      	 	<div class="sale">{{ text_sale }}</div>
					      	 	{% endif %} 
					      	 {% elseif (theme_options.get( 'display_text_new' ) != '0' and theme_options.isLatestProduct( product_id )) %} 
     					      	 <div class="new">{% if (theme_options.get( 'new_text', config.get( 'config_language_id' ) ) != '') %} {{ theme_options.get( 'new_text', config.get( 'config_language_id' ) ) }} {% else %} {{ 'New' }} {% endif %}</div>
					      	 {% endif %} 
					      	 
					     	 <a href="{{ popup }}" title="{{ heading_title }}" id="ex1" {% if (theme_options.get( 'product_image_zoom' ) == 2) %}class="popup-image"{% else %} {{ 'class="open-popup-image"' }} {% endif %}><img src="{{ thumb }}" title="{{ heading_title }}" alt="{{ heading_title }}" id="image" itemprop="image" data-zoom-image="{{ popup }}" /></a>
					      </div>
					  	 {% else %} 
					  	 <div class="product-image">
					  	 	 <img src="image/no_image.jpg" title="{{ heading_title }}" alt="{{ heading_title }}" id="image" itemprop="image" />
					  	 </div>
					  	 {% endif %} 
				      </div>
				      
				      {% if ((images or theme_options.get( 'product_image_zoom' ) != 2) and theme_options.get( 'position_image_additional' ) != 2) %} 
				      <div class="col-sm-12">
				           <div class="overflow-thumbnails-carousel clearfix">
     					      <div class="thumbnails-carousel owl-carousel">
     					      	{% if (theme_options.get( 'product_image_zoom' ) != 2 and thumb) %} 
     					      	     <div class="item"><a href="{{ popup }}" class="popup-image" data-image="{{ thumb }}" data-zoom-image="{{ popup }}"><img src="{{ theme_options.productImageThumb(product_id, config.get('theme_default_image_additional_width'), config.get('theme_default_image_additional_height')) }}" title="{{ heading_title }}" alt="{{ heading_title }}" /></a></div>
     					      	{% endif %} 
     						     {% for image in images %} 
     						         <div class="item"><a href="{{ image['popup'] }}" class="popup-image" data-image="{{ image['popup'] }}" data-zoom-image="{{ image['popup'] }}"><img src="{{ image['thumb'] }}" title="{{ heading_title }}" alt="{{ heading_title }}" /></a></div>
     						     {% endfor %} 
     					      </div>
					      </div>
					      
					      <script type="text/javascript">
					           $(document).ready(function() {
					             $(".thumbnails-carousel").owlCarousel({
					                 autoPlay: 6000, //Set AutoPlay to 3 seconds
					                 navigation: true,
					                 navigationText: ['', ''],
					                 itemsCustom : [
					                   [0, 4],
					                   [450, 5],
					                   [550, 6],
					                   [768, 3],
					                   [1200, 4]
					                 ],
					                 {% if (page_direction[language_id] == 'RTL') %} 
					                 direction: 'rtl'
					                 {% endif %} 
					             });
					           });
					      </script>
				      </div>
				      {% endif %}
				       
			      </div>
			      
			      
			 {% set product_image_bottom = theme_options.getModules('product_image_bottom') %}
			 {% if ( product_image_bottom|length > 0 ) %} 
			 	{% for module in product_image_bottom %} 
			 		{{ module }}
			 	{% endfor %}
			 {% endif %} 
			    </div>

			    <div class="col-sm-{{ product_center_grid }} product-center clearfix">
			     <div itemscope itemtype="http://schema.org/Offer">
			      
			 {% set product_options_top = theme_options.getModules('product_options_top') %}
			 {% if ( product_options_top|length > 0 ) %} 
			 	{% for module in product_options_top %} 
			 		{{ module }}
			 	{% endfor %}
			 {% endif %} 
			      
			      {% if (review_status) %} 
			      <div class="review">
			      	{% if (rating > 0) %} 
			      	<span itemprop="review" class="hidden" itemscope itemtype="http://schema.org/Review-aggregate">
			      		<span itemprop="itemreviewed">{{ heading_title }}</span>
			      		<span itemprop="rating">{{ rating }}</span>
			      		<span itemprop="votes">100</span>
			      	</span>
			      	{% endif %} 
			        <div class="rating"><i class="fa fa-star{% if (rating >= 1) %} {{ ' active' }} {% endif %}"></i><i class="fa fa-star{% if (rating >= 2) %} {{ ' active' }} {% endif %}"></i><i class="fa fa-star{% if (rating >= 3) %} {{ ' active' }} {% endif %}"></i><i class="fa fa-star{% if (rating >= 4) %} {{ ' active' }} {% endif %}"></i><i class="fa fa-star{% if (rating >= 5) %} {{ ' active' }} {% endif %}"></i>&nbsp;&nbsp;&nbsp;<a onclick="$('a[href=\'#tab-review\']').trigger('click'); $('html, body').animate({scrollTop:$('#tab-review').offset().top}, '500', 'swing');">{{ reviews }}</a>&nbsp;&nbsp;|&nbsp;&nbsp;<a onclick="$('a[href=\'#tab-review\']').trigger('click'); $('html, body').animate({scrollTop:$('#tab-review').offset().top}, '500', 'swing');">{{ text_write }}</a></div>
			        {% if (theme_options.get( 'product_social_share' ) != '0') %} 
			        <div class="share">
			        	<!-- AddThis Button BEGIN -->
			        	<div class="addthis_toolbox addthis_default_style"><a class="addthis_button_facebook_like" fb:like:layout="button_count"></a> <a class="addthis_button_tweet"></a> <a class="addthis_button_pinterest_pinit"></a> <a class="addthis_counter addthis_pill_style"></a></div>
			        	<script type="text/javascript" src="//s7.addthis.com/js/300/addthis_widget.js#pubid=ra-515eeaf54693130e"></script> 
			        	<!-- AddThis Button END --> 
			        </div>
			        {% endif %} 
			      </div>
			      {% endif %} 
			      
			      <div class="description">
			        {% if (manufacturer) %} 
			        <span>{{ text_manufacturer }}</span> <a href="{{ manufacturers }}">{{ manufacturer }}</a><br />
			        {% endif %} 
			        <span>{{ text_model }}</span> {{ model }}<br />
			        {% if (reward) %} 
			        <span>{{ text_reward }}</span> {{ reward }}<br />
			        {% endif %} 
			        <span>{{ text_stock }}</span> {{ stock }}</div>
			      {% if (price) %} 
			      <div class="price">
			        {% if (theme_options.get( 'display_specials_countdown' ) == '1' and special) %} {% set countdown = random(5000)*random(50000) %} 
			 {% set product_detail = theme_options.getDataProduct( product_id ) %}
			 {% set date_end = product_detail['date_end'] %}
			 {% if (date_end != '0000-00-00' and date_end) %} 
			             		<script>
			             		$(function () {
			             			var austDay = new Date();
			             			austDay = new Date({{ theme_options.date("Y", theme_options.strtotime(date_end)) }}, {{ theme_options.date("m", theme_options.strtotime(date_end)) }} - 1, {{ theme_options.date("d", theme_options.strtotime(date_end)) }});
			             			$('#countdown{{ countdown }}').countdown({until: austDay});
			             		});
			             		</script>
			             		<h3>{% if (theme_options.get( 'limited_time_offer_text', config.get( 'config_language_id' ) ) != '') %} {{ theme_options.get( 'limited_time_offer_text', config.get( 'config_language_id' ) ) }} {% else %} {{ 'Limited time offer' }} {% endif %}</h3>
			             		<div id="countdown{{ countdown }}" class="clearfix"></div>
			        	     {% endif %} 
			        {% endif %} 
			        {% if (not special) %} 
			        <span class="price-new"><span itemprop="price" id="price-old">{{ price }}</span></span>
			        {% else %} 
			        <span class="price-new"><span itemprop="price" id="price-special">{{ special }}</span></span> <span class="price-old" id="price-old">{{ price }}</span>
			        {% endif %} 
			        <br />
			        {% if (tax) %} 
			        <span class="price-tax">{{ text_tax }} <span id="price-tax">{{ tax }}</span></span><br />
			        {% endif %} 
			        {% if (points) %} 
			        <span class="reward"><small>{{ text_points }} {{ points }}</small></span><br />
			        {% endif %} 
			        {% if (discounts) %} 
			        <br />
			        <div class="discount">
			          {% for discount in discounts %} 
			          {{ discount['quantity'] }}{{ text_discount }}{{ discount['price'] }}<br />
			          {% endfor %} 
			        </div>
			        {% endif %} 
			      </div>
			      {% endif %} 
			     </div> 
			     
			     <div id="product">
			      {% set product_options_center = theme_options.getModules('product_options_center') %}
			      {% if (options or product_options_center|length > 0) %} 
			      <div class="options">
			        {% for module in product_options_center %} {{ module }} {% endfor %} 
			        
			        {% if (options) %} 
			        <div class="options2">
     			        <h2>{{ text_option }}</h2>
     			        {% for option in options %} 
     			        	
     			        {% if (option['type'] == 'select') %} 
     			        <div class="form-group{{ option['required'] ? ' required' : '' }}">
     			          <label class="control-label" for="input-option{{ option['product_option_id'] }}">{{ option['name'] }}</label>
     			          <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{{ option['required'] ? ' required' : '' }}">
     			           <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 {% if (theme_options.get( 'product_page_radio_style' ) == 1) %} {{ 'radio-type-button2' }} {% endif %}">
     			               <label>
     			                 <input type="radio" name="option[{{ option['product_option_id'] }}]" value="{{ option_value['product_option_value_id'] }}" />
     			                 <span {% if (option_value['image']) %} {{ 'style="padding: 2px"' }} {% endif %}>{% if (not option_value['image']) %}{{ option_value['name'] }}{% endif %} 
     			                 {% if (option_value['image']) %} 
     			                 <img src="{{ option_value['image'] }}" alt="{{ option_value['name'] ~ option_value['price'] ? ' ' ~ option_value['price_prefix'] ~ option_value['price'] : '' }}"  style="display: block;border-radius: 100px;-webkit-border-radius: 100px;-moz-border-radius: 100px" class="img-thumbnail" /> 
     			                 {% endif %} 
     			                 {% if (theme_options.get( 'product_page_radio_style' ) != 1) %}{% if (option_value['price']) %} 
     			                 ({{ option_value['price_prefix'] }}{{ option_value['price'] }})
     			                 {% endif %}{% endif %}</span>
     			               </label>
     			             </div>
     			             {% endfor %} 
     			             
     			             {% if (theme_options.get( 'product_page_radio_style' ) == 1) %} 
     			             <script type="text/javascript">
     			                  $(document).ready(function(){
     			                       $('#input-option{{ option['product_option_id'] }}').on('click', 'span', function () {
     			                            $('#input-option{{ option['product_option_id'] }} span').removeClass("active");
     			                            $(this).addClass("active");
     			                       });
     			                  });
     			             </script>
     			             {% endif %} 
     			           </div>
     			         </div>
     			         {% endif %} 
     			         
     			        {% if (option['type'] == 'checkbox') %} 
     			        <div class="form-group{{ option['required'] ? ' required' : '' }}">
     			          <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 {% if (theme_options.get( 'product_page_checkbox_style' ) == 1) %} {{ 'radio-type-button2' }} {% endif %}">
     			              <label>
     			                <input type="checkbox" name="option[{{ option['product_option_id'] }}][]" value="{{ option_value['product_option_value_id'] }}" />
     			                <span>{{ option_value['name'] }} 
     			                {% if (theme_options.get( 'product_page_checkbox_style' ) != 1) %}{% if (option_value['price']) %} 
     			                ({{ option_value['price_prefix'] }}{{ option_value['price'] }})
     			                {% endif %}{% endif %}</span>
     			              </label>
     			            </div>
     			            {% endfor %} 
     			            
     			            {% if (theme_options.get( 'product_page_checkbox_style' ) == 1) %} 
     			            <script type="text/javascript">
     			                 $(document).ready(function(){
     			                      $('#input-option{{ option['product_option_id'] }}').on('click', 'span', function () {
     			                           if($(this).hasClass("active") == true) {
     			                                $(this).removeClass("active");
     			                           } else {
     			                                $(this).addClass("active");
     			                           }
     			                      });
     			                 });
     			            </script>
     			            {% endif %} 
     			          </div>
     			        </div>
     			        {% endif %} 
     			        
     			        {% if (option['type'] == 'image') %} 
     			        <div class="form-group{{ option['required'] ? ' required' : '' }}">
     			          <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 {% if (theme_options.get( 'product_page_radio_style' ) == 1) %} {{ 'radio-type-button' }} {% endif %}">
     			              <label>
     			                <input type="radio" name="option[{{ option['product_option_id'] }}]" value="{{ option_value['product_option_value_id'] }}" />
     			                <span {% if (theme_options.get( 'product_page_radio_style' ) == 1) %}data-toggle="tooltip" data-placement="top" title="{{ option_value['name'] }} {% if (option_value['price']) %}({{ option_value['price_prefix'] }}{{ option_value['price'] }}){% endif %}"{% endif %}><img src="{{ option_value['image'] }}" alt="{{ option_value['name'] ~ option_value['price'] ? ' ' ~ option_value['price_prefix'] ~ option_value['price'] : '' }}" {% if (theme_options.get( 'product_page_radio_style' ) == 1) %}width="{% if (theme_options.get( 'product_page_radio_image_width' ) > 0) %} {{ theme_options.get( 'product_page_radio_image_width' ) }} {% else %} {{ 25 }} {% endif %}px" height="{% if (theme_options.get( 'product_page_radio_image_height' ) > 0) %} {{ theme_options.get( 'product_page_radio_image_height' ) }} {% else %} {{ 25 }} {% endif %}px"{% endif %} /> {% if (theme_options.get( 'product_page_radio_style' ) != 1) %}{{ option_value['name'] }} 
     			                {% if (option_value['price']) %} 
     			                ({{ option_value['price_prefix'] }}{{ option_value['price'] }})
     			                {% endif %}{% endif %}</span>
     			              </label>
     			            </div>
     			            {% endfor %} 
     			            {% if (theme_options.get( 'product_page_radio_style' ) == 1) %} 
     			            <script type="text/javascript">
     			                 $(document).ready(function(){
     			                      $('#input-option{{ option['product_option_id'] }}').on('click', 'span', function () {
     			                           $('#input-option{{ option['product_option_id'] }} span').removeClass("active");
     			                           $(this).addClass("active");
     			                      });
     			                 });
     			            </script>
     			            {% endif %} 
     			          </div>
     			        </div>
     			        {% endif %} 
     			        
     			        {% if (option['type'] == 'text') %} 
     			        <div class="form-group{{ option['required'] ? ' required' : '' }}">
     			          <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{{ option['required'] ? ' required' : '' }}">
     			          <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{{ option['required'] ? ' required' : '' }}">
     			          <label class="control-label">{{ option['name'] }}</label>
     			          <button type="button" id="button-upload{{ option['product_option_id'] }}" class="btn btn-default btn-block" style="margin-top: 7px"><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{{ option['required'] ? ' required' : '' }}">
     			       	  <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{{ option['required'] ? ' required' : '' }}">
     			       	  <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{{ option['required'] ? ' required' : '' }}">
     			       	  <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 %} 
     			   </div>
			        {% endif %} 
			      </div>
			      {% endif %} 
			      
			      {% if (recurrings) %} 
			      <div class="options">
			          <h2>{{ text_payment_recurring }}</h2>
			          <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>
			      </div>
			      {% endif %} 
			      
			      <div class="cart">
			        <div class="add-to-cart clearfix">
			          
			 {% set product_enquiry = theme_options.getModules('product_enquiry') %}
			 {% if ( product_enquiry|length > 0 ) %} 
			 	{% for module in product_enquiry %} 
			 		{{ module }}
			 	{% endfor %}
			 {% else %} 
     			          <p>{{ entry_qty }}</p>
     			          <div class="quantity">
     				          <input type="text" name="quantity" id="quantity_wanted" size="2" value="{{ minimum }}" />
     				          <a href="#" id="q_up"><i class="fa fa-plus"></i></a>
     				          <a href="#" id="q_down"><i class="fa fa-minus"></i></a>
     			          </div>
     			          <input type="hidden" name="product_id" size="2" value="{{ product_id }}" />
     			          <input type="button" value="{{ button_cart }}" id="button-cart" rel="{{ product_id }}" data-loading-text="{{ text_loading }}" class="button" />
     			          
     			          
 			 {% set product_question = theme_options.getModules('product_question') %}
 			 {% if ( product_question|length > 0 ) %} 
 			 	{% for module in product_question %} 
 			 		{{ module }}
 			 	{% endfor %}
 			 {% endif %} 
			          {% endif %} 
			        </div>
			        
			        <div class="links clearfix">
			        	<a onclick="wishlist.add('{{ product_id }}');">{% if (theme_options.get( 'add_to_wishlist_text', config.get( 'config_language_id' ) ) != '') %} {{ theme_options.get( 'add_to_wishlist_text', config.get( 'config_language_id' ) ) }} {% else %} {{ 'Add to wishlist' }} {% endif %}</a>
			        	<a onclick="compare.add('{{ product_id }}');">{% if (theme_options.get( 'add_to_compare_text', config.get( 'config_language_id' ) ) != '') %} {{ theme_options.get( 'add_to_compare_text', config.get( 'config_language_id' ) ) }} {% else %} {{ 'Add to compare' }} {% endif %}</a>
			        </div>
			         
			        {% if (minimum > 1) %} 
			        <div class="minimum">{{ text_minimum }}</div>
			        {% endif %} 
			      </div>
			     </div><!-- End #product -->
			      
			      
			 {% set product_options_bottom = theme_options.getModules('product_options_bottom') %}
			 {% if ( product_options_bottom|length > 0 ) %} 
			 	{% for module in product_options_bottom %} 
			 		{{ module }}
			 	{% endfor %}
			 {% endif %} 
		    	</div>
		    </div>
    	</div>
    	 
    	{% if (theme_options.get( 'custom_block', 'product_page', config.get( 'config_language_id' ), 'status' ) == 1 or product_custom_block|length > 0) %} 
    	<div class="col-md-3 col-sm-12">
    	     {% if (theme_options.get( 'custom_block', 'product_page', config.get( 'config_language_id' ), 'status' ) == 1) %} 
    		<div class="product-block">
    			{% if (theme_options.get( 'custom_block', 'product_page', config.get( 'config_language_id' ), 'heading' ) != '') %} 
    			<h4 class="title-block">{{ theme_options.get( 'custom_block', 'product_page', config.get( 'config_language_id' ), 'heading' ) }}</h4>
    			<div class="strip-line"></div>
    			{% endif %} 
    			<div class="block-content">
    				{{ theme_options.html_entity_decode(theme_options.get( 'custom_block', 'product_page', config.get( 'config_language_id' ), 'text' )) }} 
    			</div>
    		</div>
    		{% endif %} 
    		
    		{% for module in product_custom_block %} {{ module }} {% endfor %} 
    	</div>
    	{% endif %} 
    </div>
  </div>
  
  
 {% set product_over_tabs = theme_options.getModules('product_over_tabs') %}
 {% if ( product_over_tabs|length > 0 ) %} 
 	{% for module in product_over_tabs %} 
 		{{ module }}
 	{% endfor %}
 {% endif %} 
  
 
 	 {% set language_id = config.get( 'config_language_id' ) %}
	 {% set tabs = [] %}
	 
	 {% set tabs = tabs | merge([{'content': 'description', 'heading': tab_description, 'sort': 1 }]) %}

	 {% if (attribute_groups) %} 
	 	{% set tabs = tabs | merge([{'content': 'attribute', 'heading': tab_attribute, 'sort': 3 }]) %}
	 {% endif %}
	 
	 {% if (review_status) %} 
	 	 {% set tabs = tabs | merge([{'content': 'review', 'heading': tab_review, 'sort': 5 }]) %}
	 {% endif %} 
	 	 	 
 	 {% if (config.get('product_tabs') is iterable) %}
		 {% for tab in config.get('product_tabs') %} 
		 	{% if (tab['status'] == 1 or tab['product_id'] == product_id) %}
		 		{% for zakladka in tab['tabs'] %} 
		 			{% if (zakladka['status'] == 1) %}
		 				{% set heading = constant('false') %} 
		 				{% set content = constant('false') %}
		 				{% if (zakladka[language_id] is defined) %}
		 					{% set heading = zakladka[language_id]['name'] %}
		 					{% set content = theme_options.html_entity_decode(zakladka[language_id]['html']) %}
		 				{% endif %}
		 				{% set tabs = tabs | merge([{'content': content, 'heading': heading, 'sort': zakladka['sort_order'] }]) %}
		 			{% endif %}
		 		{% endfor %}
		 	{% endif %}
		 {% endfor %}
	 {% endif %} 
	 
  	{% set tabs_test = theme_options.usort(tabs) %}

   <div id="tabs" class="htabs">
  	{% set i = 0 %} 
  	{% for tab in tabs_test  %} 
  		{% set i = i + 1 %}
 		{% set id = 'tab_'~i %}
 		{% if (tab['content'] == 'description') %} {% set id = 'tab-description' %} {% endif %}
 		{% if (tab['content'] == 'attribute') %} {% set id = 'tab-attribute' %} {% endif %}
 		{% if (tab['content'] == 'review') %} {% set id = 'tab-review' %} {% endif %}
 		{{ '<a href="#'~id~'">'~tab['heading']~'</a>' }}
 	{% endfor %} 
  </div>
 {% set i = 0 %} 
  {% for tab in tabs_test %} 
  	{% set i = i + 1 %}
 	{% set id = 'tab_'~i %}
 	{% if (tab['content'] != 'description' and tab['content'] != 'attribute' and tab['content'] != 'review') %}
 		{{ '<div id="'~id~'" class="tab-content">'~tab['content']~'</div>' }}
 	{% endif %}
 {% endfor %}  
  <div id="tab-description" class="tab-content" itemprop="description">{{ description }}</div>
  {% if (attribute_groups) %} 
  <div id="tab-attribute" class="tab-content">
    <table class="attribute" cellspacing="0">
      {% for attribute_group in attribute_groups %} 
      <thead>
        <tr>
          <td colspan="2">{{ attribute_group['name'] }}</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 id="tab-review" class="tab-content">
	<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="" id="input-name" class="form-control" />
	    </div>
	  </div>
	  <div class="form-group required">
	    <div class="col-sm-12">
	         <label class="control-label">{{ entry_rating }}</label>
	        
	       <div class="rating set-rating">
	          <i class="fa fa-star" data-value="1"></i>
	          <i class="fa fa-star" data-value="2"></i>
	          <i class="fa fa-star" data-value="3"></i>
	          <i class="fa fa-star" data-value="4"></i>
	          <i class="fa fa-star" data-value="5"></i>
	      </div>
	      <script type="text/javascript">
	          $(document).ready(function() {
	            $('.set-rating i').hover(function(){
	                var rate = $(this).data('value');
	                var i = 0;
	                $('.set-rating i').each(function(){
	                    i++;
	                    if(i <= rate){
	                        $(this).addClass('active');
	                    }else{
	                        $(this).removeClass('active');
	                    }
	                })
	            })
	            
	            $('.set-rating i').mouseleave(function(){
	                var rate = $('input[name="rating"]:checked').val();
	                rate = parseInt(rate);
	                i = 0;
	                  $('.set-rating i').each(function(){
	                    i++;
	                    if(i <= rate){
	                        $(this).addClass('active');
	                    }else{
	                        $(this).removeClass('active');
	                    }
	                  })
	            })
	            
	            $('.set-rating i').click(function(){
	                $('input[name="rating"]:nth('+ ($(this).data('value')-1) +')').prop('checked', true);
	            });
	          });
	      </script>
	      <div class="hidden">
	         &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>
	  </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>
	  {{ captcha }} 
	  <div class="buttons clearfix" style="margin-bottom: 0px">
	    <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 %} 
  
	{% 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>

<script type="text/javascript"><!--
$('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, .text-danger').remove();
			
			if (json['success']) {
				$('#recurring-description').html(json['success']);
			}
		}
	});
});
//--></script> 
<script type="text/javascript"><!--
$('#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, .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']) {
				$.notify({
					message: json['success'],
					target: '_blank'
				},{
					// settings
					element: 'body',
					position: null,
					type: "info",
					allow_dismiss: true,
					newest_on_top: false,
					placement: {
						from: "top",
						align: "right"
					},
					offset: 20,
					spacing: 10,
					z_index: 2031,
					delay: 5000,
					timer: 1000,
					url_target: '_blank',
					mouse_over: null,
					animate: {
						enter: 'animated fadeInDown',
						exit: 'animated fadeOutUp'
					},
					onShow: null,
					onShown: null,
					onClose: null,
					onClosed: null,
					icon_type: 'class',
					template: '<div data-notify="container" class="col-xs-11 col-sm-3 alert alert-success" role="alert">' +
						'<button type="button" aria-hidden="true" class="close" data-notify="dismiss">×</button>' +
						'<span data-notify="message"><i class="fa fa-check-circle"></i>&nbsp; {2}</span>' +
						'<div class="progress" data-notify="progressbar">' +
							'<div class="progress-bar progress-bar-success" role="progressbar" aria-valuenow="0" aria-valuemin="0" aria-valuemax="100" style="width: 0%;"></div>' +
						'</div>' +
						'<a href="{3}" target="{4}" data-notify="url"></a>' +
					'</div>' 
				});
				
				$('#cart_block #cart_content').load('index.php?route=common/cart/info #cart_content_ajax');
				$('#cart_block #total_price_ajax').load('index.php?route=common/cart/info #total_price');
				$('#cart_block .cart-count').load('index.php?route=common/cart/info #total_count_ajax');
			}
		},
     	error: function(xhr, ajaxOptions, thrownError) {
     	    alert(thrownError + "\r\n" + xhr.statusText + "\r\n" + xhr.responseText);
     	}
	});
});
//--></script> 
<script type="text/javascript"><!--
$('.date').datetimepicker({
	pickTime: false
});

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

$('.time').datetimepicker({
	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');
	
	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').attr('value', json['code']);
					}
				},
				error: function(xhr, ajaxOptions, thrownError) {
					alert(thrownError + "\r\n" + xhr.statusText + "\r\n" + xhr.responseText);
				}
			});
		}
	}, 500);
});
//--></script> 
<script type="text/javascript"><!--
$('#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-success, .alert-danger').remove();
            
			if (json['error']) {
                $('#review').after('<div class="alert alert-danger"><i class="fa fa-exclamation-circle"></i> ' + json['error'] + '</div>');
            }
            
            if (json['success']) {
                $('#review').after('<div class="alert alert-success"><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);
            }
        }
    });
});
</script>

<script type="text/javascript"><!--
$(document).ready(function() {     
	$('.popup-gallery').magnificPopup({
		delegate: 'a.popup-image',
		type: 'image',
		tLoading: 'Loading image #%curr%...',
		mainClass: 'mfp-with-zoom',
		removalDelay: 200,
		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');
			}
		}
	});
});
//--></script> 

<script type="text/javascript">
var ajax_price = function() {
	$.ajax({
		type: 'POST',
		url: 'index.php?route=product/liveprice/index',
		data: $('.product-info input[type=\'text\'], .product-info input[type=\'hidden\'], .product-info input[type=\'radio\']:checked, .product-info input[type=\'checkbox\']:checked, .product-info select, .product-info textarea'),
		dataType: 'json',
			success: function(json) {
			if (json.success) {
				change_price('#price-special', json.new_price.special);
				change_price('#price-tax', json.new_price.tax);
				change_price('#price-old', json.new_price.price);
			}
		}
	});
}

var change_price = function(id, new_price) {
	$(id).html(new_price);
}

$('.product-info input[type=\'text\'], .product-info input[type=\'hidden\'], .product-info input[type=\'radio\'], .product-info input[type=\'checkbox\'], .product-info select, .product-info textarea, .product-info input[name=\'quantity\']').on('change', function() {
	ajax_price();
});
</script>

<script type="text/javascript">
$.fn.tabs = function() {
	var selector = this;
	
	this.each(function() {
		var obj = $(this); 
		
		$(obj.attr('href')).hide();
		
		$(obj).click(function() {
			$(selector).removeClass('selected');
			
			$(selector).each(function(i, element) {
				$($(element).attr('href')).hide();
			});
			
			$(this).addClass('selected');
			
			$($(this).attr('href')).show();
			
			return false;
		});
	});

	$(this).show();
	
	$(this).first().click();
};
</script>

<script type="text/javascript"><!--
$('#tabs a').tabs();
//--></script> 

{% if (theme_options.get( 'product_image_zoom' ) != 2) %} 
	<script type="text/javascript" src="catalog/view/theme/fastor/js/jquery.elevateZoom-3.0.3.min.js"></script>
{% endif %} 

{% include 'fastor/template/new_elements/wrapper_bottom.twig' %}
{{ footer }}