{extends "index.tpl"}

{block "css" append}
   {encore_entry_link_tags entry='home'}
{/block}

{block "breadcrumbs"}
{/block}

{block "google_tag_manager"}
   {include 'block.analytics.gtm.tpl' pageType='home'}
{/block}

{block "body-container"}
   {include "block.home_slider.tpl"}
   <div class="container">
      <div class="row home-products" data-filter="products">
         <div class="col-xs-12">{* *}
            <div class="homepage-h1 h1 text-center m-b-2 m-t-3">
               <a href="/novinky/" title="Zobrazit více novinek">
                  <h1>Kosmetika a parfémy</h1> – <h2 class="h1">Novinky</h2>
               </a>
            </div>
            {* ELNINO wants original ordering *}
            {insert_products type="newest_product" in_store=1 image=2 count=6 template="block.products.tpl"
            catalog_class="col-xl-2 col-md-4 col-sm-6 col-xs-12"}
            {* parameter order zde protoze se na uvodu zobrazovali produktu jako nove podle noveho / prejmenovaneho modulu *}
            {*{insert_products type="newest_product" order='pv.date_added DESC' in_store=1 image=2 count=6 template="block.products.tpl" catalog_class="col-xl-2 col-md-4 col-sm-6"}*}
         </div>
      </div>

      <div class="row">
         <div class="col-xs-12">
            {get_articles assign="news" section='all' count=2}
            {if "news.articles"}
               <h2 class="h1 text-center m-b-2 m-t-3"><a href="{url s=articles IDb=7}">Co se právě děje</a></h2>
               <div class="row home-news">
                  {foreach $news.articles as $article}
                     <div class="col-xs-12 col-sm-12 col-xl-6 xs-p-x-0 m-b-1 {if $article@iteration == 2}hidden-sm-down{/if}">
                        <div class="news-item">
                           {if $article.image}
                              <div class="col-sm-4 col-xs-12 news-img p-a-0">
                                 <a href="{url s=article IDa=$article.id TITLE=$article.title}" title="{$article.title}">
                                    <img src="{get_photo photo=$article.image size=10}" class="img-full" alt="{$article.title}">
                                 </a>
                              </div>
                           {/if}

                           <div class="col-sm-8 col-xs-12 news-text">
                              <div class="news-date">
                                 <span>
                                    {$article.datef|date_format:"%e"}
                                 </span>
                                 <span>
                                    {$article.datef|date_format:"%-m"}
                                 </span>
                              </div>
                              <h2><a href="{url s=article IDa=$article.id TITLE=$article.title}">{$article.title}</a></h2>
                              <p>{$article.lead_in|strip_tags nofilter}</p>
                              <a href="{url s=article IDa=$article.id TITLE=$article.title}" class="read-more">Číst dále</a>
                           </div>
                        </div>
                     </div>
                  {/foreach}
               </div>
            {/if}
         </div>
      </div>

      <div class="row home-social-row">
         <div class="col-xs-12 col-md-6 col-lg-4">
            <h2 class="h1 text-center m-b-2 m-t-3"><a href="{$cfg.social.facebook}" title="{t}Zobrazit na Facebooku{/t}"><span
                          class="home-icon fc fc-facebook-official"></span></a> Facebook</h2>
            <div class="text-center">
               <div id="fb-root"></div>
               <script>(function(d, s, id) {
                     var js, fjs = d.getElementsByTagName(s)[0];
                     if (d.getElementById(id)) return;
                     js = d.createElement(s);
                     js.id = id;
                     js.src = 'https://connect.facebook.net/{$cfg.Lang.language_code|default:"cs_CZ"}/sdk.js#xfbml=1&version=v2.12';
                     fjs.parentNode.insertBefore(js, fjs);
                  }(document, "script", "facebook-jssdk"));</script>

               <div class="fb-page" data-href="{$cfg.social.facebook}" data-tabs="timeline" data-width="500" data-height="160"
                    data-small-header="true"
                    data-adapt-container-width="true" data-hide-cover="false" data-show-facepile="true">
                  <blockquote cite="{$cfg.social.facebook}" class="fb-xfbml-parse-ignore"><a
                             href="{$cfg.social.facebook}">Kosmetika-zdravi.cz</a>
                  </blockquote>
               </div>
            </div>

         </div>
         <div class="col-xs-12 col-md-6 col-lg-8">
            <h2 class="h1 text-center m-b-2 m-t-3"><a href="{$cfg.social.instagram}" title="{t}Zobrazit na Instagramu{/t}"><span
                          class="home-icon fc icons_ig_home"></span></a> {t}Ze světa kosmetiky a zdraví{/t}</h2>
            <div>
               <div id="instafeed"></div>
            </div>
         </div>
      </div>
   </div>
{/block}

{block "js-entry" append}
   {encore_entry_script_tags entry='home'}
{/block}

<script>
   {block onready append}
   {block "instafeed-init"}
   var feed = new Instafeed({
      {block "instafeed-options"}
      get: "user",
      userId: {block "instafeedID"}3539793929{/block},
      accessToken: '{block "instafeedToken"}"539793929.513e6b5.f4e1cbeb0c39466b973be1fa45d84e8"{/block}',
      limit: {block "instafeedItems"}6{/block},
      resolution: "low_resolution",
      sortBy: "most-recent",
      {/block}
      template: {literal}"<a href={{model.images.standard_resolution.url}} data-rel=\"gallery\" title=\"{{caption}}\">" +
              "<figure style=\"background-image: url({{image}});\"><figcaption><p>{{caption}}</p></figcaption><img src={{image}}></figure></a>"{/literal},
      after: function() {
         // remove hashtags from image caption
         var caption = $("#instafeed p");

         // loop thought images that have caption
         for (var i = 0; i < caption.length; i++) {
            if (caption[i].textContent.length > 0) {
               // remove words starting with # or @
               var newCaption = caption[i].textContent.replace(/[#@]\w+\s?/g, "");
               // trim to 70 characters and replace original textContent
               caption[i].textContent = (newCaption.length >= 70) ? newCaption.substring(0, 70) + "..." : newCaption;
            }
         }
      }
   });
   {block "instafeed-run"}feed.run();{/block}
   {/block}
   {/block}
</script>

{block analytics append}
   {if !isDebug() and $dbcfg.custom.karsaEhsopId}
      <script>
         //** BEGIN karsaMonitorCollector v5 **
         (function() {
            var supportJsHostUrl = "https://collector.karsa-monitor.com";
            var d = document, g = d.createElement("script"), s = d.getElementsByTagName("script")[0];
            g.type = "text/javascript";
            g.async = true;
            g.defer = true;
            g.src = supportJsHostUrl + "/collector-api.js";
            s.parentNode.insertBefore(g, s);
         })();
         //** END karsaMonitorCollector v5 **
      </script>
   {/if}
{/block}
