https://spacefarmers.io/assets/app-ce91776ab3e5c3d2803e48b88bdb093a7b05ad5c782f962e25c73127f7344305.js

1/*
2Template Name: Velzon - Admin & Dashboard Template
3Author: Themesbrand
4Version: 1.6.0
5Website: https://Themesbrand.com/
6Contact: [email protected]
7File: Main Js File
8*/
9
10("use strict");
11
12/**
13 *  global variables
14 */
15var navbarMenuHTML = document.querySelector(".navbar-menu").innerHTML;
16var horizontalMenuSplit = 7; // after this number all horizontal menus will be moved in More menu options
17var default_lang = "en"; // set Default Language
18var language = localStorage.getItem("language");
19if (typeof pointsPerBlock === 'undefined') {
20	var pointsPerBlock = 0;
21}
22
23function initLanguage() {
24	// Set new language
25	(language === null) ? setLanguage(default_lang): setLanguage(language);
26	var languages = document.getElementsByClassName("language");
27	languages && Array.from(languages).forEach(function (dropdown) {
28		dropdown.addEventListener("click", function (event) {
29			setLanguage(dropdown.getAttribute("data-lang"));
30		});
31	});
32}
33
34function getChartColorsArray(chartId) {
35	if (document.getElementById(chartId) !== null) {
36		var colors = document.getElementById(chartId).getAttribute("data-colors");
37		colors = JSON.parse(colors);
38		return colors.map(function (value) {
39			var newValue = value.replace(" ", "");
40			if (newValue.indexOf(",") === -1) {
41				var color = getComputedStyle(document.documentElement).getPropertyValue(newValue);
42				if (color) return color;
43				else return newValue;;
44			} else {
45				var val = value.split(',');
46				if (val.length == 2) {
47					var rgbaColor = getComputedStyle(document.documentElement).getPropertyValue(val[0]);
48					rgbaColor = "rgba(" + rgbaColor + "," + val[1] + ")";
49					return rgbaColor;
50				} else {
51					return newValue;
52				}
53			}
54		});
55	}
56}
57
58Chart.defaults.borderColor = "rgba(133, 141, 152, 0.1)";
59Chart.defaults.color = "#858d98";
60
61function nextHour() {
62	const now = new Date();
63	now.setHours(now.getHours() + 1);
64	now.setMinutes(0);
65	now.setSeconds(0);
66	return now;
67}
68
69function nextDay() {
70	const now = new Date();
71	now.setHours(23);
72	now.setMinutes(59);
73	now.setSeconds(59);
74	return now;
75}
76
77function nextFiveMinutes() {
78	const now = new Date();
79	now.setMinutes(now.getMinutes() + 5);
80	return now;
81}
82
83function hoursAgo(hours) {
84	const time = new Date(new Date().getTime() - (hours * 60 * 60 * 1000))
85	return time;
86}
87
88// Multi language setting
89function getLanguage() {
90	language == null ? setLanguage(default_lang) : false;
91	var request = new XMLHttpRequest();
92	// Instantiating the request object
93	request.open("GET", "assets/lang/" + language + ".json");
94	// Defining event listener for readystatechange event
95	request.onreadystatechange = function () {
96		// Check if the request is compete and was successful
97		if (this.readyState === 4 && this.status === 200) {
98			var data = JSON.parse(this.responseText);
99			Object.keys(data).forEach(function (key) {
100				var elements = document.querySelectorAll("[data-key='" + key + "']");
101				Array.from(elements).forEach(function (elem) {
102					elem.textContent = data[key];
103				});
104			});
105		}
106	};
107	// Sending the request to the server
108	request.send();
109}
110
111const getOrCreateLegendList = (chart, id) => {
112	const legendContainer = document.getElementById(id);
113	let listContainer = legendContainer.querySelector('ul');
114
115	if (!listContainer) {
116		listContainer = document.createElement('ul');
117		listContainer.style.display = 'flex';
118		if (legendContainer.dataset.flexDirection) {
119			listContainer.style.flexDirection = legendContainer.dataset.flexDirection;
120		} else {
121			listContainer.style.flexDirection = 'row';
122		}
123		listContainer.style.margin = 0;
124		listContainer.style.padding = 0;
125
126		legendContainer.appendChild(listContainer);
127	}
128
129	return listContainer;
130};
131
132const htmlLegendPlugin = {
133	id: 'htmlLegend',
134	afterUpdate(chart, args, options) {
135		const ul = getOrCreateLegendList(chart, options.containerID);
136
137		// Remove old legend items
138		while (ul.firstChild) {
139			ul.firstChild.remove();
140		}
141
142		// Reuse the built-in legendItems generator
143		const items = chart.options.plugins.legend.labels.generateLabels(chart);
144
145		items.forEach(item => {
146			const li = document.createElement('li');
147			li.style.alignItems = 'center';
148			li.style.cursor = 'pointer';
149			li.style.display = 'flex';
150			li.style.flexDirection = 'row';
151			li.style.marginLeft = '10px';
152
153			li.onclick = () => {
154				const {
155					type
156				} = chart.config;
157				if (type === 'pie' || type === 'doughnut') {
158					// Pie and doughnut charts only have a single dataset and visibility is per item
159					chart.toggleDataVisibility(item.index);
160				} else {
161					chart.setDatasetVisibility(item.datasetIndex, !chart.isDatasetVisible(item.datasetIndex));
162				}

163				chart.update();
164			};
165
166			// Color box
167			const boxSpan = document.createElement('span');
168			boxSpan.style.background = item.fillStyle;
169			boxSpan.style.borderColor = item.strokeStyle;
170			boxSpan.style.borderWidth = item.lineWidth + 'px';
171			boxSpan.style.display = 'inline-block';
172			boxSpan.style.height = '20px';
173			boxSpan.style.marginRight = '10px';
174			boxSpan.style.width = '20px';
175
176			// Text
177			const textContainer = document.createElement('p');
178			textContainer.style.color = item.fontColor;
179			textContainer.style.margin = 0;
180			textContainer.style.padding = 0;
181			textContainer.style.textDecoration = item.hidden ? 'line-through' : '';
182
183			const text = document.createTextNode(item.text);
184			textContainer.appendChild(text);
185
186			li.appendChild(boxSpan);
187			li.appendChild(textContainer);
188			ul.appendChild(li);
189		});
190	}
191};
192
193function timeDiff(utc_time) {
194	var serverTime = new Date(utc_time);
195	var clientTime = new Date().getTimezoneOffset();
196	var clientTimeUTC = new Date(new Date().getTime() + clientTime * 60000);
197	var serverTimeUTC = new Date(serverTime.getTime() + serverTime.getTimezoneOffset() * 60000);
198	var timeDifference = Math.abs(clientTimeUTC.getTime() - serverTimeUTC.getTime());
199	return timeDifference;
200}
201
202function cleanupBootstrapModal() {
203	// cleanup bootstrap modal elements
204	const backDrops = document.getElementsByClassName('modal-backdrop');
205	if (backDrops.length > 0)
206		backDrops[0].remove();
207	document.body.classList.remove('modal-open');
208	document.body.style.removeProperty("overflow");
209	document.body.style.removeProperty("padding-right");
210	// end of cleanup bootstrap modal elements
211}
212
213function copyToClipboard(elementId) {
214	var copyText = document.getElementById(elementId);
215	copyText.select();
216	copyText.setSelectionRange(0, 99999);
217	navigator.clipboard.writeText(copyText.value);
218	return false;
219}
220
221function activeMenu(menu) {
222	var elements = document.getElementsByClassName("menu-link");
223	elements && Array.from(elements).forEach(function (el) {
224		el.classList.remove("active");
225	});
226	document.getElementById("nav-" + menu).classList.add("active");
227}
228
229function activeTab(tab) {
230	var elements = document.querySelectorAll(".farmer-menu .nav-link");
231	elements && Array.from(elements).forEach(function (el) {
232		el.classList.remove("active");
233	});
234	const tabSetting = document.getElementById("tab-settings");
235	if (tabSetting)
236		tabSetting.classList.remove("active");
237	document.getElementById("tab-" + tab).classList.add("active");
238}
239
240function pluginData() {
241	/**
242	 * Common plugins
243	 */
244	/**
245	 * Toast UI Notification
246	 */
247	var toastExamples = document.querySelectorAll("[data-toast]");
248	Array.from(toastExamples).forEach(function (element) {
249		element.addEventListener("click", function () {
250			var toastData = {};
251			var isToastVal = element.attributes;
252			if (isToastVal["data-toast-text"]) {
253				toastData.text = isToastVal["data-toast-text"].value.toString();
254			}
255			if (isToastVal["data-toast-gravity"]) {
256				toastData.gravity = isToastVal["data-toast-gravity"].value.toString();
257			}
258			if (isToastVal["data-toast-position"]) {
259				toastData.position = isToastVal["data-toast-position"].value.toString();
260			}
261			if (isToastVal["data-toast-className"]) {
262				toastData.className = isToastVal["data-toast-className"].value.toString();
263			}
264			if (isToastVal["data-toast-duration"]) {
265				toastData.duration = isToastVal["data-toast-duration"].value.toString();
266			}
267			if (isToastVal["data-toast-close"]) {
268				toastData.close = isToastVal["data-toast-close"].value.toString();
269			}
270			if (isToastVal["data-toast-style"]) {
271				toastData.style = isToastVal["data-toast-style"].value.toString();
272			}
273			if (isToastVal["data-toast-offset"]) {
274				toastData.offset = isToastVal["data-toast-offset"];
275			}
276			Toastify({
277				newWindow: true,
278				text: toastData.text,
279				gravity: toastData.gravity,
280				position: toastData.position,
281				className: "bg-" + toastData.className,
282				stopOnFocus: true,
283				offset: {
284					x: toastData.offset ? 50 : 0, // horizontal axis - can be a number or a string indicating unity. eg: '2em'
285					y: toastData.offset ? 10 : 0, // vertical axis - can be a number or a string indicating unity. eg: '2em'
286				},
287				duration: toastData.duration,
288				close: toastData.close == "close" ? true : false,
289				style: toastData.style == "style" ? {
290					background: "linear-gradient(to right, #0AB39C, #405189)"
291				} : "",
292			}).showToast();
293		});
294	});
295
296	/**
297	 * Choices Select plugin
298	 */
299
300
301	/**
302	 * flatpickr
303	 */
304	var flatpickrExamples = document.querySelectorAll("[data-provider]");

305	Array.from(flatpickrExamples).forEach(function (item) {
306		if (item.getAttribute("data-provider") == "flatpickr") {
307			var dateData = {};
308			var isFlatpickerVal = item.attributes;
309			if (isFlatpickerVal["data-date-format"])
310				dateData.dateFormat = isFlatpickerVal["data-date-format"].value.toString();
311			if (isFlatpickerVal["data-enable-time"]) {
312				(dateData.enableTime = true),
313				(dateData.dateFormat = isFlatpickerVal["data-date-format"].value.toString() + " H:i");
314			}
315			if (isFlatpickerVal["data-altFormat"]) {
316				(dateData.altInput = true),
317				(dateData.altFormat = isFlatpickerVal["data-altFormat"].value.toString());
318			}
319			if (isFlatpickerVal["data-minDate"]) {
320				dateData.minDate = isFlatpickerVal["data-minDate"].value.toString();
321				dateData.dateFormat = isFlatpickerVal["data-date-format"].value.toString();
322			}
323			if (isFlatpickerVal["data-maxDate"]) {
324				dateData.maxDate = isFlatpickerVal["data-maxDate"].value.toString();
325				dateData.dateFormat = isFlatpickerVal["data-date-format"].value.toString();
326			}
327			if (isFlatpickerVal["data-deafult-date"]) {
328				dateData.defaultDate = isFlatpickerVal["data-deafult-date"].value.toString();
329				dateData.dateFormat = isFlatpickerVal["data-date-format"].value.toString();
330			}
331			if (isFlatpickerVal["data-multiple-date"]) {
332				dateData.mode = "multiple";
333				dateData.dateFormat = isFlatpickerVal["data-date-format"].value.toString();
334			}
335			if (isFlatpickerVal["data-range-date"]) {
336				dateData.mode = "range";
337				dateData.dateFormat = isFlatpickerVal["data-date-format"].value.toString();
338			}
339			if (isFlatpickerVal["data-inline-date"]) {
340				(dateData.inline = true),
341				(dateData.defaultDate = isFlatpickerVal["data-deafult-date"].value.toString());
342				dateData.dateFormat = isFlatpickerVal["data-date-format"].value.toString();
343			}
344			if (isFlatpickerVal["data-disable-date"]) {
345				var dates = [];
346				dates.push(isFlatpickerVal["data-disable-date"].value);
347				dateData.disable = dates.toString().split(",");
348			}
349			flatpickr(item, dateData);
350		} else if (item.getAttribute("data-provider") == "timepickr") {
351			var timeData = {};
352			var isTimepickerVal = item.attributes;
353			if (isTimepickerVal["data-time-basic"]) {
354				(timeData.enableTime = true),
355				(timeData.noCalendar = true),
356				(timeData.dateFormat = "H:i");
357			}
358			if (isTimepickerVal["data-time-hrs"]) {
359				(timeData.enableTime = true),
360				(timeData.noCalendar = true),
361				(timeData.dateFormat = "H:i"),
362				(timeData.time_24hr = true);
363			}
364			if (isTimepickerVal["data-min-time"]) {
365				(timeData.enableTime = true),
366				(timeData.noCalendar = true),
367				(timeData.dateFormat = "H:i"),
368				(timeData.minTime = isTimepickerVal["data-min-time"].value.toString());
369			}
370			if (isTimepickerVal["data-max-time"]) {
371				(timeData.enableTime = true),
372				(timeData.noCalendar = true),
373				(timeData.dateFormat = "H:i"),
374				(timeData.minTime = isTimepickerVal["data-max-time"].value.toString());
375			}
376			if (isTimepickerVal["data-default-time"]) {
377				(timeData.enableTime = true),
378				(timeData.noCalendar = true),
379				(timeData.dateFormat = "H:i"),
380				(timeData.defaultDate = isTimepickerVal["data-default-time"].value.toString());
381			}
382			if (isTimepickerVal["data-time-inline"]) {
383				(timeData.enableTime = true),
384				(timeData.noCalendar = true),
385				(timeData.defaultDate = isTimepickerVal["data-time-inline"].value.toString());
386				timeData.inline = true;
387			}
388			flatpickr(item, timeData);
389		}
390	});
391
392	// Dropdown
393	Array.from(document.querySelectorAll('.dropdown-menu a[data-bs-toggle="tab"]')).forEach(function (element) {
394		element.addEventListener("click", function (e) {
395			e.stopPropagation();
396			bootstrap.Tab.getInstance(e.target).show();
397		});
398	});
399}
400
401function initSelectChoices() {
402	var choicesExamples = document.querySelectorAll("[data-choices]");
403	Array.from(choicesExamples).forEach(function (item) {
404		var choiceData = {};
405		var isChoicesVal = item.attributes;
406		if (isChoicesVal["data-choices-groups"]) {
407			choiceData.placeholderValue = "This is a placeholder set in the config";
408		}
409		if (isChoicesVal["data-choices-search-false"]) {
410			choiceData.searchEnabled = false;

411		}
412		if (isChoicesVal["data-choices-search-true"]) {
413			choiceData.searchEnabled = true;
414		}
415		if (isChoicesVal["data-choices-removeItem"]) {
416			choiceData.removeItemButton = true;
417		}
418		if (isChoicesVal["data-choices-sorting-false"]) {
419			choiceData.shouldSort = false;
420		}
421		if (isChoicesVal["data-choices-sorting-true"]) {
422			choiceData.shouldSort = true;
423		}
424		if (isChoicesVal["data-choices-multiple-remove"]) {
425			choiceData.removeItemButton = true;
426		}
427		if (isChoicesVal["data-choices-limit"]) {
428			choiceData.maxItemCount = isChoicesVal["data-choices-limit"].value.toString();
429		}
430		if (isChoicesVal["data-choices-limit"]) {
431			choiceData.maxItemCount = isChoicesVal["data-choices-limit"].value.toString();
432		}
433		if (isChoicesVal["data-choices-editItem-true"]) {
434			choiceData.maxItemCount = true;
435		}
436		if (isChoicesVal["data-choices-editItem-false"]) {
437			choiceData.maxItemCount = false;
438		}
439		if (isChoicesVal["data-choices-text-unique-true"]) {
440			choiceData.duplicateItemsAllowed = false;
441		}
442		if (isChoicesVal["data-choices-text-disabled-true"]) {
443			choiceData.addItems = false;
444		}
445		isChoicesVal["data-choices-text-disabled-true"] ? new Choices(item, choiceData).disable() : new Choices(item, choiceData);
446	});
447}
448
449// on click collapse menu
450function isCollapseMenu() {
451	/**
452	 * Sidebar menu collapse
453	 */
454	if (document.querySelectorAll(".navbar-nav .collapse")) {
455		var collapses = document.querySelectorAll(".navbar-nav .collapse");
456		Array.from(collapses).forEach(function (collapse) {
457			// Init collapses
458			var collapseInstance = new bootstrap.Collapse(collapse, {
459				toggle: false,
460			});
461			// Hide sibling collapses on `show.bs.collapse`
462			collapse.addEventListener("show.bs.collapse", function (e) {
463				e.stopPropagation();
464				var closestCollapse = collapse.parentElement.closest(".collapse");
465				if (closestCollapse) {
466					var siblingCollapses = closestCollapse.querySelectorAll(".collapse");
467					Array.from(siblingCollapses).forEach(function (siblingCollapse) {
468						var siblingCollapseInstance = bootstrap.Collapse.getInstance(siblingCollapse);
469						if (siblingCollapseInstance === collapseInstance) {
470							return;
471						}
472						siblingCollapseInstance.hide();
473					});
474				} else {
475					var getSiblings = function (elem) {
476						// Setup siblings array and get the first sibling
477						var siblings = [];
478						var sibling = elem.parentNode.firstChild;
479						// Loop through each sibling and push to the array
480						while (sibling) {
481							if (sibling.nodeType === 1 && sibling !== elem) {
482								siblings.push(sibling);
483							}
484							sibling = sibling.nextSibling;
485						}
486						return siblings;
487					};
488					var siblings = getSiblings(collapse.parentElement);
489					Array.from(siblings).forEach(function (item) {
490						if (item.childNodes.length > 2)
491							item.firstElementChild.setAttribute("aria-expanded", "false");
492						var ids = item.querySelectorAll("*[id]");
493						Array.from(ids).forEach(function (item1) {
494							item1.classList.remove("show");
495							if (item1.childNodes.length > 2) {
496								var val = item1.querySelectorAll("ul li a");
497								Array.from(val).forEach(function (subitem) {
498									if (subitem.hasAttribute("aria-expanded"))
499										subitem.setAttribute("aria-expanded", "false");
500								});
501							}
502						});
503					});
504				}
505			});
506
507			// Hide nested collapses on `hide.bs.collapse`
508			collapse.addEventListener("hide.bs.collapse", function (e) {
509				e.stopPropagation();
510				var childCollapses = collapse.querySelectorAll(".collapse");
511				Array.from(childCollapses).forEach(function (childCollapse) {
512					childCollapseInstance = bootstrap.Collapse.getInstance(childCollapse);
513					childCollapseInstance.hide();
514				});
515			});
516		});
517	}
518}
519
520/**
521 * Generate two column menu
522 */
523function twoColumnMenuGenerate() {
524	var isTwoColumn = document.documentElement.getAttribute("data-layout");
525	var isValues = sessionStorage.getItem("defaultAttribute");
526	var defaultValues = JSON.parse(isValues);
527
528	if (defaultValues && (isTwoColumn == "twocolumn" || defaultValues["data-layout"] == "twocolumn")) {
529		document.querySelector(".navbar-menu").innerHTML = navbarMenuHTML;
530
531		var ul = document.createElement("ul");
532		ul.innerHTML = '<a href="#" class="logo"><img src="assets/images/logo-sm.png" alt="" height="22"></a>';
533		Array.from(document.getElementById("navbar-nav").querySelectorAll(".menu-link")).forEac

533h(function (item) {
534			ul.className = "twocolumn-iconview";
535			var li = document.createElement("li");
536			var a = item;
537			Array.from(a.querySelectorAll("span")).forEach(function (element) {
538				element.classList.add("d-none");
539			});
540
541			if (item.parentElement.classList.contains("twocolumn-item-show")) {
542				item.classList.add("active");
543			}
544			li.appendChild(a);
545			ul.appendChild(li);
546
547			a.classList.contains("nav-link") ? a.classList.replace("nav-link", "nav-icon") : "";
548			a.classList.remove("collapsed", "menu-link");
549		});
550		var currentPath = location.pathname == "/" ? "index.html" : location.pathname.substring(1);
551		currentPath = currentPath.substring(currentPath.lastIndexOf("/") + 1);
552		if (currentPath) {
553			// navbar-nav
554			var a = document.getElementById("navbar-nav").querySelector('[href="' + currentPath + '"]');
555
556			if (a) {
557				var parentCollapseDiv = a.closest(".collapse.menu-dropdown");
558				if (parentCollapseDiv) {
559					parentCollapseDiv.classList.add("show");
560					parentCollapseDiv.parentElement.children[0].classList.add("active");
561					parentCollapseDiv.parentElement.children[0].setAttribute("aria-expanded", "true");
562					if (parentCollapseDiv.parentElement.closest(".collapse.menu-dropdown")) {
563						parentCollapseDiv.parentElement.closest(".collapse").classList.add("show");
564						if (parentCollapseDiv.parentElement.closest(".collapse").previousElementSibling)
565							parentCollapseDiv.parentElement.closest(".collapse").previousElementSibling.classList.add("active");
566						if (parentCollapseDiv.parentElement.parentElement.parentElement.parentElement.closest(".collapse.menu-dropdown")) {
567							parentCollapseDiv.parentElement.parentElement.parentElement.parentElement.closest(".collapse").classList.add("show");
568							if (parentCollapseDiv.parentElement.parentElement.parentElement.parentElement.closest(".collapse").previousElementSibling) {
569								parentCollapseDiv.parentElement.parentElement.parentElement.parentElement.closest(".collapse").previousElementSibling.classList.add("active");
570							}
571						}
572					}
573				}
574			}
575		}
576		// add all sidebar menu icons
577		document.getElementById("two-column-menu").innerHTML = ul.outerHTML;
578
579		// show submenu on sidebar menu click
580		Array.from(document.querySelector("#two-column-menu ul").querySelectorAll("li a")).forEach(function (element) {
581			var currentPath = location.pathname == "/" ? "index.html" : location.pathname.substring(1);
582			currentPath = currentPath.substring(currentPath.lastIndexOf("/") + 1);
583			element.addEventListener("click", function (e) {
584				if (!(currentPath == "/" + element.getAttribute("href") && !element.getAttribute("data-bs-toggle")))
585					document.body.classList.contains("twocolumn-panel") ? document.body.classList.remove("twocolumn-panel") : "";
586				document.getElementById("navbar-nav").classList.remove("twocolumn-nav-hide");
587				document.querySelector(".hamburger-icon").classList.remove("open");
588				if ((e.target && e.target.matches("a.nav-icon")) || (e.target && e.target.matches("i"))) {
589					if (document.querySelector("#two-column-menu ul .nav-icon.active") !== null)
590						document.querySelector("#two-column-menu ul .nav-icon.active").classList.remove("active");
591					e.target.matches("i") ? e.target.closest("a").classList.add("active") : e.target.classList.add("active");
592
593					var twoColumnItem = document.getElementsByClassName("twocolumn-item-show");
594
595					twoColumnItem.length > 0 ? twoColumnItem[0].classList.remove("twocolumn-item-show") : "";
596
597					var currentMenu = e.target.matches("i") ? e.target.closest("a") : e.target;
598					var childMenusId = currentMenu.getAttribute("href").slice(1);
599					if (document.getElementById(childMenusId))
600						document.getElementById(childMenusId).parentElement.classList.add("twocolumn-item-show");
601				}
602			});
603
604			// add active class to the sidebar menu icon who has direct link
605			if (currentPath == "/" + element.getAttribute("href") && !element.getAttribute("data-bs-toggle")) {
606				element.classList.add("active");
607				document.getElementById("navbar-nav").classList.add("twocolumn-nav-hide");
608				if (document.querySelector(".hamburger-icon")) {
609					document.querySelector(".hamburger-icon").classList.add("open");
610				}
611			}
612		});
613
614		var currentLayout = document.documentElement.getAttribute("data-layout");
615		if (currentLayout !== "horizontal") {
616			var simpleBar = new SimpleBar(document.getElementById("navbar-nav"));
617			if (simpleBar) simpleBar.getContentElement();
618
619			var simpleBar1 = new SimpleBar(
620				document.getElementsByClassName("twocolumn-iconview")[0]
621			);
622			if (simpleBar1) simpleBar1.getContentElement();
623		}
624	}
625}
626
627//  Search menu dropdown on Topbar
628function isCustomDropdown() {
629	//Search bar
630	var searchOptions = document.getElementById("search-close-options");
631	var dropdown = document.getElementById("search-dropdown");
632	var searchInput = document.getElementById("search-options");
633	if (searchInput) {
634		searchInput.addEventListener("focus", function () {
635			var inputLength = searchInput.value.length;
636			if (inputLength > 0) {
637				dropdown.classList.add("show");
638				searchOptions.classList.remove("d-none");
639			} else {
640				dropdown.classList.remove("show");
641				searchOptions.classList.add("d-none");
642			}
643		});
644
645		searchInput.addEventListener("keyup", function (event) {
646			var inputLength = searchInput.value.length;
647			if (inputLength > 0) {
648				dropdown.classList.add("show");
649				searchOptions.classList.remove("d-none");
650
651				var inputVal = searchInput.value.toLowerCase();
652				var notifyItem = document.getElementsByClassName("notify-item");
653				Array.from(notifyItem).forEach(function (element) {
654					var notifiTxt = (element.getElementsByTagName("span")) ? element.getElementsByTagName("span")[0].innerText.toLowerCase() : '';
655					if (notifiTxt)
656						element.style.display = notifiTxt.includes(inputVal) ? "block" : "none";
657				});
658			} else {
659				dropdown.classList.remove("show");
660				searchOptions.classList.add("d-none");
661			}
662		});
663
664		searchOptions.addEventListener("click", function () {
665			searchInput.value = "";
666			dropdown.classList.remove("show");
667			searchOptions.classList.add("d-none");
668		});
669
670		document.body.addEventListener("click", function (e) {
671			if (e.target.getAttribute("id") !== "search-options") {
672				dropdown.classList.remove("show");
673				searchOptions.classList.add("d-none");
674			}
675		});
676	}
677}
678//  search menu dropdown on topbar
679function isCustomDropdownResponsive() {
680	//Search bar
681	var searchOptions = document.getElementById("search-close-options");
682	var dropdownReponsive = document.getElementById("search-dropdown-reponsive");
683	var searchInputReponsive = document.getElementById("search-options-reponsive");
684
685	if (searchOptions && dropdownReponsive && searchInputReponsive) {
686		searchInputReponsive.addEventListener("focus", function () {
687			var inputLength = searchInputReponsive.value.length;
688			if (inputLength > 0) {
689				dropdownReponsive.classList.add("show");
690				searchOptions.classList.remove("d-none");
691			} else {
692				dropdownReponsive.classList.remove("show");
693				searchOptions.classList.add("d-none");
694			}
695		});
696
697		searchInputReponsive.addEventListener("keyup", function () {
698			var inputLength = searchInputReponsive.value.length;
699			if (inputLength > 0) {
700				dropdownReponsive.classList.add("show");
701				searchOptions.classList.remove("d-none");
702			} else {
703				dropdownReponsive.classList.remove("show");
704				searchOptions.classList.add("d-none");
705			}
706		});
707
708		searchOptions.addEventListener("click", function () {
709			searchInputReponsive.value = "";
710			dropdownReponsive.classList.remove("show");
711			searchOptions.classList.add("d-none");
712		});
713
714		document.body.addEventListener("click", function (e) {
715			if (e.target.getAttribute("id") !== "search-options") {
716				dropdownReponsive.classList.remove("show");
717				searchOptions.classList.add("d-none");
718			}
719		});
720	}
721}
722
723function elementInViewport(el) {
724	if (el) {
725		var top = el.offsetTop;
726		var left = el.offsetLeft;
727		var width = el.offsetWidth;
728		var height = el.offsetHeight;
729
730		if (el.offsetParent) {
731			while (el.offsetParent) {
732				el = el.offsetParent;
733				top += el.offsetTop;
734				left += el.offsetLeft;
735			}
736		}
737		return (
738			top >= window.pageYOffset &&
739			left >= window.pageXOffset &&
740			top + height <= window.pageYOffset + window.innerHeight &&
741			left + width <= window.pageXOffset + window.innerWidth
742		);
743	}
744}
745
746function initLeftMenuCollapse() {
747	/**
748	 * Vertical layout menu scroll add
749	 */
750	if (document.documentElement.getAttribute("data-layout") == "vertical") {
751		document.getElementById("two-column-menu").innerHTML = "";
752		document.querySelector(".navbar-menu").innerHTML = navbarMenuHTML;
753
754		document.getElementById("scrollbar").setAttribute("data-simplebar", "");
755		document.getElementById("navbar-nav").setAttribute("data-simplebar", "");
756		document.getElementById("scrollbar").classList.add("h-100");
757	}
758
759	/**
760	 * Two-column layout menu scroll add
761	 */
762	if (document.documentElement.getAttribute("data-layout") == "twocolumn") {
763		document.getElementById("scrollbar").removeAttribute("data-simplebar");
764		document.getElementById("scrollbar").classList.remove("h-100");
765	}
766
767	/**
768	 * Horizontal layout menu
769	 */
770	if (document.documentElement.getAttribute("data-layout") == "horizontal") {
771		updateHorizontalMenus();
772	}
773}
774
775function isLoadBodyElement() {
776	var verticalOverlay = document.getElementsByClassName("vertical-overlay");
777	if (verticalOverlay) {

778		Array.from(verticalOverlay).forEach(function (element) {
779			element.addEventListener("click", function () {
780				document.body.classList.remove("vertical-sidebar-enable");
781				if (sessionStorage.getItem("data-layout") == "twocolumn")
782					document.body.classList.add("twocolumn-panel");
783				else
784					document.documentElement.setAttribute("data-sidebar-size", sessionStorage.getItem("data-sidebar-size"));
785			});
786		});
787	}
788}
789
790function windowResizeHover() {
791	feather.replace();
792	var windowSize = document.documentElement.clientWidth;
793	if (windowSize < 1025 && windowSize > 767) {
794		document.body.classList.remove("twocolumn-panel");
795		if (sessionStorage.getItem("data-layout") == "twocolumn") {
796			document.documentElement.setAttribute("data-layout", "twocolumn");
797			if (document.getElementById("customizer-layout03")) {
798				document.getElementById("customizer-layout03").click();
799			}
800			twoColumnMenuGenerate();
801			initTwoColumnActiveMenu();
802			isCollapseMenu();
803		}
804		if (sessionStorage.getItem("data-layout") == "vertical") {
805			document.documentElement.setAttribute("data-sidebar-size", "sm");
806		}
807		if (document.querySelector(".hamburger-icon")) {
808			document.querySelector(".hamburger-icon").classList.add("open");
809		}
810	} else if (windowSize >= 1025) {
811		document.body.classList.remove("twocolumn-panel");
812		if (sessionStorage.getItem("data-layout") == "twocolumn") {
813			document.documentElement.setAttribute("data-layout", "twocolumn");
814			if (document.getElementById("customizer-layout03")) {
815				document.getElementById("customizer-layout03").click();
816			}
817			twoColumnMenuGenerate();
818			initTwoColumnActiveMenu();
819			isCollapseMenu();
820		}
821		if (sessionStorage.getItem("data-layout") == "vertical") {
822			document.documentElement.setAttribute(
823				"data-sidebar-size",
824				sessionStorage.getItem("data-sidebar-size")
825			);
826		}
827		if (document.querySelector(".hamburger-icon")) {
828			document.querySelector(".hamburger-icon").classList.remove("open");
829		}
830	} else if (windowSize <= 767) {
831		document.body.classList.remove("vertical-sidebar-enable");
832		document.body.classList.add("twocolumn-panel");
833		if (sessionStorage.getItem("data-layout") == "twocolumn") {
834			document.documentElement.setAttribute("data-layout", "vertical");
835			hideShowLayoutOptions("vertical");
836			isCollapseMenu();
837		}
838		if (sessionStorage.getItem("data-layout") != "horizontal") {
839			document.documentElement.setAttribute("data-sidebar-size", "lg");
840		}
841		if (document.querySelector(".hamburger-icon")) {
842			document.querySelector(".hamburger-icon").classList.add("open");
843		}
844	}
845
846	var isElement = document.querySelectorAll("#navbar-nav > li.nav-item");
847	Array.from(isElement).forEach(function (item) {
848		item.addEventListener("click", menuItem.bind(this), false);
849		item.addEventListener("mouseover", menuItem.bind(this), false);
850	});
851}
852
853function menuItem(e) {
854	if (e.target && e.target.matches("a.nav-link span")) {
855		if (elementInViewport(e.target.parentElement.nextElementSibling) == false) {
856			e.target.parentElement.nextElementSibling.classList.add("dropdown-custom-right");
857			e.target.parentElement.parentElement.parentElement.parentElement.classList.add("dropdown-custom-right");
858			var eleChild = e.target.parentElement.nextElementSibling;
859			Array.from(eleChild.querySelectorAll(".menu-dropdown")).forEach(function (item) {
860				item.classList.add("dropdown-custom-right");
861			});
862		} else if (elementInViewport(e.target.parentElement.nextElementSibling) == true) {
863			if (window.innerWidth >= 1848) {
864				var elements = document.getElementsByClassName("dropdown-custom-right");
865				while (elements.length > 0) {
866					elements[0].classList.remove("dropdown-custom-right");
867				}
868			}
869		}
870	}
871
872	if (e.target && e.target.matches("a.nav-link")) {
873		if (elementInViewport(e.target.nextElementSibling) == false) {
874			e.target.nextElementSibling.classList.add("dropdown-custom-right");
875			e.target.parentElement.parentElement.parentElement.classList.add("dropdown-custom-right");
876			var eleChild = e.target.nextElementSibling;
877			Array.from(eleChild.querySelectorAll(".menu-dropdown")).forEach(function (item) {
878				item.classList.add("dropdown-custom-right");
879			});
880		} else if (elementInViewport(e.target.nextElementSibling) == true) {
881			if (window.innerWidth >= 1848) {
882				var elements = document.getElementsByClassName("dropdown-custom-right");
883				while (elements.length > 0) {
884					elements[0].classList.remove("dropdown-custom-right");
885				}
886			}
887		}
888	}
889}
890
891function closeMenu() {
892	document.querySelector(".hamburger-icon").classList.remove("open");
893	document.body.classList.remove("menu");
894}
895
896function toggleHamburgerMenu() {
897	var windowSize = document.documentElement.clientWidth;
898
899	if (windowSize > 767)
900		document.querySelector(".hamburger-icon").classList.toggle("open");
901
902	//For collapse horizontal menu
903	if (document.documentElement.getAttribute("data-layout") === "horizontal") {
904		document.body.classList.contains("menu") ? document.body.classList.remove("menu") : document.body.classList.add("menu");
905	}
906
907	//For collapse vertical menu
908	if (document.documentElement.getAttribute("data-layout") === "vertical") {
909		if (windowSize < 1025 && windowSize > 767) {
910			document.body.classList.remove("vertical-sidebar-enable");
911			document.documentElement.getAttribute("data-sidebar-size") == "sm" ?
912				document.documentElement.setAttribute("data-sidebar-size", "") :
913				document.documentElement.setAttribute("data-sidebar-size", "sm");
914		} else if (windowSize > 1025) {
915			document.body.classList.remove("vertical-sidebar-enable");
916			document.documentElement.getAttribute("data-sidebar-size") == "lg" ?
917				document.documentElement.setAttribute("data-sidebar-size", "sm") :
918				document.documentElement.setAttribute("data-sidebar-size", "lg");
919		} else if (windowSize <= 767) {
920			document.body.classList.add("vertical-sidebar-enable");
921			document.documentElement.setAttribute("data-sidebar-size", "lg");
922		}
923	}
924
925	//Two column menu
926	if (document.documentElement.getAttribute("data-layout") == "twocolumn") {

927		document.body.classList.contains("twocolumn-panel") ?
928			document.body.classList.remove("twocolumn-panel") :
929			document.body.classList.add("twocolumn-panel");
930	}
931}
932
933function windowLoadContent() {
934	// Demo show code
935	document.addEventListener("DOMContentLoaded", function () {
936		var checkbox = document.getElementsByClassName("code-switcher");
937		Array.from(checkbox).forEach(function (check) {
938			check.addEventListener("change", function () {
939				var card = check.closest(".card");
940				var preview = card.querySelector(".live-preview");
941				var code = card.querySelector(".code-view");
942
943				if (check.checked) {
944					preview.classList.add("d-none");
945					code.classList.remove("d-none");
946				} else {
947					preview.classList.remove("d-none");
948					code.classList.add("d-none");
949				}
950			});
951		});
952		feather.replace();
953	});
954
955	window.addEventListener("resize", windowResizeHover);
956	windowResizeHover();
957
958	Waves.init();
959
960	document.addEventListener("scroll", function () {
961		windowScroll();
962	});
963
964	window.addEventListener("load", function () {
965		var isTwoColumn = document.documentElement.getAttribute("data-layout");
966		if (isTwoColumn == "twocolumn") {
967			initTwoColumnActiveMenu();
968		} else {
969			initActiveMenu();
970		}
971		isLoadBodyElement();
972		addEventListenerOnSmHoverMenu();
973	});
974	if (document.getElementById("topnav-hamburger-icon")) {
975		document.getElementById("topnav-hamburger-icon").addEventListener("click", toggleHamburgerMenu);
976	}
977	var isValues = sessionStorage.getItem("defaultAttribute");
978	var defaultValues = JSON.parse(isValues);
979	var windowSize = document.documentElement.clientWidth;
980}
981
982// page topbar class added
983function windowScroll() {
984	var pageTopbar = document.getElementById("page-topbar");
985	if (pageTopbar) {
986		document.body.scrollTop >= 50 || document.documentElement.scrollTop >= 50 ? pageTopbar.classList.add("topbar-shadow") : pageTopbar.classList.remove("topbar-shadow");
987	}
988}
989
990// convert UTC times
991function convertUTCTime() {
992	[...document.getElementsByClassName("utc-time")].forEach((element) => {
993		const date = new Date(element.dataset.date);
994		if (date == "Invalid Date")
995			return;
996
997  	var options = {
998			hour: 'numeric',
999			minute: 'numeric',
1000			hour12: getTime() == '12H',
1001		};
1002		if (!element.classList.contains('hide-date'))
1003			options = {
1004				...options,
1005				year: 'numeric',
1006				month: 'short',
1007				day: 'numeric'
1008			};
1009		if (!element.classList.contains('hide-seconds'))
1010			options = {
1011				...options,
1012				second: 'numeric'
1013			};
1014		element.innerHTML = date.toLocaleString(undefined, options);
1015	});
1016}
1017
1018// Two-column menu activation
1019function initTwoColumnActiveMenu() {
1020	feather.replace();
1021	// two column sidebar active js
1022	var currentPath = location.pathname == "/" ? "index.html" : location.pathname.substring(1);
1023	currentPath = currentPath.substring(currentPath.lastIndexOf("/") + 1);
1024	if (currentPath) {
1025		if (document.body.className == "twocolumn-panel") {
1026			document.getElementById("two-column-menu").querySelector('[href="' + currentPath + '"]').classList.add("active");
1027		}
1028		// navbar-nav
1029		var a = document.getElementById("navbar-nav").querySelector('[href="' + currentPath + '"]');
1030		if (a) {
1031			a.classList.add("active");
1032			var parentCollapseDiv = a.closest(".collapse.menu-dropdown");
1033			if (parentCollapseDiv && parentCollapseDiv.parentElement.closest(".collapse.menu-dropdown")) {
1034				parentCollapseDiv.classList.add("show");
1035				parentCollapseDiv.parentElement.children[0].classList.add("active");
1036				parentCollapseDiv.parentElement.closest(".collapse.menu-dropdown").parentElement.classList.add("twocolumn-item-show");
1037				if (parentCollapseDiv.parentElement.parentElement.parentElement.parentElement.closest(".collapse.menu-dropdown")) {
1038					var menuIdSub = parentCollapseDiv.parentElement.parentElement.parentElement.parentElement.closest(".collapse.menu-dropdown").getAttribute("id");
1039					parentCollapseDiv.parentElement.parentElement.parentElement.parentElement.closest(".collapse.menu-dropdown").parentElement.classList.add("twocolumn-item-show");
1040					parentCollapseDiv.parentElement.closest(".collapse.menu-dropdown").parentElement.classList.remove("twocolumn-item-show");
1041					if (document.getElementById("two-column-menu").querySelector('[href="#' + menuIdSub + '"]'))
1042						document.getElementById("two-column-menu").querySelector('[href="#' + menuIdSub + '"]').classList.add("active");
1043				}
1044				var menuId = parentCollapseDiv.parentElement.closest(".collapse.menu-dropdown").getAttribute("id");
1045				if (document.getElementById("two-column-menu").querySelector('[href="#' + menuId + '"]'))
1046					document.getElementById("two-column-menu").querySelector('[href="#' + menuId + '"]').classList.add("active");
1047			} else {
1048				a.closest(".collapse.menu-dropdown").parentElement.classList.add("twocolumn-item-show");
1049				var menuId = parentCollapseDiv.getAttribute("id");
1050				if (document.getElementById("two-column-menu").querySelector('[href="#' + menuId + '"]'))
1051					document.getElementById("two-column-menu").querySelector('[href="#' + menuId + '"]').classList.add("active");
1052			}
1053		} else {

1054			document.body.classList.add("twocolumn-panel");
1055		}
1056	}
1057}
1058
1059// two-column sidebar active js
1060function initActiveMenu() {
1061	var currentPath = location.pathname == "/" ? "index.html" : location.pathname.substring(1);
1062	currentPath = currentPath.substring(currentPath.lastIndexOf("/") + 1);
1063	if (currentPath) {
1064		// navbar-nav
1065		var a = document.getElementById("navbar-nav").querySelector('[href="' + currentPath + '"]');
1066		if (a) {
1067			a.classList.add("active");
1068			var parentCollapseDiv = a.closest(".collapse.menu-dropdown");
1069			if (parentCollapseDiv) {
1070				parentCollapseDiv.classList.add("show");
1071				parentCollapseDiv.parentElement.children[0].classList.add("active");
1072				parentCollapseDiv.parentElement.children[0].setAttribute("aria-expanded", "true");
1073				if (parentCollapseDiv.parentElement.closest(".collapse.menu-dropdown")) {
1074					parentCollapseDiv.parentElement.closest(".collapse").classList.add("show");
1075					if (parentCollapseDiv.parentElement.closest(".collapse").previousElementSibling)
1076						parentCollapseDiv.parentElement.closest(".collapse").previousElementSibling.classList.add("active");
1077
1078					if (parentCollapseDiv.parentElement.parentElement.parentElement.parentElement.closest(".collapse.menu-dropdown")) {
1079						parentCollapseDiv.parentElement.parentElement.parentElement.parentElement.closest(".collapse").classList.add("show");
1080						if (parentCollapseDiv.parentElement.parentElement.parentElement.parentElement.closest(".collapse").previousElementSibling) {
1081							parentCollapseDiv.parentElement.parentElement.parentElement.parentElement.closest(".collapse").previousElementSibling.classList.add("active");
1082							if ((document.documentElement.getAttribute("data-layout") == "horizontal") && parentCollapseDiv.parentElement.parentElement.parentElement.parentElement.parentElement.parentElement.parentElement.closest(".collapse")) {
1083								parentCollapseDiv.parentElement.parentElement.parentElement.parentElement.parentElement.parentElement.parentElement.closest(".collapse").previousElementSibling.classList.add("active")
1084							}
1085						}
1086					}
1087				}
1088			}
1089		}
1090	}
1091}
1092
1093function elementInViewport(el) {
1094	if (el) {
1095		var top = el.offsetTop;
1096		var left = el.offsetLeft;
1097		var width = el.offsetWidth;
1098		var height = el.offsetHeight;
1099
1100		if (el.offsetParent) {
1101			while (el.offsetParent) {
1102				el = el.offsetParent;
1103				top += el.offsetTop;
1104				left += el.offsetLeft;
1105			}
1106		}
1107		return (
1108			top >= window.pageYOffset &&
1109			left >= window.pageXOffset &&
1110			top + height <= window.pageYOffset + window.innerHeight &&
1111			left + width <= window.pageXOffset + window.innerWidth
1112		);
1113	}
1114}
1115
1116function initComponents() {
1117	// tooltip
1118	var tooltipTriggerList = [].slice.call(
1119		document.querySelectorAll('[data-bs-toggle="tooltip"]')
1120	);
1121	tooltipTriggerList.map(function (tooltipTriggerEl) {
1122		return new bootstrap.Tooltip(tooltipTriggerEl);
1123	});
1124
1125	// popover
1126	var popoverTriggerList = [].slice.call(
1127		document.querySelectorAll('[data-bs-toggle="popover"]')
1128	);
1129	popoverTriggerList.map(function (popoverTriggerEl) {
1130		return new bootstrap.Popover(popoverTriggerEl);
1131	});
1132}
1133
1134// Counter Number
1135function startCounters() {
1136	var counter = document.querySelectorAll(".counter-value");
1137	var speed = 100; // The lower the slower
1138	counter &&
1139		Array.from(counter).forEach(function (counter_value) {
1140			function updateCount() {
1141				var target = +counter_value.getAttribute("data-target");
1142				var step = counter_value.getAttribute("data-step");
1143				var decimals = +counter_value.getAttribute("data-decimals");
1144				var count = +counter_value.innerText;
1145				if (step == undefined) {
1146					var inc = target / speed;
1147					if (inc < 1) {
1148						inc = 1;
1149					}
1150				} else {
1151					var inc = +step;
1152				}
1153				// Check if target is reached
1154				if (count < target) {
1155					// Add inc to count and output in counter_value
1156					counter_value.innerText = (count + inc).toFixed(decimals);
1157					// Call function every ms
1158					setTimeout(updateCount, 1);
1159				} else {
1160					counter_value.innerText = numberWithCommas(target);
1161				}
1162				numberWithCommas(counter_value.innerText);
1163			}
1164			updateCount();
1165		});
1166
1167	function numberWithCommas(x) {
1168		return x.toString().replace(/\B(?=(\d{3})+(?!\d))/g, ",");
1169	}
1170}
1171
1172function updateHorizontalMenus() {
1173	document.getElementById("two-column-menu").innerHTML = "";
1174	document.querySelector(".navbar-menu").innerHTML = navbarMenuHTML;
1175
1176	document.getElementById("scrollbar").removeAttribute("data-simplebar");
1177	document.getElementById("navbar-nav").removeAttribute("data-simplebar");
1178	document.getElementById("scrollbar").classList.remove("h-100");
1179
1180	var splitMenu = horizontalMenuSplit;
1181	var extraMenuName = "More";
1182	var menuData = document.querySelectorAll("ul.navbar-nav > li.nav-item");
1183	var newMenus = "";
1184	var splitItem = "";
1185

1186	Array.from(menuData).forEach(function (item, index) {
1187		if (index + 1 === splitMenu) {
1188			splitItem = item;
1189		}
1190		if (index + 1 > splitMenu) {
1191			newMenus += item.outerHTML;
1192			item.remove();
1193		}
1194
1195		if (index + 1 === menuData.length) {
1196			if (splitItem.insertAdjacentHTML) {
1197				splitItem.insertAdjacentHTML(
1198					"afterend",
1199					'<li class="nav-item">\
1200						<a class="nav-link" href="#sidebarMore" data-bs-toggle="collapse" role="button" aria-expanded="false" aria-controls="sidebarMore">\
1201							<i class="ri-briefcase-2-line"></i> ' + extraMenuName + '\
1202						</a>\
1203						<div class="collapse menu-dropdown" id="sidebarMore"><ul class="nav nav-sm flex-column">' + newMenus + "</ul></div>\
1204					</li>");
1205			}
1206		}
1207	});
1208}
1209
1210function hideShowLayoutOptions(dataLayout) {
1211	if (dataLayout == "vertical") {
1212		document.getElementById("two-column-menu").innerHTML = "";
1213		document.querySelector(".navbar-menu").innerHTML = navbarMenuHTML;
1214		if (document.getElementById("theme-settings-offcanvas")) {
1215			document.getElementById("sidebar-size").style.display = "block";
1216			document.getElementById("sidebar-view").style.display = "block";
1217			document.getElementById("sidebar-color").style.display = "block";
1218			document.getElementById("sidebar-img").style.display = "block";
1219			document.getElementById("layout-position").style.display = "block";
1220			document.getElementById("layout-width").style.display = "block";
1221		}
1222		initLeftMenuCollapse();
1223		initActiveMenu();
1224		addEventListenerOnSmHoverMenu();
1225		initMenuItemScroll();
1226	} else if (dataLayout == "horizontal") {
1227		updateHorizontalMenus();
1228		if (document.getElementById("theme-settings-offcanvas")) {
1229			document.getElementById("sidebar-size").style.display = "none";
1230			document.getElementById("sidebar-view").style.display = "none";
1231			document.getElementById("sidebar-color").style.display = "none";
1232			document.getElementById("sidebar-img").style.display = "none";
1233			document.getElementById("layout-position").style.display = "block";
1234			document.getElementById("layout-width").style.display = "block";
1235		}
1236		initActiveMenu();
1237	} else if (dataLayout == "twocolumn") {
1238		document.getElementById("scrollbar").removeAttribute("data-simplebar");
1239		document.getElementById("scrollbar").classList.remove("h-100");
1240		if (document.getElementById("theme-settings-offcanvas")) {
1241			document.getElementById("sidebar-size").style.display = "none";
1242			document.getElementById("sidebar-view").style.display = "none";
1243			document.getElementById("sidebar-color").style.display = "block";
1244			document.getElementById("sidebar-img").style.display = "block";
1245			document.getElementById("layout-position").style.display = "none";
1246			document.getElementById("layout-width").style.display = "none";
1247		}
1248	}
1249}
1250
1251// add listener Sidebar Hover icon on change layout from setting
1252function addEventListenerOnSmHoverMenu() {
1253	document.getElementById("vertical-hover").addEventListener("click", function () {
1254		if (document.documentElement.getAttribute("data-sidebar-size") === "sm-hover") {
1255			document.documentElement.setAttribute("data-sidebar-size", "sm-hover-active");
1256		} else if (document.documentElement.getAttribute("data-sidebar-size") === "sm-hover-active") {
1257			document.documentElement.setAttribute("data-sidebar-size", "sm-hover");
1258		} else {
1259			document.documentElement.setAttribute("data-sidebar-size", "sm-hover");
1260		}
1261	});
1262}
1263// set full layout
1264function layoutSwitch(isLayoutAttributes) {
1265	switch (isLayoutAttributes) {
1266		case isLayoutAttributes:
1267			switch (isLayoutAttributes["data-layout"]) {
1268				case "vertical":
1269					getElementUsingTagname("data-layout", "vertical");
1270					sessionStorage.setItem("data-layout", "vertical");
1271					document.documentElement.setAttribute("data-layout", "vertical");
1272					hideShowLayoutOptions("vertical");
1273					isCollapseMenu();
1274					break;
1275				case "horizontal":
1276					getElementUsingTagname("data-layout", "horizontal");
1277					sessionStorage.setItem("data-layout", "horizontal");
1278					document.documentElement.setAttribute("data-layout", "horizontal");
1279					hideShowLayoutOptions("horizontal");
1280					break;
1281				case "twocolumn":
1282					getElementUsingTagname("data-layout", "twocolumn");
1283					sessionStorage.setItem("data-layout", "twocolumn");
1284					document.documentElement.setAttribute("data-layout", "twocolumn");
1285					hideShowLayoutOptions("twocolumn");
1286					break;
1287				default:
1288					if (sessionStorage.getItem("data-layout") == "vertical" && sessionStorage.getItem("data-layout")) {
1289						getElementUsingTagname("data-layout", "vertical");
1290						sessionStorage.setItem("data-layout", "vertical");
1291						document.documentElement.setAttribute("data-layout", "vertical");
1292						hideShowLayoutOptions("vertical");
1293						isCollapseMenu();
1294					} else if (sessionStorage.getItem("data-layout") == "horizontal") {
1295						getElementUsingTagname("data-layout", "horizontal");
1296						sessionStorage.setItem("data-layout", "horizontal");
1297						document.documentElement.setAttribute("data-layout", "horizontal");
1298						hideShowLayoutOptions("horizontal");
1299					} else if (sessionStorage.getItem("data-layout") == "twocolumn") {
1300						getElementUsingTagname("data-layout", "twocolumn");
1301						sessionStorage.setItem("data-layout", "twocolumn");
1302						document.documentElement.setAttribute("data-layout", "twocolumn");
1303						hideShowLayoutOptions("twocolumn");
1304					}
1305					break;
1306			}
1307			switch (isLayoutAttributes["data-topbar"]) {
1308				case "light":
1309					getElementUsingTagname("data-topbar", "light");
1310					sessionStorage.setItem("data-topbar", "light");
1311					document.documentElement.setAttribute("data-topbar", "light");
1312					break;
1313				case "dark":
1314					getElementUsingTagname("data-topbar", "dark");
1315					sessionStorage.setItem("data-topbar", "dark");
1316					document.documentElement.setAttribute("data-topbar", "dark");
1317					break;
1318				default:
1319					if (sessionStorage.getItem("data-topbar") == "dark") {
1320						getElementUsingTagname("data-topbar", "dark");
1321						sessionStorage.setItem("data-topbar", "dark");
1322						document.documentElement.setAttribute("data-topbar", "dark");
1323					} else {
1324						getElementUsingTagname("data-topbar", "light");
1325						sessionStorage.setItem("data-topbar", "light");
1326						document.documentElement.setAttribute("data-topbar", "light");
1327					}
1328					break;
1329			}
1330
1331			switch (isLayoutAttributes["data-layout-style"]) {
1332				case "default":
1333					getElementUsingTagname("data-layout-style", "default");
1334					sessionStorage.setItem("data-layout-style", "default");
1335					document.documentElement.setAttribute("data-layout-style", "default");
1336					break;
1337				case "detached":
1338					getElementUsingTagname("data-layout-style", "detached");
1339					sessionStorage.setItem("data-layout-style", "detached");
1340					document.documentElement.setAttribute("data-layout-style", "detached");
1341					break;
1342				default:
1343					if (sessionStorage.getItem("data-layout-style") == "detached") {
1344						getElementUsingTagname("data-layout-style", "detached");
1345						sessionStorage.setItem("data-layout-style", "detached");
1346						document.documentElement.setAttribute("data-layout-style", "detached");
1347					} else {
1348						getElementUsingTagname("data-layout-style", "default");
1349						sessionStorage.setItem("data-layout-style", "default");
1350						document.documentElement.setAttribute("data-layout-style", "default");
1351					}
1352					break;
1353			}
1354
1355			switch (isLayoutAttributes["data-sidebar-size"]) {
1356				case "lg":
1357					getElementUsingTagname("data-sidebar-size", "lg");
1358					document.documentElement.setAttribute("data-sidebar-size", "lg");
1359					sessionStorage.setItem("data-sidebar-size", "lg");
1360					break;
1361

1362				case "sm":
1363					getElementUsingTagname("data-sidebar-size", "sm");
1364					document.documentElement.setAttribute("data-sidebar-size", "sm");
1365					sessionStorage.setItem("data-sidebar-size", "sm");
1366					break;
1367
1368				case "md":
1369					getElementUsingTagname("data-sidebar-size", "md");
1370					document.documentElement.setAttribute("data-sidebar-size", "md");
1371					sessionStorage.setItem("data-sidebar-size", "md");
1372					break;
1373
1374				case "sm-hover":
1375					getElementUsingTagname("data-sidebar-size", "sm-hover");
1376					document.documentElement.setAttribute("data-sidebar-size", "sm-hover");
1377					sessionStorage.setItem("data-sidebar-size", "sm-hover");
1378					break;
1379
1380				default:
1381					if (sessionStorage.getItem("data-sidebar-size") == "sm") {
1382						document.documentElement.setAttribute("data-sidebar-size", "sm");
1383						getElementUsingTagname("data-sidebar-size", "sm");
1384						sessionStorage.setItem("data-sidebar-size", "sm");
1385					} else if (sessionStorage.getItem("data-sidebar-size") == "md") {
1386						document.documentElement.setAttribute("data-sidebar-size", "md");
1387						getElementUsingTagname("data-sidebar-size", "md");
1388						sessionStorage.setItem("data-sidebar-size", "md");
1389					} else if (sessionStorage.getItem("data-sidebar-size") == "sm-hover") {
1390						document.documentElement.setAttribute("data-sidebar-size", "sm-hover");
1391						getElementUsingTagname("data-sidebar-size", "sm-hover");
1392						sessionStorage.setItem("data-sidebar-size", "sm-hover");
1393					} else {
1394						document.documentElement.setAttribute("data-sidebar-size", "lg");
1395						getElementUsingTagname("data-sidebar-size", "lg");
1396						sessionStorage.setItem("data-sidebar-size", "lg");
1397					}
1398					break;
1399			}
1400
1401			switch (isLayoutAttributes["data-layout-mode"]) {
1402				case "light":
1403					getElementUsingTagname("data-layout-mode", "light");
1404					document.documentElement.setAttribute("data-layout-mode", "light");
1405					sessionStorage.setItem("data-layout-mode", "light");
1406					break;
1407				case "dark":
1408					getElementUsingTagname("data-layout-mode", "dark");
1409					document.documentElement.setAttribute("data-layout-mode", "dark");
1410					sessionStorage.setItem("data-layout-mode", "dark");
1411					break;
1412				default:
1413					if (sessionStorage.getItem("data-layout-mode") && sessionStorage.getItem("data-layout-mode") == "dark") {
1414						sessionStorage.setItem("data-layout-mode", "dark");
1415						document.documentElement.setAttribute("data-layout-mode", "dark");
1416						getElementUsingTagname("data-layout-mode", "dark");
1417					} else {
1418						sessionStorage.setItem("data-layout-mode", "light");
1419						document.documentElement.setAttribute("data-layout-mode", "light");
1420						getElementUsingTagname("data-layout-mode", "light");
1421					}
1422					break;
1423			}
1424
1425			switch (isLayoutAttributes["data-layout-width"]) {
1426				case "fluid":
1427					getElementUsingTagname("data-layout-width", "fluid");
1428					document.documentElement.setAttribute("data-layout-width", "fluid");
1429					sessionStorage.setItem("data-layout-width", "fluid");
1430					break;
1431				case "boxed":
1432					getElementUsingTagname("data-layout-width", "boxed");
1433					document.documentElement.setAttribute("data-layout-width", "boxed");
1434					sessionStorage.setItem("data-layout-width", "boxed");
1435					break;
1436				default:
1437					if (sessionStorage.getItem("data-layout-width") == "boxed") {
1438						sessionStorage.setItem("data-layout-width", "boxed");
1439						document.documentElement.setAttribute("data-layout-width", "boxed");
1440						getElementUsingTagname("data-layout-width", "boxed");
1441					} else {
1442						sessionStorage.setItem("data-layout-width", "fluid");
1443						document.documentElement.setAttribute("data-layout-width", "fluid");
1444						getElementUsingTagname("data-layout-width", "fluid");
1445					}
1446					break;
1447			}
1448
1449			switch (isLayoutAttributes["data-sidebar"]) {
1450				case "light":
1451					getElementUsingTagname("data-sidebar", "light");
1452					sessionStorage.setItem("data-sidebar", "light");
1453					document.documentElement.setAttribute("data-sidebar", "light");
1454					break;
1455				case "dark":
1456					getElementUsingTagname("data-sidebar", "dark");
1457					sessionStorage.setItem("data-sidebar", "dark");
1458					document.documentElement.setAttribute("data-sidebar", "dark");
1459					break;
1460				case "gradient":
1461					getElementUsingTagname("data-sidebar", "gradient");
1462					sessionStorage.setItem("data-sidebar", "gradient");
1463					document.documentElement.setAttribute("data-sidebar", "gradient");
1464					break;
1465				case "gradient-2":
1466					getElementUsingTagname("data-sidebar", "gradient-2");
1467					sessionStorage.setItem("data-sidebar", "gradient-2");
1468					document.documentElement.setAttribute("data-sidebar", "gradient-2");
1469					break;
1470				case "gradient-3":
1471					getElementUsingTagname("data-sidebar", "gradient-3");
1472					sessionStorage.setItem("data-sidebar", "gradient-3");
1473					document.documentElement.setAttribute("data-sidebar", "gradient-3");
1474					break;
1475				case "gradient-4":
1476					getElementUsingTagname("data-sidebar", "gradient-4");
1477					sessionStorage.setItem("data-sidebar", "gradient-4");
1478					document.documentElement.setAttribute("data-sidebar", "gradient-4");
1479					break;
1480				default:
1481					if (sessionStorage.getItem("data-sidebar") && sessionStorage.getItem("data-sidebar") == "light") {
1482						sessionStorage.setItem("data-sidebar", "light");
1483						getElementUsingTagname("data-sidebar", "light");
1484						document.documentElement.setAttribute("data-sidebar", "light");
1485					} else if (sessionStorage.getItem("data-sidebar") == "dark") {
1486						sessionStorage.setItem("data-sidebar", "dark");
1487						getElementUsingTagname("data-sidebar", "dark");
1488						document.documentElement.setAttribute("data-sidebar", "dark");
1489					} else if (sessionStorage.getItem("data-sidebar") == "gradient") {
1490						sessionStorage.setItem("data-sidebar", "gradient");
1491						getElementUsingTagname("data-sidebar", "gradient");
1492						document.documentElement.setAttribute("data-sidebar", "gradient");
1493					} else if (sessionStorage.getItem("data-sidebar") == "gradient-2") {
1494						sessionStorage.setItem("data-sidebar", "gradient-2");
1495						getElementUsingTagname("data-sidebar", "gradient-2");
1496						document.documentElement.setAttribute("data-sidebar", "gradient-2");
1497					} else if (sessionStorage.getItem("data-sidebar") == "gradient-3") {
1498						sessionStorage.setItem("data-sidebar", "gradient-3");
1499						getElementUsingTagname("data-sidebar", "gradient-3");
1500						document.documentElement.setAttribute("data-sidebar", "gradient-3");
1501					} else if (sessionStorage.getItem("data-sidebar") == "gradient-4") {
1502						sessionStorage.setItem("data-sidebar", "gradient-4");
1503						getElementUsingTagname("data-sidebar", "gradient-4");
1504						document.documentElement.setAttribute("data-sidebar", "gradient-4");
1505					}
1506					break;
1507			}
1508
1509			switch (isLayoutAttributes["data-sidebar-image"]) {
1510				case "none":
1511					getElementUsingTagname("data-sidebar-image", "none");
1512					sessionStorage.setItem("data-sidebar-image", "none");
1513					document.documentElement.setAttribute("data-sidebar-image", "none");
1514					break;
1515				case "img-1":
1516					getElementUsingTagname("data-sidebar-image", "img-1");
1517					sessionStorage.setItem("data-sidebar-image", "img-1");
1518					document.documentElement.setAttribute("data-sidebar-image", "img-1");
1519					break;
1520				case "img-2":
1521					getElementUsingTagname("data-sidebar-image", "img-2");
1522					sessionStorage.setItem("data-sidebar-image", "img-2");
1523					document.documentElement.setAttribute("data-sidebar-image", "img-2");
1524					break;
1525				case "img-3":
1526					getElementUsingTagname("data-sidebar-image", "img-3");
1527					sessionStorage.setItem("data-sidebar-image", "img-3");
1528					document.documentElement.setAttribute("data-sidebar-image", "img-3");
1529					break;
1530				case "img-4":
1531					getElementUsingTagname("data-sidebar-image", "img-4");
1532					sessionStorage.setItem("data-sidebar-image", "img-4");
1533					document.documentElement.setAttribute("data-sidebar-image", "img-4");
1534					break;
1535				default:
1536					if (sessionStorage.getItem("data-sidebar-image") && sessionStorage.getItem("data-sidebar-image") == "none") {
1537						sessionStorage.setItem("data-sidebar-image", "none");
1538						getElementUsingTagname("data-sidebar-image", "none");
1539						document.documentElement.setAttribute("data-sidebar-image", "none");
1540					} else if (sessionStorage.getItem("data-sidebar-image") == "img-1") {
1541						sessionStorage.setItem("data-sidebar-image", "img-1");
1542						getElementUsingTagname("data-sidebar-image", "img-1");
1543						document.documentElement.setAttribute("data-sidebar-image", "img-2");
1544					} else if (sessionStorage.getItem("data-sidebar-image") == "img-2") {
1545						sessionStorage.setItem("data-sidebar-image", "img-2");
1546						getElementUsingTagname("data-sidebar-image", "img-2");
1547						document.documentElement.setAttribute("data-sidebar-image", "img-2");
1548					} else if (sessionStorage.getItem("data-sidebar-image") == "img-3") {
1549						sessionStorage.setItem("data-sidebar-image", "img-3");
1550						getElementUsingTagname("data-sidebar-image", "img-3");
1551						document.documentElement.setAttribute("data-sidebar-image", "img-3");
1552					} else if (sessionStorage.getItem("data-sidebar-image") == "img-4") {
1553						sessionStorage.setItem("data-sidebar-image", "img-4");
1554						getElementUsingTagname("data-sidebar-image", "img-4");
1555						document.documentElement.setAttribute("data-sidebar-image", "img-4");
1556					}
1557					break;
1558			}
1559
1560			switch (isLayoutAttributes["data-layout-position"]) {
1561				case "fixed":
1562					getElementUsingTagname("data-layout-position", "fixed");
1563					sessionStorage.setItem("data-layout-position", "fixed");
1564					document.documentElement.setAttribute("data-layout-position", "fixed");
1565					break;
1566				case "scrollable":
1567					getElementUsingTagname("data-layout-position", "scrollable");
1568					sessionStorage.setItem("data-layout-position", "scrollable");
1569					document.documentElement.setAttribute("data-layout-position", "scrollable");
1570					break;
1571				default:
1572					if (sessionStorage.getItem("data-layout-position") && sessionStorage.getItem("data-layout-position") == "scrollable") {
1573						getElementUsingTagname("data-layout-position", "scrollable");
1574						sessionStorage.setItem("data-layout-position", "scrollable");
1575						document.documentElement.setAttribute("data-layout-position", "scrollable");
1576					} else {
1577						getElementUsingTagname("data-layout-position", "fixed");
1578						sessionStorage.setItem("data-layout-position", "fixed");
1579						document.documentElement.setAttribute("data-layout-position", "fixed");
1580					}
1581					break;
1582			}
1583			default:
1584				break;
1585	}
1586}
1587
1588function initMenuItemScroll() {
1589	setTimeout(function () {
1590		var sidebarMenu = document.getElementById("navbar-nav");
1591		if (sidebarMenu) {
1592			var activeMenu = sidebarMenu.querySelector(".nav-item .active");
1593			var offset = activeMenu ? activeMenu.offsetTop : 0;
1594			if (offset > 300) {
1595				var verticalMenu = document.getElementsByClassName("app-menu") ? document.getElementsByClassName("app-menu")[0] : "";
1596				if (verticalMenu && verticalMenu.querySelector(".simplebar-content-wrapper")) {
1597					setTimeout(function () {
1598						offset == 330 ?
1599							(verticalMenu.querySelector(".simplebar-content-wrapper").scrollTop = offset + 85) :
1600							(verticalMenu.querySelector(".simplebar-content-wrapper").scrollTop = offset);
1601					}, 0);
1602				}
1603			}
1604		}
1605	}, 250);
1606}
1607
1608// add change event listener on right layout setting
1609function getElementUsingTagname(ele, val) {
1610	Array.from(document.querySelectorAll("input[name=" + ele + "]")).forEac

1610h(function (x) {
1611		val == x.value ? (x.checked = true) : (x.checked = false);
1612
1613		x.addEventListener("change", function () {
1614			document.documentElement.setAttribute(ele, x.value);
1615			sessionStorage.setItem(ele, x.value);
1616
1617			if (ele == "data-layout-width" && x.value == "boxed") {
1618				document.documentElement.setAttribute("data-sidebar-size", "sm-hover");
1619				sessionStorage.setItem("data-sidebar-size", "sm-hover");
1620				document.getElementById("sidebar-size-small-hover").checked = true;
1621			} else if (ele == "data-layout-width" && x.value == "fluid") {
1622				document.documentElement.setAttribute("data-sidebar-size", "lg");
1623				sessionStorage.setItem("data-sidebar-size", "lg");
1624				document.getElementById("sidebar-size-default").checked = true;
1625			}
1626
1627			if (ele == "data-layout") {
1628				if (x.value == "vertical") {
1629					hideShowLayoutOptions("vertical");
1630					isCollapseMenu();
1631					feather.replace();
1632				} else if (x.value == "horizontal") {
1633					document.getElementById("sidebarimg-none").click();
1634					hideShowLayoutOptions("horizontal");
1635					feather.replace();
1636				} else if (x.value == "twocolumn") {
1637					hideShowLayoutOptions("twocolumn");
1638					document.documentElement.setAttribute("data-layout-width", "fluid");
1639					document.getElementById("layout-width-fluid").click();
1640					twoColumnMenuGenerate();
1641					initTwoColumnActiveMenu();
1642					isCollapseMenu();
1643					feather.replace();
1644				}
1645			}
1646		});
1647	});
1648
1649	Array.from(document.querySelectorAll("#collapseBgGradient .form-check input")).forEach(function (subElem) {
1650		var myCollapse = document.getElementById('collapseBgGradient')
1651		if ((subElem.checked == true)) {
1652			var bsCollapse = new bootstrap.Collapse(myCollapse, {
1653				toggle: false,
1654			})
1655			bsCollapse.show()
1656		}
1657
1658		document.querySelector("[data-bs-target='#collapseBgGradient']").addEventListener('click', function (elem) {
1659			document.getElementById("sidebar-color-gradient").click();
1660		});
1661	});
1662
1663
1664	Array.from(document.querySelectorAll("[name='data-sidebar']")).forEach(function (elem) {
1665		if (document.querySelector("#collapseBgGradient .form-check input:checked")) {
1666			document.querySelector("[data-bs-target='#collapseBgGradient']").classList.add("active");
1667		} else {
1668			document.querySelector("[data-bs-target='#collapseBgGradient']").classList.remove("active");
1669		}
1670
1671		elem.addEventListener("change", function () {
1672			if (document.querySelector("#collapseBgGradient .form-check input:checked")) {
1673				document.querySelector("[data-bs-target='#collapseBgGradient']").classList.add("active");
1674			} else {
1675				document.querySelector("[data-bs-target='#collapseBgGradient']").classList.remove("active");
1676			}
1677		})
1678	})
1679}
1680
1681function setDefaultAttribute() {
1682	if (!sessionStorage.getItem("defaultAttribute")) {
1683		var attributesValue = document.documentElement.attributes;
1684		var isLayoutAttributes = {};
1685		Array.from(attributesValue).forEach(function (x) {
1686			if (x && x.nodeName && x.nodeName != "undefined") {
1687				var nodeKey = x.nodeName;
1688				isLayoutAttributes[nodeKey] = x.nodeValue;
1689				sessionStorage.setItem(nodeKey, x.nodeValue);
1690			}
1691		});
1692		sessionStorage.setItem("defaultAttribute", JSON.stringify(isLayoutAttributes));
1693		layoutSwitch(isLayoutAttributes);
1694
1695		// open right sidebar on first time load
1696		var offCanvas = document.querySelector('.btn[data-bs-target="#theme-settings-offcanvas"]');
1697		offCanvas ? offCanvas.click() : "";
1698	} else {
1699		var isLayoutAttributes = {};
1700		isLayoutAttributes["data-layout"] = sessionStorage.getItem("data-layout");
1701		isLayoutAttributes["data-sidebar-size"] = sessionStorage.getItem("data-sidebar-size");
1702		isLayoutAttributes["data-layout-mode"] = sessionStorage.getItem("data-layout-mode");
1703		isLayoutAttributes["data-layout-width"] = sessionStorage.getItem("data-layout-width");
1704		isLayoutAttributes["data-sidebar"] = sessionStorage.getItem("data-sidebar");
1705		isLayoutAttributes["data-layout-position"] = sessionStorage.getItem("data-layout-position");
1706		isLayoutAttributes["data-layout-style"] = sessionStorage.getItem("data-layout-style");
1707		isLayoutAttributes["data-topbar"] = sessionStorage.getItem("data-topbar");
1708		layoutSwitch(isLayoutAttributes);
1709	}
1710}
1711
1712function initFullScreen() {
1713	var fullscreenBtn = document.querySelector('[data-toggle="fullscreen"]');
1714	fullscreenBtn &&
1715		fullscreenBtn.addEventListener("click", function (e) {
1716			e.preventDefault();
1717			document.body.classList.toggle("fullscreen-enable");
1718			if (!document.fullscreenElement &&
1719				/* alternative standard method */
1720				!document.mozFullScreenElement &&
1721				!document.webkitFullscreenElement
1722			) {
1723				// current working methods
1724				if (document.documentElement.requestFullscreen) {
1725					document.documentElement.requestFullscreen();
1726				} else if (document.documentElement.mozRequestFullScreen) {
1727					document.documentElement.mozRequestFullScreen();
1728				} else if (document.documentElement.webkitRequestFullscreen) {
1729					document.documentElement.webkitRequestFullscreen(
1730						Element.ALLOW_KEYBOARD_INPUT
1731					);
1732				}
1733			} else {
1734				if (document.cancelFullScreen) {
1735					document.cancelFullScreen();
1736				} else if (document.mozCancelFullScreen) {
1737					document.mozCancelFullScreen();
1738				} else if (document.webkitCancelFullScreen) {
1739					document.webkitCancelFullScreen();
1740				}
1741			}
1742		});
1743
1744	document.addEventListener("fullscreenchange", exitHandler);
1745	document.addEventListener("webkitfullscreenchange", exitHandler);
1746	document.addEventListener("mozfullscreenchange", exitHandler);
1747
1748	function exitHandler() {
1749		if (!document.webkitIsFullScreen && !document.mozFullScreen && !document.msFullscreenElement) {
1750			document.body.classList.remove("fullscreen-enable");
1751		}
1752	}
1753}
1754
1755function setLayoutMode(mode, modeType, modeTypeId, html) {
1756	var isModeTypeId = document.getElementById(modeTypeId);
1757	html.setAttribute(mode, modeType);
1758	if (isModeTypeId) {
1759		document.getElementById(modeTypeId).click();
1760	}
1761}
1762

1763function notifyThemeChanged(theme) {
1764	var event = new CustomEvent('dashboard:themeChanged', {
1765		detail: {
1766			theme: theme
1767		}
1768	});
1769	window.dispatchEvent(event);
1770}
1771
1772function resetTheme() {
1773	localStorage.removeItem('theme');
1774	initTheme();
1775}
1776
1777function initTheme() {
1778	const theme = getTheme();
1779	if (theme == 'dark') {
1780		setDarkMode();
1781	} else {
1782		setLightMode();
1783	}
1784
1785	notifyThemeChanged(theme);
1786
1787	// highlight theme in configurator
1788	Array.from(document.querySelectorAll(".theme-setting")).forEach(function (element) {
1789		element.classList.remove("bg-soft-primary");
1790	});
1791	const localeTheme = localStorage.getItem('theme');
1792	if (localeTheme) {
1793		document.getElementById(localeTheme + 'Mode').classList.add('bg-soft-primary');
1794	} else {
1795		document.getElementById('autoMode').classList.add('bg-soft-primary');
1796	}
1797}
1798
1799function getTheme() {
1800	let theme = localStorage.getItem('theme');
1801	if (theme) {
1802		if (theme == 'dark') {
1803			return 'dark';
1804		} else {
1805			return 'light';
1806		}
1807	} else {
1808		if (window.matchMedia) {
1809			var match = window.matchMedia('(prefers-color-scheme: dark)');
1810			if (match.matches) {
1811				return 'dark';
1812			} else {
1813				return 'light';
1814			}
1815		} else {
1816			return 'light';
1817		}
1818	}
1819}
1820
1821function setDarkMode(persist = false) {
1822	var html = document.getElementsByTagName("HTML")[0];
1823	setLayoutMode("data-layout-mode", "dark", "layout-mode-dark", html);
1824	Array.from(document.querySelectorAll(".theme-setting")).forEach(function (element) {
1825		element.classList.remove("bg-soft-primary");
1826	});
1827	document.getElementById('darkMode').classList.add('bg-soft-primary');
1828	if (persist)
1829		localStorage.setItem('theme', 'dark');
1830	notifyThemeChanged('dark');
1831}
1832
1833function setLightMode(persist = false) {
1834	var html = document.getElementsByTagName("HTML")[0];
1835	setLayoutMode("data-layout-mode", "light", "layout-mode-light", html);
1836	Array.from(document.querySelectorAll(".theme-setting")).forEach(function (element) {
1837		element.classList.remove("bg-soft-primary");
1838	});
1839	document.getElementById('lightMode').classList.add('bg-soft-primary');
1840	if (persist)
1841		localStorage.setItem('theme', 'light');
1842	notifyThemeChanged('light');
1843}
1844
1845function initTimeFormat() {
1846	const theme = getTime();
1847	// highlight time format in configurator
1848	Array.from(document.querySelectorAll(".time-setting")).forEach(function (element) {
1849		element.classList.remove("bg-soft-primary");
1850	});
1851	const format = localStorage.getItem('time');
1852	if (format) {
1853		document.getElementById('time' + format).classList.add('bg-soft-primary');
1854	} else {
1855		document.getElementById('autoTime').classList.add('bg-soft-primary');
1856	}
1857}
1858
1859function resetTime() {
1860	localStorage.removeItem('time');
1861	Array.from(document.querySelectorAll(".time-setting")).forEach(function (element) {
1862		element.classList.remove("bg-soft-primary");
1863	});
1864	document.getElementById('autoTime').classList.add('bg-soft-primary');
1865	convertUTCTime();
1866}
1867
1868function getTime() {
1869	return localStorage.getItem('time');
1870}
1871
1872function setTime(format) {
1873	localStorage.setItem('time', format);
1874	Array.from(document.querySelectorAll(".time-setting")).forEach(function (element) {
1875		element.classList.remove("bg-soft-primary");
1876	});
1877	document.getElementById('time' + format).classList.add('bg-soft-primary');
1878	convertUTCTime();
1879}
1880
1881function getChartColorsArray(chartId) {
1882	if (document.getElementById(chartId) !== null) {
1883		var colors = document.getElementById(chartId).getAttribute("data-colors");
1884		if (colors) {
1885			colors = JSON.parse(colors);
1886			return colors.map(function (value) {
1887				var newValue = value.replace(" ", "");
1888				if (newValue.indexOf(",") === -1) {
1889					var color = getComputedStyle(document.documentElement).getPropertyValue(newValue);
1890					if (color) return color;
1891					else return newValue;;
1892				} else {
1893					var val = value.split(',');
1894					if (val.length == 2) {
1895						var rgbaColor = getComputedStyle(document.documentElement).getPropertyValue(val[0]);
1896						rgbaColor = "rgba(" + rgbaColor + "," + val[1] + ")";
1897						return rgbaColor;
1898					} else {
1899						return newValue;
1900					}
1901				}
1902			});
1903		}
1904	}
1905}
1906
1907function init() {
1908	// setDefaultAttribute();
1909	// twoColumnMenuGenerate();
1910	// isCustomDropdown();
1911	// isCustomDropdownResponsive();
1912	// initFullScreen();
1913	windowLoadContent();
1914	startCounters();
1915	disableDropdownTabEvents();
1916	// initLeftMenuCollapse();
1917	// initComponents();
1918	// resetLayout();
1919	// pluginData();
1920	// initLanguage();
1921	// isCollapseMenu();
1922	// initMenuItemScroll();
1923}
1924
1925function disableDropdownTabEvents() {
1926	Array.from(document.querySelectorAll('.dropdown-menu a[data-bs-toggle="tab"]')).forEac

1926h(function (element) {
1927		element.addEventListener("click", function (e) {
1928			e.stopPropagation();
1929			bootstrap.Tab.getInstance(e.target).show();
1930		});
1931	});
1932}
1933
1934var timeOutFunctionId;
1935
1936function setResize() {
1937	var currentLayout = document.documentElement.getAttribute("data-layout");
1938	if (currentLayout !== "horizontal") {
1939		if (document.getElementById("navbar-nav")) {
1940			var simpleBar = new SimpleBar(document.getElementById("navbar-nav"));
1941			if (simpleBar) simpleBar.getContentElement();
1942		}
1943
1944		if (document.getElementsByClassName("twocolumn-iconview")[0]) {
1945			var simpleBar1 = new SimpleBar(
1946				document.getElementsByClassName("twocolumn-iconview")[0]
1947			);
1948			if (simpleBar1) simpleBar1.getContentElement();
1949		}
1950		clearTimeout(timeOutFunctionId);
1951	}
1952}
1953
1954window.addEventListener("resize", function () {
1955	if (timeOutFunctionId) clearTimeout(timeOutFunctionId);
1956	timeOutFunctionId = setTimeout(setResize, 2000);
1957});
1958
1959
1960//
1961/********************* scroll top js ************************/
1962//
1963
1964var mybutton = document.getElementById("back-to-top");
1965
1966// When the user scrolls down 20px from the top of the document, show the button
1967window.onscroll = function () {
1968	scrollFunction();
1969};
1970
1971function scrollFunction() {
1972	if (document.body.scrollTop > 100 || document.documentElement.scrollTop > 100) {
1973		mybutton.style.display = "block";
1974	} else {
1975		mybutton.style.display = "none";
1976	}
1977}
1978
1979// When the user clicks on the button, scroll to the top of the document
1980function topFunction() {
1981	document.body.scrollTop = 0;
1982	document.documentElement.scrollTop = 0;
1983};