xamxam/app/public/assets/js/app/access-request.js

/**
 * access-request.js — handles the "Demander l'accès" form on public thesis pages.
 *
 * Shows/hides the justification textarea based on email domain (@erg.school / @erg.be).
 * Submits via fetch() to /request-access and displays success/error messages.
 * Handles the special "recipient_rejected" status to let the user fix their email.
 *
 * Expects a form with:
 *   #access-request-form  — the form (needs data-thesis-id)
 *   #access-email          — email input
 *   #justification-container — wrapper div for justification
 *   #access-justification   — justification textarea
 *   #access-request-message — message display div
 */
(() => {
	var form = document.getElementById("access-request-form");
	if (!form) return;

	var emailInput = document.getElementById("access-email");
	var justificationContainer = document.getElementById(
		"justification-container",
	);
	var justificationInput = document.getElementById("access-justification");
	var messageDiv = document.getElementById("access-request-message");

	if (!emailInput || !messageDiv) return;

	// Show/hide justification based on email domain
	emailInput.addEventListener("input", function () {
		var email = this.value.trim().toLowerCase();
		var isErg = email.endsWith("@erg.school") || email.endsWith("@erg.be");
		if (justificationContainer)
			justificationContainer.style.display = isErg ? "none" : "block";
		if (justificationInput) justificationInput.required = !isErg;
	});

	function showRetryPrompt(rejectedEmail, serverMessage) {
		messageDiv.style.display = "block";
		messageDiv.className = "tfe-access-message tfe-access-error";
		messageDiv.innerHTML =
			"<strong>Adresse e-mail introuvable sur le serveur de l'ERG.</strong><br>" +
			"<small>" +
			serverMessage.replace(/</g, "&lt;") +
			"</small><br><br>" +
			"Corrigez votre adresse e-mail et réessayez.";
		emailInput.value = rejectedEmail;
		emailInput.classList.add("input-error");
		emailInput.focus();
		emailInput.select();
		emailInput.addEventListener("input", function clearError() {
			emailInput.classList.remove("input-error");
			emailInput.removeEventListener("input", clearError);
		});
	}

	form.addEventListener("submit", (e) => {
		e.preventDefault();

		var submitBtn = form.querySelector('button[type="submit"]');
		submitBtn.disabled = true;
		submitBtn.textContent = "Envoi en cours...";
		messageDiv.style.display = "none";

		var submittedEmail = emailInput.value.trim();
		var formData = new FormData(form);
		formData.append("thesis_id", form.getAttribute("data-thesis-id"));

		fetch("/request-access", {
			method: "POST",
			body: formData,
		})
			.then((response) => response.json())
			.then((data) => {
				submitBtn.disabled = false;
				submitBtn.textContent = "Demander l'accès";

				if (data.status === "recipient_rejected") {
					showRetryPrompt(submittedEmail, data.message);
					return;
				}

				messageDiv.style.display = "block";
				if (data.success) {
					messageDiv.className = "tfe-access-message tfe-access-success";
					messageDiv.textContent = data.message;
					form.reset();
				} else {
					messageDiv.className = "tfe-access-message tfe-access-error";
					messageDiv.textContent =
						data.message || "Une erreur est survenue. Veuillez réessayer.";
				}
			})
			.catch(() => {
				submitBtn.disabled = false;
				submitBtn.textContent = "Demander l'accès";
				messageDiv.style.display = "block";
				messageDiv.className = "tfe-access-message tfe-access-error";
				messageDiv.textContent = "Erreur de connexion. Veuillez réessayer.";
			});
	});
})();