{extends 'file:layouts/layout.tpl'}

{block 'css'}
  <link rel="stylesheet" href="{'/templates/assets/css/index.min.css' | version}">
{/block}

{block 'js'}
  <script defer src="{'/templates/assets/js/index.min.js' | version}"></script>
  <script defer src="{'/assets/components/devbrains/search_by_vehicle/search.js' | version}"></script>
{/block}

{block 'main'}
  {'@FILE chunks/home_filter.tpl' | chunk}

  {set $hero = $_modx->resource.hero | fromJSON}

  {if $hero?}
    <section class="section section_slider">
      <div class="container">
        <div class="swiper slider-main">
          <div class="swiper-wrapper">

            {foreach $hero as $item}
            	{if $item.disabled != '1'}
            
	              <div class="swiper-slide">
	              	{if $item.uri_variant == 'banner'}
	              		<a class="slider-main__slide" href="{$item.uri}">
	              	{else}
	                	<div class="slider-main__slide">
                	{/if}
	                	
	                	<picture class="slider-main__image">
	                		{if $item.image_mobile?}
                      	<source srcset="/userdata/{$item.image_mobile}" media="(max-width: 640px)">
                      {/if}
                      <img src="/userdata/{$item.image}" width="2880" height="862" alt="">
                    </picture>
	                	
	                  <div class="slider-main__content">
	                  	<div class="slider-main__content-body">
	                  		{if $item.heading?}
		                    	<div class="slider-main__headnote">{$item.heading}</div>
		                    {/if}
		                    
		                    {if $item.title?}
		                    	<div class="slider-main__title">{$item.title | nl2br}</div>
		                    {/if}
		                    
		                    {if $item.description?}
		                    	<div class="slider-main__description">{$item.description | nl2br}</div>
		                    {/if}
	                    </div>
	
											<div class="slider-main__content-footer">
		                    {if $item.uri_variant == 'button'}
		                      <a class="button {$item.button_variant ?: 'button_primary-transparent'}" href="{$item.uri}">
		                        {$item.button_text ?: 'Узнать подробнее'}
		                      </a>
		                    {/if}
		                    
		                    {if $item.note?}
		                    	<div class="slider-main__note">{$item.note | nl2br}</div>
		                    {/if}
	                    </div>
	                  </div>
	              
	                {if $item.uri_variant == 'banner'}
	              		</a>
	              	{else}
	                	</div>
                	{/if}
	              
	              </div>
              
              {/if}
            {/foreach}

          </div>
          <div class="swiper-pagination"></div>
        </div>
      </div>
    </section>
  {/if}

  <section class="section section_tire-fitting">
    <div class="container">
      <a href="#tire_fitting" class="button button_dark-gray button_no-corners" data-modal>Записаться на шиномонтаж</a>
    </div>
  </section>

  {set $beft_offers_ids = '@FILE snippets/get_products_ids_for_best_offer.php' | snippet : [
  	'limit' => 8
  ]}
  
  {if $beft_offers_ids?}

    {set $best_offers = 'msProducts' | snippet : [
      'parents' => 0,
      'resources' => $beft_offers_ids,
      'includeThumbs' => 'medium',
      'tpl' => '@FILE chunks/product.tpl'
    ]}

    {if $best_offers?}
      <section class="section section_products">
        <div class="container">
          <div class="section__title"><span>Лучшие предложения</span></div>
          <div class="product-items">
            {$best_offers}
          </div>

          <div class="more">
            <a class="button button_transparent" href="{5 | url}?sort=ms|priority:desc,ms|popular:desc">Смотреть все шины</a>
          </div>
        </div>
      </section>
      <!-- section-->
    {/if}
  {/if}
  
  {set $vendors = '@FILE snippets/get_brands_list.php' | snippet : [
    'tpl' => '@FILE chunks/brand.tpl',
    'limit' => 8
  ]}

  {if $vendors?}
    <section class="section section_brands">
      <div class="container">
        <div class="section__title"><span>Популярные производители</span></div>

        <div class="brands">
          <div class="brands__list">
            {$vendors}
          </div>

          <div class="brands__more">
            <a class="button button_transparent" href="{14 | url}">Смотреть всех производителей</a>
          </div>
        </div>
      </div>
    </section>
    <!-- section-->
  {/if}

  <section class="section section_about">
    <div class="container">
      <div class="main-about">
        <div class="main-about__images">
          <img src="/templates/assets/img/main/about_1.jpg" alt="">
          <img src="/templates/assets/img/main/about_2.jpg" alt="">
        </div>
        <div class="main-about__content">
          <span class="main-about__headnote">О нас</span>

          {* <h1 class="main-about__title">{8 | resource : 'longtitle'}</h1> *}

          {8 | resource : 'content'}

          <div class="main-about__control">
            <a class="button button_primary-transparent" href="{8 | url}">Узнать подробнее</a>
          </div>
        </div>
      </div>

      {'@FILE chunks/hero_links.tpl' | chunk}
    </div>
  </section>
  <!-- section-->
{/block}