From 41dc0d7c6808bfb42294f3deae6c848d3d6f0020 Mon Sep 17 00:00:00 2001
From: Campii <dominik.chrzanowski183@gmail.com>
Date: Tue, 7 Jun 2022 18:41:25 +0200
Subject: [PATCH] feat: slider has same height like active slide
[CustomerReviewsSlider] quiqqer/package-bricks#134
---
bin/Controls/Slider/CustomerReviewsSlider.js | 33 +++++++++++++++++++-
1 file changed, 32 insertions(+), 1 deletion(-)
diff --git a/bin/Controls/Slider/CustomerReviewsSlider.js b/bin/Controls/Slider/CustomerReviewsSlider.js
index 2be3d96..6a0157c 100644
--- a/bin/Controls/Slider/CustomerReviewsSlider.js
+++ b/bin/Controls/Slider/CustomerReviewsSlider.js
@@ -44,6 +44,7 @@ define('package/quiqqer/bricks/bin/Controls/Slider/CustomerReviewsSlider', [
*/
$onImport: function () {
var delay = this.getAttribute('delay');
+ var self = this;
var options = {
type: 'carousel',
@@ -54,7 +55,37 @@ define('package/quiqqer/bricks/bin/Controls/Slider/CustomerReviewsSlider', [
options['autoplay'] = delay;
}
- new Glide('.glide', options).mount();
+ var glide = new Glide('.glide', options);
+
+ var GlideElem = document.querySelector('.customerReviewsSlider-slider-wrapper');
+
+ if (GlideElem) {
+
+ // Automated height on Carousel build
+ glide.on('build.after', function () {
+ self.glideHandleHeight();
+ });
+
+ // Automated height on Carousel change
+ glide.on('run.after', function () {
+ self.glideHandleHeight();
+ });
+
+
+ glide.mount();
+ }
+ },
+
+ glideHandleHeight: function () {
+ const activeSlide = document.querySelector('.glide__slide--active');
+ const activeSlideHeight = activeSlide ? activeSlide.offsetHeight + 50 : 0;
+
+ const glideTrack = document.querySelector('.customerReviewsSlider-track');
+ const glideTrackHeight = glideTrack ? glideTrack.offsetHeight : 0;
+
+ if (activeSlideHeight !== glideTrackHeight) {
+ glideTrack.style.height = `${activeSlideHeight}px`;
+ }
}
});
});
\ No newline at end of file
--
GitLab