Merge pull request #8 from Oksydan/develop

New version 1.1

is_imageslider.php

@@ -53,7 +53,7 @@ public function __construct()
     {
         $this->name = 'is_imageslider';
         $this->tab = 'front_office_features';
-        $this->version = '1.0.4';
+        $this->version = '1.1.0';
         $this->author = 'Prestashop - modified by Igor Stępień';
         $this->need_instance = 0;
         $this->bootstrap = true;
@@ -76,6 +76,7 @@ public function install()
         /* Adds Module */
         if (parent::install() &&
             $this->registerHook('displayHome') &&
+            $this->registerHook('displayHeader') &&
             $this->registerHook('actionShopDataDuplication')
         ) {
             $shops = Shop::getContextListShopID();
@@ -526,6 +527,25 @@ protected function _postProcess()
         }
     }
 
+    public function hookDisplayHeader()
+    {
+        if ($this->context->controller->getPageName() == 'index') {
+            $slides = $this->getSlides(true, 1);
+
+            if (!$slides) {
+                return '';
+            }
+
+            $slide = reset($slides);
+            $image = $this->context->isMobile() ? $slide['image_mobile'] : $slide['image'];
+
+            $this->smarty->assign([
+                'image' => $this->context->link->getMediaLink(_MODULE_DIR_ . 'is_imageslider/images/' . $image),
+            ]);
+
+            return $this->fetch('module:is_imageslider/views/templates/hook/head.tpl');
+        }
+    }
 
     public function renderWidget($hookName = null, array $configuration = [])
     {
@@ -539,16 +559,18 @@ public function renderWidget($hookName = null, array $configuration = [])
     public function getWidgetVariables($hookName = null, array $configuration = [])
     {
         $slides = $this->getSlides(true);
+        $isMobile = $this->context->isMobile();
+
         if (is_array($slides)) {
             foreach ($slides as &$slide) {
-                $slide['sizes'] = @getimagesize((__DIR__ . DIRECTORY_SEPARATOR . 'images' . DIRECTORY_SEPARATOR . $slide['image']));
+                $image = $isMobile ? $slide['image_mobile'] : $slide['image'];
+                $slide['sizes'] = @getimagesize((__DIR__ . DIRECTORY_SEPARATOR . 'images' . DIRECTORY_SEPARATOR . $image));
+
                 if (isset($slide['sizes'][3]) && $slide['sizes'][3]) {
                     $slide['size'] = $slide['sizes'][3];
                 }
-                $slide['sizes_mobile'] = @getimagesize((__DIR__ . DIRECTORY_SEPARATOR . 'images' . DIRECTORY_SEPARATOR . $slide['image_mobile']));
-                if (isset($slide['sizes_mobile'][3]) && $slide['sizes_mobile'][3]) {
-                    $slide['size_mobile'] = $slide['sizes_mobile'][3];
-                }
+
+                $slide['image_url'] = $this->context->link->getMediaLink(_MODULE_DIR_ . 'is_imageslider/images/' . $image);
             }
         }
 
@@ -631,7 +653,7 @@ public function getNextPosition()
         return (++$row['next_position']);
     }
 
-    public function getSlides($active = null)
+    public function getSlides($active = null, $limit = false)
     {
         $this->context = Context::getContext();
         $id_shop = $this->context->shop->id;
@@ -647,8 +669,9 @@ public function getSlides($active = null)
             AND (hss.date_start <= "'.date("Y-m-d H:i:s").'" OR hss.date_start = "0000-00-00 00:00:00" )
             AND (hss.date_end >= "'.date("Y-m-d H:i:s").'" OR hss.date_end = "0000-00-00 00:00:00" )
             AND hssl.id_lang = '.(int)$id_lang.
-            ($active ? ' AND hss.`active` = 1' : ' ').'
-            ORDER BY hss.position'
+            ($active ? ' AND hss.`active` = 1 ' : ' ').
+            'ORDER BY hss.position' .
+            ($limit ? ' LIMIT ' . (int) $limit . ' ' : ' ')
         );
 
         foreach ($slides as &$slide) {

upgrade/upgrade-1-1-0.php

@@ -0,0 +1,10 @@
+<?php
+
+if (!defined('_PS_VERSION_')) {
+    exit;
+}
+
+function upgrade_module_1_1_0($module)
+{
+  return $module->registerHook('displayHeader');
+}

views/templates/hook/head.tpl

@@ -0,0 +1,3 @@
+{if $image}
+  <link rel="preload" href="{$image}" as="image">
+{/if}

views/templates/hook/slider.tpl

@@ -33,41 +33,32 @@
     ]
   ]}
 
-  <div class="homeslider swiper-container" {if $homeslider.slides|count > 1} data-swiper='{$sliderConfig|json_encode}'{/if}>
+  <div class="homeslider swiper" {if $homeslider.slides|count > 1} data-swiper='{$sliderConfig|json_encode}'{/if}>
     <ul class="swiper-wrapper homeslider__list">
       {foreach from=$homeslider.slides item=slide}
         <li class="swiper-slide homeslider__slide">
           <a href="{$slide.url}">
             {if $slide@first}
-              {if $slide.image_url && $slide.image_mobile_url}
-                <img
-                  class="img-fluid d-block d-lg-none"
-                  src="{$slide.image_mobile_url}"
-                  alt="{$slide.title}"
-                  {$slide.size_mobile nofilter}>
-                <img
-                  class="img-fluid d-none d-lg-block lazyload"
-                  src="data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='{$slide.sizes[0]}' height='{$slide.sizes[1]}' viewBox='0 0 1 1'%3E%3C/svg%3E"
-                  data-src="{$slide.image_url}"
-                  alt="{$slide.title}"
-                  {$slide.size nofilter}>
-              {/if}
+              <img
+                class="img-fluid"
+                src="{$slide.image_url}"
+                alt="{$slide.title}"
+                {if !empty($slide.sizes)}
+                  width="{$slide.sizes.0}"
+                  height="{$slide.sizes.1}"
+                {/if}
+                >
             {else}
-              {if $slide.image_url && $slide.image_mobile_url}
-                <picture>
-                    <source
-                      data-srcset="{$slide.image_url}"
-                      media="(min-width: 768px)">
-                  <img
-                    class="img-fluid homeslider__img swiper-lazy"
-                    src="data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' {$slide.size|replace:'"':"'"} viewBox='0 0 1 1'%3E%3C/svg%3E"
-                    data-src="{$slide.image_mobile_url}"
-                    alt="{$slide.title}"
-                    loading="lazy"
-                    {$slide.size nofilter}
-                    >
-                </picture>
-              {/if}
+              <img
+                class="img-fluid homeslider__img swiper-lazy"
+                data-src="{$slide.image_url}"
+                alt="{$slide.title}"
+                {if !empty($slide.sizes)}
+                  src="data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='{$slide.sizes.0}' height='{$slide.sizes.1}' viewBox='0 0 1 1'%3E%3C/svg%3E"
+                  width="{$slide.sizes.0}"
+                  height="{$slide.sizes.1}"
+                {/if}
+                >
             {/if}
 
             {if $slide.title || $slide.description }