Browse code

Refactor and rewrite as contao bundle

Benjamin Roth authored on04/11/2022 22:32:32
Showing1 changed files
1 1
deleted file mode 100644
... ...
@@ -1,118 +0,0 @@
1
-"use strict";
2
-
3
-exports.__esModule = true;
4
-exports.default = void 0;
5
-
6
-var _dom = _interopRequireDefault(require("../../utils/dom"));
7
-
8
-var _utils = require("../../utils/utils");
9
-
10
-function _interopRequireDefault(obj) { return obj && obj.__esModule ? obj : { default: obj }; }
11
-
12
-function _extends() { _extends = Object.assign || function (target) { for (var i = 1; i < arguments.length; i++) { var source = arguments[i]; for (var key in source) { if (Object.prototype.hasOwnProperty.call(source, key)) { target[key] = source[key]; } } } return target; }; return _extends.apply(this, arguments); }
13
-
14
-var Coverflow = {
15
-  setTranslate: function setTranslate() {
16
-    var swiper = this;
17
-    var swiperWidth = swiper.width,
18
-        swiperHeight = swiper.height,
19
-        slides = swiper.slides,
20
-        slidesSizesGrid = swiper.slidesSizesGrid;
21
-    var params = swiper.params.coverflowEffect;
22
-    var isHorizontal = swiper.isHorizontal();
23
-    var transform = swiper.translate;
24
-    var center = isHorizontal ? -transform + swiperWidth / 2 : -transform + swiperHeight / 2;
25
-    var rotate = isHorizontal ? params.rotate : -params.rotate;
26
-    var translate = params.depth; // Each slide offset from center
27
-
28
-    for (var i = 0, length = slides.length; i < length; i += 1) {
29
-      var $slideEl = slides.eq(i);
30
-      var slideSize = slidesSizesGrid[i];
31
-      var slideOffset = $slideEl[0].swiperSlideOffset;
32
-      var offsetMultiplier = (center - slideOffset - slideSize / 2) / slideSize * params.modifier;
33
-      var rotateY = isHorizontal ? rotate * offsetMultiplier : 0;
34
-      var rotateX = isHorizontal ? 0 : rotate * offsetMultiplier; // var rotateZ = 0
35
-
36
-      var translateZ = -translate * Math.abs(offsetMultiplier);
37
-      var stretch = params.stretch; // Allow percentage to make a relative stretch for responsive sliders
38
-
39
-      if (typeof stretch === 'string' && stretch.indexOf('%') !== -1) {
40
-        stretch = parseFloat(params.stretch) / 100 * slideSize;
41
-      }
42
-
43
-      var translateY = isHorizontal ? 0 : stretch * offsetMultiplier;
44
-      var translateX = isHorizontal ? stretch * offsetMultiplier : 0;
45
-      var scale = 1 - (1 - params.scale) * Math.abs(offsetMultiplier); // Fix for ultra small values
46
-
47
-      if (Math.abs(translateX) < 0.001) translateX = 0;
48
-      if (Math.abs(translateY) < 0.001) translateY = 0;
49
-      if (Math.abs(translateZ) < 0.001) translateZ = 0;
50
-      if (Math.abs(rotateY) < 0.001) rotateY = 0;
51
-      if (Math.abs(rotateX) < 0.001) rotateX = 0;
52
-      if (Math.abs(scale) < 0.001) scale = 0;
53
-      var slideTransform = "translate3d(" + translateX + "px," + translateY + "px," + translateZ + "px)  rotateX(" + rotateX + "deg) rotateY(" + rotateY + "deg) scale(" + scale + ")";
54
-      $slideEl.transform(slideTransform);
55
-      $slideEl[0].style.zIndex = -Math.abs(Math.round(offsetMultiplier)) + 1;
56
-
57
-      if (params.slideShadows) {
58
-        // Set shadows
59
-        var $shadowBeforeEl = isHorizontal ? $slideEl.find('.swiper-slide-shadow-left') : $slideEl.find('.swiper-slide-shadow-top');
60
-        var $shadowAfterEl = isHorizontal ? $slideEl.find('.swiper-slide-shadow-right') : $slideEl.find('.swiper-slide-shadow-bottom');
61
-
62
-        if ($shadowBeforeEl.length === 0) {
63
-          $shadowBeforeEl = (0, _dom.default)("<div class=\"swiper-slide-shadow-" + (isHorizontal ? 'left' : 'top') + "\"></div>");
64
-          $slideEl.append($shadowBeforeEl);
65
-        }
66
-
67
-        if ($shadowAfterEl.length === 0) {
68
-          $shadowAfterEl = (0, _dom.default)("<div class=\"swiper-slide-shadow-" + (isHorizontal ? 'right' : 'bottom') + "\"></div>");
69
-          $slideEl.append($shadowAfterEl);
70
-        }
71
-
72
-        if ($shadowBeforeEl.length) $shadowBeforeEl[0].style.opacity = offsetMultiplier > 0 ? offsetMultiplier : 0;
73
-        if ($shadowAfterEl.length) $shadowAfterEl[0].style.opacity = -offsetMultiplier > 0 ? -offsetMultiplier : 0;
74
-      }
75
-    }
76
-  },
77
-  setTransition: function setTransition(duration) {
78
-    var swiper = this;
79
-    swiper.slides.transition(duration).find('.swiper-slide-shadow-top, .swiper-slide-shadow-right, .swiper-slide-shadow-bottom, .swiper-slide-shadow-left').transition(duration);
80
-  }
81
-};
82
-var _default = {
83
-  name: 'effect-coverflow',
84
-  params: {
85
-    coverflowEffect: {
86
-      rotate: 50,
87
-      stretch: 0,
88
-      depth: 100,
89
-      scale: 1,
90
-      modifier: 1,
91
-      slideShadows: true
92
-    }
93
-  },
94
-  create: function create() {
95
-    var swiper = this;
96
-    (0, _utils.bindModuleMethods)(swiper, {
97
-      coverflowEffect: _extends({}, Coverflow)
98
-    });
99
-  },
100
-  on: {
101
-    beforeInit: function beforeInit(swiper) {
102
-      if (swiper.params.effect !== 'coverflow') return;
103
-      swiper.classNames.push(swiper.params.containerModifierClass + "coverflow");
104
-      swiper.classNames.push(swiper.params.containerModifierClass + "3d");
105
-      swiper.params.watchSlidesProgress = true;
106
-      swiper.originalParams.watchSlidesProgress = true;
107
-    },
108
-    setTranslate: function setTranslate(swiper) {
109
-      if (swiper.params.effect !== 'coverflow') return;
110
-      swiper.coverflowEffect.setTranslate();
111
-    },
112
-    setTransition: function setTransition(swiper, duration) {
113
-      if (swiper.params.effect !== 'coverflow') return;
114
-      swiper.coverflowEffect.setTransition(duration);
115
-    }
116
-  }
117
-};
118
-exports.default = _default;
119 0
\ No newline at end of file
Browse code

swiper.js version 6.3.3

Benjamin Roth authored on13/10/2020 19:31:56
Showing1 changed files
1 1
new file mode 100644
... ...
@@ -0,0 +1,118 @@
1
+"use strict";
2
+
3
+exports.__esModule = true;
4
+exports.default = void 0;
5
+
6
+var _dom = _interopRequireDefault(require("../../utils/dom"));
7
+
8
+var _utils = require("../../utils/utils");
9
+
10
+function _interopRequireDefault(obj) { return obj && obj.__esModule ? obj : { default: obj }; }
11
+
12
+function _extends() { _extends = Object.assign || function (target) { for (var i = 1; i < arguments.length; i++) { var source = arguments[i]; for (var key in source) { if (Object.prototype.hasOwnProperty.call(source, key)) { target[key] = source[key]; } } } return target; }; return _extends.apply(this, arguments); }
13
+
14
+var Coverflow = {
15
+  setTranslate: function setTranslate() {
16
+    var swiper = this;
17
+    var swiperWidth = swiper.width,
18
+        swiperHeight = swiper.height,
19
+        slides = swiper.slides,
20
+        slidesSizesGrid = swiper.slidesSizesGrid;
21
+    var params = swiper.params.coverflowEffect;
22
+    var isHorizontal = swiper.isHorizontal();
23
+    var transform = swiper.translate;
24
+    var center = isHorizontal ? -transform + swiperWidth / 2 : -transform + swiperHeight / 2;
25
+    var rotate = isHorizontal ? params.rotate : -params.rotate;
26
+    var translate = params.depth; // Each slide offset from center
27
+
28
+    for (var i = 0, length = slides.length; i < length; i += 1) {
29
+      var $slideEl = slides.eq(i);
30
+      var slideSize = slidesSizesGrid[i];
31
+      var slideOffset = $slideEl[0].swiperSlideOffset;
32
+      var offsetMultiplier = (center - slideOffset - slideSize / 2) / slideSize * params.modifier;
33
+      var rotateY = isHorizontal ? rotate * offsetMultiplier : 0;
34
+      var rotateX = isHorizontal ? 0 : rotate * offsetMultiplier; // var rotateZ = 0
35
+
36
+      var translateZ = -translate * Math.abs(offsetMultiplier);
37
+      var stretch = params.stretch; // Allow percentage to make a relative stretch for responsive sliders
38
+
39
+      if (typeof stretch === 'string' && stretch.indexOf('%') !== -1) {
40
+        stretch = parseFloat(params.stretch) / 100 * slideSize;
41
+      }
42
+
43
+      var translateY = isHorizontal ? 0 : stretch * offsetMultiplier;
44
+      var translateX = isHorizontal ? stretch * offsetMultiplier : 0;
45
+      var scale = 1 - (1 - params.scale) * Math.abs(offsetMultiplier); // Fix for ultra small values
46
+
47
+      if (Math.abs(translateX) < 0.001) translateX = 0;
48
+      if (Math.abs(translateY) < 0.001) translateY = 0;
49
+      if (Math.abs(translateZ) < 0.001) translateZ = 0;
50
+      if (Math.abs(rotateY) < 0.001) rotateY = 0;
51
+      if (Math.abs(rotateX) < 0.001) rotateX = 0;
52
+      if (Math.abs(scale) < 0.001) scale = 0;
53
+      var slideTransform = "translate3d(" + translateX + "px," + translateY + "px," + translateZ + "px)  rotateX(" + rotateX + "deg) rotateY(" + rotateY + "deg) scale(" + scale + ")";
54
+      $slideEl.transform(slideTransform);
55
+      $slideEl[0].style.zIndex = -Math.abs(Math.round(offsetMultiplier)) + 1;
56
+
57
+      if (params.slideShadows) {
58
+        // Set shadows
59
+        var $shadowBeforeEl = isHorizontal ? $slideEl.find('.swiper-slide-shadow-left') : $slideEl.find('.swiper-slide-shadow-top');
60
+        var $shadowAfterEl = isHorizontal ? $slideEl.find('.swiper-slide-shadow-right') : $slideEl.find('.swiper-slide-shadow-bottom');
61
+
62
+        if ($shadowBeforeEl.length === 0) {
63
+          $shadowBeforeEl = (0, _dom.default)("<div class=\"swiper-slide-shadow-" + (isHorizontal ? 'left' : 'top') + "\"></div>");
64
+          $slideEl.append($shadowBeforeEl);
65
+        }
66
+
67
+        if ($shadowAfterEl.length === 0) {
68
+          $shadowAfterEl = (0, _dom.default)("<div class=\"swiper-slide-shadow-" + (isHorizontal ? 'right' : 'bottom') + "\"></div>");
69
+          $slideEl.append($shadowAfterEl);
70
+        }
71
+
72
+        if ($shadowBeforeEl.length) $shadowBeforeEl[0].style.opacity = offsetMultiplier > 0 ? offsetMultiplier : 0;
73
+        if ($shadowAfterEl.length) $shadowAfterEl[0].style.opacity = -offsetMultiplier > 0 ? -offsetMultiplier : 0;
74
+      }
75
+    }
76
+  },
77
+  setTransition: function setTransition(duration) {
78
+    var swiper = this;
79
+    swiper.slides.transition(duration).find('.swiper-slide-shadow-top, .swiper-slide-shadow-right, .swiper-slide-shadow-bottom, .swiper-slide-shadow-left').transition(duration);
80
+  }
81
+};
82
+var _default = {
83
+  name: 'effect-coverflow',
84
+  params: {
85
+    coverflowEffect: {
86
+      rotate: 50,
87
+      stretch: 0,
88
+      depth: 100,
89
+      scale: 1,
90
+      modifier: 1,
91
+      slideShadows: true
92
+    }
93
+  },
94
+  create: function create() {
95
+    var swiper = this;
96
+    (0, _utils.bindModuleMethods)(swiper, {
97
+      coverflowEffect: _extends({}, Coverflow)
98
+    });
99
+  },
100
+  on: {
101
+    beforeInit: function beforeInit(swiper) {
102
+      if (swiper.params.effect !== 'coverflow') return;
103
+      swiper.classNames.push(swiper.params.containerModifierClass + "coverflow");
104
+      swiper.classNames.push(swiper.params.containerModifierClass + "3d");
105
+      swiper.params.watchSlidesProgress = true;
106
+      swiper.originalParams.watchSlidesProgress = true;
107
+    },
108
+    setTranslate: function setTranslate(swiper) {
109
+      if (swiper.params.effect !== 'coverflow') return;
110
+      swiper.coverflowEffect.setTranslate();
111
+    },
112
+    setTransition: function setTransition(swiper, duration) {
113
+      if (swiper.params.effect !== 'coverflow') return;
114
+      swiper.coverflowEffect.setTransition(duration);
115
+    }
116
+  }
117
+};
118
+exports.default = _default;
0 119
\ No newline at end of file