const contextId = '';
const deviceType = getDeviceType();
window.trimSpace_mlsTable = JSON.parse('{"Abbildung":"Standard","abCURR":"ab","Abmeldung Newsletter Text Du":"Deine E-Mail Adresse <%email-address%> ist ausgetragen.<br>Schade, dass du uns verl\u00e4sst.","Abmeldung Newsletter Text Sie":"Ihre E-Mail Adresse <%email-address%> ist ausgetragen.<br>Schade, dass Sie uns verlassen.","AIContentHelp":"Im HTML Editor kann der Text bearbeitet und formatiert werden.<br>Text markieren und im eingeblendeten Menu die Formatierungsfunktionen anwenden.","Anmeldung Newsletter Text Du":"Deine E-Mail Adresse <%email-address%> ist eingetragen.<br>Vielen Dank f\u00fcr deine Anmeldung.","Anmeldung Newsletter Text Sie":"Ihre E-Mail Adresse <%email-address%> ist eingetragen.<br>Vielen Dank f\u00fcr Ihre Anmeldung.","Auftrag":"Auftrag","Deluxe":"Premium","keinProduktgefunden":"Ups! Das Produkt ist gerade nicht verf\u00fcgbar.","Kostenlose Abholung an unserem Standort in":"Kostenlose Abholung an unserem Standort","Kreditkarte":"Karte","Minimum":"Minimum","noAIContent":"Es sind keine Daten zur Aufbereitung vorhanden.<br>Diese m\u00fcssen zuvor beim entsprechenden Eingabefeld erfasst werden.","noAIError":"KI Funktionen sind derzeit nicht verf\u00fcgbar.","Noch etwas dazu?":null,"PLZ":"Postleitzahl","Vielen Dank f\u00fcr Ihren Auftrag.":""}') 
console.log(window.trimSpace_mlsTable);
window.imgBlobCache = window.imgBlobCache || {};

window.addEventListener("popstate", function (event) {
	load_mainSpace('');
});

load_initial();
load_mainSpace();

function load_initial() {
}

function load_mainSpace(setHistory) {

	if (location.pathname != "/") {
		var params = location.pathname.split("/");
		loadContent('mainSpace', params[1], params[2], params[3], setHistory);
	}

}

async function trimSpace_setLanguage(code) {

	try {
		const response = await fetch('https://apiv1christoph.trimell-cloud.ch/rest/lg1/v1/get-svr-content-load?setLanguage=' + code + '&context=' + contextId, { headers: {'Authorization': 'Bearer djhihdlk8kC000098K32okjsgftrpd376kdjuh33' }});

		if (!response.ok) {
			throw new Error(`HTTP ${response.status}`);
		}

		const responseJson = await response.json();
		console.log(responseJson.state);

		window.trimSpace_mlsTable = responseJson.mls;
		console.log(window.trimSpace_mlsTable);

		load_initial();

	} catch (error) {

		console.error("Fehler:", error);

	}

}

async function trimSpace_updateValue(basename, value) {

	const formData = new FormData();
	formData.append(basename, value);
  	const response = await fetch('https://apiv1christoph.trimell-cloud.ch/rest/lg1/v1/get-svr-content-load?updateValue&context=' + contextId, {
	headers: {'Authorization': 'Bearer djhihdlk8kC000098K32okjsgftrpd376kdjuh33' },
	method: "POST",
    	body: formData 
  	});

	const responseJson = await response.json();

	if (responseJson.state == 'error') {
		const errorDiv = document.getElementById('trimSpace_formError_' + basename);
		if (errorDiv) {
			errorDiv.innerHTML = responseJson.error_description;
			errorDiv.style.display = 'block';
		}
	} else {
		const errorDiv = document.getElementById('trimSpace_formError_' + basename);
		if (errorDiv) {
			errorDiv.innerHTML = "";
			errorDiv.style.display = 'none';
		}		
		const formElement = document.getElementById('trimSpace_formValue_' + basename);
		if (formElement) {
			formElement.value = responseJson.value;
		}
	}

  	return;
}

async function trimSpace_sendContact() {

	var formFields = document.getElementsByName('trimSpace_formField');
	var formValidation = true;

	for (var i = 0; i < formFields.length; i++) {

		var params = formFields[i].innerHTML.split('|');
		var errorDiv = document.getElementById('trimSpace_formError_' + params[0]);
		var formField = document.getElementById('trimSpace_formValue_' + params[0]);

		if (errorDiv && formField) {
			if (errorDiv.innerHTML > '') {
				formValidation = false;
			} else {
				if (params[1] == 'mandatory' && formField.value == '') {
						if (window.trimSpace_mlsTable['Dieses Feld muss zwingend ausgefüllt sein'] > '') {
							errorDiv.innerHTML = window.trimSpace_mlsTable['Dieses Feld muss zwingend ausgefüllt sein'];
						} else {
							errorDiv.innerHTML = "Dieses Feld muss zwingend ausgefüllt sein";
						}
						errorDiv.style.display = 'block';
						formValidation = false;
				}	
			}
		}

	}

	if (formValidation == true) {

		const response = await fetch('https://apiv1christoph.trimell-cloud.ch/rest/lg1/v1/get-svr-content-load?sendContact&context=' + contextId, {
			headers: {'Authorization': 'Bearer djhihdlk8kC000098K32okjsgftrpd376kdjuh33' }
		});

		const responseJson = await response.json();

		if (responseJson.state == 'done') {
			loadContent('mainSpace', 'contact', 'confirmation', '', '');
		} else {
			alert("error in form");
		}
	
	}

}

async function loadContent(div_trimSpace, contentType, view, filter, tab, setHistory) {

	if (setHistory == 'set') {
		history.pushState(
			{},
			"",
			"/" + contentType + "/" + view + "/" + filter
		);
	}

	if (tab > '') {
		document.querySelectorAll('.trimSpace_siteNavigation_tab').forEach(tabDiv => {
				tabDiv.classList.remove('active');
		});
		var tabDiv = document.getElementById('trimSpace_siteNavigation_tab_'+tab);
		if (tabDiv) {
			document.getElementById('trimSpace_siteNavigation_tab_'+tab).classList.add('active');
		} else {
			setTimeout(() => {
				document.getElementById('trimSpace_siteNavigation_tab_'+tab).classList.add('active');
			}, 1000);
		}
	}


	const div = document.getElementById('div_trimSpace_' + div_trimSpace)

	if (div) {

		try {
 			const response = await fetch('https://apiv1christoph.trimell-cloud.ch/rest/lg1/v1/get-svr-content-load?dkey=&divTrimSpace=' + div_trimSpace + '&contentType=' + contentType + '&view=' + view + '&filter=' + filter + '&tab=' + tab + '&deviceType=' + deviceType + '&context=' + contextId, { headers: {'Authorization': 'Bearer djhihdlk8kC000098K32okjsgftrpd376kdjuh33' }});

        	if (!response.ok) {
            	throw new Error(`HTTP ${response.status}`);
        	}

			const responseJson = await response.json();

			for (space in responseJson.spaces) {

				switch (responseJson.spaces[space]['action']) {

					case 'directContent':

						if (responseJson.spaces[space]['value'] > '') { 
							var div_Space = document.getElementById('div_trimSpace_' + space);
							if (div_Space) {
								div_Space.innerHTML = responseJson.spaces[space]['value'];
							}
							if (space == 'slider' || space == 'mainSpaceNavigation' || space == 'news') {
								div_Space.classList.add('isOpen');
							}
						} else {
							var div_Space = document.getElementById('div_trimSpace_' + space);
							if (space == 'slider' || space == 'mainSpaceNavigation' || space == 'news') {
								div_Space.classList.remove('isOpen');
							}					
						}
						break;


					case 'contentLoad':

						loadContent(space, responseJson.spaces[space]['content_type'], responseJson.spaces[space]['view'], responseJson.spaces[space]['value'], responseJson.spaces[space]['tab'],'');
						break;

				}

			}

			setTimeout(() => {
				for (space in responseJson.spaces) {
					if (responseJson.spaces[space]['value'] == '' && responseJson.spaces[space]['action'] == 'directContent') {
						document.getElementById('div_trimSpace_' + space).innerHTML = responseJson.spaces[space]['value'];
					}
				}
			}, 1000);

    		div.innerHTML = responseJson.body.html;

			if (div_trimSpace == 'slider' || div_trimSpace == 'mainSpaceNavigation' || div_trimSpace == 'news') {
				div.classList.add('isOpen');
			}

			console.log('%c' + div_trimSpace + ':', "font-weight: bold;");

			console.log('\tTotal time (s): '+ responseJson.responseTime.total);
			console.log('\tScript time (s): '+ responseJson.responseTime.script);
			console.log('\tAPI Request Time (s): ' + responseJson.responseTime.apiRequest);
			
			if (responseJson.debug) {
				console.log('URL: ' + responseJson.debug.apiURL);
				console.log('Load type: '+ responseJson.debug.loadType);
				try {
					var datalog = JSON.parse(responseJson.debug.apiResponse);
					console.log(datalog);
				} catch (error) {
					console.log("no apiResult");
				}
				try {
					var datalog = responseJson.debug.context;
					console.log(datalog);
				} catch (error) {
					console.log("no context");
				}
			}
			
			if (responseJson.body.jscript > "") {
			
					const scriptElement = document.createElement('script');
					scriptElement.textContent = responseJson.body.jscript;
					div.appendChild(scriptElement);
				
			}

    	} catch (error) {

			console.log(div_trimSpace+":");
			console.error("Fehler:", error);


    	}
    
    }

}

function getDeviceType() {
    const ua = navigator.userAgent.toLowerCase();

    // iPad
    if (
        /ipad/.test(ua) ||
        (navigator.platform === 'MacIntel' && navigator.maxTouchPoints > 1)
    ) {
        return 'tablet';
    }

    // iPhone / iPod
    if (/iphone|ipod/.test(ua)) {
        return 'smartphone';
    }

    // Android
    if (/android/.test(ua)) {
        return /mobile/.test(ua) ? 'smartphone' : 'tablet';
    }

    // Alles andere
    return 'desktop';
}

async function InterceptAndCache(imgElement, originalUrl) {
  // 1. Wenn das Bild schon im RAM liegt, sofort synchron zuweisen
  if (window.imgBlobCache[originalUrl]) {
    imgElement.src = window.imgBlobCache[originalUrl];
    return;
  }

  // 2. Wenn nicht, im Hintergrund laden, in Blob umwandeln und im RAM speichern
  try {
    const response = await fetch(originalUrl);
    const blob = await response.blob();
    const blobUrl = URL.createObjectURL(blob);
    
    window.imgBlobCache[originalUrl] = blobUrl;
    imgElement.src = blobUrl; // Bild anzeigen
  } catch (error) {
    // Fallback: Falls Fetch fehlschlägt, die originale URL erzwingen
    imgElement.src = originalUrl;
  }
}

async function InterceptAndCacheBackground(element) {
  const originalUrl = element.getAttribute('data-bg');
  if (!originalUrl) return;

  // 1. Wenn bereits im RAM, sofort flackerfrei als Hintergrund setzen
  if (window.imgBlobCache[originalUrl]) {
    element.style.backgroundImage = `url('${window.imgBlobCache[originalUrl]}')`;
    return;
  }

  // 2. Wenn nicht, im Hintergrund laden und im RAM cachen
  try {
    const response = await fetch(originalUrl);
    const blob = await response.blob();
    const blobUrl = URL.createObjectURL(blob);
    
    window.imgBlobCache[originalUrl] = blobUrl;
    element.style.backgroundImage = `url('${blobUrl}')`;
  } catch (error) {
    // Fallback bei Netzwerkfehlern
    element.style.backgroundImage = `url('${originalUrl}')`;
  }
}