{#
 # Cloudflare Turnstile - Universal Login Form Protection
 #
 # This template event fires on ALL pages (in overall_footer.html).
 # We inject JavaScript that detects and protects ANY login form on the page,
 # regardless of theme or form location (header dropdown, footer, sidebar, etc.).
 #
 # Detection criteria (phpBB standard patterns):
 # - Form action contains "mode=login"
 # - Form has <input type="submit" name="login">
 # - Form has <input name="mode" value="login">
 #
 # Skip logic:
 # - Forms already containing .cf-turnstile (already protected)
 # - Forms with id="login" (standard login page - handled by CAPTCHA_TEMPLATE)
 #}

{% if S_TURNSTILE_UNIVERSAL_LOGIN %}
<script src="{{ U_TURNSTILE_SCRIPT }}" async defer></script>

<script>
document.addEventListener('DOMContentLoaded', function() {
	/**
	 * Check if a form is a login form based on phpBB patterns
	 */
	function isLoginForm(form) {
		// Check 1: Form action contains login destination
		var action = form.getAttribute('action') || '';
		if (action.indexOf('mode=login') !== -1) {
			return true;
		}

		// Check 2: Has login submit button (most reliable indicator)
		if (form.querySelector('input[type="submit"][name="login"]')) {
			return true;
		}

		// Check 3: Has hidden mode=login field
		var modeInput = form.querySelector('input[name="mode"]');
		if (modeInput && modeInput.value === 'login') {
			return true;
		}

		return false;
	}

	/**
	 * Check if form should be skipped
	 */
	function shouldSkipForm(form) {
		// Skip if already has Turnstile widget
		if (form.querySelector('.cf-turnstile')) {
			return true;
		}

		// Skip standard login page form (handled by CAPTCHA_TEMPLATE)
		if (form.id === 'login') {
			return true;
		}

		return false;
	}

	{% if TURNSTILE_WIDGET_TYPE == 'invisible' %}
	// Invisible mode: track state for form interception
	var formState = new WeakMap();

	function getButtonText(btn) {
		return btn.tagName === 'INPUT' ? btn.value : btn.textContent;
	}

	function setButtonText(btn, text) {
		if (btn.tagName === 'INPUT') { btn.value = text; } else { btn.textContent = text; }
	}
	{% endif %}

	/**
	 * Inject Turnstile widget into a login form
	 */
	function injectTurnstile(form) {
		// Find the submit button (support both <input> and <button> elements)
		var submitButton = form.querySelector('input[type="submit"][name="login"], button[type="submit"][name="login"]');
		if (!submitButton) {
			submitButton = form.querySelector('input[type="submit"], button[type="submit"]');
		}
		if (!submitButton) {
			return; // No submit button found
		}

		// Create wrapper for the Turnstile widget
		var wrapper = document.createElement('span');
		wrapper.style.display = 'inline-block';
		wrapper.style.verticalAlign = 'middle';

		{% if TURNSTILE_WIDGET_TYPE == 'invisible' %}
		// Invisible mode: minimal footprint, widget runs in background
		wrapper.style.width = '1px';
		wrapper.style.height = '1px';
		wrapper.style.overflow = 'hidden';

		// Track state for this form
		var state = { tokenReady: false, pendingSubmit: false, originalText: getButtonText(submitButton), timeoutStarted: false };
		formState.set(form, state);

		// Create unique callback for this form
		var callbackId = 'tcb_' + Math.random().toString(36).substr(2, 9);
		window[callbackId] = function(token) {
			state.tokenReady = true;
			if (state.pendingSubmit) {
				submitButton.disabled = false; // Re-enable for click (visual styles stay)
				submitButton.click();
			}
		};

		wrapper.innerHTML = '<div class="cf-turnstile" data-sitekey="{{ TURNSTILE_SITEKEY }}" data-size="normal" data-appearance="interaction-only" data-theme="{{ TURNSTILE_THEME|default('auto') }}" data-callback="' + callbackId + '" style="transform: scale(0.6); transform-origin: left center;"></div>';

		// Form submission interception
		form.addEventListener('submit', function(e) {
			var tokenInput = form.querySelector('input[name="cf-turnstile-response"]');
			if ((tokenInput && tokenInput.value) || state.tokenReady) {
				return true; // Token ready, allow submit
			}
			e.preventDefault();
			state.pendingSubmit = true;
			submitButton.disabled = true;
			submitButton.style.opacity = '0.6';
			submitButton.style.cursor = 'not-allowed';
			setButtonText(submitButton, '{{ lang('TURNSTILE_VERIFYING')|e('js') }}');

			// Timeout fallback: re-enable after 10s, let server handle it
			if (!state.timeoutStarted) {
				state.timeoutStarted = true;
				setTimeout(function() {
					if (!state.tokenReady) {
						submitButton.disabled = false;
						submitButton.style.opacity = '';
						submitButton.style.cursor = '';
						setButtonText(submitButton, state.originalText);
					}
				}, 10000);
			}
			return false;
		});
		{% else %}
		// Visible mode: scaled widget for compact login forms (hardcoded 60% scale for header dropdowns)
		wrapper.style.marginRight = '5px';
		wrapper.style.width = '180px';
		wrapper.style.height = '39px';
		wrapper.innerHTML = '<div class="cf-turnstile" data-sitekey="{{ TURNSTILE_SITEKEY }}" data-size="normal" data-appearance="always" data-theme="{{ TURNSTILE_THEME|default('auto') }}" style="transform: scale(0.6); transform-origin: left center; margin-top: -13px;"></div>';
		{% endif %}

		// Insert before the submit button
		submitButton.parentNode.insertBefore(wrapper, submitButton);
	}

	// Find and protect all login forms on the page
	var forms = document.querySelectorAll('form');
	forms.forEach(function(form) {
		if (isLoginForm(form) && !shouldSkipForm(form)) {
			injectTurnstile(form);
		}
	});
});
</script>
{% endif %}