var action_button_width = 0;

function updatemenuScrollArrows()
{
	var menu_holder_width = document.querySelector("#desktop-menu .main_menu_holder").offsetWidth;
	var menu_width = document.querySelector("#desktop-menu .main_menu_holder .main_menu").offsetWidth;
	var menu = document.querySelector("#desktop-menu .main_menu_holder.overflowing .main_menu");
	
	var currentPosition = parseInt(menu.style.marginLeft);
	
	var minPosition = 0 - menu_width + menu_holder_width - 40;
	
	var ml = document.querySelector("#desktop-menu .main_menu_holder .main_menu").style.marginLeft;
	if(ml == "0px" || ml == "0")
	{
		document.querySelector(".main_menu_scroll_left").style.display = "none";
		document.querySelector(".main_menu_scroll_right").style.display = "flex";
	}
	else
	{
		document.querySelector(".main_menu_scroll_left").style.display = "flex";
		console.log("MIN: " + minPosition + " " + currentPosition);
		if(minPosition == currentPosition)
		{
			document.querySelector(".main_menu_scroll_right").style.display = "none";
		}
	}
	document.querySelector("#desktop-menu .main_menu_holder").style.opacity = 1;
}

function menu_resize()
{
	if(document.querySelector(".action-button") != null && document.querySelector(".action-button") != undefined)
	{
		action_button_width = document.querySelector(".action-button").offsetWidth + 60;
	}
	var menu_header = document.querySelector('header')
	if(window.innerWidth < 1000)
	{
		menu_header.classList.remove('desktop');
		menu_header.classList.add('mobile');
	}
	else
	{
		document.querySelector("body").classList.remove('menueopened');
		menu_header.classList.add('desktop');
		menu_header.classList.remove('mobile');
		
		var menu_holder_width = document.querySelector("#desktop-menu .main_menu_holder").offsetWidth;
		var menu_width = document.querySelector("#desktop-menu .main_menu_holder .main_menu").offsetWidth;
		
		if(menu_holder_width < menu_width)
		{
			document.querySelector("#desktop-menu .main_menu_holder .main_menu").style.marginLeft = "0";
			document.querySelector("#desktop-menu .main_menu_holder").classList.add("overflowing");
			updatemenuScrollArrows();
		}
		else
		{
			document.querySelector("#desktop-menu .main_menu_holder").classList.remove("overflowing");
			document.querySelector(".main_menu_scroll_left").style.display = "none";
			document.querySelector(".main_menu_scroll_right").style.display = "none";
			document.querySelector("#desktop-menu .main_menu_holder").style.opacity = 1;
		}
	}
	
	var container_width = document.querySelector(".container-standard-width").offsetWidth;
	var logo_width = document.querySelector(".logo-holder").offsetWidth;
	document.querySelector("#desktop-menu .main_menu_clip").style.width = (container_width - logo_width - action_button_width) + "px";
	var menu_width = document.querySelector(".main_menu_holder").offsetWidth;
	
	document.querySelectorAll('.mmi-l2').forEach((el) => {
		var menuetype = el.getAttribute("data-menuetype");
		
		if(el.querySelector(".mmi-l2-column_c") != null && el.querySelector(".mmi-l2-column_c") != undefined)
		{
			menuetype = 1;
			el.style.width = "26.5rem";
			el.style.maxWidth = "26.5rem";
			if(el.querySelectorAll(".mmi-l3").length == 0)
			{
				el.classList.add("nochildren");
			}
		}
		
		if(menuetype == "0" || menuetype == "2" || menuetype == "3" || menuetype == "4")
		{
			el.style.width = container_width + "px";
			el.style.left = parseInt((menu_width - container_width)/2) + "px";
		}
		if(menuetype == "1")
		{
			var parentPos = el.parentElement.offsetLeft;
			var newpos = parseInt(parentPos - 4);
			
			var rect = el.parentElement.getBoundingClientRect();
			var scrollLeft = window.pageXOffset || document.documentElement.scrollLeft;
			var relativeLeft = rect.left + scrollLeft;
			var maxpos = window.innerWidth - (27 * 16) - document.querySelector("#desktop-menu .main_menu_holder").getBoundingClientRect().left;
			
			if(newpos > maxpos)
			{
				newpos = maxpos;
			}
			
			
			el.style.left = newpos + "px";
		}
	});
	
	
	document.querySelectorAll('.searchover').forEach((el) => {
		el.style.width = (container_width + 1) + "px";
		var rect = document.querySelector('#desktop-menu .header_menu_l2 .container-standard-width').getBoundingClientRect();
			var scrollLeft = window.pageXOffset || document.documentElement.scrollLeft;
		console.log(rect);
		var relativeLeft = rect.left + scrollLeft;
		el.style.left = parseInt(relativeLeft) + "px";
	});
	
	
	document.addEventListener('click', function(event) {
		let element = event.target;

		while (element) {
			if (element.matches && element.matches('.showsearchoverlay')) {
				document.querySelector('.searchover').style.display = 'block';
				event.stopPropagation();
				return;
			}
			if (element.matches && element.matches('#searchoverclose')) {
				document.querySelector('.searchover').style.display = 'none';
				event.stopPropagation();
				return;
			}
			element = element.parentElement;
		}
	}, false);
	
}

function scrollmenuRight()
{
	var menu_holder_width = document.querySelector("#desktop-menu .main_menu_holder").offsetWidth;
	var menu_width = document.querySelector("#desktop-menu .main_menu_holder .main_menu").offsetWidth;
	var menu = document.querySelector("#desktop-menu .main_menu_holder.overflowing .main_menu");
	
	var currentPosition = parseInt(menu.style.marginLeft);
	
	var targetPosition = currentPosition - menu_holder_width;
	
	var minPosition = 0 - menu_width + menu_holder_width - 40;
	
	if(targetPosition < minPosition)
	{
		targetPosition = minPosition;
	}
	
	menu.style.transition = 'margin-left 1s';
	menu.addEventListener('transitionend', (event) => { 
		updatemenuScrollArrows();
	});
	menu.style.marginLeft = targetPosition + 'px';
}


function scrollmenuLeft()
{
	var menu_holder_width = document.querySelector("#desktop-menu .main_menu_holder").offsetWidth;
	var menu_width = document.querySelector("#desktop-menu .main_menu_holder .main_menu").offsetWidth;
	var menu = document.querySelector("#desktop-menu .main_menu_holder.overflowing .main_menu");
	
	var currentPosition = parseInt(menu.style.marginLeft);
	
	var targetPosition = currentPosition + menu_holder_width;
	
	if(targetPosition > 0)
	{
		targetPosition = 0;
	}
	
	menu.style.transition = 'margin-left 1s';
	menu.addEventListener('transitionend', (event) => { 
		updatemenuScrollArrows();
	});
	menu.style.marginLeft = targetPosition + 'px';
}

function menu_init()
{
	document.addEventListener('click', function (event) {
		if(event.target.closest('.main_menu_scroll_right'))
		{
			scrollmenuRight();
		}
		if(event.target.closest('.main_menu_scroll_left'))
		{
			scrollmenuLeft();
		}
		if(event.target.closest('.menu_trigger_button'))
		{
			document.querySelector(".mobile_menu_list").scrollTo(0,0);
			document.querySelector("body").classList.toggle('menueopened');
		}
		if(event.target.closest('#mobile-menu .mmi-l1'))
		{
			document.querySelectorAll('#mobile-menu .mmi-l1.opened').forEach((el) => {
				if(el != event.target.closest('#mobile-menu .mmi-l1'))
				{
					el.classList.remove('opened');
				}
			});
			event.target.closest('#mobile-menu .mmi-l1').classList.toggle('opened');
		}
	});
}

document.addEventListener('DOMContentLoaded', function(event) 
{
	var menu_holder = document.querySelector(".main_menu_holder");
	if(menu_holder != undefined && menu_holder != null)
	{
		if(document.querySelector(".action-button") != null && document.querySelector(".action-button") != undefined)
		{
			action_button_width = document.querySelector(".action-button").offsetWidth + 60;
		}
		menu_init();
		window.addEventListener('resize', menu_resize);
		menu_resize();
		checkScroll();
	}
});

function checkScroll()
{
	const scrollPosition = window.scrollY;
	if(scrollPosition > 40)
	{
		document.querySelector("#mobile-menu .header_menu_l1").style.display = "none";
	}
	else
	{
		document.querySelector("#mobile-menu .header_menu_l1").style.display = "block";
	}
}

window.addEventListener('scroll', function(event) {
	var menu_holder = document.querySelector(".main_menu_holder");
	if(menu_holder != undefined && menu_holder != null)
	{
		checkScroll();
	}
});