From: soufiane <soufiane@cubedesigners.com>
Date: Mon, 24 Nov 2025 19:10:18 +0000 (+0100)
Subject: wait #7830 @3:30
X-Git-Url: http://git.cubedesigners.com/?a=commitdiff_plain;h=5c353ed8a4a70673b43e0fbb0db3a26d6456a92c;p=fluidbook-v3.git

wait #7830 @3:30
---

diff --git a/framework/application/forms/CMS/Sub/Home/Block.php b/framework/application/forms/CMS/Sub/Home/Block.php
index f16962f..89055c4 100644
--- a/framework/application/forms/CMS/Sub/Home/Block.php
+++ b/framework/application/forms/CMS/Sub/Home/Block.php
@@ -43,7 +43,7 @@ class Fluidbook_Form_CMS_Sub_Home_Block extends CubeIT_Form_SubForm {
 
 		$backgroundImage = new CubeIT_Form_Element_File_Image('backgroundimage');
 		$backgroundImage->setLabel('Image de fond');
-		$backgroundImage->setMaxItems(1);
+		$backgroundImage->setMaxItems(5);
 		$backgroundImage->setOrder(60);
 		$this->addElement($backgroundImage);
 
diff --git a/framework/application/views/helpers/BackgroundBlock.php b/framework/application/views/helpers/BackgroundBlock.php
index f6060f8..d247d2c 100644
--- a/framework/application/views/helpers/BackgroundBlock.php
+++ b/framework/application/views/helpers/BackgroundBlock.php
@@ -23,66 +23,67 @@ class Fluidbook_View_Helper_BackgroundBlock extends CubeIT_View_Helper_Abstract
         }
         if (isset($data['bg_image'])) {
 
-            $bgimage = CubeIT_Util_Cms::extractFile($data['bg_image']);
             $extra_attributes = array();
-            if ($bgimage) {
-                $image_path = CubeIT_View_Helper_ImageCms::getPath($bgimage);
+            $bg = '';
+            if ($data['bg_image']) {
+                foreach ($data['bg_image'] as $img) {
+                    $bgimage = CubeIT_Util_Cms::extractFile($img);
+                    $image_path = CubeIT_View_Helper_ImageCms::getPath($bgimage);
 
-                // Work out the ratio of the background image
-                CubeIT_Image::getDimensions($image_path, $image_width, $image_height);
-                $image_ratio = $image_height / $image_width;
-                $attributes['data-bg-ratio'] = $image_ratio;
+                    // Work out the ratio of the background image
+                    CubeIT_Image::getDimensions($image_path, $image_width, $image_height);
+                    $image_ratio = $image_height / $image_width;
+                    $attributes['data-bg-ratio'] = $image_ratio;
 
-                // Create a cropped version of the image for mobile that cuts off the left 45% of the image
-                // Make sure image is not wider than 900px when finished
-                $mobile_max_width = 900;
-                // Scale image, factoring in crop that will take place...
-                // Image will be cropped to 900px wide so ensure that we have 45% extra and then determine the target height
-                $target_height = ($mobile_max_width / 0.55) * $image_ratio;
+                    // Create a cropped version of the image for mobile that cuts off the left 45% of the image
+                    // Make sure image is not wider than 900px when finished
+                    $mobile_max_width = 900;
+                    // Scale image, factoring in crop that will take place...
+                    // Image will be cropped to 900px wide so ensure that we have 45% extra and then determine the target height
+                    $target_height = ($mobile_max_width / 0.55) * $image_ratio;
 
-                if (stripos($image_path, '.oam') !== false || stripos($image_path, '.zip') !== false) {
-                    if (!isset($data['backgroundmobileimage'])) {
-                        $pict = $this->view->imageCms($image_path);
+                    if (stripos($image_path, '.oam') !== false || stripos($image_path, '.zip') !== false) {
+                        if (!isset($data['backgroundmobileimage'])) {
+                            $pict = $this->view->imageCms($image_path);
+                        } else {
+                            $pict = '<div class="desktopr">' . $this->view->imageCms($image_path) . '</div>';
+                            $pict .= '<div class="mobiler">' . $this->view->imageCms(CubeIT_View_Helper_ImageCms::getPath(CubeIT_Util_Cms::extractFile($data['backgroundmobileimage']))) . '</div>';
+                        }
                     } else {
-                        $pict = '<div class="desktopr">' . $this->view->imageCms($image_path) . '</div>';
-                        $pict .= '<div class="mobiler">' . $this->view->imageCms(CubeIT_View_Helper_ImageCms::getPath(CubeIT_Util_Cms::extractFile($data['backgroundmobileimage']))) . '</div>';
-                    }
-                } else {
-                    if (isset($data['backgroundmobileimage'])) {
-                        $bgmobileimage = CubeIT_Util_Cms::extractFile($data['backgroundmobileimage']);
-                        if ($bgmobileimage) {
-                            $attributes['data-has-mobile'] = '1';
-                            $mobile_path = CubeIT_View_Helper_ImageCms::getPath($bgmobileimage);
-                            CubeIT_Image::getDimensions($mobile_path, $image_width, $image_height);
-                            $image_ratio = $image_height / $image_width;
-                            $attributes['data-mobile-ratio'] = $image_ratio;
-                            $target_height = $mobile_max_width * $image_ratio;
-                            $mobile = $this->imageProcess()->imageProcessGetURL($mobile_path, '', $mobile_max_width, $target_height, array(), 'C', 'R', 'M');
+                        if (isset($data['backgroundmobileimage'])) {
+                            $bgmobileimage = CubeIT_Util_Cms::extractFile($data['backgroundmobileimage']);
+                            if ($bgmobileimage) {
+                                $attributes['data-has-mobile'] = '1';
+                                $mobile_path = CubeIT_View_Helper_ImageCms::getPath($bgmobileimage);
+                                CubeIT_Image::getDimensions($mobile_path, $image_width, $image_height);
+                                $image_ratio = $image_height / $image_width;
+                                $attributes['data-mobile-ratio'] = $image_ratio;
+                                $target_height = $mobile_max_width * $image_ratio;
+                                $mobile = $this->imageProcess()->imageProcessGetURL($mobile_path, '', $mobile_max_width, $target_height, array(), 'C', 'R', 'M');
+                            } else {
+                                $mobile = $this->imageProcess()->imageProcessGetURL($image_path, '', $mobile_max_width, $target_height, array(), 'C', 'R', 'M');
+                            }
                         } else {
                             $mobile = $this->imageProcess()->imageProcessGetURL($image_path, '', $mobile_max_width, $target_height, array(), 'C', 'R', 'M');
                         }
-                    } else {
-                        $mobile = $this->imageProcess()->imageProcessGetURL($image_path, '', $mobile_max_width, $target_height, array(), 'C', 'R', 'M');
-                    }
 
-                    $pict = $this->picture([
-                        [
-                            'src' => $image_path,
-                            'width' => 2560
+                        $pict = $this->picture([
+                            [
+                                'src' => $image_path,
+                                'width' => 2560
+                            ],
+                            [
+                                'src' => $mobile,
+                                'width' => $mobile_max_width,
+                                'media' => '(max-width: 900px)'
+                            ]
                         ],
-                        [
-                            'src' => $mobile,
-                            'width' => $mobile_max_width,
-                            'media' => '(max-width: 900px)'
-                        ]
-                    ],
-                        [
-                            'alt' => $data['title']
-                        ]);
-
-
+                            [
+                                'alt' => $data['title']
+                            ]);
+                    }
+                    $bg .= $this->htmlElement($pict, 'div', array('class' => 'picture'));
                 }
-                $bg = $this->htmlElement($pict, 'div', array('class' => 'picture'));
                 $content = $bg . $content;
             }
         }
diff --git a/js/210-home.js b/js/210-home.js
index 4949d4a..854156e 100644
--- a/js/210-home.js
+++ b/js/210-home.js
@@ -5,6 +5,7 @@ function load_home() {
     $(window).on('fluidbookresize', resizeHome);
     resizeHome();
     initScrollify();
+    carouselIntro();
 
 
     // Bouncing scroll down arrow
@@ -246,3 +247,15 @@ function resizeHomeContact(ww, wh) {
     }
 
 }
+
+function carouselIntro() {
+    var tl = new TimelineMax({
+        repeat: -1,
+        repeatDelay: 5
+    });
+
+    tl.staggerTo(".intro .picture", 1.2, {
+        opacity: 1,
+    }, 5)
+
+}
diff --git a/less/210-home.less b/less/210-home.less
index 0d1a6fa..89a8a01 100644
--- a/less/210-home.less
+++ b/less/210-home.less
@@ -19,6 +19,10 @@
 
     // Make picture element behave like a background image so it doesn't overlap
     // the header area (image itself should have necessary whitespace included)
+    .picture {
+      opacity: 0;
+    }
+
     .picture picture img {
       height: 100%; // Needed along with width:100% so that object-fit works
       object-fit: contain;