https://4glaza.ru/local/modules/intervolga.levenhuk.enrich/js/public/lazyswiper.js

1(function (window) {
2
3	'use strict';
4
5	window.IV = window.IV || {};
6
7	window.IV.LazySwiper = function (parameters, eventName) {
8		this.container = document.querySelector('[data-entity="' + parameters.CONTAINER_NAME + '"]');
9		this.wrapper = document.querySelector('[data-entity="' + parameters.WRAPPER_NAME + '"]');
10
11		this.navigation = parameters.NAVIGATION;
12
13		this.componentName = parameters.COMPONENT_NAME;
14		this.templateName = parameters.TEMPLATE_NAME;
15		this.parameters = parameters.PARAMETERS_HASHED;
16
17		this.ajaxUrl = parameters.AJAX_URL;
18		this.itemClasses = parameters.ITEM_CLASSES;
19		this.loader = null;
20		if(this.itemClasses) {
21			this.loader = this.wrapper.insertAdjacentElement('beforeend', BX.create('div', {
22				props: {
23					className: this.itemClasses + ' loader',
24				},
25				style: {
26					display: 'none'
27				}
28			}));
29		}
30
31		this.blockSending = false;
32		this.isCheckingProgress = false;
33		this.bindEvents(eventName)
34	};
35
36	window.IV.LazySwiper.prototype = {
37		bindEvents: function (eventName) {
38			document.addEventListener(eventName, function(event) {
39				if(this.container.dataset.entity === event.detail.swiper.el.dataset.entity) {
40					this.addSliderHandler();
41				}
42			}.bind(this));
43			this.addSliderHandler();
44		},
45
46		addSliderHandler: function () {
47			if(this.isCheckingProgress) {
48				return;
49			}
50			if(this.container && this.container.swiper) {
51				const swiper = this.container.swiper;
52
53				swiper.on('activeIndexChange', this.sliderProgress.bind(this));
54				swiper.on('transitionEnd', this.updateSlider.bind(this));
55				this.isCheckingProgress = true;
56			}
57		},
58
59		sliderProgress: function(swiper) {
60			if(!!swiper.progress && swiper.progress >= 0.8 && !this.blockSending) {
61				this.showMore();
62			}
63		},
64
65		updateSlider: function(swiper) {
66			swiper.update();
67			swiper.updateProgress();
68			swiper.updateSlides();
69		},
70
71		showMore: function() {
72			if (this.navigation.NavPageNomer < this.navigation.NavPageCount) {
73				let data = {};
74				data['PAGEN_1'] = this.navigation.NavPageNomer + 1;
75				if (!this.blockSending) {
76					this.blockSending = true;
77					this.setLoader(true);
78					this.updateSlider(this.container.swiper);
79					this.sendRequest(data);
80				}
81			}
82		},
83
84		sendRequest: function(data) {
85			const cacheParameter = document.location.href.indexOf('clear_cache=Y') !== -1 ? '?clear_cache=Y' : '';
86
87			let defaultData = {
88				componentName: this.componentName,
89				templateName: this.templateName,
90				parameters: this.parameters,
91			};
92
93			BX.ajax({
94				url: this.ajaxUrl + cacheParameter,
95				method: 'POST',
96				dataType: 'json',
97				timeout: 60,
98				data: BX.merge(defaultData, data),
99				onfailure: BX.delegate(function(response) {
100					console.error(response);
101					this.blockSending = false;
102					this.setLoader(false)
103				}, this),
104				onsuccess: BX.delegate(function(response){
105					const result = response.result;
106					if (!result || !result.body) {
107						this.blockSending = false;
108						this.setLoader(false);
109						return;
110					}
111
112					const body = result.body;
113					const processedHTML = BX.processHTML(body);
114
115					let temporaryNode = BX.create('DIV');
116					temporaryNode.innerHTML = processedHTML.HTML;
117
118					const newItems = temporaryNode.querySelector('.swiper-wrapper');
119
120					if(newItems && newItems.children.length > 0) {
121						Array.from(newItems.children).forEach(function(element) {
122							if(this.loader) {
123								this.wrapper.insertBefore(element, this.loader);
124							} else {
125								this.wrapper.appendChild(element);
126							}
127						}.bind(this))
128					}
129
130					this.updateSlider(this.container.swiper);
131					this.blockSending = false;
132					this.setLoader(false);
133
134					this.navigation.NavPageNomer++;
135				}, this)
136			});
137		},
138
139		setLoader(isShown) {
140			if(!this.loader) {
141				return;
142			}
143			if(isShown) {
144				BX.show(this.loader);
145			} else {
146				BX.hide(this.loader);
147			}
148		}
149	};
150})(window);