https://www.agropur.com/themes/custom/agropur_com_theme/js/es6/components/modal.js?tktkyz

1"use strict";
2
3(function() {
4	var CLOSE_ICON_SVG = '<svg xmlns="http://www.w3.org/2000/svg" x="0px" y="0px" viewBox="0.226 0.227 27.547 27.547"><polygon points="1.64,27.773 0.226,26.359 12.586,14 0.226,1.641 1.64,0.227 14,12.586 26.359,0.227 27.773,1.641 15.414,14 27.773,26.359 26.359,27.773 14,15.414"/></svg>';
5
6	function Modal(element) {
7		this.element = element;
8		this.modalName = element.getAttribute('data-modal-name');
9		this.modalStyle = element.getAttribute('data-modal-style') || 'blue';
10		this.open = false;
11		this.contentSlot = element.querySelector('[data-modal-content]');
12
13		this.init();
14	}
15
16	Modal.prototype.init = function() {
17		this.render();
18		this.bindEvents();
19	};
20
21	Modal.prototype.render = function() {
22		this.element.className = 'modal modal--' + this.modalStyle;
23
24		var contentWrapper = document.createElement('div');
25		contentWrapper.className = 'modal__content';
26
27		var innerWrapper = document.createElement('div');
28		innerWrapper.className = 'content-wrapper content-wrapper--narrow';
29
30		if (this.contentSlot) {
31			while (this.contentSlot.firstChild) {
32				innerWrapper.appendChild(this.contentSlot.firstChild);
33			}
34			this.contentSlot.remove();
35		}
36
37		contentWrapper.appendChild(innerWrapper);
38		this.element.insertBefore(contentWrapper, this.element.firstChild);
39
40		var closeButton = document.createElement('div');
41		closeButton.className = 'close-button modal__close-button';
42		closeButton.setAttribute('data-toggle-modal', this.modalName);
43		closeButton.innerHTML = CLOSE_ICON_SVG;
44		this.element.appendChild(closeButton);
45	};
46
47	Modal.prototype.bindEvents = function() {
48		var self = this;
49
50		document.querySelectorAll('[data-toggle-modal="' + this.modalName + '"]').forEach(function(trigger) {
51			trigger.addEventListener('click', function() {
52				self.toggleModal();
53			});
54		});
55
56		document.addEventListener('keyup', function(event) {
57			if (event.keyCode === 27 && self.open) {
58				self.toggleModal();
59			}
60		});
61	};
62
63	Modal.prototype.toggleModal = function() {
64		this.open = !this.open;
65		this.element.classList.toggle('modal--open', this.open);
66
67		if (this.open) {
68			document.body.classList.add('prevent-scroll');
69			var newsSliderModal = document.querySelector('.news-slider .modal');
70			var modalContainer = document.getElementById('modal-container');
71			if (newsSliderModal && modalContainer) {
72				modalContainer.appendChild(newsSliderModal);
73			}
74			if (typeof EventBus !== 'undefined') {
75				EventBus.$emit('stop-bgVideos');
76			}
77		} else {
78			document.body.classList.remove('prevent-scroll');
79			if (typeof EventBus !== 'undefined') {
80				EventBus.$emit('stop-videos');
81				EventBus.$emit('play-bgVideos');
82			}
83		}
84	};
85
86	function initModals() {
87		document.querySelectorAll('[data-modal]').forEach(function(element) {
88			new Modal(element);
89		});
90	}
91
92	if (document.readyState === 'loading') {
93		document.addEventListener('DOMContentLoaded', initModals);
94	} else {
95		initModals();
96	}
97})();