var lastpage = 1;
var currentpage = 1;
var currentlist = 0;
var currentsublist = 0;
var current = -1;
var currentuser = 0;
var wishlists = Array();
var newWishlist = "";
var newSublist = "";
var searchResults = Array();
var show_filtered_products = true;

var wishlistToPreselect = '';
var sublistToPreselect = '';

var curtime = 0;

var filters = Array();
var filtersIds = Array();

var firstOpen = true;

var activeFilters = Array();
var selectedCategory = 0;

var mbe = document.getElementById('msgbox');

var lasttouchscreenreceiver = null;

var msgbox = null;

if(mbe != undefined && mbe != null)
{
	msgbox = new bootstrap.Modal(document.getElementById('msgbox'), {});
}

var awaytimeout = null;

// Click Funktion: Menu
const menuLinks = Array.from(document.querySelectorAll('[data-menu-link]'));
const menu = document.getElementById("main_navigation");

menuLinks.forEach(function (item, index) {
    item.onclick = function() {
        let menueTarget = document.querySelector("[data-menu-target='" + item.getAttribute('data-menu-link') + "']");
        let menueTargets = document.querySelectorAll("[data-menu-target]");

        let menuOverlay = document.getElementById("nav_overlay");
        menuOverlay.style.display = "none";


        if (menueTarget.classList.contains('active')) {
            menueTarget.style.opacity = 0;
            menueTarget.style.display = "none";
            menueTarget.classList.remove("active");
            menuOverlay.style.display = "none";

        } else {
            for (let i = 0; i < menueTargets.length; i++) {
                menueTargets[i].style.opacity = 0;
                menueTargets[i].style.display = "none";
                menueTargets[i].classList.remove("active");

                if(menueTarget.getAttribute('data-menu-overlay') == 'true'){
                    menuOverlay.style.display = "block";
                }
            }

            menueTarget.classList.add("active");
            menueTarget.style.display = "block";
            menueTarget.style.opacity = 1;
			
			if(item.getAttribute('data-menu-link') == "nav_filter" && firstOpen == true)
			{
				firstOpen = false;

				var filter_id = "select_all";
				var filter_checked = false; 
				
				 if(filter_id == "select_all")
				 {
					 document.querySelectorAll('input[type="checkbox"]').forEach(cb => {
						cb.checked = filter_checked; 
					 });
				 }
				 
				document.querySelector('#filter_indicator').style.display = "none";
				  
				updateContent();	
			}
       }


    }
   
});








function overlay_shown()
{
	
	if(document.querySelector('.wishlistoverlay').style.display == 'block' || document.querySelector('#search_overlay').style.display == 'block' || document.querySelector('#away_overlay').style.display == 'block' || document.querySelector('#tutorial_overlay').style.display == 'block')
	{
		document.querySelector('.main-content.overview').classList.add('noscroll_over');
		document.querySelector('.contentholder').classList.add('noscroll_over');
	}
	else
	{
		document.querySelector('.main-content.overview').classList.remove('noscroll_over');
		document.querySelector('.contentholder').classList.remove('noscroll_over');
	}
	setTimeout(overlay_shown,500);
	
}


function increaseTimeout()
{
	clearTimeout(awaytimeout);
	if(	document.querySelector('.wishlistoverlay').style.display != 'none' || 
		document.querySelector('#search_overlay').style.display != 'none')
	{
		curtime = curtime + 1;
	}
	if(curtime > timeout)
	{		
		// var reseturl = document.querySelector('#reset_user a').getAttribute('href');
		// location.href = reseturl;
		showAwayOverlay();
	}
	else
	{			
		awaytimeout = setTimeout(increaseTimeout,1000);
	}
}


function hideTutorial()
{
	document.getElementById('tutorial_overlay').innerHTML = '';
	document.getElementById('tutorial_overlay').style.display = 'none';
}

var splide_tutorial;

var lastHeight = -1;

function adjustIframeHeight() {
	
	
	if(document.getElementById("myIframe") != null && document.getElementById("myIframe") != undefined)
	{
		
		var iframe = document.getElementById("myIframe");
		var innerDoc = iframe.contentDocument || iframe.contentWindow.document;
		var contentHeight = Math.max(innerDoc.body.scrollHeight, innerDoc.documentElement.scrollHeight);
		if(lastHeight != contentHeight)
		{
			lastHeight = contentHeight;
			iframe.style.height = contentHeight + "px";
		}
		setTimeout(adjustIframeHeight,2500);
	}
}


async function doSearch()
{
	data = new FormData();
	data.set('language',currentLanguage);
	data.set('searchterm',document.querySelector('#searchterm').value);
	let request = new XMLHttpRequest();
	
    request.onreadystatechange = function() {
        if (this.readyState == 4 && this.status == 200) {
			var searchResultsTemp = JSON.parse(this.responseText);
			
			searchResults = Array();
			
			Object.entries(searchResultsTemp).forEach(([key, value]) => {
			  searchResults[searchResults.length] = value;
			})
			
			document.querySelectorAll('#search_content')[0].innerHTML = document.querySelectorAll('.main-content.overview .kacheln')[0].innerHTML;
			
			var check = searchResults;
							
			
			document.querySelectorAll('#search_content .gridelement').forEach((item) =>{
				var heart = item.querySelectorAll('.info_heart');
				if(heart.length == 0)
				{
					item.parentNode.removeChild(item);
				}
				else
				{
					var dtp = (item.getAttribute('data-topage'));
					if(parseInt(dtp) != NaN && parseInt(dtp) > 0)
					{
						if(!check.includes(dtp))
						{
							item.parentNode.removeChild(item);
						}
					}
				}
			});
			
			var searchfor = document.querySelector('#searchterm').value
			searchfor = searchfor.trim();
			searchfor = searchfor.toLowerCase();
			document.querySelectorAll('#search_content .to_pdf.gridelement').forEach((item) =>{
				var pdf_title = item.textContent;
				pdf_title = pdf_title.trim().toLowerCase();
				if(pdf_title.indexOf(searchfor) < 0)
				{
					item.parentNode.removeChild(item);
				}
				else
				{
				}
			});
			
			
			document.querySelectorAll('#search_content .start_page_category').forEach((item) => {
				var kchln = item.querySelectorAll('.gridelement');
				if(kchln.length == 0)
				{
					item.parentNode.removeChild(item);
				}
			});
			
			
			document.querySelectorAll('#search_content .gridelement').forEach((item) => {
				
				item.querySelectorAll('a').forEach((lnk) => {
					lnk.setAttribute('href','#');
					lnk.classList.add('open-matching-pdf');
				});
				item.style.display = 'unset';
			});
			
			
			document.querySelectorAll('#search_content .kacheln').forEach((item) => {
				item.style.display = 'flex';
			});
			
			
			
			
			document.querySelectorAll('#search_content .to_page').forEach(item => {
				item.addEventListener('click', event => {
					document.querySelector('#search_overlay').innerHTML = '';
					document.querySelector('#search_overlay').style.display = 'none';
					toPage = item.getAttribute("data-topage");
					lastpage = currentpage;
					currentpage = toPage;
					updateContent();
					filterChanged();
				});
			});
			
			
			document.querySelectorAll('#search_content .open-matching-pdf').forEach(item => {
				item.addEventListener('click', event => {
					
					var ge = event.target.closest('.gridelement');
					
					var toMatch = ge.getAttribute('data-pdf');
					document.querySelector('#search_overlay').innerHTML = '';
					document.querySelector('#search_overlay').style.display = 'none';
					updateContent();
					filterChanged();
					document.querySelectorAll('.to_pdf.gridelement').forEach(grid =>{
						if(grid.getAttribute('data-pdf') == toMatch)
						{
							grid.querySelector('a').click();
						}
					});
				});
			});
			
			
			document.querySelectorAll('#search_content .to_wishlist').forEach(item => {
				item.addEventListener('click', event => {
					var val_ids = "";
					
					if(currentlist == "" || currentlist == 0)
					{
						
						var countWishlists = 0;
						for (const key in wishlists){
						  if(wishlists.hasOwnProperty(key)){
							  countWishlists = countWishlists + 1;
						  }
						}
						if(countWishlists == 0)
						{
							showOverlayNewList();
						}
						else
						{
							showMessage(getTranslation('tl_warning_no_wishlist_selected'),getTranslation('tl_select_wishlist_first'));
						}
					}
					else
					{
						var di = event.target.getAttribute('data-pageid');
						
						if(parseInt(di) > 0)
						{
							data = new FormData();
							data.set('language',currentLanguage);
							data.set('value',di);
							data.set('sublistid',currentsublist);
							data.set('listid',currentlist);
							let request = new XMLHttpRequest();
							
							request.onreadystatechange = function() {
								if (this.readyState == 4 && this.status == 200) {
									updateWishlistFromData(JSON.parse(this.responseText));
									
									updateWishlistContent();
								}
							};
							
							request.open("POST", '/add-to-wishlist', true);
							request.send(data)
						}
						else
						{
							var pdfurl = event.target.getAttribute('data-pdf-url');
							if(pdfurl != null && pdfurl != undefined)
							{
								data = new FormData();
								data.set('language',currentLanguage);
								data.set('value',pdfurl);
								data.set('sublistid',currentsublist);
								data.set('listid',currentlist);
								let request = new XMLHttpRequest();
								
								request.onreadystatechange = function() {
									if (this.readyState == 4 && this.status == 200) {
										updateWishlistFromData(JSON.parse(this.responseText));
										updateWishlistContent();
									}
								};
								
								request.open("POST", '/add-to-wishlist', true);
								request.send(data)
							}
						}
						
					}
					event.stopPropagation();
				});
			});
			
			
		}
    };
	
	request.open("POST", '/do-search', true);
	request.send(data)
}


function showSearch()
{
	document.getElementById('search_overlay').innerHTML = '<div class="container"><div class="overlay_header"><div class="overlay_icon opacity-0"><i class="fa-solid fa-arrow-left"></i></div><div class="header_title"><h1 class="display-1">' + getTranslation('tl_headline_search') + '</h1><hr></div><div class="overlay_icon close_search_overlay"><i class="fa-solid fa-xmark"></i></div></div><div class="overlay_content search"><input type="text" name="searchterm" id="searchterm" placeholder="' + getTranslation('tl_placeholder_search_for') + '" class="input_style touchkeyreceiver text-center">' + getKeyboard('standard') + '<a class="btn_style btn_secondary_alt searchbutton" style="display: inline-block;"><i class="fa-solid fa-magnifying-glass"></i><span>' + getTranslation('tl_button_search') + '</span></a><div id="search_content"></div></div></div>';
	document.getElementById('search_overlay').style.display = 'block';
	
	document.getElementById('searchterm').focus;
	lasttouchscreenreceiver = document.getElementById('searchterm');
	
	document.querySelector('.close_search_overlay').addEventListener('click', event =>{
		document.querySelector('#search_overlay').innerHTML = '';
		document.querySelector('#search_overlay').style.display = 'none';
	});
	
	document.querySelector('.searchbutton').addEventListener('click', event =>{
		doSearch();
	});
	
	
}


function showTutorial()
{
	  var xhr = new XMLHttpRequest();

	  xhr.onreadystatechange = function (e) { 
		if (xhr.readyState == 4 && xhr.status == 200) {
			document.getElementById('tutorial_overlay').innerHTML = xhr.responseText;
			document.getElementById('tutorial_overlay').style.display = 'block';
			
            splide_tutorial = new Splide('#tutorial_overlay .splide', {
                classes: {
                    arrow: 'splide__arrow border-arrows',
                },
            });
            splide_tutorial.mount();
			
			document.querySelectorAll('#tutorial_overlay .skip').forEach(item => {
				item.addEventListener('click', event =>{
					hideTutorial();
				});
			});
			
			
			document.querySelectorAll('#tutorial_overlay .tut_next').forEach(item => {
				item.addEventListener('click', event =>{
					splide_tutorial.go( '>' );
				});
			});
			
			
			document.querySelectorAll('#tutorial_overlay .skip').forEach(item => {
				item.addEventListener('click', event =>{
					hideTutorial();
				});
			});
			
			document.querySelectorAll('#tutorial_overlay .to_page').forEach(item => {
				item.addEventListener('click', event => {
					hideTutorial();
					toPage = item.getAttribute("data-topage");
					lastpage = currentpage;
					currentpage = toPage;
					updateContent();
					filterChanged();
				});
			});
			
		}
	  }

		if(use_startscreenandtutorial == true)
		{
			  var url = "https://www..com/overlays/tutorial_" + currentLanguage + ".html";
			  xhr.open("GET", url, true);
			  xhr.setRequestHeader('Content-type', 'text/html');
			  xhr.send();
		}
		else
		{
			document.getElementById('tutorial_overlay').style.display = 'none';
		}
	  
}

function showStart()
{
  var xhr = new XMLHttpRequest();

  xhr.onreadystatechange = function (e) { 
	if (xhr.readyState == 4 && xhr.status == 200) {
		document.getElementById('tutorial_overlay').innerHTML = xhr.responseText;
		document.getElementById('tutorial_overlay').style.display = 'block';
				
		document.querySelectorAll('#tutorial_overlay .skip').forEach(item => {
			item.addEventListener('click', event =>{
				hideTutorial();
			});
		});
		
		document.querySelectorAll('#tutorial_overlay .bottom_headline').forEach(item => {
			item.addEventListener('click', event => {
				showTutorial();
			});
		});
		
	}
  }

	if(use_startscreenandtutorial == true && preselectpage == 0)
	{
		  var url = "https://www..com/overlays/start_" + currentLanguage + ".html";
		  xhr.open("GET", url, true);
		  xhr.setRequestHeader('Content-type', 'text/html');
		  xhr.send();
	}
	else
	{
		document.getElementById('tutorial_overlay').style.display = 'none';
		if(preselectpage > 0)
		{
			document.querySelector('.wishlistoverlay').innerHTML = '';
			document.querySelector('.wishlistoverlay').style.display = 'none';
			toPage = preselectpage;
			lastpage = currentpage;
			currentpage = toPage;
			updateContent();
			filterChanged();
		}
	}
}

var intv;
function startTimer(duration, display) {
	var timer = duration, minutes, seconds;
	intv = setInterval(function () {
		minutes = parseInt(timer / 60, 10)
		seconds = parseInt(timer % 60, 10);

		minutes = minutes < 10 ? "0" + minutes : minutes;
		seconds = seconds < 10 ? "0" + seconds : seconds;

		display.textContent = minutes + ":" + seconds;
		if (--timer < 0) {
			timer = 0;
			var reseturl = document.querySelector('#reset_user a').getAttribute('href');
			location.href = reseturl;
		}
		else
		{
			
		}
	}, 1000);
}


function hideAwayOverlay()
{
}

function showAwayOverlay()
{
	if(document.getElementById('tutorial_overlay').style.display == 'none')
	{
	  var xhr = new XMLHttpRequest();

	  xhr.onreadystatechange = function (e) { 
		if (xhr.readyState == 4 && xhr.status == 200) {
			document.getElementById('away_overlay').innerHTML = xhr.responseText;
			document.getElementById('away_overlay').style.display = 'block';
			
			document.querySelectorAll('#away_overlay .restart').forEach(item => {
				item.addEventListener('click', event =>{
					var reseturl = document.querySelector('#reset_user a').getAttribute('href');
					location.href = reseturl;
				});
			});
			
            var display = document.querySelector('#time');
            startTimer((60 * away_timeout), display);
			
		}
	  }

		var url = "https://www..com/overlays/away_" + currentLanguage + ".html";
	  xhr.open("GET", url, true);
	  xhr.setRequestHeader('Content-type', 'text/html');
	  xhr.send();
	}
	  
}

	
document.addEventListener('click', function (event) {
	curtime = 0;
	if(intv != null && intv != undefined)
	{
		clearInterval(intv);
	}
	hideAwayOverlay();
	if(event.target.classList.contains('keyboard-input'))
	{
		var taste = event.target.innerText;
		if(lasttouchscreenreceiver != null)
		{
			if(event.target.getAttribute('data-key') == undefined || event.target.getAttribute('data-key') == null)
			{
				lasttouchscreenreceiver.value = lasttouchscreenreceiver.value + taste;
			}
			else
			{
				if(event.target.getAttribute('data-key') == "SPACE")
				{
					lasttouchscreenreceiver.value = lasttouchscreenreceiver.value + " ";
				}
				if(event.target.getAttribute('data-key') == "DEL")
				{
					lasttouchscreenreceiver.value = lasttouchscreenreceiver.value.slice(0, -1);
				}
			}
		}
	}
	if(event.target.classList.contains('touchkeyreceiver'))
	{
		lasttouchscreenreceiver = event.target;
	}
});

function getKeyboard(type)
{
	if(document.querySelector('.felogin-hidden') != undefined && document.querySelector('.felogin-hidden') != null)
	{
		var use_touchkeyboard = true;
	}
	if(use_touchkeyboard == false)
	{
		return '';
	}
	else
	{
		var toReturn = '';
		if(type == 'mail')
		{
			toReturn = ' <div class="keyboard-bg"/><div class="keyboard-line keyboard-line-1"><div class="keyboard-input">1</div><div class="keyboard-input">2</div><div class="keyboard-input">3</div><div class="keyboard-input">4</div><div class="keyboard-input">5</div><div class="keyboard-input">6</div><div class="keyboard-input">7</div><div class="keyboard-input">8</div><div class="keyboard-input">9</div><div class="keyboard-input">0</div><div class="keyboard-input" data-key="DEL">⌫</div></div><div class="keyboard-line keyboard-line-2"><div class="keyboard-input">Q</div><div class="keyboard-input">W</div><div class="keyboard-input">E</div><div class="keyboard-input">R</div><div class="keyboard-input">T</div><div class="keyboard-input">Z</div><div class="keyboard-input">U</div><div class="keyboard-input">I</div><div class="keyboard-input">O</div><div class="keyboard-input">P</div><div class="keyboard-input">Ü</div></div><div class="keyboard-line keyboard-line-3"><div class="keyboard-input">A</div><div class="keyboard-input">S</div><div class="keyboard-input">D</div><div class="keyboard-input">F</div><div class="keyboard-input">G</div><div class="keyboard-input">H</div><div class="keyboard-input">J</div><div class="keyboard-input">K</div><div class="keyboard-input">L</div><div class="keyboard-input">Ö</div><div class="keyboard-input">Ä</div></div><div class="keyboard-line keyboard-line-4"><div class="keyboard-input">Y</div><div class="keyboard-input">X</div><div class="keyboard-input">C</div><div class="keyboard-input">V</div><div class="keyboard-input">B</div><div class="keyboard-input">N</div><div class="keyboard-input">M</div><div class="keyboard-input">-</div><div class="keyboard-input">_</div><div class="keyboard-input">.</div></div><div class="keyboard-line keyboard-line-5"><div class="keyboard-input keyboard-at">@</div><div class="keyboard-input keyboard-de">.DE</div><div class="keyboard-input keyboard-com">.COM</div></div> </div>';
		}
		if(type == 'standard')
		{
			toReturn = ' <div class="keyboard-bg"/><div class="keyboard-line keyboard-line-1"><div class="keyboard-input">1</div><div class="keyboard-input">2</div><div class="keyboard-input">3</div><div class="keyboard-input">4</div><div class="keyboard-input">5</div><div class="keyboard-input">6</div><div class="keyboard-input">7</div><div class="keyboard-input">8</div><div class="keyboard-input">9</div><div class="keyboard-input">0</div><div class="keyboard-input" data-key="DEL">⌫</div></div><div class="keyboard-line keyboard-line-2"><div class="keyboard-input">Q</div><div class="keyboard-input">W</div><div class="keyboard-input">E</div><div class="keyboard-input">R</div><div class="keyboard-input">T</div><div class="keyboard-input">Z</div><div class="keyboard-input">U</div><div class="keyboard-input">I</div><div class="keyboard-input">O</div><div class="keyboard-input">P</div><div class="keyboard-input">Ü</div></div><div class="keyboard-line keyboard-line-3"><div class="keyboard-input">A</div><div class="keyboard-input">S</div><div class="keyboard-input">D</div><div class="keyboard-input">F</div><div class="keyboard-input">G</div><div class="keyboard-input">H</div><div class="keyboard-input">J</div><div class="keyboard-input">K</div><div class="keyboard-input">L</div><div class="keyboard-input">Ö</div><div class="keyboard-input">Ä</div></div><div class="keyboard-line keyboard-line-4"><div class="keyboard-input">Y</div><div class="keyboard-input">X</div><div class="keyboard-input">C</div><div class="keyboard-input">V</div><div class="keyboard-input">B</div><div class="keyboard-input">N</div><div class="keyboard-input">M</div><div class="keyboard-input">-</div><div class="keyboard-input">_</div><div class="keyboard-input">.</div></div><div class="keyboard-line keyboard-line-5"><div class="keyboard-input keyboard-large-space" data-key="SPACE"> </div></div> </div>';
		}
		return toReturn;
	}
}

function getSetting(whichOne)
{
	if(settings[whichOne] != null && settings[whichOne] != undefined)
	{
		return settings[whichOne];
	}
	else
	{
		return 'Missing Setting: ' + whichOne;
	}
}

function getTranslation(whichOne)
{
	if(translations[whichOne] != null && translations[whichOne] != undefined)
	{
		return translations[whichOne];
	}
	else
	{
		return 'Missing Translation: ' + whichOne;
	}
}

function show_wishlist()
{	
	if(currentlist != "")
	{
		lastpage = currentpage;
		currentpage = 1;
		updateContent();
		wishlistobj = wishlists[currentlist];
		
		if(currentsublist > 0)
		{
			wishlistobj = wishlists[currentlist]['sublists'][currentsublist];
		}
		
		var items = wishlistobj['vals'];

		var kacheln = document.querySelectorAll('.gridelement');
		kacheln.forEach(function(kachel) 
		{
			var dataparent = kachel.getAttribute("data-parent");
			var display = 'none';
			
			for(var i = 0; i < items.length; i++)
			{				
				var added = false;
				if(kachel.getAttribute('data-page') == items[i])
				{
					display = "block";
				}
			}
			
			
			kachel.style.display = display;
		});
	
	}
}



function showMessage(title,body)
{
	document.querySelector(".modal-title").innerText = title;
	document.querySelector(".modal-body").innerHTML = body;
	msgbox.show();
}

function onlyUnique(value, index, self) {
	if(value=="")
	{
		return false;
	}
  return self.indexOf(value) === index;
}

function arrangeGrid()
{
	if(currentpage == 1)
	{
		
		document.querySelectorAll('.gridelement').forEach(item => {
			var sort = parseInt(item.getAttribute('sort'));
			item.style.order = sort + 1000;
		});
		
	}
	
}

function closeMenue(){
	let menueTargets = document.querySelectorAll("[data-menu-target]");

	let menuOverlay = document.getElementById("nav_overlay");
	if(menuOverlay != undefined && menuOverlay != null)
	{
		for (let i = 0; i < menueTargets.length; i++) {
			menueTargets[i].style.opacity = 0;
			menueTargets[i].style.display = "none";
			menueTargets[i].classList.remove("active");
		}
		menuOverlay.style.display = "none";
	}
}


const menuClose = Array.from(document.querySelectorAll('.ts-vp_nav__item__sub__close'));

menuClose.forEach(function (item, index) {
    item.onclick = function() {
		closeMenue();
    }
});

var h = null;
function updateBreadCrumb()
{
    var newHtml = ' <a class="h4 primary-color homelink">HOME</a>';
	var label = '';
	h = null;
	
	if(currentpage == 1)
	{
		
		var fa = document.querySelectorAll('.menue-filter.active');
		var showOnly = '76'; // Home
		fa.forEach(function (filt, index) {
			showOnly = filt.getAttribute('data-showonly');
			label = filt.textContent;
		});
		if(showOnly != '76')
		{
			newHtml = ' <a class="h4 primary-color homelink"><span class="home_icon"><i class="fa-solid fa-arrow-left"></i></span> HOME</a>';
			newHtml = newHtml + '<span class="h4"> <i class="fa-solid fa-angle-right"></i> </span><span class="h4">' + label + '</span>';
		}
	
	}
	else
	{
		var selectorVal = '.gridelement.page-' + currentpage + ' h4.h3';
		var selector = document.querySelector(selectorVal);
		var heart = null;
		if(selector != null && selector != undefined)
		{
			label = selector.textContent;
			newHtml = ' <a class="h4 primary-color homelink"><span class="home_icon"><i class="fa-solid fa-arrow-left"></i></span> HOME</a>';
			newHtml = newHtml + '<span class="h4"> <i class="fa-solid fa-angle-right"></i> </span><span class="h4">' + label + '</span>';
			
			heart = document.querySelector('.gridelement.page-' + currentpage + ' .info_heart');
			if(heart != null && heart != undefined)
			{
				newHtml = newHtml + heart.outerHTML;
				h = heart;
			}
		}
		else
		{
			document.querySelectorAll('.main_navigation_content .to_page').forEach(item =>{
				if(item.getAttribute('data-topage') == currentpage)
				{
					label = item.textContent;
					newHtml = ' <a class="h4 primary-color homelink"><span class="home_icon"><i class="fa-solid fa-arrow-left"></i></span> HOME</a>';
					newHtml = newHtml + '<span class="h4"> <i class="fa-solid fa-angle-right"></i> </span><span class="h4">' + label + '</span>';
					heart = item.querySelector('.info_heart');
					if(heart != null && heart != undefined)
					{
						newHtml = newHtml + heart.outerHTML;
						h = heart;
					}
				}
			});
		}
	}
	
	var b = document.querySelectorAll('.breadcrumb')[0];
	if(b != undefined && b != null)
	{
		b.innerHTML = newHtml;
	}
	
	if(h != null)
	{
		document.querySelector('.breadcrumb .info_heart').addEventListener('click', event => {
			h.click();
		});
	}
	
	
	document.querySelectorAll('.homelink').forEach(function(item){ 
		item.addEventListener('click', event => {
			document.querySelectorAll('.menue-filter').forEach(it =>{
				it.classList.remove('active');
				if(it.getAttribute('data-showonly') == '76')
				{
					it.classList.add('active');
				}
			});
			goHome();
		});
	});
}

function goHome(){
	toPage = 1;
	lastpage = currentpage;
	currentpage = toPage;
	updateContent();
	filterChanged();
}




// Model Viewer
async function initModelViewer()
{
	var allmodels = Array(
		0,
		0,
		0,
		0,
		0,
		0,
		0,
		0,
		0,
		0
	);
	
	document.querySelectorAll('model-viewer').forEach(item => {
			var datagroup = item.getAttribute("data-group");
			var myindex = 0;
			if(datagroup != "")
			{
				myindex = parseInt(datagroup.replace("group_",""));
			}
			allmodels[myindex] = allmodels[myindex] + 1;
			
			if(item.getAttribute('hotspotdata') != '')
			{
				var tslots = JSON.parse(item.getAttribute('hotspotdata'));
				for(var s = 0; s < tslots.length; s++)
				{
					if(tslots[s][1].x != undefined && tslots[s][1].x != null)
					{
						tslots[s][1] = tslots[s][1].x + "m " + tslots[s][1].y + "m " + tslots[s][1].z + "m";
					}
					if(tslots[s][2].x != undefined && tslots[s][2].x != null)
					{
						tslots[s][2] = tslots[s][2].x + "m " + tslots[s][2].y + "m " + tslots[s][2].z + "m";
					}
				}
				
				var index = 0;
				for(index = 0; index < tslots.length; index++)
				{
					if(tslots[index][3] == 1)
					{
						var hotspot = document.createElement("button");
						hotspot.setAttribute('id','button-' + index);
						hotspot.setAttribute('data-index',index);
						hotspot.setAttribute('data-position',tslots[index][1]);
						hotspot.setAttribute('data-normal',tslots[index][2]);
						hotspot.setAttribute('data-visibility-attribute','visible');
						hotspot.setAttribute('slot','hotspot-' + index);
						hotspot.classList.add('hotspot');
						hotspot.innerHTML = '<div id="HotspotAnnotation-' + index + '" class="HotspotAnnotation annotation">' + tslots[index][0] + '</div><div class="toggle_button"><i class="fa-solid fa-plus"></div>';
						item.append(hotspot);
					}
				}
			}
			const hotspots = item.querySelectorAll(".hotspot")
			hotspots.forEach((point) => {
				point.addEventListener("click", () => {
					point.classList.toggle("active")
					hotspots.forEach((pt) => {
						if (point === pt) return
						pt.classList.remove("active")
					})

				})
				point.addEventListener("touchend", () => {
					point.classList.toggle("active")
					hotspots.forEach((pt) => {
						if (point === pt) return
						pt.classList.remove("active")
					})

				})
			})
	
	});
	
	
	
	// Handles loading the events for <model-viewer>'s slotted progress bar
	var onProgress = (event) => {
		var progressBar = event.target.querySelector('.progress-bar');
		var updatingBar = event.target.querySelector('.update-bar');
		if(updatingBar != null)
		{
			updatingBar.style.width = `${event.detail.totalProgress * 100}%`;
			if (event.detail.totalProgress === 1) {
			  progressBar.classList.add('hide');
			} else {
			  progressBar.classList.remove('hide');
			  if (event.detail.totalProgress === 0) {
			  }
			}
		}
	  };
	  
	var checkelement =  document.querySelectorAll('model-viewer').forEach(item => {
		item.addEventListener('progress', onProgress);
		
		
		
		
		item.addEventListener('load', function(e){
			var it = e.target;
			it.querySelectorAll('.qrcode').forEach(qr => {
				if(it.canActivateAR == false || noar == true)
				{
					var qrcode = new QRCode(it.querySelector('.qrcode_img'), {
						width : getSetting('fe_qr_size'),
						height : getSetting('fe_qr_size')
					});
					var qrurl = getSetting('fe_qr_view_url') + '?uid=' + qr.getAttribute('data-uid');
					qrcode.makeCode(qrurl);
					it.querySelector('.qrcode_text').innerHTML = getTranslation("tl_qrcode_text");
					qr.style.display = "block";
				}
				else
				{
					qr.style.display = "none";
				}
			});
		});
		
		
	});
	
	
	var g = 0;
	for(g = 1; g < 10; g++)
	{
		if(allmodels[g] > 1)
		{
			var el = document.querySelector('model-viewer.group_' + g);
			var wrapper = document.createElement('div');
			el.parentNode.insertBefore(wrapper, el);
			wrapper.appendChild(el);
			wrapper.classList.add("model_group");
			document.querySelector('model-viewer.group_' + g).style.display = 'block';
			
			var mod_index = 0;
			var selector = document.createElement("select");
			
			document.querySelectorAll('model-viewer.group_' + g).forEach(mod => {
				mod_index = mod_index + 1;
				mod.setAttribute("id","model_group_" + g + "_" + mod_index);
				selector.options[selector.options.length] = new Option(mod.getAttribute("data-name"), g + "_" + mod_index);
				wrapper.append(mod);
			});
			
			document.querySelector('model-viewer.group_' + g).append(selector);
			selector.addEventListener("change", (event) => {
				event.target.closest('.model_group').querySelectorAll('model-viewer').forEach(mv => {
					mv.style.display = "none";
				});
				document.querySelector("#model_group_" + event.target.value).style.display = "block";
			});
			
			wrapper.append(selector);
		}
	}
}




function hotspotScroll(scrollTargetId) {
    var scrollTarget = document.getElementById(scrollTargetId);
	if (typeof(scrollTarget) != 'undefined' && scrollTarget != null)
	{
		var offset = 175;
		window.scrollTo({
			behavior: 'smooth',
			top:       
				scrollTarget.getBoundingClientRect().top -
				document.body.getBoundingClientRect().top -
				offset,
		  });
	}
}



function checkScroll(){
	let documentHeight = document.body.scrollHeight;
	let currentScroll = window.scrollY + window.innerHeight;
	
	/*
	// When the user is [modifier]px from the bottom, fire the event.
	let modifier = 20; 
	if(currentScroll + modifier > documentHeight) {
		document.querySelector("#scroll_down").classList.remove("force_flex");
	}
	else
	{
		if(documentHeight > window.innerHeight)
		{
			document.querySelector("#scroll_down").classList.add("force_flex");
		}
		else
		{
			document.querySelector("#scroll_down").classList.remove("force_flex");
		}
	}
	*/
	
}

function initVideoElements()
{
	const videoEl = document.querySelectorAll(".media_video_element")

	Array.from(videoEl).forEach((element, index) => {
		const playButton = element.parentElement.querySelector(".playbutton")
		if (element.tagName == "IFRAME"){
			var sib = element.nextElementSibling;
			if(sib != null && sib != undefined)
			{
				sib.remove();
			}
		}

		playButton.addEventListener("click", () => {       
			if (element.paused || element.ended) {
				element.play();
				playButton.classList.add("play");
				playButton.classList.remove("pause");
				playButton.style.opacity = 0;

			} else {
				element.pause();
				playButton.classList.add("pause");
				playButton.classList.remove("play");
				playButton.style.opacity = 1;

			}
		})
	}) 
}

function initAccordions()
{
	const accordions = document.querySelectorAll(".structure__accordion")

	Array.from(accordions).forEach((single, index) => {

		const accordionButtons = single.querySelectorAll(".accordion-controls li button")

		Array.from(accordionButtons).forEach((btn, i) => {
			btn.addEventListener("click", (e) => {
				const control = btn;

				const accordionContent = control.parentElement.querySelector("." + btn.getAttribute("aria-controls"))
				checkOthers(accordionButtons, btn)

				const isAriaExp = btn.getAttribute("aria-expanded")
				const newAriaExp = (isAriaExp == "false") ? "true" : "false"
				btn.setAttribute("aria-expanded", newAriaExp)

				const isAriaHid = accordionContent.getAttribute("aria-hidden")
				if (isAriaHid == "true") {
					accordionContent.setAttribute("aria-hidden", "false")
					/* accordionContent.style.display = "block" */
					accordionContent.style.height = window.getComputedStyle(accordionContent.children[0]).height
				} else {
					accordionContent.setAttribute("aria-hidden", "true")
					/* accordionContent.style.display = "none" */
					accordionContent.style.height = "0px"
				}
			})
		})

	})

	const checkOthers = (btns, elem) => {
		for (let index = 0; index < btns.length; index++) {
			if (btns[index] != elem) {
				if (btns[index].getAttribute("aria-expanded") == "true") {
					btns[index].setAttribute("aria-expanded", "false")

					const content = btns[index].parentElement.querySelector("." + btns[index].getAttribute("aria-controls"))
					content.setAttribute("aria-hidden", "true")
					/* content.style.display = "none" */
					content.style.height = "0px"
				}
			}

		}
	}

	const ta = document.querySelectorAll(".tab_accordion_wrapper")

	ta.forEach((ta_el, i) => {
		const tabs = ta_el.querySelectorAll(".tab_accordion_single")
		const tab_content_wrapper = ta_el.querySelector(".tab_content_wrapper")
		tabs.forEach(tab => {
			tab.addEventListener("click", () => {
				const content = tab.querySelector(".tab_accordion_content")
				for (let index = 0; index < tabs.length; index++) {
					const contents = tabs[index].querySelector(".tab_accordion_content")
					tabs[index].setAttribute("aria-expanded", "false")
					tabs[index].setAttribute("aria-hidden", "true")
					contents.style.height = "0px";
				}
				tab.setAttribute("aria-expanded", "true")
				tab.setAttribute("aria-hidden", "false")

				content.style.height = window.getComputedStyle(content.children[0]).height
				tab_content_wrapper.innerHTML = content.innerHTML
			})
		})
	})
}

function fadeIn(element, duration = 600) {
  element.style.display = '';
  element.style.opacity = 0;
  var last = +new Date();
  var tick = function() {
    element.style.opacity = +element.style.opacity + (new Date() - last) / duration;
    last = +new Date();
    if (+element.style.opacity < 1) {
      (window.requestAnimationFrame && requestAnimationFrame(tick)) || setTimeout(tick, 16);
    }
  };
  tick();
}

function updateContent()
{
	data = new FormData();
	data.set('page',currentpage);
	let request = new XMLHttpRequest();
	request.onreadystatechange = function() {
		if (this.readyState == 4 && this.status == 200) {
			
		}
	};
	request.open("POST", '/content-request', true);
	request.send(data)
	
	document.querySelectorAll(".lang-select a").forEach(function(langlink){
		var thref = langlink.getAttribute("href");
		var tempHArray = thref.split("?");
		thref = tempHArray[0] + "?preselectPage=" + currentpage;
		langlink.setAttribute("href",thref);
	});
	
	if(currentpage == 1)
	{
		var vis_products = 0;
		// document.querySelector('.filteritem').style.display = 'inherit';
		// document.querySelector('.searchitem').style.display = 'inherit';
		document.querySelector(".overview").style.display = "block";
		document.querySelector(".contentholder").innerHTML = "";
		arrangeGrid();
	}
	else
	{
		document.querySelector(".overview").style.display = "none";
		document.querySelectorAll('.filter_active').forEach(function(fa){ fa.style.display = "none"});
		
		var pfad = "?id=" + currentpage;
		if(currentLanguage != "en")
		{
			pfad = currentLanguage + "/?id=" + currentpage + ".html";
		}
		
		var isOffline = 0;
		var offline = document.querySelector('.offline');
		if(typeof(offline) != 'undefined' && offline != null)
		{
			pfad = "/offline/" + currentpage + ".html";
			if(currentLanguage != "en")
			{
				pfad = "/offline/" + currentLanguage + "/" + currentpage + ".html";
			}
			isOffline = 1;
		}
		
		
		fetch(pfad)
		.then((response) => response.text())
		.then((html) => {
			document.querySelector(".overview").style.display = "none";
			
			var sa = html.split("<!-- MAIN START -->");
			
			if(sa.length == 2)
			{
				sa2 = sa[1].split("<!-- MAIN END -->");
				html = sa2[0];
			}
			
			if(isOffline == 1)
			{
				html = html.replaceAll('download="download"','target="blank"');
			}
			
			
			document.querySelector(".contentholder").innerHTML = html;
			document.querySelectorAll(".contentholder a").forEach(link => {
				var to = link.getAttribute('href');
				if(to != undefined && to != null)
				{
					document.querySelectorAll('.kacheln_container').forEach(cont => {
						var dlink = cont.getAttribute('data-link');
						if(dlink != undefined && dlink != null)
						{
							if(dlink == to)
							{
								link.setAttribute('href','#');
								link.setAttribute('data-topage',cont.getAttribute('data-topage'));
								link.classList.add('to_page');
							}
						}
					});
					var tgt_string = "";
					var tgt = link.getAttribute('target');
					if(tgt != null && tgt != undefined)
					{
						tgt_string = tgt;
					}
					if(tgt_string == "")
					{			
						if(to.indexOf(".pdf") > 0)
						{
							link.classList.add("pdflightbox");
							link.setAttribute("href",to + "#toolbar=0");
						}
					}
				}
			});
			document.querySelectorAll('.pdflightbox').forEach(el => el.addEventListener('click', Lightbox.initialize));
			
			fadeIn(document.querySelector(".contentholder"));
			
			
			document.querySelectorAll('.contentholder .to_page').forEach(item => {
				item.addEventListener('click', event => {
					event.stopPropagation();
					toPage = item.getAttribute("data-topage");
					var found = false;
					document.querySelectorAll('.main_navigation_content li').forEach(li => {
						var tgt = li.getAttribute('data-showonly');
						if(tgt != undefined && tgt != null)
						{
							if(tgt == toPage)
							{
								found = true;
								li.click();
							}
						}
					});
					if(found == false)
					{
						lastpage = currentpage;
						currentpage = toPage;
						updateContent();
						filterChanged();
					}
					
				});
			});
			
			var lastVideo = null;
			document.querySelectorAll('.media_item').forEach(item => {
				if(item.classList.contains('media_item__video'))
				{
					lastVideo = item;
					var sr = item.getAttribute("href");
					if(navigator.userAgent == "Mozilla/5.0 (Windows NT 10.0; Win64; x64) AppleWebKit/537.36 (KHTML, like Gecko) Chrome/106.0.0.0 Safari/537.36")
					{
						sr = sr.replace(".mp4",".webm");
						sr = sr.replace(".MP4",".webm");
						item.setAttribute("href",sr);
					}
				}
				else
				{
					if(lastVideo != null)
					{
						var im  = item.querySelector('img').getAttribute('src');
						lastVideo.setAttribute('data-thumb',im);
						lastVideo.querySelector('img').setAttribute('src',im);
						lastVideo = null;
						item.parentNode.removeChild(item);
					}
				}
			});
			
			
			initModelViewer();
			
			
			if(document.getElementById("myIframe") != null && document.getElementById("myIframe") != undefined)
			{
				setTimeout(adjustIframeHeight,250);
			}
			
			closeMenue();
			var backelement =  document.querySelector('.button_back');
			if (typeof(backelement) != 'undefined' && backelement != null)
			{
				backelement.addEventListener('click', event => {
					if(currentpage == lastpage)
					{
						if(lastpage > 1)
						{
							lastpage = 1;
						}
					}
					currentpage = lastpage;
					updateContent();
				});
			}
			updateBreadCrumb();
		})
		.catch((error) => {
			console.warn(error);
		});
	}
	
	/*
	if(document.querySelector("#select_all").checked)
	{
		document.querySelector('#filter_indicator').style.display = 'none';
	}
	else
	{
		document.querySelector('#filter_indicator').style.display = 'block';
	}
	*/		  	
	
	window.scrollTo(0, 0);
	updateBreadCrumb();
	
	menu.setAttribute("aria-expanded", "false");
	menu.setAttribute("aria-hidden", "true");

	setTimeout(() => {
		initVideoElements();
		initAccordions();
	}, 1000);
}



function initNewWishlistOverlay()
{
	document.querySelector('#submit_new_wishlist').addEventListener('click', event =>{
		newWishlist = document.querySelector('#new_wishlist_name').value;
		newWishlist = newWishlist.trim();
		if(newWishlist != "")
		{
			for (const key in wishlists){
			  if(wishlists.hasOwnProperty(key)){
					if(wishlists[key]['label'] == newWishlist)
					{
						newWishlist = "--alreadyexists--";
					}
			  }
			}
		}
		if(newWishlist == "")
		{
			showMessage(getTranslation('tl_popup_missing_name'),getTranslation('tl_popup_missing_name_text'));
		}
		else
		{ 
			if(newWishlist == "--alreadyexists--")
			{
				showMessage(getTranslation('tl_popup_name_existiert'),getTranslation('tl_popup_name_existiert_text'));
			}
			else
			{
				currentlist = 0;
				wishlistToPreselect = newWishlist;
				updateWishlist(newWishlist,'','0');
			}
		}
	});	
}

function updateDisplayPreview()
{
	document.querySelector('#wishlist_content').innerHTML = document.querySelector('.main-content.overview .kacheln').innerHTML;
	
	var check = Array();
	
	document.querySelector('.selectedwishlist').style.display = 'none';
	if(currentlist > 0)
	{
		check = wishlists[currentlist]['vals'];
		
		document.querySelector('.selectedwishlist .h1').innerHTML = '<span>' + getTranslation('tl_list') + '</span> ' + wishlists[currentlist]['label'];
		
		document.querySelector('.selectedwishlist').style.display = 'flex';
		
	}
	if(currentsublist > 0)
	{
		check = wishlists[currentlist]['sublists'][currentsublist]['vals'];
		
		document.querySelector('.selectedwishlist .h1').innerHTML = '<span>' + getTranslation('tl_list') + '</span> ' + wishlists[currentlist]['label'] + ': ' + wishlists[currentlist]['sublists'][currentsublist]['label'];
		
		document.querySelector('.selectedwishlist').style.display = 'flex';
	}
	
	
	document.querySelectorAll('#wishlist_content .gridelement').forEach((item) =>{
		var heart = item.querySelectorAll('.info_heart');
		if(heart.length == 0)
		{
			item.parentNode.removeChild(item);
		}
		else
		{
			var dtp = (item.getAttribute('data-topage'));
			if(parseInt(dtp) != NaN && parseInt(dtp) > 0)
			{
				if(!check.includes(dtp))
				{
					if(item.parentNode.classList.contains("always_hidden"))
					{
						var showKachel = false;
						var toRemove = "";
						item.parentNode.querySelectorAll('.praesentation_slide_holder img').forEach((item_img) => {
							if(item_img.hasAttribute('data-imagefile'))
							{
								var toCheck = item_img.getAttribute('data-imagefile');
								if(check.includes(toCheck))
								{
									showKachel = true;
									if(toRemove != "")
									{
										toRemove += ",";
									}
									toRemove += toCheck;
								}
							}
						});
						var slideList = item.parentNode.querySelector(".praesentation_slide_holder");
						if(showKachel == true)
						{
							item.parentNode.classList.remove("always_hidden");
							item.classList.add("uselink");
							item.setAttribute("data-to-remove",toRemove);
						}
						else
						{
							item.parentNode.removeChild(item);
						}
					}
					else
					{
						item.parentNode.removeChild(item);
					}
				}
			}
		}
	});
	
	document.querySelectorAll('#wishlist_content .to_pdf.gridelement').forEach((item) =>{
		var pdflink = item.getAttribute('data-pdf');
		if(!check.includes(pdflink))
		{
			item.parentNode.removeChild(item);
		}
	});
	
	
	document.querySelectorAll('#wishlist_content .start_page_category').forEach((item) => {
		var kchln = item.querySelectorAll('.gridelement');
		if(kchln.length == 0)
		{
			item.parentNode.removeChild(item);
		}
	});
	
	
	document.querySelectorAll('#wishlist_content .gridelement').forEach((item) => {
		var heart = item.querySelectorAll('.info_heart')[0];
		if(heart != undefined && heart != null)
		{
			heart.parentNode.removeChild(heart);
		}
		item.insertAdjacentHTML('afterbegin', '<div class="wishlist_del"><i class="fa-solid fa-xmark"></i></div>')
		// item.classList.remove('to_page');
		
		item.querySelectorAll('a').forEach((lnk) => {
			lnk.setAttribute('href','#');
			lnk.classList.add('open-matching-pdf');
		});
		item.style.display = 'unset';
	});
	
	
	document.querySelectorAll('#wishlist_content .kacheln').forEach((item) => {
		item.style.display = 'flex';
	});
	
	document.querySelectorAll('.wishlist_del').forEach((item) => {
		item.addEventListener('click', event =>{
			var ge = event.target.closest('.gridelement');
			var toRemove = '';
			if(ge.classList.contains('to_pdf'))
			{
				toRemove = ge.getAttribute('data-pdf');
			}
			else
			{
				toRemove = ge.getAttribute('data-topage');
			}
			
			if(ge.getAttribute("data-to-remove") != null && ge.getAttribute("data-to-remove") != undefined)
			{
				toRemove = ge.getAttribute("data-to-remove");
			}
			removeProduct(currentlist,currentsublist,toRemove);
			
			event.stopPropagation();
		});
	});
	
	if(document.querySelectorAll('.wishlist_del').length > 0)
	{
		document.querySelector('.sharebutton').style.display = 'inline-block';
	}
	else
	{
		document.querySelector('.sharebutton').style.display = 'none';
	}
	
	document.querySelectorAll('#wishlist_content .to_page').forEach(item => {
		item.addEventListener('click', event => {
			if(item.classList.contains("uselink") == false)
			{
				document.querySelector('.wishlistoverlay').innerHTML = '';
				document.querySelector('.wishlistoverlay').style.display = 'none';
				toPage = item.getAttribute("data-topage");
				lastpage = currentpage;
				currentpage = toPage;
				updateContent();
				filterChanged();
			}
			else
			{
				window.location.href = (item.getAttribute("data-link"));
			}
		});
	});
	
	
	document.querySelectorAll('#wishlist_content .open-matching-pdf').forEach(item => {
		item.addEventListener('click', event => {
			
			var ge = event.target.closest('.gridelement');
			
			var toMatch = ge.getAttribute('data-pdf');
			document.querySelector('.wishlistoverlay').innerHTML = '';
			document.querySelector('.wishlistoverlay').style.display = 'none';
			updateContent();
			filterChanged();
			document.querySelectorAll('.to_pdf.gridelement').forEach(grid =>{
				if(grid.getAttribute('data-pdf') == toMatch)
				{
					grid.querySelector('a').click();
				}
			});
		});
	});
	
	var curcontent = document.querySelector('#wishlist_content').innerHTML;
	curcontent = curcontent.trim();
	if(curcontent=='' && currentlist > 0)
	{
		document.querySelector('#wishlist_content').innerHTML = '<div class="display-5 wishlist_empty">' + getTranslation('tl_nothing_on_list') + '</div>';
	}
	
}

function sublistsUpdated()
{	

	document.querySelectorAll('.sublists .wishlists-entry').forEach(item => {
		if(currentsublist == item.getAttribute('data-sublist-id'))
		{
			item.classList.add("active");
		}
	});
	
	if(document.querySelector(".sublists") != null && document.querySelector(".sublists") != undefined)
	{
		var lwishlists = document.querySelector(".sublists").children

		Array.from(lwishlists).forEach((wishlist) => {
			wishlist.addEventListener("click", (event) => {
				for (let index = 0; index < lwishlists.length; index++) {
					lwishlists[index].classList.remove("active");
				}
				wishlist.classList.add("active")
				wishlist.parentElement.insertBefore(wishlist, wishlist.parentElement.firstChild)
				
				currentsublist = wishlist.getAttribute('data-sublist-id');
				updateDisplayedWishlist();
				updateDisplayPreview();
			})
		})
		
		
	}
}

function mainlistSelected()
{
	document.querySelectorAll('.overlay_content.watchlist .main_wishlist')[0].style.display = 'block';
	
	var tempHtml = '';
	tempHtml = tempHtml + '<div class="wishlists-entry nosel" data-sublist-id="0">' + getTranslation('tl_select_sublist') + '</div>';
	
	if(wishlists[currentlist] != null && wishlists[currentlist] != undefined)
	{
		if(wishlists[currentlist]['sublists'] != null && wishlists[currentlist]['sublists'] != undefined)
		{
			var sl = wishlists[currentlist]['sublists'];
			
			var min = -1;
			var lastmin = -1;
			
			var sortorder = Array();
			for (var key in sl) {
				sortorder[sortorder.length] = (sl[key]['label']).toLowerCase() + "**;;*" + key;
			}
			
			sortorder.sort();
			
			
			
			for (var so = 0; so < sortorder.length; so++) {
				var splitted = sortorder[so].split('**;;*');
				key = splitted[1];
				var value = sl[key];
				tempHtml = tempHtml + '<div class="wishlists-entry" data-sublist-id="' + key + '">' + value['label'] + '</div>';
			};
		}
	}
	
	document.querySelector('.wishlists.sublists').innerHTML = tempHtml;
	sublistsUpdated();
	updateDisplayPreview();
}


function showOverlayNewList()
{
	var kb = getKeyboard('standard');
	document.querySelector('.wishlistoverlay').innerHTML = '<div class="container"><div class="overlay_header"><div class="overlay_icon opacity-0"><i class="fa-solid fa-arrow-left"></i></div><div class="header_title"><h1 class="">' + getTranslation('tl_overlay_wishlists_newlist') + '</h1><hr></div><div class="overlay_icon" id="close_new_wishlist" ><i class="fa-solid fa-xmark"></i></div></div> <div class="overlay_content"><p><input type="text" class="touchkeyreceiver" id="new_wishlist_name"/></p>' + kb + '<p><a class="btn_style btn_secondary_alt new_wish_list" id="submit_new_wishlist"><i class="fa-solid fa-plus"></i><span>' + getTranslation('tl_overlay_button_newlist') + '</span></a></p></div></div>';
	document.querySelector('.wishlistoverlay').style.display = 'block';
	document.querySelector("#close_new_wishlist").addEventListener('click', event =>{
		showWishlistOverlay();
	});
	
	document.querySelector('#submit_new_wishlist').addEventListener('click', event =>{
		newWishlist = document.querySelector('#new_wishlist_name').value;
		newWishlist = newWishlist.trim();
		if(newWishlist != "")
		{
			for (const key in wishlists){
			  if(wishlists.hasOwnProperty(key)){
					if(wishlists[key]['label'] == newWishlist)
					{
						newWishlist = "--alreadyexists--";
					}
			  }
			}
		}
		if(newWishlist == "")
		{
			showMessage(getTranslation('tl_popup_missing_name'),getTranslation('tl_popup_missing_name_text'));
		}
		else
		{
			if(newWishlist == "--alreadyexists--")
			{
				showMessage(getTranslation('tl_popup_name_existiert'),getTranslation('tl_popup_name_existiert_text'));
			}
			else
			{
				currentlist = 0;
				wishlistToPreselect = newWishlist;
				updateWishlist(newWishlist,'','0');
			}
		}
	});
	document.getElementById('new_wishlist_name').focus();
	lasttouchscreenreceiver = document.getElementById('new_wishlist_name');
	
} 



function showOverlayNewSubList()
{
	var kb = getKeyboard('standard');
	document.querySelector('.wishlistoverlay').innerHTML = '<div class="container"><div class="overlay_header"><div class="overlay_icon opacity-0"><i class="fa-solid fa-arrow-left"></i></div><div class="header_title"><h1><span>' + getTranslation('tl_headline_new_sublist') + ' </span>' + wishlists[currentlist]['label'] + '</h1><hr></div><div class="overlay_icon" id="close_new_wishlist" ><i class="fa-solid fa-xmark"></i></div></div> <div class="overlay_content"><p><input type="text" class="touchkeyreceiver" id="new_wishlist_name"/></p>' + kb + '<p><a class="btn_style btn_secondary_alt new_wish_list" id="submit_new_wishlist"><i class="fa-solid fa-plus"></i><span>' + getTranslation('tl_button_new_sublist') + '</span></a></p></div></div>';
	document.querySelector('.wishlistoverlay').style.display = 'block';
	
	document.querySelector("#close_new_wishlist").addEventListener('click', event =>{
		showWishlistOverlay();
	});
	
	document.querySelector('#submit_new_wishlist').addEventListener('click', event =>{
		newWishlist = document.querySelector('#new_wishlist_name').value;
		newWishlist = newWishlist.trim();
		if(newWishlist != "")
		{
			for (const key in wishlists[currentlist]['sublists']){
			  if(wishlists[currentlist]['sublists'].hasOwnProperty(key)){
					if(wishlists[currentlist]['sublists'][key]['label'] == newWishlist)
					{
						newWishlist = "--alreadyexists--";
					}
			  }
			}
		}
		if(newWishlist == "")
		{
			showMessage(getTranslation('tl_popup_missing_name'),getTranslation('tl_popup_missing_name_text'));
		}
		else
		{
			if(newWishlist == "--alreadyexists--")
			{
				showMessage(getTranslation('tl_popup_name_existiert'),getTranslation('tl_popup_name_existiert_text'));
			}
			else
			{
				wishlistToPreselect = wishlists[currentlist]['label'];
				sublistToPreselect = newWishlist;
				updateWishlist(newWishlist,'','-1');
			}
		}
	});
	document.getElementById('new_wishlist_name').focus();
	lasttouchscreenreceiver = document.getElementById('new_wishlist_name');
}


function shareStepTwo(linktext)
{
	
	// var sharelinke = '/view.php?content=53-50-45-46-16&u=1&ts=1686020727&check=4qc244d496cb7f1d549';
		
	var pdflink = '/pdf.php?content=53-50-45-46-16&u=1&ts=1686020727&check=4qc244d496cb7f1d549&print=true';
	
	var printlink = '/pdf_gen.php?content=53-50-45-46-16&u=1&ts=1686020727&check=4qc244d496cb7f1d549&print=true';
	
	
	document.querySelector('.wishlistoverlay').innerHTML = '<div class="container"><div class="overlay_header"><div class="overlay_icon opacity-0"><i class="fa-solid fa-arrow-left"></i></div><div class="header_title"><h1>Share</h1><hr></div><div class="overlay_icon" id="close_me"><i class="fa-solid fa-xmark"></i></div></div><div class="overlay_content share"><h4 class="text_accent">SUBLIST:</h4><p>Persönliche Interessen</p><div class="btn_wrapper"><a class="btn_style btn_secondary_alt"><i class="fa-solid fa-envelope"></i><span>E-Mail</span></a><a class="btn_style btn_secondary_alt"><i class="fa-solid fa-file-pdf"></i><span>PDF</span></a><a class="btn_style btn_secondary_alt"><i class="fa-solid fa-print"></i><span>Print</span></a></div></div></div>';
	
	document.querySelector('.wishlistoverlay').style.display = 'block';
	
	document.querySelector("#close_me").addEventListener('click', event =>{
		showWishlistOverlay();
	});
}


function shareStepOne()
{
	
	var toShare = "";
	if(currentsublist == 0)
	{
		toShare = wishlists[currentlist].vals.join('-');
	}
	else
	{
		toShare = wishlists[currentlist]['sublists'][currentsublist].vals.join('-');
	}
	getShareLink(toShare);
	
	
}


function showOverlayEditTitle()
{
	var kb = getKeyboard('standard');
	document.querySelector('.wishlistoverlay').innerHTML = '<div class="container"><div class="overlay_header"><div class="overlay_icon opacity-0"><i class="fa-solid fa-arrow-left"></i></div><div class="header_title"><h1><span>EDIT TITLE</span></h1><hr></div><div class="overlay_icon" id="close_me" ><i class="fa-solid fa-xmark"></i></div></div> <div class="overlay_content"><p><input type="text" class="touchkeyreceiver" id="new_wishlist_name"/></p>' + kb + '<p><a class="btn_style btn_secondary_alt new_wish_list" id="submit_new_title"><i class="fa-solid fa-plus"></i><span>Save title</span></a></p></div></div>';
	document.querySelector('.wishlistoverlay').style.display = 'block';
	
	document.querySelector("#close_me").addEventListener('click', event =>{
		showWishlistOverlay();
	});
	
	document.querySelector('#submit_new_title').addEventListener('click', event =>{
		
		newWishlist = document.querySelector('#new_wishlist_name').value;
		newWishlist = newWishlist.trim();
		if(newWishlist != "")
		{
			if(currentsublist == 0)
			{
				for (const key in wishlists){
				  if(wishlists.hasOwnProperty(key)){
						if(wishlists[key]['label'] == newWishlist)
						{
							newWishlist = "--alreadyexists--";
						}
				  }
				}
			}
			else
			{
				for (const key in wishlists[currentlist]['sublists']){
				  if(wishlists[currentlist]['sublists'].hasOwnProperty(key)){
						if(wishlists[currentlist]['sublists'][key]['label'] == newWishlist)
						{
							newWishlist = "--alreadyexists--";
						}
				  }
				}
			}
		}
		if(newWishlist == "")
		{
			showMessage(getTranslation('tl_popup_missing_name'),getTranslation('tl_popup_missing_name_text'));
		}
		else
		{
			if(newWishlist == "--alreadyexists--")
			{
				showMessage(getTranslation('tl_popup_name_existiert'),getTranslation('tl_popup_name_existiert_text'));
			}
			else
			{
				if(currentsublist == 0)
				{
					updateWishlistTitle(newWishlist,currentlist);
				}
				else
				{
					updateSublistTitle(newWishlist,currentlist,currentsublist)
				}
			}
		}
	});
	
	if(currentsublist == 0)
	{
		document.getElementById('new_wishlist_name').value = wishlists[currentlist]['label'];
	}
	else
	{
		document.getElementById('new_wishlist_name').value = wishlists[currentlist]['sublists'][currentsublist]['label'];
	}
	
	document.getElementById('new_wishlist_name').focus();
	lasttouchscreenreceiver = document.getElementById('new_wishlist_name');
}



function showOverlayDeleteList()
{
	var deltitle = wishlists[currentlist]['label'];
	
	if(currentsublist > 0)
	{
		deltitle = deltitle + ': ' + wishlists[currentlist]['sublists'][currentsublist]['label'];
	}
	
	document.querySelector('.wishlistoverlay').innerHTML = '<div class="container"><div class="overlay_header"><div class="overlay_icon opacity-0"><i class="fa-solid fa-arrow-left"></i></div><div class="header_title"><h1>Delete List</h1><hr></div><div class="overlay_icon" id="close_me"><i class="fa-solid fa-xmark"></i></div></div><div class="overlay_content delete-list"><h4 class="text_accent">Do you really want to delete this List</h4><p class="deltitle">' + deltitle + '</p><div class="btn_wrapper"><a class="btn_style btn_primary" id="deleteconfirm"><i class="fa-solid fa-check"></i><span>Yes</span></a><a class="btn_style btn_secondary_alt" id="close_me2"><i class="fa-solid fa-xmark"></i><span>No</span></a></div></div></div>';
	document.querySelector('.wishlistoverlay').style.display = 'block';
	
	document.querySelector("#close_me").addEventListener('click', event =>{
		showWishlistOverlay();
	});
	
	document.querySelector("#close_me2").addEventListener('click', event =>{
		showWishlistOverlay();
	});
	
	
	document.querySelector("#deleteconfirm").addEventListener('click', event =>{
		deleteWishlist(currentlist,currentsublist);
	});
	
	
}





function initWishlistOverlay()
{
	document.querySelectorAll('.mainlist.list_header_title.h1')[0].innerHTML = '<span>' + getTranslation('tl_overlay_wishlists_list') + '</span>';	
	document.querySelectorAll('.sublistheader .h1')[0].innerHTML = '<span>' + getTranslation('tl_overlay_wishlists_sublist') + '</span>';
	document.querySelector('.close_wishlist_overlay').addEventListener('click', event =>{
		document.querySelector('.wishlistoverlay').innerHTML = '';
		document.querySelector('.wishlistoverlay').style.display = 'none';
	});
	

	document.querySelector('#show_new_wishlist').addEventListener('click', event =>{
		showOverlayNewList();
	});	
	
	

	document.querySelector('#show_new_sublist').addEventListener('click', event =>{
		showOverlayNewSubList();
	});	
	
	document.querySelector('.edit_wishlist_title').addEventListener('click', event =>{
		showOverlayEditTitle();
	});	
	
	document.querySelector('.delete_wishlist').addEventListener('click', event =>{
		showOverlayDeleteList();
	});	
	
	
	document.querySelector('.sharebutton').addEventListener('click', event =>{
		shareStepOne();
	});	
	
	
	if(use_onlyonewishlist==true)
	{
		document.querySelectorAll('.h-onlyone').forEach((item) => {
			item.style.display = 'none';
		});
	}
	
	
	var wishlistSelects = document.querySelectorAll(".wishlist-select")
	Array.from(wishlistSelects).forEach((select) => {
		select.style.height = window.getComputedStyle(select).height
		select.addEventListener("click", (event) => {
			
			var ariaExp = JSON.parse(select.getAttribute("aria-expanded"))
			var ariaHid = JSON.parse(select.getAttribute("aria-hidden"))


			select.setAttribute("aria-expanded", !ariaExp)
			select.setAttribute("aria-hidden", !ariaHid)
		})
		
	
		if(select.querySelector(".mainlists") != null && select.querySelector(".mainlists") != undefined)
		{
			var lwishlists = select.querySelector(".mainlists").children

			Array.from(lwishlists).forEach((wishlist) => {
				wishlist.addEventListener("click", (event) => {
					
					for (let index = 0; index < lwishlists.length; index++) {
						lwishlists[index].classList.remove("active");
					}
					wishlist.classList.add("active")
					wishlist.parentElement.insertBefore(wishlist, wishlist.parentElement.firstChild)
					
					if(currentlist != wishlist.getAttribute('data-wishlist-id'))
					{
						currentlist = wishlist.getAttribute('data-wishlist-id');
						currentsublist = 0;
					}
					mainlistSelected();
					updateDisplayedWishlist();
				})
			})
		}
		
	})
	
	
	document.querySelectorAll('.overlay_content.watchlist .main_wishlist')[0].style.display = 'none';
	
	
	document.querySelectorAll('.mainlists .wishlists-entry').forEach(item => {
		if(currentlist == item.getAttribute('data-wishlist-id'))
		{
			item.classList.add("active");
			updateDisplayedWishlist();
			mainlistSelected();
		}
	});
	
	if(currentlist > 0)
	{
		document.querySelectorAll('.sublistheader')[0].style.display = 'block';
		document.querySelectorAll('.sublistselect')[0].style.display = 'flex';
	}
	else
	{
		document.querySelectorAll('.sublistheader')[0].style.display = 'none';
		document.querySelectorAll('.sublistselect')[0].style.display = 'none';
	}
	
	if(use_onlyonewishlist == true)
	{
		document.querySelector('.wishlistoverlay .display-1').innerHTML = getTranslation('tl_menue_your_wishlist');
		document.querySelector('.wl_p1').remove();
		document.querySelector('.wl_p2').remove();
		document.querySelector('.wishlistoverlay .list_header.selectedwishlist').remove();
		document.querySelector('#show_my_wl').innerHTML = '<i class="fa-solid fa-eye"></i> ' + getTranslation('tl_menue_your_wishlist');
	}
	
}

function updateDisplayedWishlist()
{
	console.log("UPDATE DISPLAYED WISHLIST: " + currentlist + " ... " + currentsublist);
	var tempHtml = '';
	if(currentlist != 0)
	{
		if(wishlists[currentlist] != undefined && wishlists[currentlist] != null)
		{
			var listvalues = wishlists[currentlist]['vals'];
			tempHtml = '<i class="fa-solid fa-heart"></i> ' + wishlists[currentlist]['label'] + ' <span class="wishlist-blob">' + wishlists[currentlist]['vals'].length + '</span>';
			document.querySelector('.bottom_wishlist .count_blob').innerHTML = wishlists[currentlist]['vals'].length;
			if(currentsublist > 0)
			{
				if(wishlists[currentlist]['sublists'][currentsublist] != undefined && wishlists[currentlist]['sublists'][currentsublist] != null)
				{
					listvalues = wishlists[currentlist]['sublists'][currentsublist]['vals'];
				}
				
				
				tempHtml = '<div><i class="fa-solid fa-heart"></i> ' + wishlists[currentlist]['label'] + '<br/><i class="fa-solid fa-arrow-right"></i> ' + wishlists[currentlist]['sublists'][currentsublist]['label'] + '</div> <span class="wishlist-blob">' + wishlists[currentlist]['sublists'][currentsublist]['vals'].length + '</span>';
				
				document.querySelector('.bottom_wishlist .count_blob').innerHTML = wishlists[currentlist]['sublists'][currentsublist]['vals'].length;
			}
			
			document.querySelectorAll('.info_heart.to_wishlist').forEach(item => {
				var cid = item.getAttribute("data-pageid");
	
				var cid_active = false;
				
				
				var heart = item.querySelector(".fa-heart")
				
				if(cid != null && cid != undefined)
				{
					if(listvalues != null && listvalues != undefined)
					{
						if(Object.values(listvalues).includes(cid))
						{
							cid_active = true;
						}
					}
	 
				
											   
					if(cid_active)
					{
						heart.classList.remove("fa-regular");
						heart.classList.add("fa-solid", "active");
					}
					else
					{
						heart.classList.remove("fa-solid", "active");
						heart.classList.add("fa-regular"); 
					}
				}
				else
				{
				
					var pdf = item.getAttribute("data-pdf-url");
					var pdf_active = false;
					
					if(pdf != null && pdf != undefined)
					{
						if(listvalues.includes(pdf))
						{
							pdf_active = true;
						}
					
						if(pdf_active)
						{
							heart.classList.remove("fa-regular");
							heart.classList.add("fa-solid", "active");
						}
						else
						{
							heart.classList.remove("fa-solid", "active");
							heart.classList.add("fa-regular"); 
						}
					}
				}
				
			});
		}
	}
	
	if(use_onlyonewishlist == false)
	{
		if(document.querySelectorAll('.sublistheader').length > 0)
		{
			if(currentlist > 0)
			{
				document.querySelectorAll('.sublistheader')[0].style.display = 'block';
				document.querySelectorAll('.sublistselect')[0].style.display = 'flex';
			}
			else
			{
				document.querySelectorAll('.sublistheader')[0].style.display = 'none';
				document.querySelectorAll('.sublistselect')[0].style.display = 'none';
			}
		}
	}
	document.querySelector('a.wl_holder').innerHTML = tempHtml;
	
	
	
	data = new FormData();
	data.set('currentlist',currentlist);
	data.set('currentsublist',currentsublist);
	let request = new XMLHttpRequest();
	request.onreadystatechange = function() {
		if (this.readyState == 4 && this.status == 200) {
			
		}
	};
	request.open("POST", '/set-list', true);
	request.send(data)
	
	document.querySelectorAll(".lang-select a").forEach(function(langlink){
		var thref = langlink.getAttribute("href");
		var tempHArray = thref.split("?");
		thref = tempHArray[0] + "?preselectPage=" + currentpage;
		langlink.setAttribute("href",thref);
	});
	
}

async function showWishlistOverlay()
{	
	
	data = new FormData()
	data.set('language',currentLanguage);
	
	document.querySelector('.wishlistoverlay').innerHTML = '';
	document.querySelector('.wishlistoverlay').style.display = 'block';
	
	let request = new XMLHttpRequest();
	
    request.onreadystatechange = function() {
        if (this.readyState == 4 && this.status == 200) {
			var antwort = this.responseText;
            document.querySelector('.wishlistoverlay').innerHTML = antwort;
			initWishlistOverlay();
		}
    };
	
	request.open("POST", '/get-wishlist-overlay', true);
	request.send(data)
}


function initEmailResult()
{
	document.querySelectorAll('.back_to_wishlist').forEach(item => {
		item.addEventListener('click', event =>{
		showWishlistOverlay();
		});
	});
}


function updateCCFields()
{
	var addresses = Array();
	var j = 0;
	for(j = 1; j < 11; j++)
	{
		var temp = document.querySelector("#cc_holder_" + j + " input").value;
		temp = temp.trim();
		if(temp != "")
		{
			addresses[addresses.length] = temp;
		}
	}
	
	var first = true;
	for(j = 10; j > 0; j--)
	{
		var element = document.querySelector("#cc_holder_" + j);
		var tf = document.querySelector("#cc_holder_" + j + " input");
		if(addresses[j-1] != null && addresses[j-1] != undefined)
		{
			tf.value = addresses[j-1];
			element.style.display = "block";
			if(first == true)
			{
				if(j < 10)
				{
					element.querySelector(".cc_plus").style.display = "block";
				}
			}
			else
			{
				element.querySelector(".cc_plus").style.display = "none";
			}
			first = false;
		}
		else
		{
			tf.value = "";
			element.style.display = "none";
		}
	}
}

var emailField = "";
var firstNameField = "";
var lastNameField = "";
function showShareViaEmail(result)
{
	emailField = "A_" + Date.now();
	firstNameField = "B_" + Date.now();
	lastNameField = "C_" + Date.now();
	textField = "D_" + Date.now();
	ccField1 = "E_" + Date.now();
	ccField2 = "F_" + Date.now();
	ccField3 = "G_" + Date.now();
	ccField4 = "H_" + Date.now();
	ccField5 = "I_" + Date.now();
	ccField6 = "J_" + Date.now();
	ccField7 = "K_" + Date.now();
	ccField8 = "L_" + Date.now();
	ccField9 = "M_" + Date.now();
	ccField10 = "N_" + Date.now();
	
	document.querySelector('.wishlistoverlay').style.display = 'block';
	
/*	document.querySelector('.wishlistoverlay').innerHTML = '<div class="container"><div class="overlay_header"><div class="overlay_icon opacity-0"></div><div class="header_title"><h1>Share</h1><hr></div><div class="overlay_icon close_share_overlay"><i class="fa-solid fa-xmark"></i></div></div><div class="overlay_content share-2"><input type="text" name="' + emailField + '" id="' + emailField + '" placeholder="E-Mail" class="input_style text-center"> <input type="text" name="' + firstNameField + '" id="' + firstNameField + '" placeholder="First Name" class="input_style text-center"> <input type="text" name="' + lastNameField + '" id="' + lastNameField + '" placeholder="Last Name" class="input_style text-center">' + getKeyboard('mail') + '<div class="input-wrapper"><input class="input_style" type="checkbox" name="check1" id="check1" value="datenschutz"><label for="check1">Ich bin mit der <a href="#" class="to_page link_mail_privacy" data-topage="59"><span>Privacy policy</span></a> einverstanden.</label></div><a class="btn_style btn_primary sendemail"><i class="fa-solid fa-paper-plane"></i><span>Send</span></a></div></div>'; */

if(currentLanguage=='de')
{
	document.querySelector('.wishlistoverlay').innerHTML = '<div class="container"><div class="overlay_header"><div class="overlay_icon opacity-0"></div><div class="header_title"><h1 class="display-1">Teilen</h1><hr></div><div class="overlay_icon close_share_overlay"><i class="fa-solid fa-xmark"></i></div></div><div class="overlay_content share-2"><input type="text" name="' + emailField + '" id="' + emailField + '" placeholder="E-Mail" class="input_style text-center touchkeyreceiver"> <input type="text" name="' + firstNameField + '" id="' + firstNameField + '" placeholder="Vorname" class="input_style text-center touchkeyreceiver"> <input type="text" name="' + lastNameField + '" id="' + lastNameField + '" placeholder="Nachname" class="input_style text-center touchkeyreceiver"> <textarea name="' + textField + '" id="' + textField + '" placeholder="" class="input_style text-center touchkeyreceiver">' + getTranslation("tl_standard_mailtext") + '</textarea><br/>' + getTranslation("tl_mail_cc") + '	<div data-plus="2" data-minus="0" class="cc_holder" id="cc_holder_1"><div class="cc_plus"><i class="fa-solid fa-circle-plus"></i></div><input type="text" name="' + ccField1 + '" id="' + ccField1 + '" placeholder="E-Mail (cc)" class="input_style text-center touchkeyreceiver"></div><div data-plus="3" data-minus="2" class="cc_holder" id="cc_holder_2"><div class="cc_plus"><i class="fa-solid fa-circle-plus"></i></div><div class="cc_minus"><i class="fa-solid fa-circle-minus"></i></div><input type="text" name="' + ccField2 + '" id="' + ccField2 + '" placeholder="E-Mail (cc)" class="input_style text-center touchkeyreceiver"></div><div data-plus="4" data-minus="3" class="cc_holder" id="cc_holder_3"><div class="cc_plus"><i class="fa-solid fa-circle-plus"></i></div><div class="cc_minus"><i class="fa-solid fa-circle-minus"></i></div><input type="text" name="' + ccField3 + '" id="' + ccField3 + '" placeholder="E-Mail (cc)" class="input_style text-center touchkeyreceiver"></div><div data-plus="5" data-minus="4" class="cc_holder" id="cc_holder_4"><div class="cc_plus"><i class="fa-solid fa-circle-plus"></i></div><div class="cc_minus"><i class="fa-solid fa-circle-minus"></i></div><input type="text" name="' + ccField4 + '" id="' + ccField4 + '" placeholder="E-Mail (cc)" class="input_style text-center touchkeyreceiver"></div><div data-plus="6" data-minus="5" class="cc_holder" id="cc_holder_5"><div class="cc_plus"><i class="fa-solid fa-circle-plus"></i></div><div class="cc_minus"><i class="fa-solid fa-circle-minus"></i></div><input type="text" name="' + ccField5 + '" id="' + ccField5 + '" placeholder="E-Mail (cc)" class="input_style text-center touchkeyreceiver"></div><div data-plus="7" data-minus="6" class="cc_holder" id="cc_holder_6"><div class="cc_plus"><i class="fa-solid fa-circle-plus"></i></div><div class="cc_minus"><i class="fa-solid fa-circle-minus"></i></div><input type="text" name="' + ccField6 + '" id="' + ccField6 + '" placeholder="E-Mail (cc)" class="input_style text-center touchkeyreceiver"></div><div data-plus="8" data-minus="7" class="cc_holder" id="cc_holder_7"><div class="cc_plus"><i class="fa-solid fa-circle-plus"></i></div><div class="cc_minus"><i class="fa-solid fa-circle-minus"></i></div><input type="text" name="' + ccField7 + '" id="' + ccField7 + '" placeholder="E-Mail (cc)" class="input_style text-center touchkeyreceiver"></div><div data-plus="9" data-minus="8" class="cc_holder" id="cc_holder_8"><div class="cc_plus"><i class="fa-solid fa-circle-plus"></i></div><div class="cc_minus"><i class="fa-solid fa-circle-minus"></i></div><input type="text" name="' + ccField8 + '" id="' + ccField8 + '" placeholder="E-Mail (cc)" class="input_style text-center touchkeyreceiver"></div><div data-plus="10" data-minus="9" class="cc_holder" id="cc_holder_9"><div class="cc_plus"><i class="fa-solid fa-circle-plus"></i></div><div class="cc_minus"><i class="fa-solid fa-circle-minus"></i></div><input type="text" name="' + ccField9 + '" id="' + ccField9 + '" placeholder="E-Mail (cc)" class="input_style text-center touchkeyreceiver"></div><div data-plus="0" data-minus="10" class="cc_holder" id="cc_holder_10"><div class="cc_minus"><i class="fa-solid fa-circle-minus"></i></div><input type="text" name="' + ccField10 + '" id="' + ccField10 + '" placeholder="E-Mail (cc)" class="input_style text-center touchkeyreceiver"></div>' + getKeyboard('mail') + '<div class="input-wrapper"><input class="input_style" type="checkbox" name="check1" id="check1" value="datenschutz"><label for="check1">Ich bin mit der <a href="#" class="to_page link_mail_privacy" data-topage="59"><span>Datenschutzerklärung</span></a> einverstanden.</label></div><a class="btn_style btn_primary sendemail"><i class="fa-solid fa-paper-plane"></i><span>Senden</span></a></div></div>';
}
else
{
	document.querySelector('.wishlistoverlay').innerHTML = '<div class="container"><div class="overlay_header"><div class="overlay_icon opacity-0"></div><div class="header_title"><h1 class="display-1">Share</h1><hr></div><div class="overlay_icon close_share_overlay"><i class="fa-solid fa-xmark"></i></div></div><div class="overlay_content share-2"><input type="text" name="' + emailField + '" id="' + emailField + '" placeholder="E-Mail" class="input_style text-center touchkeyreceiver"> <input type="text" name="' + firstNameField + '" id="' + firstNameField + '" placeholder="First Name" class="input_style text-center touchkeyreceiver"> <input type="text" name="' + lastNameField + '" id="' + lastNameField + '" placeholder="Last Name" class="input_style text-center touchkeyreceiver"><textarea name="' + textField + '" id="' + textField + '" placeholder="" class="input_style text-center touchkeyreceiver">' + getTranslation("tl_standard_mailtext") + '</textarea><br/>' + getTranslation("tl_mail_cc") + '	<div data-plus="2" data-minus="0" class="cc_holder" id="cc_holder_1"><div class="cc_plus"><i class="fa-solid fa-circle-plus"></i></div><input type="text" name="' + ccField1 + '" id="' + ccField1 + '" placeholder="E-Mail (cc)" class="input_style text-center touchkeyreceiver"></div><div data-plus="3" data-minus="2" class="cc_holder" id="cc_holder_2"><div class="cc_plus"><i class="fa-solid fa-circle-plus"></i></div><div class="cc_minus"><i class="fa-solid fa-circle-minus"></i></div><input type="text" name="' + ccField2 + '" id="' + ccField2 + '" placeholder="E-Mail (cc)" class="input_style text-center touchkeyreceiver"></div><div data-plus="4" data-minus="3" class="cc_holder" id="cc_holder_3"><div class="cc_plus"><i class="fa-solid fa-circle-plus"></i></div><div class="cc_minus"><i class="fa-solid fa-circle-minus"></i></div><input type="text" name="' + ccField3 + '" id="' + ccField3 + '" placeholder="E-Mail (cc)" class="input_style text-center touchkeyreceiver"></div><div data-plus="5" data-minus="4" class="cc_holder" id="cc_holder_4"><div class="cc_plus"><i class="fa-solid fa-circle-plus"></i></div><div class="cc_minus"><i class="fa-solid fa-circle-minus"></i></div><input type="text" name="' + ccField4 + '" id="' + ccField4 + '" placeholder="E-Mail (cc)" class="input_style text-center touchkeyreceiver"></div><div data-plus="6" data-minus="5" class="cc_holder" id="cc_holder_5"><div class="cc_plus"><i class="fa-solid fa-circle-plus"></i></div><div class="cc_minus"><i class="fa-solid fa-circle-minus"></i></div><input type="text" name="' + ccField5 + '" id="' + ccField5 + '" placeholder="E-Mail (cc)" class="input_style text-center touchkeyreceiver"></div><div data-plus="7" data-minus="6" class="cc_holder" id="cc_holder_6"><div class="cc_plus"><i class="fa-solid fa-circle-plus"></i></div><div class="cc_minus"><i class="fa-solid fa-circle-minus"></i></div><input type="text" name="' + ccField6 + '" id="' + ccField6 + '" placeholder="E-Mail (cc)" class="input_style text-center touchkeyreceiver"></div><div data-plus="8" data-minus="7" class="cc_holder" id="cc_holder_7"><div class="cc_plus"><i class="fa-solid fa-circle-plus"></i></div><div class="cc_minus"><i class="fa-solid fa-circle-minus"></i></div><input type="text" name="' + ccField7 + '" id="' + ccField7 + '" placeholder="E-Mail (cc)" class="input_style text-center touchkeyreceiver"></div><div data-plus="9" data-minus="8" class="cc_holder" id="cc_holder_8"><div class="cc_plus"><i class="fa-solid fa-circle-plus"></i></div><div class="cc_minus"><i class="fa-solid fa-circle-minus"></i></div><input type="text" name="' + ccField8 + '" id="' + ccField8 + '" placeholder="E-Mail (cc)" class="input_style text-center touchkeyreceiver"></div><div data-plus="10" data-minus="9" class="cc_holder" id="cc_holder_9"><div class="cc_plus"><i class="fa-solid fa-circle-plus"></i></div><div class="cc_minus"><i class="fa-solid fa-circle-minus"></i></div><input type="text" name="' + ccField9 + '" id="' + ccField9 + '" placeholder="E-Mail (cc)" class="input_style text-center touchkeyreceiver"></div><div data-plus="0" data-minus="10" class="cc_holder" id="cc_holder_10"><div class="cc_minus"><i class="fa-solid fa-circle-minus"></i></div><input type="text" name="' + ccField10 + '" id="' + ccField10 + '" placeholder="E-Mail (cc)" class="input_style text-center touchkeyreceiver"></div>' + getKeyboard('mail') + '<div class="input-wrapper"><input class="input_style" type="checkbox" name="check1" id="check1" value="datenschutz"><label for="check1">I accept the <a href="#" class="to_page link_mail_privacy" data-topage="59"><span>Privacy policy</span></a>.</label></div><a class="btn_style btn_primary sendemail"><i class="fa-solid fa-paper-plane"></i><span>Send</span></a></div></div>';
}



	document.querySelectorAll('.cc_plus').forEach(item => {
		item.addEventListener('click', event => {
			var toShow = '#cc_holder_' + item.parentElement.getAttribute("data-plus");
			document.querySelector(toShow).style.display = "block";
			if(parseInt(item.parentElement.getAttribute("data-plus")) < 10)
			{
				document.querySelector(toShow).querySelector(".cc_plus").style.display = "block";
			}
			item.style.display = "none";
		});
	});

	document.querySelectorAll('.cc_minus').forEach(item => {
		item.addEventListener('click', event => {
			var toHide = '#cc_holder_' + item.parentElement.getAttribute("data-minus");
			document.querySelector(toHide + " input").value = "";
			updateCCFields();
		});
	});

	document.querySelectorAll('.wishlistoverlay .to_page').forEach(item => {
		item.addEventListener('click', event => {
			document.querySelector('.wishlistoverlay').innerHTML = '';
			document.querySelector('.wishlistoverlay').style.display = 'none';
			toPage = item.getAttribute("data-topage");
			lastpage = currentpage;
			currentpage = toPage;
			updateContent();
			filterChanged();
		});
	});
	
	document.getElementById(emailField).focus();
	lasttouchscreenreceiver = document.getElementById(emailField);
	
	
	document.querySelector(".close_share_overlay").addEventListener('click', event =>{
		showWishlistOverlay();
	});
	
	document.querySelector(".sendemail").addEventListener('click', event =>{
		var mailaddress = document.getElementById(emailField).value;
		mailaddress = mailaddress.trim();
		
		if(mailaddress != "")
		{
			
			var validRegex = /^[a-zA-Z0-9.!#$%&'*+/=?^_`{|}~-]+@[a-zA-Z0-9-]+(?:\.[a-zA-Z0-9-]+)*$/;
			var sendit = true;
	
			var cc1 = document.getElementById(ccField1).value;
			cc1 = cc1.trim();
			var cc2 = document.getElementById(ccField2).value;
			cc2 = cc2.trim();
			var cc3 = document.getElementById(ccField3).value;
			cc3 = cc3.trim();
			var cc4 = document.getElementById(ccField4).value;
			cc4 = cc4.trim();
			var cc5 = document.getElementById(ccField5).value;
			cc5 = cc5.trim();
			var cc6 = document.getElementById(ccField6).value;
			cc6 = cc6.trim();
			var cc7	= document.getElementById(ccField7).value;
			cc7 = cc7.trim();
			var cc8 = document.getElementById(ccField8).value;
			cc8 = cc8.trim();
			var cc9 = document.getElementById(ccField9).value;
			cc9 = cc9.trim();
			var cc10 = document.getElementById(ccField10).value;
			cc10 = cc10.trim();
			
			
			if(!mailaddress.match(validRegex))
			{
				sendit = false;
			}
			
			if(cc1 != "")
			{
				if(!cc1.match(validRegex))
				{
					sendit = false;
				}
			}
			if(cc2 != "")
			{
				if(!cc2.match(validRegex))
				{
					sendit = false;
				}
			}
			if(cc3 != "")
			{
				if(!cc3.match(validRegex))
				{
					sendit = false;
				}
			}
			if(cc4 != "")
			{
				if(!cc4.match(validRegex))
				{
					sendit = false;
				}
			}
			if(cc5 != "")
			{
				if(!cc5.match(validRegex))
				{
					sendit = false;
				}
			}
			if(cc6 != "")
			{
				if(!cc6.match(validRegex))
				{
					sendit = false;
				}
			}
			if(cc7 != "")
			{
				if(!cc7.match(validRegex))
				{
					sendit = false;
				}
			}
			if(cc8 != "")
			{
				if(!cc8.match(validRegex))
				{
					sendit = false;
				}
			}
			if(cc9 != "")
			{
				if(!cc9.match(validRegex))
				{
					sendit = false;
				}
			}
			if(cc10 != "")
			{
				if(!cc10.match(validRegex))
				{
					sendit = false;
				}
			}
			
			
			if(sendit == true)
			{
				// senden
				var cb = (document.getElementById('check1'));
				var cbnl = (document.getElementById('check2'));
				
				var newsletter = 0;
				
				if(cb.checked)
				{
					var firstname = document.getElementById(firstNameField).value;
					var lastname = document.getElementById(lastNameField).value;
					var custom = document.getElementById(textField).value;
					
					data = new FormData();
					data.set('language',currentLanguage);
					data.set('toshare',result);
					data.set('newsletter',newsletter);
					data.set('email',mailaddress);
					data.set('firstname',firstname);
					data.set('lastname',lastname);
					data.set('cc1',cc1);
					data.set('cc2',cc2);
					data.set('cc3',cc3);
					data.set('cc4',cc4);
					data.set('cc5',cc5);
					data.set('cc6',cc6);
					data.set('cc7',cc7);
					data.set('cc8',cc8);
					data.set('cc9',cc9);
					data.set('cc10',cc10);
					data.set('custom',custom);
					document.querySelector('.wishlistoverlay').innerHTML = '';
					document.querySelector('.wishlistoverlay').style.display = 'block';
					
					let request = new XMLHttpRequest();
					
					request.onreadystatechange = function() {
						if (this.readyState == 4 && this.status == 200) {
							var antwort = this.responseText;
							document.querySelector('.wishlistoverlay').innerHTML = antwort;
							initEmailResult();
						}
					};
					
					request.open("POST", '/send-email', true);
					request.send(data)
				}
				else
				{
					showMessage(getTranslation('tl_popup_datenschutz'),getTranslation('tl_popup_datenschutz_text'));
				}
			}
			else
			{
				showMessage(getTranslation('tl_popup_email'),getTranslation('tl_popup_email_text'));
				
			}
		}
		
	});
	
	
	
}


async function getShareLink(toShare)
{
	if(toShare == "")
	{
		showMessage(getTranslation('tl_popup_wishlistempty'),getTranslation('tl_popup_wishlistempty_text'));
	}
	else
	{
		data = new FormData();
		data.set('language',currentLanguage);
		data.set('toshare',toShare)
		let request = new XMLHttpRequest();
		
		request.onreadystatechange = function() {
			if (this.readyState == 4 && this.status == 200) {
				var result = (JSON.parse(this.responseText));
				result = result.replace('.php?','.php?lang=' + currentLanguage + '&');
				pdf = result.replace("view.php","pdf.php");
				if(use_shareviaemail == true)
				{
					showShareViaEmail(result);
				}
				else
				{
					showMessage(getTranslation('tl_popup_sharing'),'<a target="_blank" href="' + result + '">' + getTranslation('tl_popup_sharing_link') + '</a><br><br><a target="_blank" href="' + result.replace('view.php','print.php') + '&print=true">' + getTranslation('tl_popup_sharing_print') + '</a>');
				}
			}
		};
		
		request.open("POST", '/get-share-link', true);
		request.send(data);
	}
}


async function updateWishlist(label,values,sublistid = '0')
{	
	data = new FormData();
	data.set('language',currentLanguage);
	data.set('label',label);
	data.set('values',values);
	data.set('sublistid',sublistid);
	data.set('selected',currentlist);
	let request = new XMLHttpRequest();
	
    request.onreadystatechange = function() {
        if (this.readyState == 4 && this.status == 200) {
            updateWishlistFromData(JSON.parse(this.responseText));
			// document.querySelector('#new_wishlist_holder').style.display = 'none';
			document.querySelector('#new_wishlist_name').value = "";
			// document.querySelector('#new_sublist_holder').style.display = 'none';
			// document.querySelector('#new_sublist_name').value = "";
			updateWishlistContent();
			
			if(wishlistToPreselect == "")
			{
				if(document.querySelector('.wishlistoverlay').style.display == 'block')
				{
					showWishlistOverlay();
				}
			}
			else
			{
				for (const key in wishlists){
				  if(wishlists.hasOwnProperty(key)){
					
					if(wishlists[key]['label'] == wishlistToPreselect)
					{
						currentlist = key;
						if(sublistToPreselect == "")
						{
							currentsublist = 0;
												
							document.querySelector('.wishlistoverlay').innerHTML = '';
							document.querySelector('.wishlistoverlay').style.display = 'none';
							wishlistToPreselect = "";
							sublistToPreselect = "";
							updateDisplayedWishlist();
						}
						else
						{
							var subs = wishlists[currentlist]['sublists'];
							
							for (const key in subs){
							  if(subs.hasOwnProperty(key)){
								  
								if(sublistToPreselect == subs[key]['label'])
								{
									currentsublist = key;
									document.querySelector('.wishlistoverlay').innerHTML = '';
									document.querySelector('.wishlistoverlay').style.display = 'none';
									wishlistToPreselect = "";
									sublistToPreselect = "";
									updateDisplayedWishlist();
								}
								
							  }
							}
						}
					}
				  }
				}
				
			}
		}
    };
	
	request.open("POST", '/update-wishlist', true);
	request.send(data)
}


async function updateWishlistTitle(label,listid)
{	
	data = new FormData();
	data.set('language',currentLanguage);
	data.set('label',label);
	data.set('listid',listid);
	let request = new XMLHttpRequest();
	
    request.onreadystatechange = function() {
        if (this.readyState == 4 && this.status == 200) {
            updateWishlistFromData(JSON.parse(this.responseText));
            showWishlistOverlay();
		}
    };
	
	request.open("POST", '/update-wishlist-title', true);
	request.send(data)
}


async function updateSublistTitle(label,listid,sublistid)
{	
	data = new FormData();
	data.set('language',currentLanguage);
	data.set('label',label);
	data.set('listid',listid);
	data.set('sublistid',sublistid);
	let request = new XMLHttpRequest();
	
    request.onreadystatechange = function() {
        if (this.readyState == 4 && this.status == 200) {
            updateWishlistFromData(JSON.parse(this.responseText));
            showWishlistOverlay();
		}
    };
	
	request.open("POST", '/update-sublist-title', true);
	request.send(data)
}

var deletingSublist = 0;
async function deleteWishlist(listid,sublistid = 0)
{
	deletingSublist = sublistid;
	if(listid > 0)
	{
		data = new FormData();
		data.set('language',currentLanguage);
		data.set('listid',listid);
		data.set('sublistid',sublistid);
		let request = new XMLHttpRequest();
		
		request.onreadystatechange = function() {
			if (this.readyState == 4 && this.status == 200) {
				if(deletingSublist == 0)
				{
					currentlist = 0;
				}
				currentsublist = 0;
				updateWishlistFromData(JSON.parse(this.responseText));
				showWishlistOverlay();
			}
		};
		
		request.open("POST", '/delete-wishlist', true);
		request.send(data)
	}
}



async function removeProduct(listid,sublistid,prod)
{
		data = new FormData();
		data.set('language',currentLanguage);
		data.set('listid',listid);
		data.set('sublistid',sublistid);
		data.set('product',prod);
		let request = new XMLHttpRequest();
		
		request.onreadystatechange = function() {
			if (this.readyState == 4 && this.status == 200) {
				updateWishlistFromData(JSON.parse(this.responseText));
				updateWishlistContent();
				// updateDisplayPreview();
				showWishlistOverlay();
			}
		};
		
		request.open("POST", '/remove-product', true);
		request.send(data)
}


function sortSelect(selElem) {
    var tmpAry = new Array();
    for (var i=0;i<selElem.options.length;i++) {
        tmpAry[i] = new Array();
        tmpAry[i][0] = selElem.options[i].text;
        tmpAry[i][1] = selElem.options[i].value;
    }
    tmpAry.sort(Intl.Collator().compare);
    while (selElem.options.length > 0) {
        selElem.options[0] = null;
    }
    for (var i=0;i<tmpAry.length;i++) {
        var op = new Option(tmpAry[i][0], tmpAry[i][1]);
        selElem.options[i] = op;
    }
    return;
}

function updateSubListSelect()
{
}

function updateSubListSelectx()
{
	document.querySelector(".sl").style.display = 'none';
	if(currentlist != "")
	{
		var select = document.querySelector('#sublistselect');
		
		
		var i, L = select.options.length - 1;
	   for(i = L; i >= 0; i--) {
		  select.remove(i);
	   }
		
		var subs = wishlists[currentlist]['sublists'];
		var display = "none";

		var opt = document.createElement('option');
		
		for (const key in subs){
		  if(subs.hasOwnProperty(key)){
			opt = document.createElement('option');
			opt.value = key;
			opt.innerHTML = subs[key]['label'];
			if(newSublist == subs[key]['label'])
			{
				currentsublist = key;
			}
			select.append(opt);
			display = "block";
		  }
		}
		
		sortSelect(select);

		opt = document.createElement('option');
		opt.value = '0';
		opt.innerHTML = '';
		select.prepend(opt);
		
		select.value = currentsublist;
		
		document.querySelector(".sl").style.display = display;
	}
}

function updateWishlistFromData(data)
{	
	wishlists = data;
	
	var countWishlists = 0;
	for (const key in wishlists){
	  if(wishlists.hasOwnProperty(key)){
		  countWishlists = countWishlists + 1;
	  }
	}
	
	if(countWishlists == 0)
	{
		document.querySelector("#show_wl").style.display = 'none';
		document.querySelector("#create_wl").style.display = 'flex';
		if(use_onlyonewishlist == true)
		{
			var reseturl = document.querySelector('#reset_user a').getAttribute('href');
			location.href = reseturl;
		}
	}
	else
	{
		document.querySelector("#show_wl").style.display = 'flex';
		document.querySelector("#create_wl").style.display = 'none';
	}
	if(use_onlyonewishlist == true)
	{
		document.querySelector("#show_wl").style.display = 'none';
		document.querySelector("#create_wl").style.display = 'none';
		document.querySelector("#show_my_wl").style.display = 'flex';
		
		for (const key in wishlists){
		  if(wishlists.hasOwnProperty(key)){
			  currentlist = key;
		  }
		}
	}
	updateDisplayedWishlist();
}

function loadWishlists()
{	
	data = new FormData();
	data.set('language',currentLanguage);
	
	let request = new XMLHttpRequest();
	
	request.onreadystatechange = function() {
		if (this.readyState == 4 && this.status == 200) {
			updateWishlistFromData(JSON.parse(this.responseText));
		}
	};
	
	request.open("POST", '/load-wishlists', true);
	request.send(data)
	
}


function updateWishlistContent()
{
	updateDisplayedWishlist();
}


function updateHearts()
{
	const infoHeart = document.querySelectorAll(".info_heart")

	Array.from(infoHeart).forEach((element, index) => {
			const heart = element.parentElement.querySelector(".fa-heart")
			var aufListe = false;
			
			if(aufListe == true){
				heart.classList.remove("fa-regular");
				heart.classList.add("fa-solid", "active");
			} else {
				heart.classList.remove("fa-solid", "active");
				heart.classList.add("fa-regular");            
			}
			
		})
}


function filterChanged()
{
	if(currentpage == 1)
	{
		var visible = Array();
		
		var fa = document.querySelectorAll('.menue-filter.active');
		var showOnly = '76'; // Home
		fa.forEach(function (filt, index) {
			
			showOnly = filt.getAttribute('data-showonly');
		});
		
		if(showOnly == '76')
		{
			document.querySelectorAll('.filter')[0].style.display = 'flex';
			document.querySelectorAll('.filter')[0].classList.remove('hidden');
			var filterPills = document.querySelectorAll('.filter_pill');
			filterPills.forEach(function(pill,index){
				if(pill.classList.contains('active'))
				{
					if(pill.classList.contains('removefilter') == false)
					{
						visible[visible.length] = pill.getAttribute('data-filter-id');
					}
				}
			});
			
			var ges = document.querySelectorAll('.gridelement');
			ges.forEach(function(ge,index){
				var display = 'none';
				if(visible.length == 0)
				{
					display = 'block';
				}
				else
				{
					var v = 0;
					var comp = ge.getAttribute('data-categories');
					for(v = 0; v < visible.length; v++)
					{
						if(comp.indexOf(',' + visible[v] + ',') >= 0)
						{
							display = 'block';
						}
					}
				}
				
				ge.style.display = display;
			});
			
			var spc = document.querySelectorAll('.start_page_category');
			for(var s = 0; s < spc.length; s++)
			{
				
				var kacheln = spc[s].querySelectorAll('.gridelement');
				var spc_display = 'none';
				
				kacheln.forEach(function(kachel,index){
					if(kachel.style.display != 'none')
					{
						spc_display = 'flex';
					}
				});
				
				spc[s].style.display = spc_display;
			}
		}
		else
		{		
			document.querySelectorAll('.filter')[0].style.display = 'none';
			document.querySelectorAll('.filter')[0].classList.add('hidden');
			var ges = document.querySelectorAll('.gridelement');
			ges.forEach(function(ge,index){
				ge.style.display = 'block';
			});
			
			var spc = document.querySelectorAll('.start_page_category');
			for(var s = 0; s < spc.length; s++)
			{
				var spc_display = 'none';
				
				if(spc[s].getAttribute('data-category-id') == showOnly)
				{
					spc_display = 'flex';
				}
				
				spc[s].style.display = spc_display;
			}
		}
		updateBreadCrumb();
	}
	else
	{
		document.querySelectorAll('.filter')[0].style.display = 'none';
		document.querySelectorAll('.filter')[0].classList.add('hidden');
	}
}

document.addEventListener("DOMContentLoaded", function() {
	if(mbe != undefined && mbe != null)
	{
		doInit();
	}
	
	if(document.querySelector('.felogin-hidden') != undefined && document.querySelector('.felogin-hidden') != null)
	{
		var temp = '<div class="vkb_btn"><i class="fa-regular fa-keyboard"></i></div><div class="vkb">' + getKeyboard('mail') + '</div>';
		document.querySelector('main').insertAdjacentHTML("afterend", temp);
		
		document.querySelector('input[type=text]').classList.add = 'touchkeyreceiver';
		document.querySelector('input[type=text]').addEventListener('focus', (event) => {lasttouchscreenreceiver = event.target;});
		lasttouchscreenreceiver = document.querySelector('input[type=text]');
		
		document.querySelector('input[type=password]').classList.add = 'touchkeyreceiver';
		document.querySelector('input[type=password]').addEventListener('focus', (event) => {lasttouchscreenreceiver = event.target;});
		
		document.querySelector('.vkb_btn').addEventListener('click', (event) =>{
			var vkb = document.querySelector('.vkb');
			if(vkb.style.display == 'none')
			{
				vkb.style.display = 'flex';
			}
			else
			{
				vkb.style.display = 'none';
			}
		});
	}
		
});



var assistent_timer = setTimeout(update_assistent_timer,1000);
var assistent_time = 0;
function update_assistent_timer()
{ 
	clearTimeout(assistent_timer);
	var ass = document.querySelector('.assistent');
	if(ass != null && ass != undefined)
	{
		if(ass.style.display == "none")
		{
			assistent_time = assistent_time + 1;
			document.querySelectorAll('.assistent_video').forEach(av => {
				var comp = parseInt(av.getAttribute("data-starttime"));
				if(comp <= assistent_time)
				{
					var newhtml = ' <video width="' + av.getAttribute("data-width") + '" height="100%" autoplay muted playsinline><source src="' + av.getAttribute("data-mov") + '" type="video/quicktime"><source src="' + av.getAttribute("data-webm") + '" type="video/webm"></video><div class="close_video"><i class="fa-solid fa-xmark"></i></div>';
					av.remove();
					document.querySelector('.assistent_video_holder').innerHTML = newhtml;
					document.querySelector('.assistent').style.display = "block";
					document.querySelector('.assistent video').addEventListener("ended", (event) => {
						document.querySelector('.assistent_video_holder').innerHTML = "";
						document.querySelector('.assistent_video_holder').style.position = "relative";
						document.querySelector('.assistent').style.display = "none";
					});
					document.querySelector(".close_video").addEventListener('click', (event) => {
						document.querySelector('.assistent').style.display = "none";
						document.querySelector('.assistent_video_holder').innerHTML = "";
					});
				}
			});
		}
	}
	assistent_timer = setTimeout(update_assistent_timer,1000);
}





function doInit()
{	
	var kacheln_startpage = document.querySelectorAll('.kacheln_container.to_page');
	kacheln_startpage.forEach(function(ksp,index){
		var filterliste = ksp.getAttribute('data-categories-description');
		var filtertitles = filterliste.split("~");
		var ft = 0;
		for(ft = 0; ft < filtertitles.length; ft++)
		{
			var tstr = filtertitles[ft].trim();
			if(tstr != "")
			{
				if(filters.includes(tstr) === false)
				{
					filters[filters.length] = tstr;
				}
			}
		}
	});
	
	var temphtml = '';
	if(filters.length > 0)
	{
		filters.sort();
		temphtml = '<span class="h4">Filter: </span>';
		
		var f = 0;
		
		for(f = 0; f < filters.length; f++)
		{
			var tarr = filters[f].split('*-*');
			temphtml = temphtml + '<div data-filter-id="' + tarr[1] + '" class="btn_style filter_pill"><span>' + tarr[0] + '</span></div>';
		}
		
		temphtml = temphtml + '<div class="btn_style filter_pill active removefilter"><i class="fa-regular fa-circle-xmark"></i>  <span>' + getTranslation('tl_remove_filter') + '</span></div>';
	}
	
	var f = document.querySelectorAll('.filter')[0];
	if(f != undefined && f != null)
	{
		f.innerHTML = temphtml;
	}
	
	var filterPills = document.querySelectorAll('.filter_pill');
	filterPills.forEach(function(pill,index){
		pill.addEventListener('click', event => {
			if(pill.classList.contains('removefilter') == false)
			{
				pill.classList.toggle('active');
			}
			else
			{
				document.querySelectorAll('.filter_pill').forEach(item => {
					if(item.classList.contains('removefilter') == false)
					{
						item.classList.remove('active');
					}
				});
			}
			filterChanged();
		});
	});
	
	var receivers = document.querySelectorAll('.receive');
	receivers.forEach(function (receiver, index) {
		var sender = document.querySelector("#" + receiver.getAttribute('data-sender'));
		if (typeof(sender) != 'undefined' && sender != null)
		{
			receiver.innerHTML = sender.innerHTML;
		}
	});
	
	
	
	const beforeUnloadListener = (event) => {
	  event.preventDefault();
	  return event.returnValue = "Are you sure you want to exit?";
	};
	
	
	document.querySelectorAll('.menue-filter').forEach(item =>{
		item.addEventListener('click', event => {
			if(item.getAttribute('data-showonly')!='63')
			{
				document.querySelectorAll('.menue-filter').forEach(it =>{
					it.classList.remove('active');
				});
				item.classList.add('active');
				toPage = 1;
				lastpage = currentpage;
				currentpage = toPage;
				updateContent();
				filterChanged();
			}
			else
			{
				showSearch();
			}
		});
	});
	
	document.querySelectorAll('.to_page').forEach(item => {
		item.addEventListener('click', event => {
			hideTutorial();
			toPage = item.getAttribute("data-topage");
			lastpage = currentpage;
			currentpage = toPage;
			updateContent();
			filterChanged();
		});
	});
	
	
	
	window.addEventListener('scroll', function() {
        checkScroll();
	});
	
	
	window.addEventListener("resize", function(){
        checkScroll();
	});
	
	var np = 1;
	document.querySelectorAll('.gridelement').forEach(item => {
		item.setAttribute("sort",np);
		item.setAttribute("id","ge-" + np);
		np++;
	});
	
	/*
	document.querySelector('.addcontenttowishlist').addEventListener('click', event => {
		if(currentlist == "")
		{
			showMessage('No active wishlist','You need to select or create a wishlist before you can add content.');
		}
		else
		{
			data = new FormData()
			var val_ids = "";
			
			if(document.querySelector(".overview").style.display != "none")
			{
				document.querySelectorAll(".gridelement").forEach(item => {
					if(item.style.display != "none")
					{
						var di = item.getAttribute('data-page');
						
						if(di != "3")
						{
							if(val_ids != "")
							{
								val_ids = val_ids + ",";
							}
							val_ids = val_ids + di;
						}
						else
						{
							val_ids = add_downloads(val_ids);
						}
					}
				});
			}
			else
			{
				val_ids = currentpage;
			}
						
			data.set('value',val_ids)
			data.set('sublistid',currentsublist)
			data.set('listid',currentlist)
			let request = new XMLHttpRequest();
			
			request.onreadystatechange = function() {
				if (this.readyState == 4 && this.status == 200) {
					updateWishlistFromData(JSON.parse(this.responseText));
					updateWishlistContent();
				}
			};
			
			request.open("POST", '/add-to-wishlist', true);
			request.send(data);
			
		}
	});
	*/
	
	
	document.querySelectorAll('.to_wishlist').forEach(item => {
		item.addEventListener('click', event => {
			var val_ids = "";
			if(currentlist == "" || currentlist == 0)
			{
				
				var countWishlists = 0;
				for (const key in wishlists){
				  if(wishlists.hasOwnProperty(key)){
					  countWishlists = countWishlists + 1;
				  }
				}
				if(countWishlists == 0)
				{
					showOverlayNewList();
				}
				else
				{
					showMessage(getTranslation('tl_warning_no_wishlist_selected'),getTranslation('tl_select_wishlist_first'));
				}
			}
			else
			{
				var di = event.target.getAttribute('data-pageid');
				
				if(parseInt(di) > 0)
				{
					data = new FormData();
					data.set('language',currentLanguage);
					data.set('value',di);
					data.set('sublistid',currentsublist);
					data.set('listid',currentlist);
					let request = new XMLHttpRequest();
					
					request.onreadystatechange = function() {
						if (this.readyState == 4 && this.status == 200) {
							updateWishlistFromData(JSON.parse(this.responseText));
							
							updateWishlistContent();
						}
					};
					
					request.open("POST", '/add-to-wishlist', true);
					request.send(data)
				}
				else
				{
					var pdfurl = event.target.getAttribute('data-pdf-url');
					if(pdfurl != null && pdfurl != undefined)
					{
						data = new FormData();
						data.set('language',currentLanguage);
						data.set('value',pdfurl);
						data.set('sublistid',currentsublist);
						data.set('listid',currentlist);
						let request = new XMLHttpRequest();
						
						request.onreadystatechange = function() {
							if (this.readyState == 4 && this.status == 200) {
								updateWishlistFromData(JSON.parse(this.responseText));
								updateWishlistContent();
							}
						};
						
						request.open("POST", '/add-to-wishlist', true);
						request.send(data)
					}
				}
				
			}
			event.stopPropagation();
		});
	});
	
	
	arrangeGrid();
	updateBreadCrumb();
	
	window.history.replaceState("object or string", "Title", "/"); 
	
	
    var cu = document.querySelector('#currentuser');
	if(typeof(cu) != 'undefined' && cu != null)
	{
		currentuser = parseInt(cu.innerText);
		cu.parentNode.removeChild(cu);
	}
	
	
	
	document.querySelectorAll('.requires_selected_wishlist').forEach( elem =>{
		elem.style.display = "none";
	});
	
	
	
	
	document.querySelector('#show_wl').addEventListener('click', event =>{
		showWishlistOverlay();
	});
	
	
	document.querySelector('#show_my_wl').addEventListener('click', event =>{
		showWishlistOverlay();
	});
	
	document.querySelector('#create_wl').addEventListener('click', event =>{
		showOverlayNewList();
	});
	
	
	
	
    var offline = document.querySelector('.offline');
	if(typeof(offline) != 'undefined' && offline != null)
	{
		var todel = document.querySelector('.sharevisible');
		todel.parentNode.removeChild(todel);
		todel = document.querySelector('.sharethewishlist');
		todel.parentNode.removeChild(todel);
		todel = document.querySelector('.del1');
		todel.parentNode.removeChild(todel);
		todel = document.querySelector('.del2');
		todel.parentNode.removeChild(todel);
	}
	
	
	
	var spc = document.querySelectorAll('.start_page_category');
	for(var s = 0; s < spc.length; s++)
	{
		
		var kacheln = spc[s].getElementsByClassName('kacheln_container');
		
		if(kacheln.length == 0)
		{
			spc[s].remove();
		}
		else
		{
			spc[s].classList.remove('d-none');
		}
	}
	
	
	var tmpBottom = document.querySelector('.bottom_navigation');
	if(tmpBottom != null && tmpBottom != undefined)
	{
		document.querySelector('.bottom_navigation .bottom_home').addEventListener('click', event=>{
			document.querySelector('.main_navigation_content li').click();
			goHome();
		});
		document.querySelector('.bottom_navigation .bottom_search').addEventListener('click', event=>{
			showSearch();
		});
		document.querySelector('.bottom_navigation .bottom_wishlist').addEventListener('click', event=>{
			showWishlistOverlay();
		});
	}
	
		document.querySelector('#show_my_wl').innerHTML = '<i class="fa-solid fa-eye"></i> ' + getTranslation('tl_menue_your_wishlist');
		
	loadWishlists();
	
	showStart();
	
	document.querySelector(".company_logo").addEventListener('click', event =>{
		document.querySelector('.main_navigation_content li').click();
		goHome();
	});
	
	
	
}