// Ajouter un style pour la mise en surbrillance
const style = document.createElement("style");
style.innerHTML = `
	.highlight { background-color: yellow; font-weight: bold; }
	.highlight-container {	padding: 2px; }
`;
document.head.appendChild(style);

// -----------------------------------------------------
// Zone de recherche
// -----------------------------------------------------
function highlightSearch(event) {
	event.preventDefault(); // Empêche l'envoi du formulaire ou le rechargement de la page

	const searchTerm = document.getElementById("searchInput").value.trim().toLowerCase();
	if (!searchTerm) {
		alert("Veuillez entrer un terme à rechercher.");
		return;
	}

	// Réinitialiser les anciens surlignages
	// document.querySelectorAll(".highlight").forEach(span => {
	// 	const parent = span.parentNode;
	// 	parent.replaceChild(document.createTextNode(span.textContent), span);
	// });

	// Supprimer les conteneurs autour des textarea
	// document.querySelectorAll(".highlight-container").forEach(container => {
	// 	const textarea = container.nextElementSibling;
	// 	if (textarea && textarea.tagName === "TEXTAREA") {
	// 		textarea.style.display = ""; // Réafficher le textarea
	// 		container.remove(); // Supprimer le span contenant le texte mis en surbrillance
	// 	}
	// });

	// Réinitialiser le style des champs input
	// document.querySelectorAll("input.inputWebmaster").forEach(input => {
	// 	input.style.backgroundColor = "";
	// });

	let firstMatch = null;
	let matchCount = 0;
	const inputs = document.querySelectorAll("input.inputWebmaster, textarea.textAreaWbm");
	inputs.forEach(input => {
		const value = input.value.toLowerCase();
		const originalValue = input.value;

		// Vérifier si l'input est DANS un <div> ayant un id qui commence par "zoneD" -> exclure les descriptions
		if (input.closest("div[id^='zoneD']")) { return; } // On ignore cet input

		// Exclure les checkboxes
		if (input.type === "checkbox") { return; }

		if (value.includes(searchTerm)) {
				matchCount++;

				// Créer un élément `span` pour la mise en surbrillance
				const regex = new RegExp(`(${searchTerm})`, "gi");
				const highlightedValue = originalValue.replace(regex, '<span style="white-space: pre-line;" class="highlight">$1</span>');

				// Remplacer le texte de l'input (pour textarea, on doit utiliser innerHTML)
				if (input.tagName === "TEXTAREA") {
					const parent = input.parentNode;
					const newSpan = document.createElement("span");
					newSpan.innerHTML = highlightedValue;
					newSpan.classList.add("highlight-container");
					parent.insertBefore(newSpan, input);
					input.style.display = "none"; // Masquer l'input pour afficher la mise en surbrillance
				} else {
					input.value = originalValue.replace(regex, "$1"); // Pas possible de mettre du HTML dans un input
					input.style.backgroundColor = "yellow";
					 console.log('2');
				}

				// Garder une référence au premier élément trouvé
				if (!firstMatch) { firstMatch = input; }
			}
		});

		if (matchCount === 0) {
			alert("Aucun terme correspondant trouvé.");
		} else if (firstMatch) {
			// document.getElementById("searchInput").innerHTML=matchCount+' trouvés';
			if (firstMatch) {
				firstMatch.style.display = "block"; // Assure que l'élément est visible

				setTimeout(() => {
					if (typeof firstMatch.scrollIntoViewIfNeeded === "function") { firstMatch.scrollIntoViewIfNeeded(true); }
					else { firstMatch.scrollIntoView({ behavior: "smooth", block: "center" }); }
				}, 100); // Donne un léger délai pour s'assurer que l'élément est bien affiché
			}
		}
}

// // Gestion de l'appui sur "Entrée"
// document.getElementById("searchInput").addEventListener("keypress", function(event) {
// 	if (event.key === "Enter") {
// 		//alert('ici');
// 		highlightSearch();
// 	}
// });



// revenir a la normal sur clic
document.addEventListener("click", function (event) {

	if (event.target.classList.contains("highlight-container")) {
		console.log('1');
		const span = event.target;
		const textarea = span.nextElementSibling;

		if (textarea && textarea.tagName === "TEXTAREA") {
			textarea.style.display = ""; // Réafficher le textarea
			span.remove(); // Supprimer le surlignage
			textarea.focus(); // Donner le focus pour édition
		}
	}
});

// Ajouter un gestionnaire d'événements pour les inputs surlignés
document.addEventListener("click", function (event) {
	if (event.target.tagName === "INPUT" && event.target.classList.contains("inputWebmaster")) {
		event.target.style.backgroundColor = ""; // Réinitialiser le fond
	}
});