From 7076343338ae3439f3c86f01144818abe8c31978 Mon Sep 17 00:00:00 2001
From: George Halkiadakis <gchalkiadakis@sklavenitis.co.gr>
Date: Sun, 12 Mar 2023 07:16:23 +0200
Subject: add container helpers; constuct public directory-tree

---
 html/content/js/Sliders/productsSlider.js | 45 +++++++++++++++++++++++++++++++
 html/content/js/Sliders/slider.js         | 42 +++++++++++++++++++++++++++++
 2 files changed, 87 insertions(+)
 create mode 100644 html/content/js/Sliders/productsSlider.js
 create mode 100644 html/content/js/Sliders/slider.js

(limited to 'html/content/js/Sliders')

diff --git a/html/content/js/Sliders/productsSlider.js b/html/content/js/Sliders/productsSlider.js
new file mode 100644
index 0000000..cc043b9
--- /dev/null
+++ b/html/content/js/Sliders/productsSlider.js
@@ -0,0 +1,45 @@
+// Modules included:
+// 'virtual',
+// 'mousewheel',
+// 'navigation',
+// 'pagination',
+// 'zoom',
+// 'lazy',
+// 'autoplay',
+// 'thumbs',
+// 'manipulation',
+// 'effect-fade',
+
+$$plugins.define('productsSlider', ['swiper-bundle'], function (element, options, Swiper) {
+    if (element.childNodes.length == 0) {
+        return;
+    }
+
+    // init Swiper
+    const swiper = new Swiper(element, {
+        breakpoints: {
+            0: {
+                slidesPerGroup: 1
+            },
+            768: {
+                slidesPerGroup: 2
+            },
+            1024: {
+                slidesPerGroup: 3
+            }
+        },
+		navigation: {
+			nextEl: element.querySelector('.swiper-button-next'),
+			prevEl: element.querySelector('.swiper-button-prev'),
+        },
+        pagination: {
+			el: element.querySelector('.swiper-pagination'),
+            type: 'bullets',
+            clickable: 'true'
+        },
+        slidesPerGroup: 3,
+        slidesPerView: 'auto',
+        spaceBetween: 16,
+        speed: 1000
+    });
+});
diff --git a/html/content/js/Sliders/slider.js b/html/content/js/Sliders/slider.js
new file mode 100644
index 0000000..a9f5824
--- /dev/null
+++ b/html/content/js/Sliders/slider.js
@@ -0,0 +1,42 @@
+// Modules included:
+// 'virtual',
+// 'mousewheel',
+// 'navigation',
+// 'pagination',
+// 'zoom',
+// 'lazy',
+// 'autoplay',
+// 'thumbs',
+// 'manipulation',
+// 'effect-fade',
+
+$$plugins.define('slider', ['swiper-bundle'], function (element, options, Swiper) {
+    if (element.childNodes.length == 0) {
+        return;
+    }
+
+    // init Swiper
+    const swiper = new Swiper(element, {
+        autoHeight: options.autoHeight ? options.autoHeight : false,
+        breakpoints: options.breakpoints,
+        centerInsufficientSlides: options.centerInsufficientSlides ? options.centerInsufficientSlides : false,
+        centeredSlides: options.centeredSlides ? options.centeredSlides : false,
+        direction: options.direction ? options.direction : 'horizontal',
+        effect: options.effect ? options.effect : 'slide',
+        loop: options.loop ? options.loop : false,
+		navigation: {
+			nextEl: element.querySelector('.swiper-button-next'),
+			prevEl: element.querySelector('.swiper-button-prev'),
+		},
+		pagination: {
+			el: element.querySelector('.swiper-pagination'),
+            type: 'bullets',
+            clickable: 'true'
+        },
+        slidesPerGroup: options.slidesPerGroup ? options.slidesPerGroup : 1,
+        slidesPerView: options.slidesPerView ? options.slidesPerView : 1,
+        spaceBetween: options.spaceBetween ? options.spaceBetween : 0,
+		speed: options.speed ? options.speed : 800,
+		watchSlidesProgress: true
+    });
+});
-- 
cgit v1.2.3