https://hsicomgis.cz/wp-content/themes/monstroid2/assets/js/responsive-menu.js?ver=1.0.0

1const monstroid2ResponsiveMenu = (options = {}) => {
2
3	const defaults = {
4		wrapper: '.main-navigation',
5		menu: '.menu',
6		threshold: 640, // Minimal menu width,
7		mobileMenuClass: 'mobile-menu',
8		mobileMenuOpenClass: 'mobile-menu-open',
9		mobileMenuToggleButtonClass: 'mobile-menu-toggle-button',
10		toggleButtonTemplate: '<i class="mobile-menu-close fa fa-bars" aria-hidden="true"></i><i class="mobile-menu-open fa fa-times" aria-hidden="true"></i>'
11	}
12	options = Object.assign(defaults, options);
13
14	const wrapper = options.wrapper.nodeType ?
15		options.wrapper :
16		document.querySelector(options.wrapper);
17
18	const menu = options.menu.nodeType ?
19		options.menu :
20		document.querySelector(options.menu);
21
22	let toggleButton,
23		toggleButtonOpenBlock,
24		toggleButtonCloseBlock,
25		isMobileMenu,
26		isMobileMenuOpen;
27
28	// series
29
30	const init = [
31		addToggleButton,
32		checkScreenWidth,
33		addResizeHandler
34	]
35
36	if (wrapper && menu) {
37		runSeries(init);
38	}
39
40	function addToggleButton() {
41		toggleButton = document.createElement('button');
42
43		toggleButton.innerHTML = options.toggleButtonTemplate.trim();
44		toggleButton.className = options.mobileMenuToggleButtonClass;
45		wrapper.insertBefore(toggleButton, wrapper.children[0]);
46
47		toggleButtonOpenBlock = toggleButton.querySelector('.mobile-menu-open');
48		toggleButtonCloseBlock = toggleButton.querySelector('.mobile-menu-close');
49
50		toggleButton.addEventListener('click', mobileMenuToggle);
51	}
52
53	// menu switchers
54
55	function switchToMobileMenu() {
56		wrapper.classList.add(options.mobileMenuClass);
57		toggleButton.style.display = "block";
58		isMobileMenuOpen = false;
59		hideMenu();
60	}
61
62	function switchToDesktopMenu() {
63		wrapper.classList.remove(options.mobileMenuClass);
64		toggleButton.style.display = "none";
65		showMenu();
66	}
67
68	// mobile menu toggle
69
70	function mobileMenuToggle() {
71		if (isMobileMenuOpen) {
72			hideMenu();
73		} else {
74			showMenu();
75		}
76		isMobileMenuOpen = !isMobileMenuOpen;
77	}
78
79	function hideMenu() {
80		wrapper.classList.remove(options.mobileMenuOpenClass);
81		menu.style.display = "none";
82		toggleButtonOpenBlock.style.display = "none";
83		toggleButtonCloseBlock.style.display = "block";
84	}
85
86	function showMenu() {
87		wrapper.classList.add(options.mobileMenuOpenClass);
88		menu.style.display = "block";
89		toggleButtonOpenBlock.style.display = "block";
90		toggleButtonCloseBlock.style.display = "none";
91	}
92
93	// resize helpers
94
95	function checkScreenWidth() {
96		let currentMobileMenuStatus = window.innerWidth < options.threshold ? true : false;
97
98		if (isMobileMenu !== currentMobileMenuStatus) {
99			isMobileMenu = currentMobileMenuStatus;
100			isMobileMenu ? switchToMobileMenu() : switchToDesktopMenu();
101		}
102	}
103
104	function addResizeHandler() {
105		window.addEventListener('resize', resizeHandler);
106	}
107
108	function resizeHandler() {
109		window.requestAnimationFrame(checkScreenWidth)
110	}
111
112	// general helpers
113
114	function runSeries(functions) {
115		functions.forEach(func => func());
116	}
117}