cione-comp-lib
Version:
`$ yarn add cione-comp-lib` 或者 `$ npm i cione-comp-lib -S`
226 lines (225 loc) • 8.46 kB
JavaScript
import "../../utils/dom.mjs";
import { bindModuleMethods } from "../../utils/utils.mjs";
import $ from "../../../../dom7/dom7.esm.mjs";
function _extends() {
_extends = Object.assign || function(target) {
for (var i = 1; i < arguments.length; i++) {
var source = arguments[i];
for (var key in source) {
if (Object.prototype.hasOwnProperty.call(source, key)) {
target[key] = source[key];
}
}
}
return target;
};
return _extends.apply(this, arguments);
}
var Lazy = {
loadInSlide: function loadInSlide(index, loadInDuplicate) {
if (loadInDuplicate === void 0) {
loadInDuplicate = true;
}
var swiper = this;
var params = swiper.params.lazy;
if (typeof index === "undefined")
return;
if (swiper.slides.length === 0)
return;
var isVirtual = swiper.virtual && swiper.params.virtual.enabled;
var $slideEl = isVirtual ? swiper.$wrapperEl.children("." + swiper.params.slideClass + '[data-swiper-slide-index="' + index + '"]') : swiper.slides.eq(index);
var $images = $slideEl.find("." + params.elementClass + ":not(." + params.loadedClass + "):not(." + params.loadingClass + ")");
if ($slideEl.hasClass(params.elementClass) && !$slideEl.hasClass(params.loadedClass) && !$slideEl.hasClass(params.loadingClass)) {
$images.push($slideEl[0]);
}
if ($images.length === 0)
return;
$images.each(function(imageEl) {
var $imageEl = $(imageEl);
$imageEl.addClass(params.loadingClass);
var background = $imageEl.attr("data-background");
var src = $imageEl.attr("data-src");
var srcset = $imageEl.attr("data-srcset");
var sizes = $imageEl.attr("data-sizes");
var $pictureEl = $imageEl.parent("picture");
swiper.loadImage($imageEl[0], src || background, srcset, sizes, false, function() {
if (typeof swiper === "undefined" || swiper === null || !swiper || swiper && !swiper.params || swiper.destroyed)
return;
if (background) {
$imageEl.css("background-image", 'url("' + background + '")');
$imageEl.removeAttr("data-background");
} else {
if (srcset) {
$imageEl.attr("srcset", srcset);
$imageEl.removeAttr("data-srcset");
}
if (sizes) {
$imageEl.attr("sizes", sizes);
$imageEl.removeAttr("data-sizes");
}
if ($pictureEl.length) {
$pictureEl.children("source").each(function(sourceEl) {
var $source = $(sourceEl);
if ($source.attr("data-srcset")) {
$source.attr("srcset", $source.attr("data-srcset"));
$source.removeAttr("data-srcset");
}
});
}
if (src) {
$imageEl.attr("src", src);
$imageEl.removeAttr("data-src");
}
}
$imageEl.addClass(params.loadedClass).removeClass(params.loadingClass);
$slideEl.find("." + params.preloaderClass).remove();
if (swiper.params.loop && loadInDuplicate) {
var slideOriginalIndex = $slideEl.attr("data-swiper-slide-index");
if ($slideEl.hasClass(swiper.params.slideDuplicateClass)) {
var originalSlide = swiper.$wrapperEl.children('[data-swiper-slide-index="' + slideOriginalIndex + '"]:not(.' + swiper.params.slideDuplicateClass + ")");
swiper.lazy.loadInSlide(originalSlide.index(), false);
} else {
var duplicatedSlide = swiper.$wrapperEl.children("." + swiper.params.slideDuplicateClass + '[data-swiper-slide-index="' + slideOriginalIndex + '"]');
swiper.lazy.loadInSlide(duplicatedSlide.index(), false);
}
}
swiper.emit("lazyImageReady", $slideEl[0], $imageEl[0]);
if (swiper.params.autoHeight) {
swiper.updateAutoHeight();
}
});
swiper.emit("lazyImageLoad", $slideEl[0], $imageEl[0]);
});
},
load: function load() {
var swiper = this;
var $wrapperEl = swiper.$wrapperEl, swiperParams = swiper.params, slides = swiper.slides, activeIndex = swiper.activeIndex;
var isVirtual = swiper.virtual && swiperParams.virtual.enabled;
var params = swiperParams.lazy;
var slidesPerView = swiperParams.slidesPerView;
if (slidesPerView === "auto") {
slidesPerView = 0;
}
function slideExist(index) {
if (isVirtual) {
if ($wrapperEl.children("." + swiperParams.slideClass + '[data-swiper-slide-index="' + index + '"]').length) {
return true;
}
} else if (slides[index])
return true;
return false;
}
function slideIndex(slideEl) {
if (isVirtual) {
return $(slideEl).attr("data-swiper-slide-index");
}
return $(slideEl).index();
}
if (!swiper.lazy.initialImageLoaded)
swiper.lazy.initialImageLoaded = true;
if (swiper.params.watchSlidesVisibility) {
$wrapperEl.children("." + swiperParams.slideVisibleClass).each(function(slideEl) {
var index = isVirtual ? $(slideEl).attr("data-swiper-slide-index") : $(slideEl).index();
swiper.lazy.loadInSlide(index);
});
} else if (slidesPerView > 1) {
for (var i = activeIndex; i < activeIndex + slidesPerView; i += 1) {
if (slideExist(i))
swiper.lazy.loadInSlide(i);
}
} else {
swiper.lazy.loadInSlide(activeIndex);
}
if (params.loadPrevNext) {
if (slidesPerView > 1 || params.loadPrevNextAmount && params.loadPrevNextAmount > 1) {
var amount = params.loadPrevNextAmount;
var spv = slidesPerView;
var maxIndex = Math.min(activeIndex + spv + Math.max(amount, spv), slides.length);
var minIndex = Math.max(activeIndex - Math.max(spv, amount), 0);
for (var _i = activeIndex + slidesPerView; _i < maxIndex; _i += 1) {
if (slideExist(_i))
swiper.lazy.loadInSlide(_i);
}
for (var _i2 = minIndex; _i2 < activeIndex; _i2 += 1) {
if (slideExist(_i2))
swiper.lazy.loadInSlide(_i2);
}
} else {
var nextSlide = $wrapperEl.children("." + swiperParams.slideNextClass);
if (nextSlide.length > 0)
swiper.lazy.loadInSlide(slideIndex(nextSlide));
var prevSlide = $wrapperEl.children("." + swiperParams.slidePrevClass);
if (prevSlide.length > 0)
swiper.lazy.loadInSlide(slideIndex(prevSlide));
}
}
}
};
var Lazy$1 = {
name: "lazy",
params: {
lazy: {
enabled: false,
loadPrevNext: false,
loadPrevNextAmount: 1,
loadOnTransitionStart: false,
elementClass: "swiper-lazy",
loadingClass: "swiper-lazy-loading",
loadedClass: "swiper-lazy-loaded",
preloaderClass: "swiper-lazy-preloader"
}
},
create: function create() {
var swiper = this;
bindModuleMethods(swiper, {
lazy: _extends({
initialImageLoaded: false
}, Lazy)
});
},
on: {
beforeInit: function beforeInit(swiper) {
if (swiper.params.lazy.enabled && swiper.params.preloadImages) {
swiper.params.preloadImages = false;
}
},
init: function init(swiper) {
if (swiper.params.lazy.enabled && !swiper.params.loop && swiper.params.initialSlide === 0) {
swiper.lazy.load();
}
},
scroll: function scroll(swiper) {
if (swiper.params.freeMode && !swiper.params.freeModeSticky) {
swiper.lazy.load();
}
},
resize: function resize(swiper) {
if (swiper.params.lazy.enabled) {
swiper.lazy.load();
}
},
scrollbarDragMove: function scrollbarDragMove(swiper) {
if (swiper.params.lazy.enabled) {
swiper.lazy.load();
}
},
transitionStart: function transitionStart(swiper) {
if (swiper.params.lazy.enabled) {
if (swiper.params.lazy.loadOnTransitionStart || !swiper.params.lazy.loadOnTransitionStart && !swiper.lazy.initialImageLoaded) {
swiper.lazy.load();
}
}
},
transitionEnd: function transitionEnd(swiper) {
if (swiper.params.lazy.enabled && !swiper.params.lazy.loadOnTransitionStart) {
swiper.lazy.load();
}
},
slideChange: function slideChange(swiper) {
if (swiper.params.lazy.enabled && swiper.params.cssMode) {
swiper.lazy.load();
}
}
}
};
export { Lazy$1 as default };