1 | import { template as _$template } from "solid-js/web";
|
2 | import { effect as _$effect } from "solid-js/web";
|
3 |
|
4 | const _tmpl$ = _$template(`<div></div>`, 2);
|
5 |
|
6 | import { calcLoopedSlides } from '../shared/calc-looped-slides.js';
|
7 |
|
8 | function renderLoop(swiper, slides, swiperParams) {
|
9 | const modifiedSlides = slides.map((child, index) => {
|
10 | const node = child.cloneNode(true);
|
11 | node.swiper = swiper;
|
12 | node['data-swiper-slide-index'] = index;
|
13 | return node;
|
14 | });
|
15 |
|
16 | function duplicateSlide(child, index, position) {
|
17 | const node = child.cloneNode(true);
|
18 | node.key = `${child.key}-duplicate-${index}-${position}`;
|
19 | node.className = `${child.className || ''} ${swiperParams.slideDuplicateClass}`;
|
20 | return node;
|
21 | }
|
22 |
|
23 | if (swiperParams.loopFillGroupWithBlank) {
|
24 | const blankSlidesNum = swiperParams.slidesPerGroup - modifiedSlides.length % swiperParams.slidesPerGroup;
|
25 |
|
26 | if (blankSlidesNum !== swiperParams.slidesPerGroup) {
|
27 | for (let i = 0; i < blankSlidesNum; i += 1) {
|
28 | const blankSlide =
|
29 | (() => {
|
30 | const _el$ = _tmpl$.cloneNode(true);
|
31 |
|
32 | _$effect(() => _el$.className = `${swiperParams.slideClass} ${swiperParams.slideBlankClass}`);
|
33 |
|
34 | return _el$;
|
35 | })();
|
36 |
|
37 | modifiedSlides.push(blankSlide);
|
38 | }
|
39 | }
|
40 | }
|
41 |
|
42 | if (swiperParams.slidesPerView === 'auto' && !swiperParams.loopedSlides) {
|
43 | swiperParams.loopedSlides = modifiedSlides.length;
|
44 | }
|
45 |
|
46 | const loopedSlides = calcLoopedSlides(modifiedSlides, swiperParams);
|
47 | const prependSlides = [];
|
48 | const appendSlides = [];
|
49 |
|
50 | for (let i = 0; i < loopedSlides; i += 1) {
|
51 | const index = i - Math.floor(i / modifiedSlides.length) * modifiedSlides.length;
|
52 | appendSlides.push(duplicateSlide(modifiedSlides[index], i, 'append'));
|
53 | prependSlides.unshift(duplicateSlide(modifiedSlides[modifiedSlides.length - index - 1], i, 'prepend'));
|
54 | }
|
55 |
|
56 | if (swiper) {
|
57 | swiper.loopedSlides = loopedSlides;
|
58 | }
|
59 |
|
60 | return [...prependSlides, ...modifiedSlides, ...appendSlides];
|
61 | }
|
62 |
|
63 | export { calcLoopedSlides, renderLoop }; |
\ | No newline at end of file |