wip #7371 @0:10

diff --git a/wp-content/mu-plugins/cube/src/Elementor/Widgets/BackgroundImage.php b/wp-content/mu-plugins/cube/src/Elementor/Widgets/BackgroundImage.php
index 57c618e1e450c6aae465051079b61d32abbbc203..a41d06e06f1a1ff4784e6bbc849e530d1a7c23a2 100644 (file)
--- a/wp-content/mu-plugins/cube/src/Elementor/Widgets/BackgroundImage.php
+++ b/wp-content/mu-plugins/cube/src/Elementor/Widgets/BackgroundImage.php
@@ -61,13 +61,20 @@ class BackgroundImage extends _Base
         );
 
         $this->add_control(
-            'image',
+            'image_desktop',
             [
-                'label' => __('Choose Image', 'elementor'),
+                'label' => __('Choose Image Desktop', 'elementor'),
                 'type' => Controls_Manager::MEDIA,
-                'default' => [
-                    'url' => Utils::get_placeholder_image_src(),
-                ],
+                'default' => [],
+            ]
+        );
+
+        $this->add_control(
+            'image_mobile',
+            [
+                'label' => __('Choose Image Mobile', 'elementor'),
+                'type' => Controls_Manager::MEDIA,
+                'default' => [],
             ]
         );
 
@@ -89,6 +96,15 @@ class BackgroundImage extends _Base
             ]
         );
 
+        $this->add_control(
+            'alt',
+            [
+                'label' => __('Alternative text', 'cube'),
+                'type' => Controls_Manager::TEXT,
+                'default' => ''
+            ]
+        );
+
         $this->add_control(
             'link',
             [
@@ -117,8 +133,10 @@ class BackgroundImage extends _Base
     protected function render()
     {
 
-        $image = $this->get_settings('image');
+        $image = $this->get_settings('image_desktop');
+        $imageMobile = $this->get_settings('image_mobile');
         $bg_position = $this->get_settings('background_position');
+        $alt = $this->get_settings('alt');
         $link = $this->get_settings('link');
         $tag = 'div'; // Default tag for widget - will change when we need a non-lightbox link
         $attributes = '';
@@ -156,7 +174,7 @@ class BackgroundImage extends _Base
                         ["controls" => "",
                             "preload" => "metadata",
                             "controlsList" => "nodownload"],
-                    
+
                 ];
                 $attributes = ' data-elementor-lightbox="' . htmlentities(wp_json_encode($lightbox_options)) . '"';
                 $attributes .= ' data-elementor-open-lightbox="yes"';
@@ -184,8 +202,12 @@ class BackgroundImage extends _Base
         }
 
         $image_url = wp_get_attachment_image_url($image['id'], 'large');
+        $image_mobile_url = wp_get_attachment_image_url($imageMobile['id'], 'medium');
+        $image_mobile_url_mlarge = wp_get_attachment_image_url($imageMobile['id'], 'medium_large');
+        if($image_mobile_url === ".webp") $image_mobile_url = $image_url;
+        if($image_mobile_url_mlarge === ".webp") $image_mobile_url_mlarge = $image_url;
 
-        echo '<' . $tag . ' class="bg-image ' . $class . '" ' . $attributes . ' style="background-image: url(' . $image_url . '); background-position: ' . $bg_position . '"><div class="bg-image-sizer" style="padding-bottom: ' . $ratio . '"></div></' . $tag . '>';
+        echo '<' . $tag . ' class="bg-image ' . $class . '" ' . $attributes . ' style="background-image: url(' . $image_url . '); background-position: ' . $bg_position . '"><img class="bg-image-mobile" style="display: none;" fetchpriority="high" srcset="'. $image_mobile_url .' 500w, '.$image_mobile_url_mlarge.' 1000w" sizes="100w" src="'.$image_mobile_url.'" alt="'.$alt.'" /><div class="bg-image-sizer" style="padding-bottom: ' . $ratio . '"></div></' . $tag . '>';
 
     }
 
@@ -212,4 +234,4 @@ class BackgroundImage extends _Base
 
         return wp_json_encode($lightbox_options);
     }
-}
+}
\ No newline at end of file