eSales Media Git repositories
Browse code

Remove old version 5

Benjamin Roth authored on14/03/2021 15:27:00
Showing1 changed files
assets/lib/swiper/5.4.0/src/components/effect-cube/effect-cube.js
History View file @0bd865c
1 1 
deleted file mode 100644
... ... 
@@ -1,180 +0,0 @@
1 
-import $ from '../../utils/dom';
2 
-import Utils from '../../utils/utils';
3 
-import Browser from '../../utils/browser';
4 
-
5 
-const Cube = {
6 
-  setTranslate() {
7 
-    const swiper = this;
8 
-    const {
9 
-      $el, $wrapperEl, slides, width: swiperWidth, height: swiperHeight, rtlTranslate: rtl, size: swiperSize,
10 
-    } = swiper;
11 
-    const params = swiper.params.cubeEffect;
12 
-    const isHorizontal = swiper.isHorizontal();
13 
-    const isVirtual = swiper.virtual && swiper.params.virtual.enabled;
14 
-    let wrapperRotate = 0;
15 
-    let $cubeShadowEl;
16 
-    if (params.shadow) {
17 
-      if (isHorizontal) {
18 
-        $cubeShadowEl = $wrapperEl.find('.swiper-cube-shadow');
19 
-        if ($cubeShadowEl.length === 0) {
20 
-          $cubeShadowEl = $('<div class="swiper-cube-shadow"></div>');
21 
-          $wrapperEl.append($cubeShadowEl);
22 
-        }
23 
-        $cubeShadowEl.css({ height: `${swiperWidth}px` });
24 
-      } else {
25 
-        $cubeShadowEl = $el.find('.swiper-cube-shadow');
26 
-        if ($cubeShadowEl.length === 0) {
27 
-          $cubeShadowEl = $('<div class="swiper-cube-shadow"></div>');
28 
-          $el.append($cubeShadowEl);
29 
-        }
30 
-      }
31 
-    }
32 
-    for (let i = 0; i < slides.length; i += 1) {
33 
-      const $slideEl = slides.eq(i);
34 
-      let slideIndex = i;
35 
-      if (isVirtual) {
36 
-        slideIndex = parseInt($slideEl.attr('data-swiper-slide-index'), 10);
37 
-      }
38 
-      let slideAngle = slideIndex * 90;
39 
-      let round = Math.floor(slideAngle / 360);
40 
-      if (rtl) {
41 
-        slideAngle = -slideAngle;
42 
-        round = Math.floor(-slideAngle / 360);
43 
-      }
44 
-      const progress = Math.max(Math.min($slideEl[0].progress, 1), -1);
45 
-      let tx = 0;
46 
-      let ty = 0;
47 
-      let tz = 0;
48 
-      if (slideIndex % 4 === 0) {
49 
-        tx = -round * 4 * swiperSize;
50 
-        tz = 0;
51 
-      } else if ((slideIndex - 1) % 4 === 0) {
52 
-        tx = 0;
53 
-        tz = -round * 4 * swiperSize;
54 
-      } else if ((slideIndex - 2) % 4 === 0) {
55 
-        tx = swiperSize + (round * 4 * swiperSize);
56 
-        tz = swiperSize;
57 
-      } else if ((slideIndex - 3) % 4 === 0) {
58 
-        tx = -swiperSize;
59 
-        tz = (3 * swiperSize) + (swiperSize * 4 * round);
60 
-      }
61 
-      if (rtl) {
62 
-        tx = -tx;
63 
-      }
64 
-
65 
-      if (!isHorizontal) {
66 
-        ty = tx;
67 
-        tx = 0;
68 
-      }
69 
-
70 
-      const transform = `rotateX(${isHorizontal ? 0 : -slideAngle}deg) rotateY(${isHorizontal ? slideAngle : 0}deg) translate3d(${tx}px, ${ty}px, ${tz}px)`;
71 
-      if (progress <= 1 && progress > -1) {
72 
-        wrapperRotate = (slideIndex * 90) + (progress * 90);
73 
-        if (rtl) wrapperRotate = (-slideIndex * 90) - (progress * 90);
74 
-      }
75 
-      $slideEl.transform(transform);
76 
-      if (params.slideShadows) {
77 
-        // Set shadows
78 
-        let shadowBefore = isHorizontal ? $slideEl.find('.swiper-slide-shadow-left') : $slideEl.find('.swiper-slide-shadow-top');
79 
-        let shadowAfter = isHorizontal ? $slideEl.find('.swiper-slide-shadow-right') : $slideEl.find('.swiper-slide-shadow-bottom');
80 
-        if (shadowBefore.length === 0) {
81 
-          shadowBefore = $(`<div class="swiper-slide-shadow-${isHorizontal ? 'left' : 'top'}"></div>`);
82 
-          $slideEl.append(shadowBefore);
83 
-        }
84 
-        if (shadowAfter.length === 0) {
85 
-          shadowAfter = $(`<div class="swiper-slide-shadow-${isHorizontal ? 'right' : 'bottom'}"></div>`);
86 
-          $slideEl.append(shadowAfter);
87 
-        }
88 
-        if (shadowBefore.length) shadowBefore[0].style.opacity = Math.max(-progress, 0);
89 
-        if (shadowAfter.length) shadowAfter[0].style.opacity = Math.max(progress, 0);
90 
-      }
91 
-    }
92 
-    $wrapperEl.css({
93 
-      '-webkit-transform-origin': `50% 50% -${swiperSize / 2}px`,
94 
-      '-moz-transform-origin': `50% 50% -${swiperSize / 2}px`,
95 
-      '-ms-transform-origin': `50% 50% -${swiperSize / 2}px`,
96 
-      'transform-origin': `50% 50% -${swiperSize / 2}px`,
97 
-    });
98 
-
99 
-    if (params.shadow) {
100 
-      if (isHorizontal) {
101 
-        $cubeShadowEl.transform(`translate3d(0px, ${(swiperWidth / 2) + params.shadowOffset}px, ${-swiperWidth / 2}px) rotateX(90deg) rotateZ(0deg) scale(${params.shadowScale})`);
102 
-      } else {
103 
-        const shadowAngle = Math.abs(wrapperRotate) - (Math.floor(Math.abs(wrapperRotate) / 90) * 90);
104 
-        const multiplier = 1.5 - (
105 
-          (Math.sin((shadowAngle * 2 * Math.PI) / 360) / 2)
106 
-          + (Math.cos((shadowAngle * 2 * Math.PI) / 360) / 2)
107 
-        );
108 
-        const scale1 = params.shadowScale;
109 
-        const scale2 = params.shadowScale / multiplier;
110 
-        const offset = params.shadowOffset;
111 
-        $cubeShadowEl.transform(`scale3d(${scale1}, 1, ${scale2}) translate3d(0px, ${(swiperHeight / 2) + offset}px, ${-swiperHeight / 2 / scale2}px) rotateX(-90deg)`);
112 
-      }
113 
-    }
114 
-    const zFactor = (Browser.isSafari || Browser.isUiWebView) ? (-swiperSize / 2) : 0;
115 
-    $wrapperEl
116 
-      .transform(`translate3d(0px,0,${zFactor}px) rotateX(${swiper.isHorizontal() ? 0 : wrapperRotate}deg) rotateY(${swiper.isHorizontal() ? -wrapperRotate : 0}deg)`);
117 
-  },
118 
-  setTransition(duration) {
119 
-    const swiper = this;
120 
-    const { $el, slides } = swiper;
121 
-    slides
122 
-      .transition(duration)
123 
-      .find('.swiper-slide-shadow-top, .swiper-slide-shadow-right, .swiper-slide-shadow-bottom, .swiper-slide-shadow-left')
124 
-      .transition(duration);
125 
-    if (swiper.params.cubeEffect.shadow && !swiper.isHorizontal()) {
126 
-      $el.find('.swiper-cube-shadow').transition(duration);
127 
-    }
128 
-  },
129 
-};
130 
-
131 
-export default {
132 
-  name: 'effect-cube',
133 
-  params: {
134 
-    cubeEffect: {
135 
-      slideShadows: true,
136 
-      shadow: true,
137 
-      shadowOffset: 20,
138 
-      shadowScale: 0.94,
139 
-    },
140 
-  },
141 
-  create() {
142 
-    const swiper = this;
143 
-    Utils.extend(swiper, {
144 
-      cubeEffect: {
145 
-        setTranslate: Cube.setTranslate.bind(swiper),
146 
-        setTransition: Cube.setTransition.bind(swiper),
147 
-      },
148 
-    });
149 
-  },
150 
-  on: {
151 
-    beforeInit() {
152 
-      const swiper = this;
153 
-      if (swiper.params.effect !== 'cube') return;
154 
-      swiper.classNames.push(`${swiper.params.containerModifierClass}cube`);
155 
-      swiper.classNames.push(`${swiper.params.containerModifierClass}3d`);
156 
-      const overwriteParams = {
157 
-        slidesPerView: 1,
158 
-        slidesPerColumn: 1,
159 
-        slidesPerGroup: 1,
160 
-        watchSlidesProgress: true,
161 
-        resistanceRatio: 0,
162 
-        spaceBetween: 0,
163 
-        centeredSlides: false,
164 
-        virtualTranslate: true,
165 
-      };
166 
-      Utils.extend(swiper.params, overwriteParams);
167 
-      Utils.extend(swiper.originalParams, overwriteParams);
168 
-    },
169 
-    setTranslate() {
170 
-      const swiper = this;
171 
-      if (swiper.params.effect !== 'cube') return;
172 
-      swiper.cubeEffect.setTranslate();
173 
-    },
174 
-    setTransition(duration) {
175 
-      const swiper = this;
176 
-      if (swiper.params.effect !== 'cube') return;
177 
-      swiper.cubeEffect.setTransition(duration);
178 
-    },
179 
-  },
180 
-};
Browse code

Initial commit

Benjamin Roth authored on19/05/2020 21:59:44
Showing1 changed files
assets/lib/swiper/5.4.0/src/components/effect-cube/effect-cube.js
History View file @a3fa092
1 1 
new file mode 100644
... ... 
@@ -0,0 +1,180 @@
1 
+import $ from '../../utils/dom';
2 
+import Utils from '../../utils/utils';
3 
+import Browser from '../../utils/browser';
4 
+
5 
+const Cube = {
6 
+  setTranslate() {
7 
+    const swiper = this;
8 
+    const {
9 
+      $el, $wrapperEl, slides, width: swiperWidth, height: swiperHeight, rtlTranslate: rtl, size: swiperSize,
10 
+    } = swiper;
11 
+    const params = swiper.params.cubeEffect;
12 
+    const isHorizontal = swiper.isHorizontal();
13 
+    const isVirtual = swiper.virtual && swiper.params.virtual.enabled;
14 
+    let wrapperRotate = 0;
15 
+    let $cubeShadowEl;
16 
+    if (params.shadow) {
17 
+      if (isHorizontal) {
18 
+        $cubeShadowEl = $wrapperEl.find('.swiper-cube-shadow');
19 
+        if ($cubeShadowEl.length === 0) {
20 
+          $cubeShadowEl = $('<div class="swiper-cube-shadow"></div>');
21 
+          $wrapperEl.append($cubeShadowEl);
22 
+        }
23 
+        $cubeShadowEl.css({ height: `${swiperWidth}px` });
24 
+      } else {
25 
+        $cubeShadowEl = $el.find('.swiper-cube-shadow');
26 
+        if ($cubeShadowEl.length === 0) {
27 
+          $cubeShadowEl = $('<div class="swiper-cube-shadow"></div>');
28 
+          $el.append($cubeShadowEl);
29 
+        }
30 
+      }
31 
+    }
32 
+    for (let i = 0; i < slides.length; i += 1) {
33 
+      const $slideEl = slides.eq(i);
34 
+      let slideIndex = i;
35 
+      if (isVirtual) {
36 
+        slideIndex = parseInt($slideEl.attr('data-swiper-slide-index'), 10);
37 
+      }
38 
+      let slideAngle = slideIndex * 90;
39 
+      let round = Math.floor(slideAngle / 360);
40 
+      if (rtl) {
41 
+        slideAngle = -slideAngle;
42 
+        round = Math.floor(-slideAngle / 360);
43 
+      }
44 
+      const progress = Math.max(Math.min($slideEl[0].progress, 1), -1);
45 
+      let tx = 0;
46 
+      let ty = 0;
47 
+      let tz = 0;
48 
+      if (slideIndex % 4 === 0) {
49 
+        tx = -round * 4 * swiperSize;
50 
+        tz = 0;
51 
+      } else if ((slideIndex - 1) % 4 === 0) {
52 
+        tx = 0;
53 
+        tz = -round * 4 * swiperSize;
54 
+      } else if ((slideIndex - 2) % 4 === 0) {
55 
+        tx = swiperSize + (round * 4 * swiperSize);
56 
+        tz = swiperSize;
57 
+      } else if ((slideIndex - 3) % 4 === 0) {
58 
+        tx = -swiperSize;
59 
+        tz = (3 * swiperSize) + (swiperSize * 4 * round);
60 
+      }
61 
+      if (rtl) {
62 
+        tx = -tx;
63 
+      }
64 
+
65 
+      if (!isHorizontal) {
66 
+        ty = tx;
67 
+        tx = 0;
68 
+      }
69 
+
70 
+      const transform = `rotateX(${isHorizontal ? 0 : -slideAngle}deg) rotateY(${isHorizontal ? slideAngle : 0}deg) translate3d(${tx}px, ${ty}px, ${tz}px)`;
71 
+      if (progress <= 1 && progress > -1) {
72 
+        wrapperRotate = (slideIndex * 90) + (progress * 90);
73 
+        if (rtl) wrapperRotate = (-slideIndex * 90) - (progress * 90);
74 
+      }
75 
+      $slideEl.transform(transform);
76 
+      if (params.slideShadows) {
77 
+        // Set shadows
78 
+        let shadowBefore = isHorizontal ? $slideEl.find('.swiper-slide-shadow-left') : $slideEl.find('.swiper-slide-shadow-top');
79 
+        let shadowAfter = isHorizontal ? $slideEl.find('.swiper-slide-shadow-right') : $slideEl.find('.swiper-slide-shadow-bottom');
80 
+        if (shadowBefore.length === 0) {
81 
+          shadowBefore = $(`<div class="swiper-slide-shadow-${isHorizontal ? 'left' : 'top'}"></div>`);
82 
+          $slideEl.append(shadowBefore);
83 
+        }
84 
+        if (shadowAfter.length === 0) {
85 
+          shadowAfter = $(`<div class="swiper-slide-shadow-${isHorizontal ? 'right' : 'bottom'}"></div>`);
86 
+          $slideEl.append(shadowAfter);
87 
+        }
88 
+        if (shadowBefore.length) shadowBefore[0].style.opacity = Math.max(-progress, 0);
89 
+        if (shadowAfter.length) shadowAfter[0].style.opacity = Math.max(progress, 0);
90 
+      }
91 
+    }
92 
+    $wrapperEl.css({
93 
+      '-webkit-transform-origin': `50% 50% -${swiperSize / 2}px`,
94 
+      '-moz-transform-origin': `50% 50% -${swiperSize / 2}px`,
95 
+      '-ms-transform-origin': `50% 50% -${swiperSize / 2}px`,
96 
+      'transform-origin': `50% 50% -${swiperSize / 2}px`,
97 
+    });
98 
+
99 
+    if (params.shadow) {
100 
+      if (isHorizontal) {
101 
+        $cubeShadowEl.transform(`translate3d(0px, ${(swiperWidth / 2) + params.shadowOffset}px, ${-swiperWidth / 2}px) rotateX(90deg) rotateZ(0deg) scale(${params.shadowScale})`);
102 
+      } else {
103 
+        const shadowAngle = Math.abs(wrapperRotate) - (Math.floor(Math.abs(wrapperRotate) / 90) * 90);
104 
+        const multiplier = 1.5 - (
105 
+          (Math.sin((shadowAngle * 2 * Math.PI) / 360) / 2)
106 
+          + (Math.cos((shadowAngle * 2 * Math.PI) / 360) / 2)
107 
+        );
108 
+        const scale1 = params.shadowScale;
109 
+        const scale2 = params.shadowScale / multiplier;
110 
+        const offset = params.shadowOffset;
111 
+        $cubeShadowEl.transform(`scale3d(${scale1}, 1, ${scale2}) translate3d(0px, ${(swiperHeight / 2) + offset}px, ${-swiperHeight / 2 / scale2}px) rotateX(-90deg)`);
112 
+      }
113 
+    }
114 
+    const zFactor = (Browser.isSafari || Browser.isUiWebView) ? (-swiperSize / 2) : 0;
115 
+    $wrapperEl
116 
+      .transform(`translate3d(0px,0,${zFactor}px) rotateX(${swiper.isHorizontal() ? 0 : wrapperRotate}deg) rotateY(${swiper.isHorizontal() ? -wrapperRotate : 0}deg)`);
117 
+  },
118 
+  setTransition(duration) {
119 
+    const swiper = this;
120 
+    const { $el, slides } = swiper;
121 
+    slides
122 
+      .transition(duration)
123 
+      .find('.swiper-slide-shadow-top, .swiper-slide-shadow-right, .swiper-slide-shadow-bottom, .swiper-slide-shadow-left')
124 
+      .transition(duration);
125 
+    if (swiper.params.cubeEffect.shadow && !swiper.isHorizontal()) {
126 
+      $el.find('.swiper-cube-shadow').transition(duration);
127 
+    }
128 
+  },
129 
+};
130 
+
131 
+export default {
132 
+  name: 'effect-cube',
133 
+  params: {
134 
+    cubeEffect: {
135 
+      slideShadows: true,
136 
+      shadow: true,
137 
+      shadowOffset: 20,
138 
+      shadowScale: 0.94,
139 
+    },
140 
+  },
141 
+  create() {
142 
+    const swiper = this;
143 
+    Utils.extend(swiper, {
144 
+      cubeEffect: {
145 
+        setTranslate: Cube.setTranslate.bind(swiper),
146 
+        setTransition: Cube.setTransition.bind(swiper),
147 
+      },
148 
+    });
149 
+  },
150 
+  on: {
151 
+    beforeInit() {
152 
+      const swiper = this;
153 
+      if (swiper.params.effect !== 'cube') return;
154 
+      swiper.classNames.push(`${swiper.params.containerModifierClass}cube`);
155 
+      swiper.classNames.push(`${swiper.params.containerModifierClass}3d`);
156 
+      const overwriteParams = {
157 
+        slidesPerView: 1,
158 
+        slidesPerColumn: 1,
159 
+        slidesPerGroup: 1,
160 
+        watchSlidesProgress: true,
161 
+        resistanceRatio: 0,
162 
+        spaceBetween: 0,
163 
+        centeredSlides: false,
164 
+        virtualTranslate: true,
165 
+      };
166 
+      Utils.extend(swiper.params, overwriteParams);
167 
+      Utils.extend(swiper.originalParams, overwriteParams);
168 
+    },
169 
+    setTranslate() {
170 
+      const swiper = this;
171 
+      if (swiper.params.effect !== 'cube') return;
172 
+      swiper.cubeEffect.setTranslate();
173 
+    },
174 
+    setTransition(duration) {
175 
+      const swiper = this;
176 
+      if (swiper.params.effect !== 'cube') return;
177 
+      swiper.cubeEffect.setTransition(duration);
178 
+    },
179 
+  },
180 
+};