{* Страница товара *}
<!-- Хлебные крошки /-->
{$bid = 0}
{$ccat = $category->path|count}
<ul class="breadcrumb">
<li><a href="/">Главная</a></li>
	{foreach from=$category->path item=cat} {if $bid == 0}{$bid = $cat->id}{/if}
<li><a href="/catalog/{$cat->url}/">{$cat->name|escape}</a></li>
	{/foreach}
	{if $brand && $ccat < 3}
<li><a href="/catalog/{$cat->url}/{$brand->url}/">{$brand->name|escape}</a></li>
	{/if}
<li>{$product->name|escape}</li>
</ul>
<!-- Хлебные крошки #End /-->
{*<h1 data-product="{$product->id}">{$product->product_h1|escape}</h1>*}
<h1>{$product->name|escape}</h1>
<div class="product-details">
<div class="product" itemscope itemtype="http://schema.org/Product">
<span style="display:none" itemprop="name">{$product->product_h1|escape}</span>
<div class="col-sm-4">
<!-- Большое фото -->
	{if $product->image}
	<div class="product-image">
		<a href="{$product->image->filename|resize:1000:1000}" class="zoom w" {*rel="product-gallery"*} data-rel="group"><img itemprop="image" class="img-thumbnail" src="{$product->image->filename|resize:252:252}" alt="{$product->product->name|escape}" /></a>
	</div>
	{/if}
	<!-- Большое фото (The End)-->
	<!-- Дополнительные фото продукта -->
	{if $product->images|count>1}
	<div class="product-images">
		{* cut удаляет первую фотографию, если нужно начать 2-й - пишем cut:2 и тд *}
		{foreach $product->images|cut as $i=>$image}
			<a href="{$image->filename|resize:1000:1000}" class="zoom w" {*rel="product-gallery"*} data-rel="group"><img class="img-thumbnail" src="{$image->filename|resize:100:100}" alt="{$product->name|escape}" /></a>
		{/foreach}
	</div>
	{/if}
	<!-- Дополнительные фото продукта (The End)-->
</div>
{literal} <script>$.yEcommerce = [];</script> {/literal}  
<div class="col-sm-8">    
	{if $product->variants|count > 0}
		<!-- Выбор варианта товара -->
		<div style="display: inline" itemprop="offers" itemscope itemtype="http://schema.org/Offer">
        <span class="mdh" itemprop="priceCurrency" data-content="RUB">RUB</span>
		<form class="variants" action="/cart">
			<table>
			{foreach $product->variants as $v}
			{literal}<script>$.yEcommerce.push( {/literal}{$v|@json_encode nofilter}{literal} );</script>{/literal}
			<tr class="variant">
				<td>
					<input id="related_{$v->id}" name="variant" value="{$v->id}" type="radio" class="variant_radiobutton" data-stock="{$v->stock}"  {if $v@first}checked{/if} {if $product->variants|count<2} style="display:none;"{/if}/>
				</td>
				<td>
					{if $v->name}<label class="variant_name" for="related_{$v->id}">{$v->name}</label>{/if}
				</td>
				<td>
					{if $v->price != 0.00}
                    <span class="mdh" itemprop="price" data-content="{$v->price}">{$v->price}</span>
                    <span class="product-price"><small>цена </small> {$v->price|convert} <small>{$currency->sign|escape}</small></span>
                    {if $v->compare_price > 0} <span class="product-compare-price"><small>цена </small> {$v->compare_price|convert} <small>{$currency->sign|escape}</small></span>{/if}
					{/if}
				</td>
			</tr>
			{/foreach}
			</table>
			<div id="params">
			{if $featuresvars}
			{foreach $featuresvars as $fv}
			{$fid = $fv->id}
			{if $v->options.$fid|count > 0}
				<div class="select">
				<label>{$fv->name}:</label> <select name="feature[{$fv->id}]">
				{if $fv->nameselect}<option value="">{$fv->nameselect}</option>{/if}
				{foreach $fv->options as $fo}
					<option value="{$fo}" class="option
						{foreach $product->variants as $v}
						{if $v->options.$fid}
							{foreach $v->options.$fid as $vo}
								{if $vo->value == $fo}
									var{$v->id}
								{/if}
							{/foreach}
						{/if}
						{/foreach}
					" disabled>
						{$fo}
					</option>
				{/foreach}
				</select></div>
			{/if}
			{/foreach}
			{literal}
			<script type="text/javascript">
				$(function() {
					function activeVariant(){
						$('#params .select select option').attr('disabled','disabled');
						var inp = $("input[name=variant]:checked")
						var variant = inp.val();
						$('#params .select select option.var'+variant).removeAttr('disabled');
						if(inp.attr('data-stock')=='0'){
							$('#buy').hide();
							$('#prebuy').show();
						}else{
							$('#buy').show();
							$('#prebuy').hide();
						}
					}
					$("input[name=variant]").change(function(){
						activeVariant();
					});
					activeVariant();
				});
			</script>
			{/literal}
			{/if}
			</div>
<div class="product-buttons">
  <div id="buy">
    <div class="minus-plus">      
    <div class="input-group">
      <span class="input-group-btn">
        <button class="btn btn-default" id="add1" type="button" onclick="javascript:this.form.amount.value= this.form.amount.value<=1 ? 1 :parseInt(this.form.amount.value)-1 ;"><span class="glyphicon glyphicon-minus"></span></button>
      </span>
      <input type="text" class="form-control" name="amount" value="1">
      <span class="input-group-btn">
        <button class="btn btn-default" id="add2" type="button" onclick="javascript:this.form.amount.value= this.form.amount.value>=10 ? 10 :parseInt(this.form.amount.value)+1 ;"><span class="glyphicon glyphicon-plus"></span></button>
      </span>      
    </div>
    </div>
            {*
				Кол-во<input id="add1" type="button" value="-" onclick="javascript:this.form.amount.value= this.form.amount.value<=1 ? 1 :parseInt(this.form.amount.value)-1 ;">
				<input type="text" style="width:30px" name="amount" value="1">
				<input type="button" value="+" id="add2" onclick="javascript:this.form.amount.value= this.form.amount.value>=10 ? 10 :parseInt(this.form.amount.value)+1 ;"><br>
             *}   
                <p>&nbsp;</p>
		<input type="submit" class="btn btn-danger" value="Добавить в корзину" data-result-text="Товар добавлен"/>
  </div>
			<div id="prebuy" style="display:none;">
				{*<p>Нет в наличии</p>*}
				<input type="button" class="btn btn-danger addcart preorder" value="Предзаказ" data-stock="{$product->variant->id}" data-id="{$product->variant->id}"/>
			</div>
</div>            
		</form></div>
		<!-- Выбор варианта товара (The End) -->
		{else}
		{/if}
		<div class="none" style="display:none;">
			<div class="modal2 dialog amount well" id="amount{$product->variant->id}" >
			<form class="ajaxform preorder form-horizontal" action="ajax/preorder.php" method="post">
				<input name="variant" value="{$product->variant->id}" type="hidden" />
				<input name="comment" value="Предзаказ на {$product->name}" type="hidden" />
				<span class="header h22">Предзаказ</span>
				<p><a href="/products/{$product->url}/">{$product->name|escape}</a></p>
				<p>Как только товар будет в наличии, наш менеджер свяжется с Вами.</p>
				<div class="cart_form">
					<div class="form-group">
						<label class="col-sm-3 control-label">Имя</label>
						<span class="col-sm-9"><input name="name" class="form-control" type="text" value="{$name|escape}" /></span>
					</div>
					<div class="form-group">
						<label class="col-sm-3 control-label">Фамилия</label>
						<span class="col-sm-9"><input name="name2" class="form-control" type="text" value="{$name2|escape}" /></span>
					</div>
					<div class="form-group">
						<label class="col-sm-3 control-label">Email</label>
						<span class="col-sm-9"><input name="email" class="form-control" type="text" value="{$email|escape}"  /></span>
					</div>
					<div class="form-group">
						<label class="col-sm-3 control-label">Телефон*</label>
						<span class="col-sm-9"><input name="phone" class="form-control" type="text" value="{$phone|escape}" required="required" /></span>
					</div>
								
				</div>
				<p class="clear"></p>
				<p class="pull-right"><input class="button btn btn-danger" type="submit" value="Отправить" /></p>
			</form>
			</div>
		</div>
 </div>
<!-- Ретинг -->
<script src="design/{$settings->theme}/js/project.js"></script>
{literal}
<script type="text/javascript">
	$(function() {
		$('.testRater').rater({ postHref: 'ajax/rating.php' });
	});
</script>
{/literal}
{*
<div class="testRater" id="product_{$product->id}">
	<div class="statVal">
		<span class="rater">
			<span class="rater-starsOff" style="width:115px;">
				<span class="rater-starsOn" style="width:{$product->rating*115/5|string_format:"%.0f"}px"></span>
			</span>
			<span class="test-text">
				<span class="rater-rating">{$product->rating|string_format:"%.1f"}</span>&#160;(голосов <span class="rater-rateCount">{$product->votes|string_format:"%.0f"}</span>)
			</span>
		</span>
	</div>
</div>
*}
<!-- Рейтинг (The End) -->
<!-- Просмотров --> <div style="text-align:right"><small>Просмотров товара: {$product->views}</small></div> <!-- Просмотров (The End) -->
 <!-- TABS -->
        {literal}
        <script type="text/javascript">
             $(document).ready(function() {
                     $("#tabcontent div._tabs").hide(); // Скрываем содержание
                     $("#tabs li:first").attr("id","current"); // Активируем первую закладку
                     $("#tabcontent div:first").fadeIn(); // Выводим содержание
                 $('#tabs a').click(function(e) {
                     e.preventDefault();
                     $("#tabcontent div._tabs").hide(); //Скрыть все сожержание
                     $("#tabs li").attr("id",""); //Сброс ID
                     $(this).parent().attr("id","current"); // Активируем закладку
                     $('#' + $(this).attr('title')).fadeIn(); // Выводим содержание текущей закладки
                 });
             });
        </script>
        {/literal}
            <ul id="tabs">
                 <li><a href="#" title="Описание">Описание</a></li>
                 <li><a href="#" title="Доставка">Доставка</a></li>
                 <li><a href="#" title="Оплата">Оплата</a></li>
                 <li><a href="#" title="Отзывы">Отзывы</a></li>
                 <li><a href="#" title="Примеры">Примеры установки</a></li>
        </ul>
        <div id="tabcontent">
                 <div id="Описание" class="_tabs">
                              <!-- Описание товара -->
                                  {*<span class="h22" data-product="{$product->id}">Описание товара {$product->name|escape}</span>*}
                                  <div class="description">
                                  {images_resize content=$product->body}
                                  </div>
                                  <div itemprop="description" style="display:none;">
                                  {if $product->annotation}{$product->annotation}{else}{$product->body}{/if}
                                  </div>
                                  <!-- Описание товара (The End)-->
                 </div>
                 
{literal}
<script>
$('.description p').each(function() {
    if ($(this).find('.fancybox').length == 1) {         
        $(this).find('.fancybox').wrap('<div class="col-sm-12"></div>')
        $(this).wrapInner('<div class="row"></div>')            
    }    
    if ($(this).find('.fancybox').length >= 2) {         
        $(this).find('.fancybox').wrap('<div class="col-sm-6"></div>')
        $(this).wrapInner('<div class="row"></div>')          
    }
});
</script>
{/literal}                 
                 
                 
                 <div id="Доставка" class="_tabs">
                              <!-- Доставка товара -->
                                 
                                  <!-- Доставка товара (The End)-->
                 </div>
                 <div id="Оплата" class="_tabs">
                              <!-- Оплата товара -->
           
								  <!-- Оплата товара (The End)-->
                 </div>
                 <div id="Отзывы" class="_tabs">
	<span class="h22">Комментарии</span>
	{if $comments}
	<!-- Список с комментариями -->
	<ul class="comment_list">
		{foreach $comments as $comment}
		<li style="background-color: transparent;padding:0"></li>
		<li style="background-color: transparent;padding:0"><a id="comment_{$comment->id}"></a><hr></li>
		
		<li>
			<!-- Имя и дата комментария-->
			<p class="comment_header" style="display: block;">
				{$comment->name|escape} <span class="product-comment-date">{$comment->date|date}, {$comment->date|time}</span>
				{if !$comment->approved}ожидает модерации</b>{/if}
			</p>
			<!-- Имя и дата комментария (The End)-->
			<!-- Комментарий -->
			{$comment->text|escape|nl2br}
			<!-- Комментарий (The End)-->
		</li>
		<li style="background-color: transparent;padding:0"><hr></li>
		{/foreach}
	</ul>
	<!-- Список с комментариями (The End)-->
	{else}
	<p>
		Пока нет комментариев
	</p>
	{/if}
	<!--Форма отправления комментария-->
	<div  class="well">
    <form class="comment_form form-horizontal" method="post">
    
		<span class="h22">Написать комментарий</span>
		{if $error}
		<div class="message_error">
		   {if $error=='captcha'}
			Неверно введена капча
			{elseif $error=='empty_name'}
			Введите имя
			{elseif $error=='empty_comment'}
			Введите комментарий
			{/if}
		</div>
		{/if}
        
        <span class="form-group">
        <label  class="col-sm-2 control-label">Комментарий</label>
		<span class="col-sm-10"><textarea class="comment_textarea form-control" id="comment_text" name="text" data-format=".+" data-notice="Введите комментарий">{$comment_text}</textarea></span>
        </span>        
        <span class="form-group">
		<label  class="col-sm-2 control-label">Имя</label>
		<span class="col-sm-10"><input class="input_name form-control" type="text" id="comment_name" name="name" value="{$comment_name}" data-format=".+" data-notice="Введите имя"/></span>
        </span>        
        <span class="form-group">
		<span class="col-sm-2"><span style="display:block" class="captcha"><img src="captcha/image.php?{math equation='rand(10,10000)'}" alt='captcha'/></span></span>        
		<span class="col-sm-2"><input class="input_captcha  form-control" id="comment_captcha" type="text" name="captcha_code" value="" data-format="\d\d\d\d" data-notice="Введите капчу"/></span>
        </span>        
        <input class="btn btn-danger pull-right" type="submit" name="comment" value="Отправить" />
        <input id="h_email" name="email">
	</form>
    </div>
	<!--Форма отправления комментария (The End)-->
</div>
<div id="Примеры" class="_tabs">
    {if $related_articles}
    <ul>
        {foreach $related_articles as $a}
	    <li>
             {if $a->image}<a href="/article/{$a->url}/"><img src="{$a->image|resizepost:100:100}"  alt="{$a->name|escape}" /></a>{/if}
             <span class="h22"><a href="/article/{$a->url}/">{$a->name|escape}</a></span>
	        <div>{$a->annotation}</div>
			<p class="clear"></p>
	    </li>
        {/foreach}
    </ul>
    {/if}
</div>
        </div>
        <!-- TABS (The End)-->
</div>


{if $adminBtn}
<a class="btn btn-warning btn-sm" href="{$adminBtn}" style="position:absolute;top:80px;right:15px" title="редактировать"><i class="fa fa-pencil-square-o"></i></a>
{/if}

</div>
<!-- Описание товара (The End)-->
{literal}
<script>
$(function() {
	$(".features li:even").addClass('even');
	$('a[data-rel=group]').attr('rel', 'product-gallery');
	$("a.zoom").fancybox({ 'hideOnContentClick' : true });
});
</script>
{/literal}
{literal}
<script type='text/javascript'>
    function saveData() {
        sessionStorage.data = '#comments';
    }
</script>
{/literal}
{literal}
<script>
    $(function() {
        $('#myTab a[href="' + sessionStorage.data + '"]').tab('show');
    });
    
    //// yandex Ecommerce
    
    var cat = [];
    $('.breadcrumb li a').each(function(k, v){ if(k) cat.push($(v).text()); });
    cat = cat.join('/');
    
	window.dataLayer = window.dataLayer || [];
     
	var name = '{/literal}{$product->name|escape}{literal}';
	var brand = '{/literal}{$product->brand|escape}{literal}';
    
	var products = [];
    
    $.each($.yEcommerce, function(k, item){
    	var variant = item.name ? item.name : name;
    	products.push({
            "id": item.id,
            "name" : name,
            "price": item.price,
            "brand": brand,
            "category": cat,
            "variant" : variant
        });
    });  	
  
	dataLayer.push({
	    "ecommerce": {
	        "detail": {
	            "products": products
	        }
	    }
	});
	
	var $form = $('form.variants');
	var id = '{/literal}{$product->id}{literal}';
	
	$form.find('input[type=submit]').click(function(){
		if($form.find('input[name=variant]:checked').size() > 0) id = $form.find('input[name=variant]:checked').val();
		dataLayer.push({
			"ecommerce": {
				"add": {
					"products": [eCommerceFindProduct(id, products)]
				}
			}
		});	
		//console.log(dataLayer)		
	});
	
	function eCommerceFindProduct(id, products){
		var res = {};
		$.each(products, function(k, item){ if(item.id == id) res = item });
		res.quantity = 1;
		return res;
	}
   
   
    
</script>
{/literal}