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/pagination/pagination.js
History View file @0bd865c
1 1 
deleted file mode 100644
... ... 
@@ -1,360 +0,0 @@
1 
-import $ from '../../utils/dom';
2 
-import Utils from '../../utils/utils';
3 
-
4 
-const Pagination = {
5 
-  update() {
6 
-    // Render || Update Pagination bullets/items
7 
-    const swiper = this;
8 
-    const rtl = swiper.rtl;
9 
-    const params = swiper.params.pagination;
10 
-    if (!params.el || !swiper.pagination.el || !swiper.pagination.$el || swiper.pagination.$el.length === 0) return;
11 
-    const slidesLength = swiper.virtual && swiper.params.virtual.enabled ? swiper.virtual.slides.length : swiper.slides.length;
12 
-    const $el = swiper.pagination.$el;
13 
-    // Current/Total
14 
-    let current;
15 
-    const total = swiper.params.loop ? Math.ceil((slidesLength - (swiper.loopedSlides * 2)) / swiper.params.slidesPerGroup) : swiper.snapGrid.length;
16 
-    if (swiper.params.loop) {
17 
-      current = Math.ceil((swiper.activeIndex - swiper.loopedSlides) / swiper.params.slidesPerGroup);
18 
-      if (current > slidesLength - 1 - (swiper.loopedSlides * 2)) {
19 
-        current -= (slidesLength - (swiper.loopedSlides * 2));
20 
-      }
21 
-      if (current > total - 1) current -= total;
22 
-      if (current < 0 && swiper.params.paginationType !== 'bullets') current = total + current;
23 
-    } else if (typeof swiper.snapIndex !== 'undefined') {
24 
-      current = swiper.snapIndex;
25 
-    } else {
26 
-      current = swiper.activeIndex || 0;
27 
-    }
28 
-    // Types
29 
-    if (params.type === 'bullets' && swiper.pagination.bullets && swiper.pagination.bullets.length > 0) {
30 
-      const bullets = swiper.pagination.bullets;
31 
-      let firstIndex;
32 
-      let lastIndex;
33 
-      let midIndex;
34 
-      if (params.dynamicBullets) {
35 
-        swiper.pagination.bulletSize = bullets.eq(0)[swiper.isHorizontal() ? 'outerWidth' : 'outerHeight'](true);
36 
-        $el.css(swiper.isHorizontal() ? 'width' : 'height', `${swiper.pagination.bulletSize * (params.dynamicMainBullets + 4)}px`);
37 
-        if (params.dynamicMainBullets > 1 && swiper.previousIndex !== undefined) {
38 
-          swiper.pagination.dynamicBulletIndex += (current - swiper.previousIndex);
39 
-          if (swiper.pagination.dynamicBulletIndex > (params.dynamicMainBullets - 1)) {
40 
-            swiper.pagination.dynamicBulletIndex = params.dynamicMainBullets - 1;
41 
-          } else if (swiper.pagination.dynamicBulletIndex < 0) {
42 
-            swiper.pagination.dynamicBulletIndex = 0;
43 
-          }
44 
-        }
45 
-        firstIndex = current - swiper.pagination.dynamicBulletIndex;
46 
-        lastIndex = firstIndex + (Math.min(bullets.length, params.dynamicMainBullets) - 1);
47 
-        midIndex = (lastIndex + firstIndex) / 2;
48 
-      }
49 
-      bullets.removeClass(`${params.bulletActiveClass} ${params.bulletActiveClass}-next ${params.bulletActiveClass}-next-next ${params.bulletActiveClass}-prev ${params.bulletActiveClass}-prev-prev ${params.bulletActiveClass}-main`);
50 
-      if ($el.length > 1) {
51 
-        bullets.each((index, bullet) => {
52 
-          const $bullet = $(bullet);
53 
-          const bulletIndex = $bullet.index();
54 
-          if (bulletIndex === current) {
55 
-            $bullet.addClass(params.bulletActiveClass);
56 
-          }
57 
-          if (params.dynamicBullets) {
58 
-            if (bulletIndex >= firstIndex && bulletIndex <= lastIndex) {
59 
-              $bullet.addClass(`${params.bulletActiveClass}-main`);
60 
-            }
61 
-            if (bulletIndex === firstIndex) {
62 
-              $bullet
63 
-                .prev()
64 
-                .addClass(`${params.bulletActiveClass}-prev`)
65 
-                .prev()
66 
-                .addClass(`${params.bulletActiveClass}-prev-prev`);
67 
-            }
68 
-            if (bulletIndex === lastIndex) {
69 
-              $bullet
70 
-                .next()
71 
-                .addClass(`${params.bulletActiveClass}-next`)
72 
-                .next()
73 
-                .addClass(`${params.bulletActiveClass}-next-next`);
74 
-            }
75 
-          }
76 
-        });
77 
-      } else {
78 
-        const $bullet = bullets.eq(current);
79 
-        const bulletIndex = $bullet.index();
80 
-        $bullet.addClass(params.bulletActiveClass);
81 
-        if (params.dynamicBullets) {
82 
-          const $firstDisplayedBullet = bullets.eq(firstIndex);
83 
-          const $lastDisplayedBullet = bullets.eq(lastIndex);
84 
-          for (let i = firstIndex; i <= lastIndex; i += 1) {
85 
-            bullets.eq(i).addClass(`${params.bulletActiveClass}-main`);
86 
-          }
87 
-          if (swiper.params.loop) {
88 
-            if (bulletIndex >= bullets.length - params.dynamicMainBullets) {
89 
-              for (let i = params.dynamicMainBullets; i >= 0; i -= 1) {
90 
-                bullets.eq(bullets.length - i).addClass(`${params.bulletActiveClass}-main`);
91 
-              }
92 
-              bullets.eq(bullets.length - params.dynamicMainBullets - 1).addClass(`${params.bulletActiveClass}-prev`);
93 
-            } else {
94 
-              $firstDisplayedBullet
95 
-                .prev()
96 
-                .addClass(`${params.bulletActiveClass}-prev`)
97 
-                .prev()
98 
-                .addClass(`${params.bulletActiveClass}-prev-prev`);
99 
-              $lastDisplayedBullet
100 
-                .next()
101 
-                .addClass(`${params.bulletActiveClass}-next`)
102 
-                .next()
103 
-                .addClass(`${params.bulletActiveClass}-next-next`);
104 
-            }
105 
-          } else {
106 
-            $firstDisplayedBullet
107 
-              .prev()
108 
-              .addClass(`${params.bulletActiveClass}-prev`)
109 
-              .prev()
110 
-              .addClass(`${params.bulletActiveClass}-prev-prev`);
111 
-            $lastDisplayedBullet
112 
-              .next()
113 
-              .addClass(`${params.bulletActiveClass}-next`)
114 
-              .next()
115 
-              .addClass(`${params.bulletActiveClass}-next-next`);
116 
-          }
117 
-        }
118 
-      }
119 
-      if (params.dynamicBullets) {
120 
-        const dynamicBulletsLength = Math.min(bullets.length, params.dynamicMainBullets + 4);
121 
-        const bulletsOffset = (((swiper.pagination.bulletSize * dynamicBulletsLength) - (swiper.pagination.bulletSize)) / 2) - (midIndex * swiper.pagination.bulletSize);
122 
-        const offsetProp = rtl ? 'right' : 'left';
123 
-        bullets.css(swiper.isHorizontal() ? offsetProp : 'top', `${bulletsOffset}px`);
124 
-      }
125 
-    }
126 
-    if (params.type === 'fraction') {
127 
-      $el.find(`.${params.currentClass}`).text(params.formatFractionCurrent(current + 1));
128 
-      $el.find(`.${params.totalClass}`).text(params.formatFractionTotal(total));
129 
-    }
130 
-    if (params.type === 'progressbar') {
131 
-      let progressbarDirection;
132 
-      if (params.progressbarOpposite) {
133 
-        progressbarDirection = swiper.isHorizontal() ? 'vertical' : 'horizontal';
134 
-      } else {
135 
-        progressbarDirection = swiper.isHorizontal() ? 'horizontal' : 'vertical';
136 
-      }
137 
-      const scale = (current + 1) / total;
138 
-      let scaleX = 1;
139 
-      let scaleY = 1;
140 
-      if (progressbarDirection === 'horizontal') {
141 
-        scaleX = scale;
142 
-      } else {
143 
-        scaleY = scale;
144 
-      }
145 
-      $el.find(`.${params.progressbarFillClass}`).transform(`translate3d(0,0,0) scaleX(${scaleX}) scaleY(${scaleY})`).transition(swiper.params.speed);
146 
-    }
147 
-    if (params.type === 'custom' && params.renderCustom) {
148 
-      $el.html(params.renderCustom(swiper, current + 1, total));
149 
-      swiper.emit('paginationRender', swiper, $el[0]);
150 
-    } else {
151 
-      swiper.emit('paginationUpdate', swiper, $el[0]);
152 
-    }
153 
-    $el[swiper.params.watchOverflow && swiper.isLocked ? 'addClass' : 'removeClass'](params.lockClass);
154 
-  },
155 
-  render() {
156 
-    // Render Container
157 
-    const swiper = this;
158 
-    const params = swiper.params.pagination;
159 
-    if (!params.el || !swiper.pagination.el || !swiper.pagination.$el || swiper.pagination.$el.length === 0) return;
160 
-    const slidesLength = swiper.virtual && swiper.params.virtual.enabled ? swiper.virtual.slides.length : swiper.slides.length;
161 
-
162 
-    const $el = swiper.pagination.$el;
163 
-    let paginationHTML = '';
164 
-    if (params.type === 'bullets') {
165 
-      const numberOfBullets = swiper.params.loop ? Math.ceil((slidesLength - (swiper.loopedSlides * 2)) / swiper.params.slidesPerGroup) : swiper.snapGrid.length;
166 
-      for (let i = 0; i < numberOfBullets; i += 1) {
167 
-        if (params.renderBullet) {
168 
-          paginationHTML += params.renderBullet.call(swiper, i, params.bulletClass);
169 
-        } else {
170 
-          paginationHTML += `<${params.bulletElement} class="${params.bulletClass}"></${params.bulletElement}>`;
171 
-        }
172 
-      }
173 
-      $el.html(paginationHTML);
174 
-      swiper.pagination.bullets = $el.find(`.${params.bulletClass}`);
175 
-    }
176 
-    if (params.type === 'fraction') {
177 
-      if (params.renderFraction) {
178 
-        paginationHTML = params.renderFraction.call(swiper, params.currentClass, params.totalClass);
179 
-      } else {
180 
-        paginationHTML = `<span class="${params.currentClass}"></span>`
181 
-        + ' / '
182 
-        + `<span class="${params.totalClass}"></span>`;
183 
-      }
184 
-      $el.html(paginationHTML);
185 
-    }
186 
-    if (params.type === 'progressbar') {
187 
-      if (params.renderProgressbar) {
188 
-        paginationHTML = params.renderProgressbar.call(swiper, params.progressbarFillClass);
189 
-      } else {
190 
-        paginationHTML = `<span class="${params.progressbarFillClass}"></span>`;
191 
-      }
192 
-      $el.html(paginationHTML);
193 
-    }
194 
-    if (params.type !== 'custom') {
195 
-      swiper.emit('paginationRender', swiper.pagination.$el[0]);
196 
-    }
197 
-  },
198 
-  init() {
199 
-    const swiper = this;
200 
-    const params = swiper.params.pagination;
201 
-    if (!params.el) return;
202 
-
203 
-    let $el = $(params.el);
204 
-    if ($el.length === 0) return;
205 
-
206 
-    if (
207 
-      swiper.params.uniqueNavElements
208 
-      && typeof params.el === 'string'
209 
-      && $el.length > 1
210 
-      && swiper.$el.find(params.el).length === 1
211 
-    ) {
212 
-      $el = swiper.$el.find(params.el);
213 
-    }
214 
-
215 
-    if (params.type === 'bullets' && params.clickable) {
216 
-      $el.addClass(params.clickableClass);
217 
-    }
218 
-
219 
-    $el.addClass(params.modifierClass + params.type);
220 
-
221 
-    if (params.type === 'bullets' && params.dynamicBullets) {
222 
-      $el.addClass(`${params.modifierClass}${params.type}-dynamic`);
223 
-      swiper.pagination.dynamicBulletIndex = 0;
224 
-      if (params.dynamicMainBullets < 1) {
225 
-        params.dynamicMainBullets = 1;
226 
-      }
227 
-    }
228 
-    if (params.type === 'progressbar' && params.progressbarOpposite) {
229 
-      $el.addClass(params.progressbarOppositeClass);
230 
-    }
231 
-
232 
-    if (params.clickable) {
233 
-      $el.on('click', `.${params.bulletClass}`, function onClick(e) {
234 
-        e.preventDefault();
235 
-        let index = $(this).index() * swiper.params.slidesPerGroup;
236 
-        if (swiper.params.loop) index += swiper.loopedSlides;
237 
-        swiper.slideTo(index);
238 
-      });
239 
-    }
240 
-
241 
-    Utils.extend(swiper.pagination, {
242 
-      $el,
243 
-      el: $el[0],
244 
-    });
245 
-  },
246 
-  destroy() {
247 
-    const swiper = this;
248 
-    const params = swiper.params.pagination;
249 
-    if (!params.el || !swiper.pagination.el || !swiper.pagination.$el || swiper.pagination.$el.length === 0) return;
250 
-    const $el = swiper.pagination.$el;
251 
-
252 
-    $el.removeClass(params.hiddenClass);
253 
-    $el.removeClass(params.modifierClass + params.type);
254 
-    if (swiper.pagination.bullets) swiper.pagination.bullets.removeClass(params.bulletActiveClass);
255 
-    if (params.clickable) {
256 
-      $el.off('click', `.${params.bulletClass}`);
257 
-    }
258 
-  },
259 
-};
260 
-
261 
-export default {
262 
-  name: 'pagination',
263 
-  params: {
264 
-    pagination: {
265 
-      el: null,
266 
-      bulletElement: 'span',
267 
-      clickable: false,
268 
-      hideOnClick: false,
269 
-      renderBullet: null,
270 
-      renderProgressbar: null,
271 
-      renderFraction: null,
272 
-      renderCustom: null,
273 
-      progressbarOpposite: false,
274 
-      type: 'bullets', // 'bullets' or 'progressbar' or 'fraction' or 'custom'
275 
-      dynamicBullets: false,
276 
-      dynamicMainBullets: 1,
277 
-      formatFractionCurrent: (number) => number,
278 
-      formatFractionTotal: (number) => number,
279 
-      bulletClass: 'swiper-pagination-bullet',
280 
-      bulletActiveClass: 'swiper-pagination-bullet-active',
281 
-      modifierClass: 'swiper-pagination-', // NEW
282 
-      currentClass: 'swiper-pagination-current',
283 
-      totalClass: 'swiper-pagination-total',
284 
-      hiddenClass: 'swiper-pagination-hidden',
285 
-      progressbarFillClass: 'swiper-pagination-progressbar-fill',
286 
-      progressbarOppositeClass: 'swiper-pagination-progressbar-opposite',
287 
-      clickableClass: 'swiper-pagination-clickable', // NEW
288 
-      lockClass: 'swiper-pagination-lock',
289 
-    },
290 
-  },
291 
-  create() {
292 
-    const swiper = this;
293 
-    Utils.extend(swiper, {
294 
-      pagination: {
295 
-        init: Pagination.init.bind(swiper),
296 
-        render: Pagination.render.bind(swiper),
297 
-        update: Pagination.update.bind(swiper),
298 
-        destroy: Pagination.destroy.bind(swiper),
299 
-        dynamicBulletIndex: 0,
300 
-      },
301 
-    });
302 
-  },
303 
-  on: {
304 
-    init() {
305 
-      const swiper = this;
306 
-      swiper.pagination.init();
307 
-      swiper.pagination.render();
308 
-      swiper.pagination.update();
309 
-    },
310 
-    activeIndexChange() {
311 
-      const swiper = this;
312 
-      if (swiper.params.loop) {
313 
-        swiper.pagination.update();
314 
-      } else if (typeof swiper.snapIndex === 'undefined') {
315 
-        swiper.pagination.update();
316 
-      }
317 
-    },
318 
-    snapIndexChange() {
319 
-      const swiper = this;
320 
-      if (!swiper.params.loop) {
321 
-        swiper.pagination.update();
322 
-      }
323 
-    },
324 
-    slidesLengthChange() {
325 
-      const swiper = this;
326 
-      if (swiper.params.loop) {
327 
-        swiper.pagination.render();
328 
-        swiper.pagination.update();
329 
-      }
330 
-    },
331 
-    snapGridLengthChange() {
332 
-      const swiper = this;
333 
-      if (!swiper.params.loop) {
334 
-        swiper.pagination.render();
335 
-        swiper.pagination.update();
336 
-      }
337 
-    },
338 
-    destroy() {
339 
-      const swiper = this;
340 
-      swiper.pagination.destroy();
341 
-    },
342 
-    click(e) {
343 
-      const swiper = this;
344 
-      if (
345 
-        swiper.params.pagination.el
346 
-        && swiper.params.pagination.hideOnClick
347 
-        && swiper.pagination.$el.length > 0
348 
-        && !$(e.target).hasClass(swiper.params.pagination.bulletClass)
349 
-      ) {
350 
-        const isHidden = swiper.pagination.$el.hasClass(swiper.params.pagination.hiddenClass);
351 
-        if (isHidden === true) {
352 
-          swiper.emit('paginationShow', swiper);
353 
-        } else {
354 
-          swiper.emit('paginationHide', swiper);
355 
-        }
356 
-        swiper.pagination.$el.toggleClass(swiper.params.pagination.hiddenClass);
357 
-      }
358 
-    },
359 
-  },
360 
-};
Browse code

Initial commit

Benjamin Roth authored on19/05/2020 21:59:44
Showing1 changed files
assets/lib/swiper/5.4.0/src/components/pagination/pagination.js
History View file @a3fa092
1 1 
new file mode 100644
... ... 
@@ -0,0 +1,360 @@
1 
+import $ from '../../utils/dom';
2 
+import Utils from '../../utils/utils';
3 
+
4 
+const Pagination = {
5 
+  update() {
6 
+    // Render || Update Pagination bullets/items
7 
+    const swiper = this;
8 
+    const rtl = swiper.rtl;
9 
+    const params = swiper.params.pagination;
10 
+    if (!params.el || !swiper.pagination.el || !swiper.pagination.$el || swiper.pagination.$el.length === 0) return;
11 
+    const slidesLength = swiper.virtual && swiper.params.virtual.enabled ? swiper.virtual.slides.length : swiper.slides.length;
12 
+    const $el = swiper.pagination.$el;
13 
+    // Current/Total
14 
+    let current;
15 
+    const total = swiper.params.loop ? Math.ceil((slidesLength - (swiper.loopedSlides * 2)) / swiper.params.slidesPerGroup) : swiper.snapGrid.length;
16 
+    if (swiper.params.loop) {
17 
+      current = Math.ceil((swiper.activeIndex - swiper.loopedSlides) / swiper.params.slidesPerGroup);
18 
+      if (current > slidesLength - 1 - (swiper.loopedSlides * 2)) {
19 
+        current -= (slidesLength - (swiper.loopedSlides * 2));
20 
+      }
21 
+      if (current > total - 1) current -= total;
22 
+      if (current < 0 && swiper.params.paginationType !== 'bullets') current = total + current;
23 
+    } else if (typeof swiper.snapIndex !== 'undefined') {
24 
+      current = swiper.snapIndex;
25 
+    } else {
26 
+      current = swiper.activeIndex || 0;
27 
+    }
28 
+    // Types
29 
+    if (params.type === 'bullets' && swiper.pagination.bullets && swiper.pagination.bullets.length > 0) {
30 
+      const bullets = swiper.pagination.bullets;
31 
+      let firstIndex;
32 
+      let lastIndex;
33 
+      let midIndex;
34 
+      if (params.dynamicBullets) {
35 
+        swiper.pagination.bulletSize = bullets.eq(0)[swiper.isHorizontal() ? 'outerWidth' : 'outerHeight'](true);
36 
+        $el.css(swiper.isHorizontal() ? 'width' : 'height', `${swiper.pagination.bulletSize * (params.dynamicMainBullets + 4)}px`);
37 
+        if (params.dynamicMainBullets > 1 && swiper.previousIndex !== undefined) {
38 
+          swiper.pagination.dynamicBulletIndex += (current - swiper.previousIndex);
39 
+          if (swiper.pagination.dynamicBulletIndex > (params.dynamicMainBullets - 1)) {
40 
+            swiper.pagination.dynamicBulletIndex = params.dynamicMainBullets - 1;
41 
+          } else if (swiper.pagination.dynamicBulletIndex < 0) {
42 
+            swiper.pagination.dynamicBulletIndex = 0;
43 
+          }
44 
+        }
45 
+        firstIndex = current - swiper.pagination.dynamicBulletIndex;
46 
+        lastIndex = firstIndex + (Math.min(bullets.length, params.dynamicMainBullets) - 1);
47 
+        midIndex = (lastIndex + firstIndex) / 2;
48 
+      }
49 
+      bullets.removeClass(`${params.bulletActiveClass} ${params.bulletActiveClass}-next ${params.bulletActiveClass}-next-next ${params.bulletActiveClass}-prev ${params.bulletActiveClass}-prev-prev ${params.bulletActiveClass}-main`);
50 
+      if ($el.length > 1) {
51 
+        bullets.each((index, bullet) => {
52 
+          const $bullet = $(bullet);
53 
+          const bulletIndex = $bullet.index();
54 
+          if (bulletIndex === current) {
55 
+            $bullet.addClass(params.bulletActiveClass);
56 
+          }
57 
+          if (params.dynamicBullets) {
58 
+            if (bulletIndex >= firstIndex && bulletIndex <= lastIndex) {
59 
+              $bullet.addClass(`${params.bulletActiveClass}-main`);
60 
+            }
61 
+            if (bulletIndex === firstIndex) {
62 
+              $bullet
63 
+                .prev()
64 
+                .addClass(`${params.bulletActiveClass}-prev`)
65 
+                .prev()
66 
+                .addClass(`${params.bulletActiveClass}-prev-prev`);
67 
+            }
68 
+            if (bulletIndex === lastIndex) {
69 
+              $bullet
70 
+                .next()
71 
+                .addClass(`${params.bulletActiveClass}-next`)
72 
+                .next()
73 
+                .addClass(`${params.bulletActiveClass}-next-next`);
74 
+            }
75 
+          }
76 
+        });
77 
+      } else {
78 
+        const $bullet = bullets.eq(current);
79 
+        const bulletIndex = $bullet.index();
80 
+        $bullet.addClass(params.bulletActiveClass);
81 
+        if (params.dynamicBullets) {
82 
+          const $firstDisplayedBullet = bullets.eq(firstIndex);
83 
+          const $lastDisplayedBullet = bullets.eq(lastIndex);
84 
+          for (let i = firstIndex; i <= lastIndex; i += 1) {
85 
+            bullets.eq(i).addClass(`${params.bulletActiveClass}-main`);
86 
+          }
87 
+          if (swiper.params.loop) {
88 
+            if (bulletIndex >= bullets.length - params.dynamicMainBullets) {
89 
+              for (let i = params.dynamicMainBullets; i >= 0; i -= 1) {
90 
+                bullets.eq(bullets.length - i).addClass(`${params.bulletActiveClass}-main`);
91 
+              }
92 
+              bullets.eq(bullets.length - params.dynamicMainBullets - 1).addClass(`${params.bulletActiveClass}-prev`);
93 
+            } else {
94 
+              $firstDisplayedBullet
95 
+                .prev()
96 
+                .addClass(`${params.bulletActiveClass}-prev`)
97 
+                .prev()
98 
+                .addClass(`${params.bulletActiveClass}-prev-prev`);
99 
+              $lastDisplayedBullet
100 
+                .next()
101 
+                .addClass(`${params.bulletActiveClass}-next`)
102 
+                .next()
103 
+                .addClass(`${params.bulletActiveClass}-next-next`);
104 
+            }
105 
+          } else {
106 
+            $firstDisplayedBullet
107 
+              .prev()
108 
+              .addClass(`${params.bulletActiveClass}-prev`)
109 
+              .prev()
110 
+              .addClass(`${params.bulletActiveClass}-prev-prev`);
111 
+            $lastDisplayedBullet
112 
+              .next()
113 
+              .addClass(`${params.bulletActiveClass}-next`)
114 
+              .next()
115 
+              .addClass(`${params.bulletActiveClass}-next-next`);
116 
+          }
117 
+        }
118 
+      }
119 
+      if (params.dynamicBullets) {
120 
+        const dynamicBulletsLength = Math.min(bullets.length, params.dynamicMainBullets + 4);
121 
+        const bulletsOffset = (((swiper.pagination.bulletSize * dynamicBulletsLength) - (swiper.pagination.bulletSize)) / 2) - (midIndex * swiper.pagination.bulletSize);
122 
+        const offsetProp = rtl ? 'right' : 'left';
123 
+        bullets.css(swiper.isHorizontal() ? offsetProp : 'top', `${bulletsOffset}px`);
124 
+      }
125 
+    }
126 
+    if (params.type === 'fraction') {
127 
+      $el.find(`.${params.currentClass}`).text(params.formatFractionCurrent(current + 1));
128 
+      $el.find(`.${params.totalClass}`).text(params.formatFractionTotal(total));
129 
+    }
130 
+    if (params.type === 'progressbar') {
131 
+      let progressbarDirection;
132 
+      if (params.progressbarOpposite) {
133 
+        progressbarDirection = swiper.isHorizontal() ? 'vertical' : 'horizontal';
134 
+      } else {
135 
+        progressbarDirection = swiper.isHorizontal() ? 'horizontal' : 'vertical';
136 
+      }
137 
+      const scale = (current + 1) / total;
138 
+      let scaleX = 1;
139 
+      let scaleY = 1;
140 
+      if (progressbarDirection === 'horizontal') {
141 
+        scaleX = scale;
142 
+      } else {
143 
+        scaleY = scale;
144 
+      }
145 
+      $el.find(`.${params.progressbarFillClass}`).transform(`translate3d(0,0,0) scaleX(${scaleX}) scaleY(${scaleY})`).transition(swiper.params.speed);
146 
+    }
147 
+    if (params.type === 'custom' && params.renderCustom) {
148 
+      $el.html(params.renderCustom(swiper, current + 1, total));
149 
+      swiper.emit('paginationRender', swiper, $el[0]);
150 
+    } else {
151 
+      swiper.emit('paginationUpdate', swiper, $el[0]);
152 
+    }
153 
+    $el[swiper.params.watchOverflow && swiper.isLocked ? 'addClass' : 'removeClass'](params.lockClass);
154 
+  },
155 
+  render() {
156 
+    // Render Container
157 
+    const swiper = this;
158 
+    const params = swiper.params.pagination;
159 
+    if (!params.el || !swiper.pagination.el || !swiper.pagination.$el || swiper.pagination.$el.length === 0) return;
160 
+    const slidesLength = swiper.virtual && swiper.params.virtual.enabled ? swiper.virtual.slides.length : swiper.slides.length;
161 
+
162 
+    const $el = swiper.pagination.$el;
163 
+    let paginationHTML = '';
164 
+    if (params.type === 'bullets') {
165 
+      const numberOfBullets = swiper.params.loop ? Math.ceil((slidesLength - (swiper.loopedSlides * 2)) / swiper.params.slidesPerGroup) : swiper.snapGrid.length;
166 
+      for (let i = 0; i < numberOfBullets; i += 1) {
167 
+        if (params.renderBullet) {
168 
+          paginationHTML += params.renderBullet.call(swiper, i, params.bulletClass);
169 
+        } else {
170 
+          paginationHTML += `<${params.bulletElement} class="${params.bulletClass}"></${params.bulletElement}>`;
171 
+        }
172 
+      }
173 
+      $el.html(paginationHTML);
174 
+      swiper.pagination.bullets = $el.find(`.${params.bulletClass}`);
175 
+    }
176 
+    if (params.type === 'fraction') {
177 
+      if (params.renderFraction) {
178 
+        paginationHTML = params.renderFraction.call(swiper, params.currentClass, params.totalClass);
179 
+      } else {
180 
+        paginationHTML = `<span class="${params.currentClass}"></span>`
181 
+        + ' / '
182 
+        + `<span class="${params.totalClass}"></span>`;
183 
+      }
184 
+      $el.html(paginationHTML);
185 
+    }
186 
+    if (params.type === 'progressbar') {
187 
+      if (params.renderProgressbar) {
188 
+        paginationHTML = params.renderProgressbar.call(swiper, params.progressbarFillClass);
189 
+      } else {
190 
+        paginationHTML = `<span class="${params.progressbarFillClass}"></span>`;
191 
+      }
192 
+      $el.html(paginationHTML);
193 
+    }
194 
+    if (params.type !== 'custom') {
195 
+      swiper.emit('paginationRender', swiper.pagination.$el[0]);
196 
+    }
197 
+  },
198 
+  init() {
199 
+    const swiper = this;
200 
+    const params = swiper.params.pagination;
201 
+    if (!params.el) return;
202 
+
203 
+    let $el = $(params.el);
204 
+    if ($el.length === 0) return;
205 
+
206 
+    if (
207 
+      swiper.params.uniqueNavElements
208 
+      && typeof params.el === 'string'
209 
+      && $el.length > 1
210 
+      && swiper.$el.find(params.el).length === 1
211 
+    ) {
212 
+      $el = swiper.$el.find(params.el);
213 
+    }
214 
+
215 
+    if (params.type === 'bullets' && params.clickable) {
216 
+      $el.addClass(params.clickableClass);
217 
+    }
218 
+
219 
+    $el.addClass(params.modifierClass + params.type);
220 
+
221 
+    if (params.type === 'bullets' && params.dynamicBullets) {
222 
+      $el.addClass(`${params.modifierClass}${params.type}-dynamic`);
223 
+      swiper.pagination.dynamicBulletIndex = 0;
224 
+      if (params.dynamicMainBullets < 1) {
225 
+        params.dynamicMainBullets = 1;
226 
+      }
227 
+    }
228 
+    if (params.type === 'progressbar' && params.progressbarOpposite) {
229 
+      $el.addClass(params.progressbarOppositeClass);
230 
+    }
231 
+
232 
+    if (params.clickable) {
233 
+      $el.on('click', `.${params.bulletClass}`, function onClick(e) {
234 
+        e.preventDefault();
235 
+        let index = $(this).index() * swiper.params.slidesPerGroup;
236 
+        if (swiper.params.loop) index += swiper.loopedSlides;
237 
+        swiper.slideTo(index);
238 
+      });
239 
+    }
240 
+
241 
+    Utils.extend(swiper.pagination, {
242 
+      $el,
243 
+      el: $el[0],
244 
+    });
245 
+  },
246 
+  destroy() {
247 
+    const swiper = this;
248 
+    const params = swiper.params.pagination;
249 
+    if (!params.el || !swiper.pagination.el || !swiper.pagination.$el || swiper.pagination.$el.length === 0) return;
250 
+    const $el = swiper.pagination.$el;
251 
+
252 
+    $el.removeClass(params.hiddenClass);
253 
+    $el.removeClass(params.modifierClass + params.type);
254 
+    if (swiper.pagination.bullets) swiper.pagination.bullets.removeClass(params.bulletActiveClass);
255 
+    if (params.clickable) {
256 
+      $el.off('click', `.${params.bulletClass}`);
257 
+    }
258 
+  },
259 
+};
260 
+
261 
+export default {
262 
+  name: 'pagination',
263 
+  params: {
264 
+    pagination: {
265 
+      el: null,
266 
+      bulletElement: 'span',
267 
+      clickable: false,
268 
+      hideOnClick: false,
269 
+      renderBullet: null,
270 
+      renderProgressbar: null,
271 
+      renderFraction: null,
272 
+      renderCustom: null,
273 
+      progressbarOpposite: false,
274 
+      type: 'bullets', // 'bullets' or 'progressbar' or 'fraction' or 'custom'
275 
+      dynamicBullets: false,
276 
+      dynamicMainBullets: 1,
277 
+      formatFractionCurrent: (number) => number,
278 
+      formatFractionTotal: (number) => number,
279 
+      bulletClass: 'swiper-pagination-bullet',
280 
+      bulletActiveClass: 'swiper-pagination-bullet-active',
281 
+      modifierClass: 'swiper-pagination-', // NEW
282 
+      currentClass: 'swiper-pagination-current',
283 
+      totalClass: 'swiper-pagination-total',
284 
+      hiddenClass: 'swiper-pagination-hidden',
285 
+      progressbarFillClass: 'swiper-pagination-progressbar-fill',
286 
+      progressbarOppositeClass: 'swiper-pagination-progressbar-opposite',
287 
+      clickableClass: 'swiper-pagination-clickable', // NEW
288 
+      lockClass: 'swiper-pagination-lock',
289 
+    },
290 
+  },
291 
+  create() {
292 
+    const swiper = this;
293 
+    Utils.extend(swiper, {
294 
+      pagination: {
295 
+        init: Pagination.init.bind(swiper),
296 
+        render: Pagination.render.bind(swiper),
297 
+        update: Pagination.update.bind(swiper),
298 
+        destroy: Pagination.destroy.bind(swiper),
299 
+        dynamicBulletIndex: 0,
300 
+      },
301 
+    });
302 
+  },
303 
+  on: {
304 
+    init() {
305 
+      const swiper = this;
306 
+      swiper.pagination.init();
307 
+      swiper.pagination.render();
308 
+      swiper.pagination.update();
309 
+    },
310 
+    activeIndexChange() {
311 
+      const swiper = this;
312 
+      if (swiper.params.loop) {
313 
+        swiper.pagination.update();
314 
+      } else if (typeof swiper.snapIndex === 'undefined') {
315 
+        swiper.pagination.update();
316 
+      }
317 
+    },
318 
+    snapIndexChange() {
319 
+      const swiper = this;
320 
+      if (!swiper.params.loop) {
321 
+        swiper.pagination.update();
322 
+      }
323 
+    },
324 
+    slidesLengthChange() {
325 
+      const swiper = this;
326 
+      if (swiper.params.loop) {
327 
+        swiper.pagination.render();
328 
+        swiper.pagination.update();
329 
+      }
330 
+    },
331 
+    snapGridLengthChange() {
332 
+      const swiper = this;
333 
+      if (!swiper.params.loop) {
334 
+        swiper.pagination.render();
335 
+        swiper.pagination.update();
336 
+      }
337 
+    },
338 
+    destroy() {
339 
+      const swiper = this;
340 
+      swiper.pagination.destroy();
341 
+    },
342 
+    click(e) {
343 
+      const swiper = this;
344 
+      if (
345 
+        swiper.params.pagination.el
346 
+        && swiper.params.pagination.hideOnClick
347 
+        && swiper.pagination.$el.length > 0
348 
+        && !$(e.target).hasClass(swiper.params.pagination.bulletClass)
349 
+      ) {
350 
+        const isHidden = swiper.pagination.$el.hasClass(swiper.params.pagination.hiddenClass);
351 
+        if (isHidden === true) {
352 
+          swiper.emit('paginationShow', swiper);
353 
+        } else {
354 
+          swiper.emit('paginationHide', swiper);
355 
+        }
356 
+        swiper.pagination.$el.toggleClass(swiper.params.pagination.hiddenClass);
357 
+      }
358 
+    },
359 
+  },
360 
+};