because of lazy loading

GrafiteInc · Aug 30, 2023 · 50ba488 · 50ba488
1 parent 3c76d61
commit 50ba488
Show file tree

Hide file tree

Showing 2 changed files with 21 additions and 1 deletion.
diff --git a/src/Components/Image.php b/src/Components/Image.php
@@ -8,6 +8,7 @@
 class Image extends HtmlComponent
 {
     public $thumbnail = false;
+    public $lazy = false;
     public $fluid = false;
     public $placeholder = false;
     public $css = '';
@@ -16,6 +17,7 @@ class Image extends HtmlComponent
 
     public function __construct(
         $thumbnail = false,
+        $lazy = false,
         $fluid = false,
         $placeholder = false,
         $css = '',
@@ -24,6 +26,7 @@ public function __construct(
     ) {
         $this->thumbnail = $thumbnail;
         $this->fluid = $fluid;
+        $this->lazy = $lazy;
         $this->placeholder = $placeholder;
         $this->css = $css;
         $this->alt = $alt;
@@ -41,6 +44,10 @@ public function render()
             $image = $image->fluid();
         }
 
+        if ($this->lazy) {
+            $image = $image->lazy();
+        }
+
         if ($this->placeholder) {
             $image = $image->placeholder();
         }

diff --git a/src/Tags/Image.php b/src/Tags/Image.php
@@ -9,6 +9,7 @@ class Image extends HtmlComponent
     public static $thumbnail = false;
     public static $fluid = false;
     public static $placeholder = false;
+    public static $lazy = false;
     public static $css = '';
     public static $alt = '';
     public static $source;
@@ -41,6 +42,13 @@ public static function thumbnail()
         return new static();
     }
 
+    public static function lazy()
+    {
+        self::$lazy = true;
+
+        return new static();
+    }
+
     public static function placeholder()
     {
         self::$placeholder = true;
@@ -58,10 +66,15 @@ public static function fluid()
     public static function process()
     {
         $html = '';
+        $lazy = '';
         $alt = self::$alt;
         $source = self::$source;
         $class = self::$css;
 
+        if (self::$lazy) {
+            $lazy = ' loading="lazy"';
+        }
+
         if (self::$thumbnail) {
             $class .= " img-thumbnail";
         }
@@ -75,7 +88,7 @@ public static function process()
         }
 
         $class = trim($class);
-        $html .= "<img class=\"{$class}\" src=\"{$source}\" alt=\"{$alt}\" />";
+        $html .= "<img {$lazy} class=\"{$class}\" src=\"{$source}\" alt=\"{$alt}\" />";
 
         if (self::$placeholder) {
             $html .= '</div>';