@wezom/zz-load/dist/core.cjs.js

Lazy loader based on IntersectionObserver API

'use strict';
var __importDefault =
	(this && this.__importDefault) ||
	function (mod) {
		return mod && mod.__esModule ? mod : { default: mod };
	};
Object.defineProperty(exports, '__esModule', { value: true });
const attrs_1 = __importDefault(require('./config/attrs'));
const events_1 = __importDefault(require('./config/events'));
const check_1 = __importDefault(require('./utils/check'));
const get_elements_1 = __importDefault(require('./utils/get-elements'));
const mark_as_1 = __importDefault(require('./utils/mark-as'));
const loads_1 = __importDefault(require('./loads'));
// -----------------------------------------------------------------------------
// Private
// -----------------------------------------------------------------------------
const _defaultOptions = {
	rootMargin: '0px',
	threshold: 0,
	clearSourceAttrs: false,
	setSourcesOnlyOnLoad: true
};
// -----------------------------------------------------------------------------
// Public
// -----------------------------------------------------------------------------
function default_1(elements, options = {}) {
	const _options = Object.assign(Object.assign({}, _defaultOptions), options);
	let observer = null;
	if (window.IntersectionObserver) {
		observer = new window.IntersectionObserver(
			(entries, observer) => {
				entries.forEach((entry) => {
					const element = entry.target;
					const inViewType = element.hasAttribute(attrs_1.default.sourceInview);
					if (entry.intersectionRatio > 0 || entry.isIntersecting) {
						if (inViewType) {
							mark_as_1.default(
								element,
								attrs_1.default.inView,
								events_1.default.inView,
								{
									visible: true
								}
							);
							loads_1.default(element, _options);
						} else {
							observer.unobserve(element);
							loads_1.default(element, _options);
						}
					} else {
						if (
							inViewType &&
							check_1.default(element, attrs_1.default.inView)
						) {
							mark_as_1.default(
								element,
								attrs_1.default.inView,
								events_1.default.inView,
								{ visible: false },
								true
							);
						}
					}
				});
			},
			{
				rootMargin: _options.rootMargin,
				threshold: _options.threshold
			}
		);
	}
	return {
		observe() {
			const list = get_elements_1.default(elements);
			for (let i = 0; i < list.length; i++) {
				const element = list[i];
				if (check_1.default(element, attrs_1.default.observed)) {
					continue;
				}
				mark_as_1.default(
					element,
					attrs_1.default.observed,
					events_1.default.observed
				);
				if (observer === null) {
					loads_1.default(element, _options);
				} else {
					observer.observe(element);
				}
			}
		},
		triggerLoad(triggerElements, triggerOptions = {}) {
			const list = get_elements_1.default(elements);
			const loadOptions = Object.assign(
				Object.assign({}, _options),
				triggerOptions
			);
			for (let i = 0; i < list.length; i++) {
				const element = list[i];
				if (check_1.default(element, attrs_1.default.processed)) {
					continue;
				}
				mark_as_1.default(
					element,
					attrs_1.default.observed,
					events_1.default.observed
				);
				loads_1.default(element, loadOptions);
			}
		}
	};
}
exports.default = default_1;