first commit
This commit is contained in:
@@ -0,0 +1,43 @@
|
||||
import { isObject } from './utils';
|
||||
import { paramsList } from './params-list';
|
||||
|
||||
function getChangedParams(swiperParams, oldParams) {
|
||||
var keys = [];
|
||||
if (!oldParams) return keys;
|
||||
|
||||
var addKey = function addKey(key) {
|
||||
if (keys.indexOf(key) < 0) keys.push(key);
|
||||
};
|
||||
|
||||
var watchParams = paramsList.filter(function (key) {
|
||||
return key[0] === '_';
|
||||
}).map(function (key) {
|
||||
return key.replace(/_/, '');
|
||||
});
|
||||
watchParams.forEach(function (key) {
|
||||
if (key in swiperParams && key in oldParams) {
|
||||
if (isObject(swiperParams[key]) && isObject(oldParams[key])) {
|
||||
var newKeys = Object.keys(swiperParams[key]);
|
||||
var oldKeys = Object.keys(oldParams[key]);
|
||||
|
||||
if (newKeys.length !== oldKeys.length) {
|
||||
addKey(key);
|
||||
} else {
|
||||
newKeys.forEach(function (newKey) {
|
||||
if (swiperParams[key][newKey] !== oldParams[key][newKey]) {
|
||||
addKey(key);
|
||||
}
|
||||
});
|
||||
oldKeys.forEach(function (oldKey) {
|
||||
if (swiperParams[key][oldKey] !== oldParams[key][oldKey]) addKey(key);
|
||||
});
|
||||
}
|
||||
} else if (swiperParams[key] !== oldParams[key]) {
|
||||
addKey(key);
|
||||
}
|
||||
}
|
||||
});
|
||||
return keys;
|
||||
}
|
||||
|
||||
export { getChangedParams };
|
||||
@@ -0,0 +1,51 @@
|
||||
// eslint-disable-next-line
|
||||
import Swiper from '../../core';
|
||||
import { isObject, extend } from './utils';
|
||||
import { paramsList } from './params-list';
|
||||
|
||||
function getParams(obj) {
|
||||
if (obj === void 0) {
|
||||
obj = {};
|
||||
}
|
||||
|
||||
var params = {
|
||||
on: {}
|
||||
};
|
||||
var passedParams = {};
|
||||
extend(params, Swiper.defaults);
|
||||
extend(params, Swiper.extendedDefaults);
|
||||
params._emitClasses = true;
|
||||
params.init = false;
|
||||
var rest = {};
|
||||
var allowedParams = paramsList.map(function (key) {
|
||||
return key.replace(/_/, '');
|
||||
});
|
||||
Object.keys(obj).forEach(function (key) {
|
||||
if (allowedParams.indexOf(key) >= 0) {
|
||||
if (isObject(obj[key])) {
|
||||
params[key] = {};
|
||||
passedParams[key] = {};
|
||||
extend(params[key], obj[key]);
|
||||
extend(passedParams[key], obj[key]);
|
||||
} else {
|
||||
params[key] = obj[key];
|
||||
passedParams[key] = obj[key];
|
||||
}
|
||||
} else if (key.search(/on[A-Z]/) === 0 && typeof obj[key] === 'function') {
|
||||
params.on["" + key[2].toLowerCase() + key.substr(3)] = obj[key];
|
||||
} else {
|
||||
rest[key] = obj[key];
|
||||
}
|
||||
});
|
||||
['navigation', 'pagination', 'scrollbar'].forEach(function (key) {
|
||||
if (params[key] === true) params[key] = {};
|
||||
if (params[key] === false) delete params[key];
|
||||
});
|
||||
return {
|
||||
params: params,
|
||||
passedParams: passedParams,
|
||||
rest: rest
|
||||
};
|
||||
}
|
||||
|
||||
export { getParams };
|
||||
@@ -0,0 +1,38 @@
|
||||
// eslint-disable-next-line
|
||||
import Swiper from '../../core';
|
||||
import { needsNavigation, needsPagination, needsScrollbar } from './utils';
|
||||
|
||||
function initSwiper(swiperParams, modules) {
|
||||
if (modules) Swiper.use(modules);
|
||||
return new Swiper(swiperParams);
|
||||
}
|
||||
|
||||
function mountSwiper(_ref, swiperParams) {
|
||||
var el = _ref.el,
|
||||
nextEl = _ref.nextEl,
|
||||
prevEl = _ref.prevEl,
|
||||
paginationEl = _ref.paginationEl,
|
||||
scrollbarEl = _ref.scrollbarEl,
|
||||
swiper = _ref.swiper;
|
||||
|
||||
if (needsNavigation(swiperParams) && nextEl && prevEl) {
|
||||
swiper.params.navigation.nextEl = nextEl;
|
||||
swiper.originalParams.navigation.nextEl = nextEl;
|
||||
swiper.params.navigation.prevEl = prevEl;
|
||||
swiper.originalParams.navigation.prevEl = prevEl;
|
||||
}
|
||||
|
||||
if (needsPagination(swiperParams) && paginationEl) {
|
||||
swiper.params.pagination.el = paginationEl;
|
||||
swiper.originalParams.pagination.el = paginationEl;
|
||||
}
|
||||
|
||||
if (needsScrollbar(swiperParams) && scrollbarEl) {
|
||||
swiper.params.scrollbar.el = scrollbarEl;
|
||||
swiper.originalParams.scrollbar.el = scrollbarEl;
|
||||
}
|
||||
|
||||
swiper.init(el);
|
||||
}
|
||||
|
||||
export { initSwiper, mountSwiper };
|
||||
@@ -0,0 +1,4 @@
|
||||
/* underscore in name -> watch for changes */
|
||||
var paramsList = ['init', '_direction', 'touchEventsTarget', 'initialSlide', '_speed', 'cssMode', 'updateOnWindowResize', 'resizeObserver', 'nested', 'focusableElements', '_enabled', '_width', '_height', 'preventInteractionOnTransition', 'userAgent', 'url', '_edgeSwipeDetection', '_edgeSwipeThreshold', '_freeMode', '_freeModeMomentum', '_freeModeMomentumRatio', '_freeModeMomentumBounce', '_freeModeMomentumBounceRatio', '_freeModeMomentumVelocityRatio', '_freeModeSticky', '_freeModeMinimumVelocity', '_autoHeight', 'setWrapperSize', 'virtualTranslate', '_effect', 'breakpoints', '_spaceBetween', '_slidesPerView', '_slidesPerColumn', '_slidesPerColumnFill', '_slidesPerGroup', '_slidesPerGroupSkip', '_centeredSlides', '_centeredSlidesBounds', '_slidesOffsetBefore', '_slidesOffsetAfter', 'normalizeSlideIndex', '_centerInsufficientSlides', '_watchOverflow', 'roundLengths', 'touchRatio', 'touchAngle', 'simulateTouch', '_shortSwipes', '_longSwipes', 'longSwipesRatio', 'longSwipesMs', '_followFinger', 'allowTouchMove', '_threshold', 'touchMoveStopPropagation', 'touchStartPreventDefault', 'touchStartForcePreventDefault', 'touchReleaseOnEdges', 'uniqueNavElements', '_resistance', '_resistanceRatio', '_watchSlidesProgress', '_watchSlidesVisibility', '_grabCursor', 'preventClicks', 'preventClicksPropagation', '_slideToClickedSlide', '_preloadImages', 'updateOnImagesReady', '_loop', '_loopAdditionalSlides', '_loopedSlides', '_loopFillGroupWithBlank', 'loopPreventsSlide', '_allowSlidePrev', '_allowSlideNext', '_swipeHandler', '_noSwiping', 'noSwipingClass', 'noSwipingSelector', 'passiveListeners', 'containerModifierClass', 'slideClass', 'slideBlankClass', 'slideActiveClass', 'slideDuplicateActiveClass', 'slideVisibleClass', 'slideDuplicateClass', 'slideNextClass', 'slideDuplicateNextClass', 'slidePrevClass', 'slideDuplicatePrevClass', 'wrapperClass', 'runCallbacksOnInit', 'observer', 'observeParents', 'observeSlideChildren', // modules
|
||||
'a11y', 'autoplay', '_controller', 'coverflowEffect', 'cubeEffect', 'fadeEffect', 'flipEffect', 'hashNavigation', 'history', 'keyboard', 'lazy', 'mousewheel', '_navigation', '_pagination', 'parallax', '_scrollbar', '_thumbs', '_virtual', 'zoom'];
|
||||
export { paramsList };
|
||||
@@ -0,0 +1,341 @@
|
||||
/* swiper.svelte generated by Svelte v3.38.2 */
|
||||
import {
|
||||
SvelteComponent,
|
||||
assign,
|
||||
attr,
|
||||
binding_callbacks,
|
||||
check_outros,
|
||||
compute_rest_props,
|
||||
create_slot,
|
||||
detach,
|
||||
element,
|
||||
exclude_internal_props,
|
||||
get_spread_update,
|
||||
group_outros,
|
||||
init,
|
||||
insert,
|
||||
safe_not_equal,
|
||||
set_attributes,
|
||||
transition_in,
|
||||
transition_out,
|
||||
update_slot
|
||||
} from "svelte/internal";
|
||||
|
||||
import { onMount, onDestroy, beforeUpdate, afterUpdate, tick } from "svelte";
|
||||
import { uniqueClasses } from "./utils";
|
||||
const get_default_slot_changes_1 = dirty => ({ data: dirty & /*slideData*/ 32 });
|
||||
const get_default_slot_context_1 = ctx => ({ data: /*slideData*/ ctx[5] });
|
||||
const get_default_slot_changes = dirty => ({ data: dirty & /*slideData*/ 32 });
|
||||
const get_default_slot_context = ctx => ({ data: /*slideData*/ ctx[5] });
|
||||
|
||||
// (92:2) {:else}
|
||||
function create_else_block(ctx) {
|
||||
let current;
|
||||
const default_slot_template = /*#slots*/ ctx[8].default;
|
||||
const default_slot = create_slot(default_slot_template, ctx, /*$$scope*/ ctx[7], get_default_slot_context_1);
|
||||
|
||||
return {
|
||||
c() {
|
||||
if (default_slot) default_slot.c();
|
||||
},
|
||||
m(target, anchor) {
|
||||
if (default_slot) {
|
||||
default_slot.m(target, anchor);
|
||||
}
|
||||
|
||||
current = true;
|
||||
},
|
||||
p(ctx, dirty) {
|
||||
if (default_slot) {
|
||||
if (default_slot.p && (!current || dirty & /*$$scope, slideData*/ 160)) {
|
||||
update_slot(default_slot, default_slot_template, ctx, /*$$scope*/ ctx[7], dirty, get_default_slot_changes_1, get_default_slot_context_1);
|
||||
}
|
||||
}
|
||||
},
|
||||
i(local) {
|
||||
if (current) return;
|
||||
transition_in(default_slot, local);
|
||||
current = true;
|
||||
},
|
||||
o(local) {
|
||||
transition_out(default_slot, local);
|
||||
current = false;
|
||||
},
|
||||
d(detaching) {
|
||||
if (default_slot) default_slot.d(detaching);
|
||||
}
|
||||
};
|
||||
}
|
||||
|
||||
// (85:2) {#if zoom}
|
||||
function create_if_block(ctx) {
|
||||
let div;
|
||||
let div_data_swiper_zoom_value;
|
||||
let current;
|
||||
const default_slot_template = /*#slots*/ ctx[8].default;
|
||||
const default_slot = create_slot(default_slot_template, ctx, /*$$scope*/ ctx[7], get_default_slot_context);
|
||||
|
||||
return {
|
||||
c() {
|
||||
div = element("div");
|
||||
if (default_slot) default_slot.c();
|
||||
attr(div, "class", "swiper-zoom-container");
|
||||
|
||||
attr(div, "data-swiper-zoom", div_data_swiper_zoom_value = typeof /*zoom*/ ctx[0] === "number"
|
||||
? /*zoom*/ ctx[0]
|
||||
: undefined);
|
||||
},
|
||||
m(target, anchor) {
|
||||
insert(target, div, anchor);
|
||||
|
||||
if (default_slot) {
|
||||
default_slot.m(div, null);
|
||||
}
|
||||
|
||||
current = true;
|
||||
},
|
||||
p(ctx, dirty) {
|
||||
if (default_slot) {
|
||||
if (default_slot.p && (!current || dirty & /*$$scope, slideData*/ 160)) {
|
||||
update_slot(default_slot, default_slot_template, ctx, /*$$scope*/ ctx[7], dirty, get_default_slot_changes, get_default_slot_context);
|
||||
}
|
||||
}
|
||||
|
||||
if (!current || dirty & /*zoom*/ 1 && div_data_swiper_zoom_value !== (div_data_swiper_zoom_value = typeof /*zoom*/ ctx[0] === "number"
|
||||
? /*zoom*/ ctx[0]
|
||||
: undefined)) {
|
||||
attr(div, "data-swiper-zoom", div_data_swiper_zoom_value);
|
||||
}
|
||||
},
|
||||
i(local) {
|
||||
if (current) return;
|
||||
transition_in(default_slot, local);
|
||||
current = true;
|
||||
},
|
||||
o(local) {
|
||||
transition_out(default_slot, local);
|
||||
current = false;
|
||||
},
|
||||
d(detaching) {
|
||||
if (detaching) detach(div);
|
||||
if (default_slot) default_slot.d(detaching);
|
||||
}
|
||||
};
|
||||
}
|
||||
|
||||
function create_fragment(ctx) {
|
||||
let div;
|
||||
let current_block_type_index;
|
||||
let if_block;
|
||||
let div_class_value;
|
||||
let current;
|
||||
const if_block_creators = [create_if_block, create_else_block];
|
||||
const if_blocks = [];
|
||||
|
||||
function select_block_type(ctx, dirty) {
|
||||
if (/*zoom*/ ctx[0]) return 0;
|
||||
return 1;
|
||||
}
|
||||
|
||||
current_block_type_index = select_block_type(ctx, -1);
|
||||
if_block = if_blocks[current_block_type_index] = if_block_creators[current_block_type_index](ctx);
|
||||
|
||||
let div_levels = [
|
||||
{
|
||||
class: div_class_value = uniqueClasses(`${/*slideClasses*/ ctx[3]}${/*className*/ ctx[2] ? ` ${/*className*/ ctx[2]}` : ""}`)
|
||||
},
|
||||
{
|
||||
"data-swiper-slide-index": /*virtualIndex*/ ctx[1]
|
||||
},
|
||||
/*$$restProps*/ ctx[6]
|
||||
];
|
||||
|
||||
let div_data = {};
|
||||
|
||||
for (let i = 0; i < div_levels.length; i += 1) {
|
||||
div_data = assign(div_data, div_levels[i]);
|
||||
}
|
||||
|
||||
return {
|
||||
c() {
|
||||
div = element("div");
|
||||
if_block.c();
|
||||
set_attributes(div, div_data);
|
||||
},
|
||||
m(target, anchor) {
|
||||
insert(target, div, anchor);
|
||||
if_blocks[current_block_type_index].m(div, null);
|
||||
/*div_binding*/ ctx[9](div);
|
||||
current = true;
|
||||
},
|
||||
p(ctx, [dirty]) {
|
||||
let previous_block_index = current_block_type_index;
|
||||
current_block_type_index = select_block_type(ctx, dirty);
|
||||
|
||||
if (current_block_type_index === previous_block_index) {
|
||||
if_blocks[current_block_type_index].p(ctx, dirty);
|
||||
} else {
|
||||
group_outros();
|
||||
|
||||
transition_out(if_blocks[previous_block_index], 1, 1, () => {
|
||||
if_blocks[previous_block_index] = null;
|
||||
});
|
||||
|
||||
check_outros();
|
||||
if_block = if_blocks[current_block_type_index];
|
||||
|
||||
if (!if_block) {
|
||||
if_block = if_blocks[current_block_type_index] = if_block_creators[current_block_type_index](ctx);
|
||||
if_block.c();
|
||||
} else {
|
||||
if_block.p(ctx, dirty);
|
||||
}
|
||||
|
||||
transition_in(if_block, 1);
|
||||
if_block.m(div, null);
|
||||
}
|
||||
|
||||
set_attributes(div, div_data = get_spread_update(div_levels, [
|
||||
(!current || dirty & /*slideClasses, className*/ 12 && div_class_value !== (div_class_value = uniqueClasses(`${/*slideClasses*/ ctx[3]}${/*className*/ ctx[2] ? ` ${/*className*/ ctx[2]}` : ""}`))) && { class: div_class_value },
|
||||
(!current || dirty & /*virtualIndex*/ 2) && {
|
||||
"data-swiper-slide-index": /*virtualIndex*/ ctx[1]
|
||||
},
|
||||
dirty & /*$$restProps*/ 64 && /*$$restProps*/ ctx[6]
|
||||
]));
|
||||
},
|
||||
i(local) {
|
||||
if (current) return;
|
||||
transition_in(if_block);
|
||||
current = true;
|
||||
},
|
||||
o(local) {
|
||||
transition_out(if_block);
|
||||
current = false;
|
||||
},
|
||||
d(detaching) {
|
||||
if (detaching) detach(div);
|
||||
if_blocks[current_block_type_index].d();
|
||||
/*div_binding*/ ctx[9](null);
|
||||
}
|
||||
};
|
||||
}
|
||||
|
||||
function instance($$self, $$props, $$invalidate) {
|
||||
let slideData;
|
||||
const omit_props_names = ["zoom","virtualIndex","class"];
|
||||
let $$restProps = compute_rest_props($$props, omit_props_names);
|
||||
let { $$slots: slots = {}, $$scope } = $$props;
|
||||
let { zoom = undefined } = $$props;
|
||||
let { virtualIndex = undefined } = $$props;
|
||||
let { class: className = undefined } = $$props;
|
||||
let slideEl = null;
|
||||
let slideClasses = "swiper-slide";
|
||||
let swiper = null;
|
||||
let eventAttached = false;
|
||||
|
||||
const updateClasses = (_, el, classNames) => {
|
||||
if (el === slideEl) {
|
||||
$$invalidate(3, slideClasses = classNames);
|
||||
}
|
||||
};
|
||||
|
||||
const attachEvent = () => {
|
||||
if (!swiper || eventAttached) return;
|
||||
swiper.on("_slideClass", updateClasses);
|
||||
eventAttached = true;
|
||||
};
|
||||
|
||||
const detachEvent = () => {
|
||||
if (!swiper) return;
|
||||
swiper.off("_slideClass", updateClasses);
|
||||
eventAttached = false;
|
||||
};
|
||||
|
||||
onMount(() => {
|
||||
if (typeof virtualIndex === "undefined") return;
|
||||
|
||||
$$invalidate(
|
||||
4,
|
||||
slideEl.onSwiper = _swiper => {
|
||||
swiper = _swiper;
|
||||
attachEvent();
|
||||
},
|
||||
slideEl
|
||||
);
|
||||
|
||||
attachEvent();
|
||||
});
|
||||
|
||||
afterUpdate(() => {
|
||||
if (!slideEl || !swiper) return;
|
||||
|
||||
if (swiper.destroyed) {
|
||||
if (slideClasses !== "swiper-slide") {
|
||||
$$invalidate(3, slideClasses = "swiper-slide");
|
||||
}
|
||||
|
||||
return;
|
||||
}
|
||||
|
||||
attachEvent();
|
||||
});
|
||||
|
||||
beforeUpdate(() => {
|
||||
attachEvent();
|
||||
});
|
||||
|
||||
onDestroy(() => {
|
||||
if (!swiper) return;
|
||||
detachEvent();
|
||||
});
|
||||
|
||||
function div_binding($$value) {
|
||||
binding_callbacks[$$value ? "unshift" : "push"](() => {
|
||||
slideEl = $$value;
|
||||
$$invalidate(4, slideEl);
|
||||
});
|
||||
}
|
||||
|
||||
$$self.$$set = $$new_props => {
|
||||
$$props = assign(assign({}, $$props), exclude_internal_props($$new_props));
|
||||
$$invalidate(6, $$restProps = compute_rest_props($$props, omit_props_names));
|
||||
if ("zoom" in $$new_props) $$invalidate(0, zoom = $$new_props.zoom);
|
||||
if ("virtualIndex" in $$new_props) $$invalidate(1, virtualIndex = $$new_props.virtualIndex);
|
||||
if ("class" in $$new_props) $$invalidate(2, className = $$new_props.class);
|
||||
if ("$$scope" in $$new_props) $$invalidate(7, $$scope = $$new_props.$$scope);
|
||||
};
|
||||
|
||||
$$self.$$.update = () => {
|
||||
if ($$self.$$.dirty & /*slideClasses*/ 8) {
|
||||
$: $$invalidate(5, slideData = {
|
||||
isActive: slideClasses.indexOf("swiper-slide-active") >= 0 || slideClasses.indexOf("swiper-slide-duplicate-active") >= 0,
|
||||
isVisible: slideClasses.indexOf("swiper-slide-visible") >= 0,
|
||||
isDuplicate: slideClasses.indexOf("swiper-slide-duplicate") >= 0,
|
||||
isPrev: slideClasses.indexOf("swiper-slide-prev") >= 0 || slideClasses.indexOf("swiper-slide-duplicate-prev") >= 0,
|
||||
isNext: slideClasses.indexOf("swiper-slide-next") >= 0 || slideClasses.indexOf("swiper-slide-duplicate-next") >= 0
|
||||
});
|
||||
}
|
||||
};
|
||||
|
||||
return [
|
||||
zoom,
|
||||
virtualIndex,
|
||||
className,
|
||||
slideClasses,
|
||||
slideEl,
|
||||
slideData,
|
||||
$$restProps,
|
||||
$$scope,
|
||||
slots,
|
||||
div_binding
|
||||
];
|
||||
}
|
||||
|
||||
class Swiper extends SvelteComponent {
|
||||
constructor(options) {
|
||||
super();
|
||||
init(this, options, instance, create_fragment, safe_not_equal, { zoom: 0, virtualIndex: 1, class: 2 });
|
||||
}
|
||||
}
|
||||
|
||||
export default Swiper;
|
||||
@@ -0,0 +1,95 @@
|
||||
<script>
|
||||
import { onMount, onDestroy, beforeUpdate, afterUpdate, tick } from 'svelte';
|
||||
import { uniqueClasses } from './utils';
|
||||
|
||||
export let zoom = undefined;
|
||||
export let virtualIndex = undefined;
|
||||
|
||||
let className = undefined;
|
||||
export { className as class };
|
||||
|
||||
let slideEl = null;
|
||||
let slideClasses = 'swiper-slide';
|
||||
|
||||
let swiper = null;
|
||||
let eventAttached = false;
|
||||
|
||||
const updateClasses = (_, el, classNames) => {
|
||||
if (el === slideEl) {
|
||||
slideClasses = classNames;
|
||||
}
|
||||
};
|
||||
|
||||
const attachEvent = () => {
|
||||
if (!swiper || eventAttached) return;
|
||||
swiper.on('_slideClass', updateClasses);
|
||||
eventAttached = true;
|
||||
};
|
||||
|
||||
const detachEvent = () => {
|
||||
if (!swiper) return;
|
||||
swiper.off('_slideClass', updateClasses);
|
||||
eventAttached = false;
|
||||
};
|
||||
|
||||
$: slideData = {
|
||||
isActive:
|
||||
slideClasses.indexOf('swiper-slide-active') >= 0 ||
|
||||
slideClasses.indexOf('swiper-slide-duplicate-active') >= 0,
|
||||
isVisible: slideClasses.indexOf('swiper-slide-visible') >= 0,
|
||||
isDuplicate: slideClasses.indexOf('swiper-slide-duplicate') >= 0,
|
||||
isPrev:
|
||||
slideClasses.indexOf('swiper-slide-prev') >= 0 ||
|
||||
slideClasses.indexOf('swiper-slide-duplicate-prev') >= 0,
|
||||
isNext:
|
||||
slideClasses.indexOf('swiper-slide-next') >= 0 ||
|
||||
slideClasses.indexOf('swiper-slide-duplicate-next') >= 0,
|
||||
};
|
||||
|
||||
onMount(() => {
|
||||
if (typeof virtualIndex === 'undefined') return;
|
||||
slideEl.onSwiper = (_swiper) => {
|
||||
swiper = _swiper;
|
||||
attachEvent();
|
||||
};
|
||||
attachEvent();
|
||||
});
|
||||
|
||||
afterUpdate(() => {
|
||||
if (!slideEl || !swiper) return;
|
||||
if (swiper.destroyed) {
|
||||
if (slideClasses !== 'swiper-slide') {
|
||||
slideClasses = 'swiper-slide';
|
||||
}
|
||||
return;
|
||||
}
|
||||
attachEvent();
|
||||
});
|
||||
|
||||
beforeUpdate(() => {
|
||||
attachEvent();
|
||||
});
|
||||
|
||||
onDestroy(() => {
|
||||
if (!swiper) return;
|
||||
detachEvent();
|
||||
});
|
||||
</script>
|
||||
|
||||
<div
|
||||
bind:this={slideEl}
|
||||
class={uniqueClasses(`${slideClasses}${className ? ` ${className}` : ''}`)}
|
||||
data-swiper-slide-index={virtualIndex}
|
||||
{...$$restProps}
|
||||
>
|
||||
{#if zoom}
|
||||
<div
|
||||
class="swiper-zoom-container"
|
||||
data-swiper-zoom={typeof zoom === 'number' ? zoom : undefined}
|
||||
>
|
||||
<slot data={slideData} />
|
||||
</div>
|
||||
{:else}
|
||||
<slot data={slideData} />
|
||||
{/if}
|
||||
</div>
|
||||
@@ -0,0 +1,565 @@
|
||||
/* swiper.svelte generated by Svelte v3.38.2 */
|
||||
import {
|
||||
SvelteComponent,
|
||||
append,
|
||||
assign,
|
||||
attr,
|
||||
binding_callbacks,
|
||||
compute_rest_props,
|
||||
create_slot,
|
||||
detach,
|
||||
element,
|
||||
exclude_internal_props,
|
||||
get_spread_update,
|
||||
init,
|
||||
insert,
|
||||
noop,
|
||||
safe_not_equal,
|
||||
set_attributes,
|
||||
space,
|
||||
transition_in,
|
||||
transition_out,
|
||||
update_slot
|
||||
} from "svelte/internal";
|
||||
|
||||
import {
|
||||
onMount,
|
||||
onDestroy,
|
||||
afterUpdate,
|
||||
createEventDispatcher,
|
||||
tick,
|
||||
beforeUpdate
|
||||
} from "svelte";
|
||||
|
||||
import { getParams } from "./get-params";
|
||||
import { initSwiper, mountSwiper } from "./init-swiper";
|
||||
|
||||
import {
|
||||
needsScrollbar,
|
||||
needsNavigation,
|
||||
needsPagination,
|
||||
uniqueClasses,
|
||||
extend
|
||||
} from "./utils";
|
||||
|
||||
import { getChangedParams } from "./get-changed-params";
|
||||
import { updateSwiper } from "./update-swiper";
|
||||
const get_container_end_slot_changes = dirty => ({ virtualData: dirty & /*virtualData*/ 512 });
|
||||
const get_container_end_slot_context = ctx => ({ virtualData: /*virtualData*/ ctx[9] });
|
||||
const get_wrapper_end_slot_changes = dirty => ({ virtualData: dirty & /*virtualData*/ 512 });
|
||||
const get_wrapper_end_slot_context = ctx => ({ virtualData: /*virtualData*/ ctx[9] });
|
||||
const get_default_slot_changes = dirty => ({ virtualData: dirty & /*virtualData*/ 512 });
|
||||
const get_default_slot_context = ctx => ({ virtualData: /*virtualData*/ ctx[9] });
|
||||
const get_wrapper_start_slot_changes = dirty => ({ virtualData: dirty & /*virtualData*/ 512 });
|
||||
const get_wrapper_start_slot_context = ctx => ({ virtualData: /*virtualData*/ ctx[9] });
|
||||
const get_container_start_slot_changes = dirty => ({ virtualData: dirty & /*virtualData*/ 512 });
|
||||
const get_container_start_slot_context = ctx => ({ virtualData: /*virtualData*/ ctx[9] });
|
||||
|
||||
// (156:2) {#if needsNavigation(swiperParams)}
|
||||
function create_if_block_2(ctx) {
|
||||
let div0;
|
||||
let t;
|
||||
let div1;
|
||||
|
||||
return {
|
||||
c() {
|
||||
div0 = element("div");
|
||||
t = space();
|
||||
div1 = element("div");
|
||||
attr(div0, "class", "swiper-button-prev");
|
||||
attr(div1, "class", "swiper-button-next");
|
||||
},
|
||||
m(target, anchor) {
|
||||
insert(target, div0, anchor);
|
||||
/*div0_binding*/ ctx[14](div0);
|
||||
insert(target, t, anchor);
|
||||
insert(target, div1, anchor);
|
||||
/*div1_binding*/ ctx[15](div1);
|
||||
},
|
||||
p: noop,
|
||||
d(detaching) {
|
||||
if (detaching) detach(div0);
|
||||
/*div0_binding*/ ctx[14](null);
|
||||
if (detaching) detach(t);
|
||||
if (detaching) detach(div1);
|
||||
/*div1_binding*/ ctx[15](null);
|
||||
}
|
||||
};
|
||||
}
|
||||
|
||||
// (160:2) {#if needsScrollbar(swiperParams)}
|
||||
function create_if_block_1(ctx) {
|
||||
let div;
|
||||
|
||||
return {
|
||||
c() {
|
||||
div = element("div");
|
||||
attr(div, "class", "swiper-scrollbar");
|
||||
},
|
||||
m(target, anchor) {
|
||||
insert(target, div, anchor);
|
||||
/*div_binding*/ ctx[16](div);
|
||||
},
|
||||
p: noop,
|
||||
d(detaching) {
|
||||
if (detaching) detach(div);
|
||||
/*div_binding*/ ctx[16](null);
|
||||
}
|
||||
};
|
||||
}
|
||||
|
||||
// (163:2) {#if needsPagination(swiperParams)}
|
||||
function create_if_block(ctx) {
|
||||
let div;
|
||||
|
||||
return {
|
||||
c() {
|
||||
div = element("div");
|
||||
attr(div, "class", "swiper-pagination");
|
||||
},
|
||||
m(target, anchor) {
|
||||
insert(target, div, anchor);
|
||||
/*div_binding_1*/ ctx[17](div);
|
||||
},
|
||||
p: noop,
|
||||
d(detaching) {
|
||||
if (detaching) detach(div);
|
||||
/*div_binding_1*/ ctx[17](null);
|
||||
}
|
||||
};
|
||||
}
|
||||
|
||||
function create_fragment(ctx) {
|
||||
let div1;
|
||||
let t0;
|
||||
let show_if_2 = needsNavigation(/*swiperParams*/ ctx[2]);
|
||||
let t1;
|
||||
let show_if_1 = needsScrollbar(/*swiperParams*/ ctx[2]);
|
||||
let t2;
|
||||
let show_if = needsPagination(/*swiperParams*/ ctx[2]);
|
||||
let t3;
|
||||
let div0;
|
||||
let t4;
|
||||
let t5;
|
||||
let t6;
|
||||
let div1_class_value;
|
||||
let current;
|
||||
const container_start_slot_template = /*#slots*/ ctx[13]["container-start"];
|
||||
const container_start_slot = create_slot(container_start_slot_template, ctx, /*$$scope*/ ctx[12], get_container_start_slot_context);
|
||||
let if_block0 = show_if_2 && create_if_block_2(ctx);
|
||||
let if_block1 = show_if_1 && create_if_block_1(ctx);
|
||||
let if_block2 = show_if && create_if_block(ctx);
|
||||
const wrapper_start_slot_template = /*#slots*/ ctx[13]["wrapper-start"];
|
||||
const wrapper_start_slot = create_slot(wrapper_start_slot_template, ctx, /*$$scope*/ ctx[12], get_wrapper_start_slot_context);
|
||||
const default_slot_template = /*#slots*/ ctx[13].default;
|
||||
const default_slot = create_slot(default_slot_template, ctx, /*$$scope*/ ctx[12], get_default_slot_context);
|
||||
const wrapper_end_slot_template = /*#slots*/ ctx[13]["wrapper-end"];
|
||||
const wrapper_end_slot = create_slot(wrapper_end_slot_template, ctx, /*$$scope*/ ctx[12], get_wrapper_end_slot_context);
|
||||
const container_end_slot_template = /*#slots*/ ctx[13]["container-end"];
|
||||
const container_end_slot = create_slot(container_end_slot_template, ctx, /*$$scope*/ ctx[12], get_container_end_slot_context);
|
||||
|
||||
let div1_levels = [
|
||||
{
|
||||
class: div1_class_value = uniqueClasses(`${/*containerClasses*/ ctx[1]}${/*className*/ ctx[0] ? ` ${/*className*/ ctx[0]}` : ""}`)
|
||||
},
|
||||
/*restProps*/ ctx[3]
|
||||
];
|
||||
|
||||
let div1_data = {};
|
||||
|
||||
for (let i = 0; i < div1_levels.length; i += 1) {
|
||||
div1_data = assign(div1_data, div1_levels[i]);
|
||||
}
|
||||
|
||||
return {
|
||||
c() {
|
||||
div1 = element("div");
|
||||
if (container_start_slot) container_start_slot.c();
|
||||
t0 = space();
|
||||
if (if_block0) if_block0.c();
|
||||
t1 = space();
|
||||
if (if_block1) if_block1.c();
|
||||
t2 = space();
|
||||
if (if_block2) if_block2.c();
|
||||
t3 = space();
|
||||
div0 = element("div");
|
||||
if (wrapper_start_slot) wrapper_start_slot.c();
|
||||
t4 = space();
|
||||
if (default_slot) default_slot.c();
|
||||
t5 = space();
|
||||
if (wrapper_end_slot) wrapper_end_slot.c();
|
||||
t6 = space();
|
||||
if (container_end_slot) container_end_slot.c();
|
||||
attr(div0, "class", "swiper-wrapper");
|
||||
set_attributes(div1, div1_data);
|
||||
},
|
||||
m(target, anchor) {
|
||||
insert(target, div1, anchor);
|
||||
|
||||
if (container_start_slot) {
|
||||
container_start_slot.m(div1, null);
|
||||
}
|
||||
|
||||
append(div1, t0);
|
||||
if (if_block0) if_block0.m(div1, null);
|
||||
append(div1, t1);
|
||||
if (if_block1) if_block1.m(div1, null);
|
||||
append(div1, t2);
|
||||
if (if_block2) if_block2.m(div1, null);
|
||||
append(div1, t3);
|
||||
append(div1, div0);
|
||||
|
||||
if (wrapper_start_slot) {
|
||||
wrapper_start_slot.m(div0, null);
|
||||
}
|
||||
|
||||
append(div0, t4);
|
||||
|
||||
if (default_slot) {
|
||||
default_slot.m(div0, null);
|
||||
}
|
||||
|
||||
append(div0, t5);
|
||||
|
||||
if (wrapper_end_slot) {
|
||||
wrapper_end_slot.m(div0, null);
|
||||
}
|
||||
|
||||
append(div1, t6);
|
||||
|
||||
if (container_end_slot) {
|
||||
container_end_slot.m(div1, null);
|
||||
}
|
||||
|
||||
/*div1_binding_1*/ ctx[18](div1);
|
||||
current = true;
|
||||
},
|
||||
p(ctx, [dirty]) {
|
||||
if (container_start_slot) {
|
||||
if (container_start_slot.p && (!current || dirty & /*$$scope, virtualData*/ 4608)) {
|
||||
update_slot(container_start_slot, container_start_slot_template, ctx, /*$$scope*/ ctx[12], dirty, get_container_start_slot_changes, get_container_start_slot_context);
|
||||
}
|
||||
}
|
||||
|
||||
if (dirty & /*swiperParams*/ 4) show_if_2 = needsNavigation(/*swiperParams*/ ctx[2]);
|
||||
|
||||
if (show_if_2) {
|
||||
if (if_block0) {
|
||||
if_block0.p(ctx, dirty);
|
||||
} else {
|
||||
if_block0 = create_if_block_2(ctx);
|
||||
if_block0.c();
|
||||
if_block0.m(div1, t1);
|
||||
}
|
||||
} else if (if_block0) {
|
||||
if_block0.d(1);
|
||||
if_block0 = null;
|
||||
}
|
||||
|
||||
if (dirty & /*swiperParams*/ 4) show_if_1 = needsScrollbar(/*swiperParams*/ ctx[2]);
|
||||
|
||||
if (show_if_1) {
|
||||
if (if_block1) {
|
||||
if_block1.p(ctx, dirty);
|
||||
} else {
|
||||
if_block1 = create_if_block_1(ctx);
|
||||
if_block1.c();
|
||||
if_block1.m(div1, t2);
|
||||
}
|
||||
} else if (if_block1) {
|
||||
if_block1.d(1);
|
||||
if_block1 = null;
|
||||
}
|
||||
|
||||
if (dirty & /*swiperParams*/ 4) show_if = needsPagination(/*swiperParams*/ ctx[2]);
|
||||
|
||||
if (show_if) {
|
||||
if (if_block2) {
|
||||
if_block2.p(ctx, dirty);
|
||||
} else {
|
||||
if_block2 = create_if_block(ctx);
|
||||
if_block2.c();
|
||||
if_block2.m(div1, t3);
|
||||
}
|
||||
} else if (if_block2) {
|
||||
if_block2.d(1);
|
||||
if_block2 = null;
|
||||
}
|
||||
|
||||
if (wrapper_start_slot) {
|
||||
if (wrapper_start_slot.p && (!current || dirty & /*$$scope, virtualData*/ 4608)) {
|
||||
update_slot(wrapper_start_slot, wrapper_start_slot_template, ctx, /*$$scope*/ ctx[12], dirty, get_wrapper_start_slot_changes, get_wrapper_start_slot_context);
|
||||
}
|
||||
}
|
||||
|
||||
if (default_slot) {
|
||||
if (default_slot.p && (!current || dirty & /*$$scope, virtualData*/ 4608)) {
|
||||
update_slot(default_slot, default_slot_template, ctx, /*$$scope*/ ctx[12], dirty, get_default_slot_changes, get_default_slot_context);
|
||||
}
|
||||
}
|
||||
|
||||
if (wrapper_end_slot) {
|
||||
if (wrapper_end_slot.p && (!current || dirty & /*$$scope, virtualData*/ 4608)) {
|
||||
update_slot(wrapper_end_slot, wrapper_end_slot_template, ctx, /*$$scope*/ ctx[12], dirty, get_wrapper_end_slot_changes, get_wrapper_end_slot_context);
|
||||
}
|
||||
}
|
||||
|
||||
if (container_end_slot) {
|
||||
if (container_end_slot.p && (!current || dirty & /*$$scope, virtualData*/ 4608)) {
|
||||
update_slot(container_end_slot, container_end_slot_template, ctx, /*$$scope*/ ctx[12], dirty, get_container_end_slot_changes, get_container_end_slot_context);
|
||||
}
|
||||
}
|
||||
|
||||
set_attributes(div1, div1_data = get_spread_update(div1_levels, [
|
||||
(!current || dirty & /*containerClasses, className*/ 3 && div1_class_value !== (div1_class_value = uniqueClasses(`${/*containerClasses*/ ctx[1]}${/*className*/ ctx[0] ? ` ${/*className*/ ctx[0]}` : ""}`))) && { class: div1_class_value },
|
||||
dirty & /*restProps*/ 8 && /*restProps*/ ctx[3]
|
||||
]));
|
||||
},
|
||||
i(local) {
|
||||
if (current) return;
|
||||
transition_in(container_start_slot, local);
|
||||
transition_in(wrapper_start_slot, local);
|
||||
transition_in(default_slot, local);
|
||||
transition_in(wrapper_end_slot, local);
|
||||
transition_in(container_end_slot, local);
|
||||
current = true;
|
||||
},
|
||||
o(local) {
|
||||
transition_out(container_start_slot, local);
|
||||
transition_out(wrapper_start_slot, local);
|
||||
transition_out(default_slot, local);
|
||||
transition_out(wrapper_end_slot, local);
|
||||
transition_out(container_end_slot, local);
|
||||
current = false;
|
||||
},
|
||||
d(detaching) {
|
||||
if (detaching) detach(div1);
|
||||
if (container_start_slot) container_start_slot.d(detaching);
|
||||
if (if_block0) if_block0.d();
|
||||
if (if_block1) if_block1.d();
|
||||
if (if_block2) if_block2.d();
|
||||
if (wrapper_start_slot) wrapper_start_slot.d(detaching);
|
||||
if (default_slot) default_slot.d(detaching);
|
||||
if (wrapper_end_slot) wrapper_end_slot.d(detaching);
|
||||
if (container_end_slot) container_end_slot.d(detaching);
|
||||
/*div1_binding_1*/ ctx[18](null);
|
||||
}
|
||||
};
|
||||
}
|
||||
|
||||
function instance($$self, $$props, $$invalidate) {
|
||||
const omit_props_names = ["class","modules","swiper"];
|
||||
let $$restProps = compute_rest_props($$props, omit_props_names);
|
||||
let { $$slots: slots = {}, $$scope } = $$props;
|
||||
const dispatch = createEventDispatcher();
|
||||
let { class: className = undefined } = $$props;
|
||||
let { modules = null } = $$props;
|
||||
let containerClasses = "swiper-container";
|
||||
let breakpointChanged = false;
|
||||
let swiperInstance = null;
|
||||
let oldPassedParams = null;
|
||||
let paramsData;
|
||||
let swiperParams;
|
||||
let passedParams;
|
||||
let restProps;
|
||||
let swiperEl = null;
|
||||
let prevEl = null;
|
||||
let nextEl = null;
|
||||
let scrollbarEl = null;
|
||||
let paginationEl = null;
|
||||
let virtualData = { slides: [] };
|
||||
|
||||
function swiper() {
|
||||
return swiperInstance;
|
||||
}
|
||||
|
||||
const setVirtualData = data => {
|
||||
$$invalidate(9, virtualData = data);
|
||||
|
||||
tick().then(() => {
|
||||
swiperInstance.$wrapperEl.children(".swiper-slide").each(el => {
|
||||
if (el.onSwiper) el.onSwiper(swiperInstance);
|
||||
});
|
||||
|
||||
swiperInstance.updateSlides();
|
||||
swiperInstance.updateProgress();
|
||||
swiperInstance.updateSlidesClasses();
|
||||
|
||||
if (swiperInstance.lazy && swiperInstance.params.lazy.enabled) {
|
||||
swiperInstance.lazy.load();
|
||||
}
|
||||
});
|
||||
};
|
||||
|
||||
const calcParams = () => {
|
||||
paramsData = getParams($$restProps);
|
||||
$$invalidate(2, swiperParams = paramsData.params);
|
||||
passedParams = paramsData.passedParams;
|
||||
$$invalidate(3, restProps = paramsData.rest);
|
||||
};
|
||||
|
||||
calcParams();
|
||||
oldPassedParams = passedParams;
|
||||
|
||||
const onBeforeBreakpoint = () => {
|
||||
breakpointChanged = true;
|
||||
};
|
||||
|
||||
swiperParams.onAny = (event, ...args) => {
|
||||
dispatch(event, [args]);
|
||||
};
|
||||
|
||||
Object.assign(swiperParams.on, {
|
||||
_beforeBreakpoint: onBeforeBreakpoint,
|
||||
_containerClasses(_swiper, classes) {
|
||||
$$invalidate(1, containerClasses = classes);
|
||||
}
|
||||
});
|
||||
|
||||
swiperInstance = initSwiper(swiperParams, modules);
|
||||
|
||||
if (swiperInstance.virtual && swiperInstance.params.virtual.enabled) {
|
||||
const extendWith = {
|
||||
cache: false,
|
||||
renderExternal: data => {
|
||||
setVirtualData(data);
|
||||
|
||||
if (swiperParams.virtual && swiperParams.virtual.renderExternal) {
|
||||
swiperParams.virtual.renderExternal(data);
|
||||
}
|
||||
},
|
||||
renderExternalUpdate: false
|
||||
};
|
||||
|
||||
extend(swiperInstance.params.virtual, extendWith);
|
||||
extend(swiperInstance.originalParams.virtual, extendWith);
|
||||
}
|
||||
|
||||
onMount(() => {
|
||||
if (!swiperEl) return;
|
||||
|
||||
mountSwiper(
|
||||
{
|
||||
el: swiperEl,
|
||||
nextEl,
|
||||
prevEl,
|
||||
paginationEl,
|
||||
scrollbarEl,
|
||||
swiper: swiperInstance
|
||||
},
|
||||
swiperParams
|
||||
);
|
||||
|
||||
dispatch("swiper", [swiperInstance]);
|
||||
if (swiperParams.virtual) return;
|
||||
|
||||
swiperInstance.slides.each(el => {
|
||||
if (el.onSwiper) el.onSwiper(swiperInstance);
|
||||
});
|
||||
});
|
||||
|
||||
afterUpdate(() => {
|
||||
if (!swiperInstance) return;
|
||||
calcParams();
|
||||
const changedParams = getChangedParams(passedParams, oldPassedParams);
|
||||
|
||||
if ((changedParams.length || breakpointChanged) && swiperInstance && !swiperInstance.destroyed) {
|
||||
updateSwiper({
|
||||
swiper: swiperInstance,
|
||||
passedParams,
|
||||
changedParams,
|
||||
nextEl,
|
||||
prevEl,
|
||||
scrollbarEl,
|
||||
paginationEl
|
||||
});
|
||||
}
|
||||
|
||||
breakpointChanged = false;
|
||||
oldPassedParams = passedParams;
|
||||
});
|
||||
|
||||
onDestroy(() => {
|
||||
if (typeof window !== "undefined" && swiperInstance && !swiperInstance.destroyed) {
|
||||
swiperInstance.destroy(true, false);
|
||||
}
|
||||
});
|
||||
|
||||
function div0_binding($$value) {
|
||||
binding_callbacks[$$value ? "unshift" : "push"](() => {
|
||||
prevEl = $$value;
|
||||
$$invalidate(5, prevEl);
|
||||
});
|
||||
}
|
||||
|
||||
function div1_binding($$value) {
|
||||
binding_callbacks[$$value ? "unshift" : "push"](() => {
|
||||
nextEl = $$value;
|
||||
$$invalidate(6, nextEl);
|
||||
});
|
||||
}
|
||||
|
||||
function div_binding($$value) {
|
||||
binding_callbacks[$$value ? "unshift" : "push"](() => {
|
||||
scrollbarEl = $$value;
|
||||
$$invalidate(7, scrollbarEl);
|
||||
});
|
||||
}
|
||||
|
||||
function div_binding_1($$value) {
|
||||
binding_callbacks[$$value ? "unshift" : "push"](() => {
|
||||
paginationEl = $$value;
|
||||
$$invalidate(8, paginationEl);
|
||||
});
|
||||
}
|
||||
|
||||
function div1_binding_1($$value) {
|
||||
binding_callbacks[$$value ? "unshift" : "push"](() => {
|
||||
swiperEl = $$value;
|
||||
$$invalidate(4, swiperEl);
|
||||
});
|
||||
}
|
||||
|
||||
$$self.$$set = $$new_props => {
|
||||
$$props = assign(assign({}, $$props), exclude_internal_props($$new_props));
|
||||
$$invalidate(28, $$restProps = compute_rest_props($$props, omit_props_names));
|
||||
if ("class" in $$new_props) $$invalidate(0, className = $$new_props.class);
|
||||
if ("modules" in $$new_props) $$invalidate(10, modules = $$new_props.modules);
|
||||
if ("$$scope" in $$new_props) $$invalidate(12, $$scope = $$new_props.$$scope);
|
||||
};
|
||||
|
||||
return [
|
||||
className,
|
||||
containerClasses,
|
||||
swiperParams,
|
||||
restProps,
|
||||
swiperEl,
|
||||
prevEl,
|
||||
nextEl,
|
||||
scrollbarEl,
|
||||
paginationEl,
|
||||
virtualData,
|
||||
modules,
|
||||
swiper,
|
||||
$$scope,
|
||||
slots,
|
||||
div0_binding,
|
||||
div1_binding,
|
||||
div_binding,
|
||||
div_binding_1,
|
||||
div1_binding_1
|
||||
];
|
||||
}
|
||||
|
||||
class Swiper extends SvelteComponent {
|
||||
constructor(options) {
|
||||
super();
|
||||
init(this, options, instance, create_fragment, safe_not_equal, { class: 0, modules: 10, swiper: 11 });
|
||||
}
|
||||
|
||||
get swiper() {
|
||||
return this.$$.ctx[11];
|
||||
}
|
||||
}
|
||||
|
||||
export default Swiper;
|
||||
@@ -0,0 +1,172 @@
|
||||
<script>
|
||||
import {
|
||||
onMount,
|
||||
onDestroy,
|
||||
afterUpdate,
|
||||
createEventDispatcher,
|
||||
tick,
|
||||
beforeUpdate,
|
||||
} from 'svelte';
|
||||
import { getParams } from './get-params';
|
||||
import { initSwiper, mountSwiper } from './init-swiper';
|
||||
import { needsScrollbar, needsNavigation, needsPagination, uniqueClasses, extend } from './utils';
|
||||
import { getChangedParams } from './get-changed-params';
|
||||
import { updateSwiper } from './update-swiper';
|
||||
|
||||
const dispatch = createEventDispatcher();
|
||||
|
||||
let className = undefined;
|
||||
export { className as class };
|
||||
export let modules = null;
|
||||
|
||||
let containerClasses = 'swiper-container';
|
||||
let breakpointChanged = false;
|
||||
let swiperInstance = null;
|
||||
let oldPassedParams = null;
|
||||
|
||||
let paramsData;
|
||||
let swiperParams;
|
||||
let passedParams;
|
||||
let restProps;
|
||||
|
||||
let swiperEl = null;
|
||||
let prevEl = null;
|
||||
let nextEl = null;
|
||||
let scrollbarEl = null;
|
||||
let paginationEl = null;
|
||||
let virtualData = { slides: [] };
|
||||
|
||||
export function swiper() {
|
||||
return swiperInstance;
|
||||
}
|
||||
|
||||
const setVirtualData = (data) => {
|
||||
virtualData = data;
|
||||
|
||||
tick().then(() => {
|
||||
swiperInstance.$wrapperEl.children('.swiper-slide').each((el) => {
|
||||
if (el.onSwiper) el.onSwiper(swiperInstance);
|
||||
});
|
||||
swiperInstance.updateSlides();
|
||||
swiperInstance.updateProgress();
|
||||
swiperInstance.updateSlidesClasses();
|
||||
if (swiperInstance.lazy && swiperInstance.params.lazy.enabled) {
|
||||
swiperInstance.lazy.load();
|
||||
}
|
||||
});
|
||||
};
|
||||
|
||||
const calcParams = () => {
|
||||
paramsData = getParams($$restProps);
|
||||
swiperParams = paramsData.params;
|
||||
passedParams = paramsData.passedParams;
|
||||
restProps = paramsData.rest;
|
||||
};
|
||||
|
||||
calcParams();
|
||||
oldPassedParams = passedParams;
|
||||
|
||||
const onBeforeBreakpoint = () => {
|
||||
breakpointChanged = true;
|
||||
};
|
||||
|
||||
swiperParams.onAny = (event, ...args) => {
|
||||
dispatch(event, [args]);
|
||||
};
|
||||
Object.assign(swiperParams.on, {
|
||||
_beforeBreakpoint: onBeforeBreakpoint,
|
||||
_containerClasses(_swiper, classes) {
|
||||
containerClasses = classes;
|
||||
},
|
||||
});
|
||||
|
||||
swiperInstance = initSwiper(swiperParams, modules);
|
||||
if (swiperInstance.virtual && swiperInstance.params.virtual.enabled) {
|
||||
const extendWith = {
|
||||
cache: false,
|
||||
renderExternal: (data) => {
|
||||
setVirtualData(data);
|
||||
if (swiperParams.virtual && swiperParams.virtual.renderExternal) {
|
||||
swiperParams.virtual.renderExternal(data);
|
||||
}
|
||||
},
|
||||
renderExternalUpdate: false,
|
||||
};
|
||||
extend(swiperInstance.params.virtual, extendWith);
|
||||
extend(swiperInstance.originalParams.virtual, extendWith);
|
||||
}
|
||||
|
||||
onMount(() => {
|
||||
if (!swiperEl) return;
|
||||
mountSwiper(
|
||||
{
|
||||
el: swiperEl,
|
||||
nextEl: nextEl,
|
||||
prevEl: prevEl,
|
||||
paginationEl: paginationEl,
|
||||
scrollbarEl: scrollbarEl,
|
||||
swiper: swiperInstance,
|
||||
},
|
||||
swiperParams,
|
||||
);
|
||||
dispatch('swiper', [swiperInstance]);
|
||||
if (swiperParams.virtual) return;
|
||||
swiperInstance.slides.each((el) => {
|
||||
if (el.onSwiper) el.onSwiper(swiperInstance);
|
||||
});
|
||||
});
|
||||
|
||||
afterUpdate(() => {
|
||||
if (!swiperInstance) return;
|
||||
calcParams();
|
||||
|
||||
const changedParams = getChangedParams(passedParams, oldPassedParams);
|
||||
if (
|
||||
(changedParams.length || breakpointChanged) &&
|
||||
swiperInstance &&
|
||||
!swiperInstance.destroyed
|
||||
) {
|
||||
updateSwiper({
|
||||
swiper: swiperInstance,
|
||||
passedParams,
|
||||
changedParams,
|
||||
nextEl,
|
||||
prevEl,
|
||||
scrollbarEl,
|
||||
paginationEl,
|
||||
});
|
||||
}
|
||||
breakpointChanged = false;
|
||||
oldPassedParams = passedParams;
|
||||
});
|
||||
|
||||
onDestroy(() => {
|
||||
if (typeof window !== 'undefined' && swiperInstance && !swiperInstance.destroyed) {
|
||||
swiperInstance.destroy(true, false);
|
||||
}
|
||||
});
|
||||
</script>
|
||||
|
||||
<div
|
||||
bind:this={swiperEl}
|
||||
class={uniqueClasses(`${containerClasses}${className ? ` ${className}` : ''}`)}
|
||||
{...restProps}
|
||||
>
|
||||
<slot name="container-start" />
|
||||
{#if needsNavigation(swiperParams)}
|
||||
<div bind:this={prevEl} class="swiper-button-prev" />
|
||||
<div bind:this={nextEl} class="swiper-button-next" />
|
||||
{/if}
|
||||
{#if needsScrollbar(swiperParams)}
|
||||
<div bind:this={scrollbarEl} class="swiper-scrollbar" />
|
||||
{/if}
|
||||
{#if needsPagination(swiperParams)}
|
||||
<div bind:this={paginationEl} class="swiper-pagination" />
|
||||
{/if}
|
||||
<div class="swiper-wrapper">
|
||||
<slot name="wrapper-start" />
|
||||
<slot {virtualData} />
|
||||
<slot name="wrapper-end" />
|
||||
</div>
|
||||
<slot name="container-end" />
|
||||
</div>
|
||||
@@ -0,0 +1,131 @@
|
||||
import { isObject, extend } from './utils';
|
||||
|
||||
function updateSwiper(_ref) {
|
||||
var swiper = _ref.swiper,
|
||||
passedParams = _ref.passedParams,
|
||||
changedParams = _ref.changedParams,
|
||||
nextEl = _ref.nextEl,
|
||||
prevEl = _ref.prevEl,
|
||||
scrollbarEl = _ref.scrollbarEl,
|
||||
paginationEl = _ref.paginationEl;
|
||||
var updateParams = changedParams.filter(function (key) {
|
||||
return key !== 'children' && key !== 'direction';
|
||||
});
|
||||
var currentParams = swiper.params,
|
||||
pagination = swiper.pagination,
|
||||
navigation = swiper.navigation,
|
||||
scrollbar = swiper.scrollbar,
|
||||
thumbs = swiper.thumbs;
|
||||
var needThumbsInit;
|
||||
var needControllerInit;
|
||||
var needPaginationInit;
|
||||
var needScrollbarInit;
|
||||
var needNavigationInit;
|
||||
|
||||
if (changedParams.includes('thumbs') && passedParams.thumbs && passedParams.thumbs.swiper && currentParams.thumbs && !currentParams.thumbs.swiper) {
|
||||
needThumbsInit = true;
|
||||
}
|
||||
|
||||
if (changedParams.includes('controller') && passedParams.controller && passedParams.controller.control && currentParams.controller && !currentParams.controller.control) {
|
||||
needControllerInit = true;
|
||||
}
|
||||
|
||||
if (changedParams.includes('pagination') && passedParams.pagination && (passedParams.pagination.el || paginationEl) && (currentParams.pagination || currentParams.pagination === false) && pagination && !pagination.el) {
|
||||
needPaginationInit = true;
|
||||
}
|
||||
|
||||
if (changedParams.includes('scrollbar') && passedParams.scrollbar && (passedParams.scrollbar.el || scrollbarEl) && (currentParams.scrollbar || currentParams.scrollbar === false) && scrollbar && !scrollbar.el) {
|
||||
needScrollbarInit = true;
|
||||
}
|
||||
|
||||
if (changedParams.includes('navigation') && passedParams.navigation && (passedParams.navigation.prevEl || prevEl) && (passedParams.navigation.nextEl || nextEl) && (currentParams.navigation || currentParams.navigation === false) && navigation && !navigation.prevEl && !navigation.nextEl) {
|
||||
needNavigationInit = true;
|
||||
}
|
||||
|
||||
if (changedParams.includes('virtual')) {
|
||||
if (passedParams.virtual && passedParams.virtual.slides && swiper.virtual) {
|
||||
swiper.virtual.slides = passedParams.virtual.slides;
|
||||
swiper.virtual.update();
|
||||
}
|
||||
}
|
||||
|
||||
var destroyModule = function destroyModule(mod) {
|
||||
if (!swiper[mod]) return;
|
||||
swiper[mod].destroy();
|
||||
|
||||
if (mod === 'navigation') {
|
||||
currentParams[mod].prevEl = undefined;
|
||||
currentParams[mod].nextEl = undefined;
|
||||
swiper[mod].prevEl = undefined;
|
||||
swiper[mod].nextEl = undefined;
|
||||
} else {
|
||||
currentParams[mod].el = undefined;
|
||||
swiper[mod].el = undefined;
|
||||
}
|
||||
};
|
||||
|
||||
updateParams.forEach(function (key) {
|
||||
if (isObject(currentParams[key]) && isObject(passedParams[key])) {
|
||||
extend(currentParams[key], passedParams[key]);
|
||||
} else {
|
||||
var newValue = passedParams[key];
|
||||
|
||||
if ((newValue === true || newValue === false) && (key === 'navigation' || key === 'pagination' || key === 'scrollbar')) {
|
||||
if (newValue === false) {
|
||||
destroyModule(key);
|
||||
}
|
||||
} else {
|
||||
currentParams[key] = passedParams[key];
|
||||
}
|
||||
}
|
||||
});
|
||||
|
||||
if (needThumbsInit) {
|
||||
var initialized = thumbs.init();
|
||||
|
||||
if (initialized) {
|
||||
thumbs.update(true);
|
||||
}
|
||||
}
|
||||
|
||||
if (needControllerInit) {
|
||||
swiper.controller.control = currentParams.controller.control;
|
||||
}
|
||||
|
||||
if (needPaginationInit) {
|
||||
if (paginationEl) currentParams.pagination.el = paginationEl;
|
||||
pagination.init();
|
||||
pagination.render();
|
||||
pagination.update();
|
||||
}
|
||||
|
||||
if (needScrollbarInit) {
|
||||
if (scrollbarEl) currentParams.scrollbar.el = scrollbarEl;
|
||||
scrollbar.init();
|
||||
scrollbar.updateSize();
|
||||
scrollbar.setTranslate();
|
||||
}
|
||||
|
||||
if (needNavigationInit) {
|
||||
if (nextEl) currentParams.navigation.nextEl = nextEl;
|
||||
if (prevEl) currentParams.navigation.prevEl = prevEl;
|
||||
navigation.init();
|
||||
navigation.update();
|
||||
}
|
||||
|
||||
if (changedParams.includes('allowSlideNext')) {
|
||||
swiper.allowSlideNext = passedParams.allowSlideNext;
|
||||
}
|
||||
|
||||
if (changedParams.includes('allowSlidePrev')) {
|
||||
swiper.allowSlidePrev = passedParams.allowSlidePrev;
|
||||
}
|
||||
|
||||
if (changedParams.includes('direction')) {
|
||||
swiper.changeDirection(passedParams.direction, false);
|
||||
}
|
||||
|
||||
swiper.update();
|
||||
}
|
||||
|
||||
export { updateSwiper };
|
||||
@@ -0,0 +1,59 @@
|
||||
function isObject(o) {
|
||||
return typeof o === 'object' && o !== null && o.constructor && Object.prototype.toString.call(o).slice(8, -1) === 'Object';
|
||||
}
|
||||
|
||||
function extend(target, src) {
|
||||
var noExtend = ['__proto__', 'constructor', 'prototype'];
|
||||
Object.keys(src).filter(function (key) {
|
||||
return noExtend.indexOf(key) < 0;
|
||||
}).forEach(function (key) {
|
||||
if (typeof target[key] === 'undefined') target[key] = src[key];else if (isObject(src[key]) && isObject(target[key]) && Object.keys(src[key]).length > 0) {
|
||||
if (src[key].__swiper__) target[key] = src[key];else extend(target[key], src[key]);
|
||||
} else {
|
||||
target[key] = src[key];
|
||||
}
|
||||
});
|
||||
}
|
||||
|
||||
function needsNavigation(params) {
|
||||
if (params === void 0) {
|
||||
params = {};
|
||||
}
|
||||
|
||||
return params.navigation && typeof params.navigation.nextEl === 'undefined' && typeof params.navigation.prevEl === 'undefined';
|
||||
}
|
||||
|
||||
function needsPagination(params) {
|
||||
if (params === void 0) {
|
||||
params = {};
|
||||
}
|
||||
|
||||
return params.pagination && typeof params.pagination.el === 'undefined';
|
||||
}
|
||||
|
||||
function needsScrollbar(params) {
|
||||
if (params === void 0) {
|
||||
params = {};
|
||||
}
|
||||
|
||||
return params.scrollbar && typeof params.scrollbar.el === 'undefined';
|
||||
}
|
||||
|
||||
function uniqueClasses(classNames) {
|
||||
if (classNames === void 0) {
|
||||
classNames = '';
|
||||
}
|
||||
|
||||
var classes = classNames.split(' ').map(function (c) {
|
||||
return c.trim();
|
||||
}).filter(function (c) {
|
||||
return !!c;
|
||||
});
|
||||
var unique = [];
|
||||
classes.forEach(function (c) {
|
||||
if (unique.indexOf(c) < 0) unique.push(c);
|
||||
});
|
||||
return unique.join(' ');
|
||||
}
|
||||
|
||||
export { isObject, extend, needsNavigation, needsPagination, needsScrollbar, uniqueClasses };
|
||||
Reference in New Issue
Block a user