@*
 * This module deals with the sign-in Modal that appears after a session timeout or an inactivity timeout. It does
 * not do the actual sign-out, this is done in the backend, here is just the showing of the sign-in Modal.
 *@

@* Signin Modal (used in case of session timeout) *@
<div class="modal fade" id="signinModal" tabindex="-1" data-bs-config='{"backdrop":"static", "focus":true, "keyboard":false}'>
	<div class="modal-dialog modal-sm">
		<div class="modal-content">
			<div class="modal-body">
				<div class="d-none" id="oidcSigninDiv">
					<h3>Please sign in again</h3>
					<p class="explanation"></p>
					<button class="btn btn-outline-secondary w-100 mb-2" id="oidcSigninButton"  type="button">
						<img class="float-start" id="oidcSigninButtonLogoImg" height="25" src="">
						<span id="oidcSigninButtonText"></span>
					</button>
					<div>Or <a href="#" class="signin-link">sign in as a different user</a>.</div>
				</div>
				<div class="d-none" id="orcidSigninDiv">
					<h3>Please sign in again</h3>
					<p class="explanation"></p>
					<button class="btn btn-outline-secondary w-100 mb-2" id="orcidSigninButton"  type="button">
						<img class="float-start" id="orcidSigninButtonLogoImg" height="25" src="">
						<span id="orcidSigninButtonText"></span>
					</button>
					<div>Or <a href="#" class="signin-link">sign in as a different user</a>.</div>
				</div>
				<div class="d-none" id="sramSigninDiv">
					<h3>Please sign in again</h3>
					<p class="explanation"></p>
					<button class="btn btn-outline-secondary w-100 mb-2" id="sramSigninButton"  type="button">
						<img class="float-start" id="sramSigninButtonLogoImg" height="25" src="">
						<span id="sramSigninButtonText"></span>
					</button>
					<div>Or <a href="#" class="signin-link">sign in as a different user</a>.</div>
				</div>
				<div class="d-none" id="conextSigninDiv">
					<h3>Please sign in again</h3>
					<p class="explanation"></p>
					<button class="btn btn-outline-secondary w-100 mb-2" id="conextSigninButton"  type="button">
						<img class="float-start" id="conextSigninButtonLogoImg" height="25" src="">
						<span id="conextSigninButtonText"></span>
					</button>
					<div>Or <a href="#" class="signin-link">sign in as a different user</a>.</div>
				</div>
				<div class="d-none" id="googleSigninDiv">
					<h3>Please sign in again</h3>
					<p class="explanation"></p>
					<div class="mb-2" id="signinGoogle"></div>
					<p>Or <a href="#" class="signin-link">sign in as a different user</a>.</p>
				</div>
				<div class="d-none" id="passwordSigninDiv">
					<h3>Please sign in again</h3>
					<p class="explanation"></p>
					<div class="form-group mb-2">
						<form class="form-admin" id="passwordSigninForm">
							<div class="col-sm-12">
								<label for="passwordSigninPassword">Password for ***</label>
								<div class="input-group">
									<input type="password" class="form-control" id="passwordSigninPassword" name="password" placeholder="Password" autocomplete="off" required autofocus>
									<input type="hidden" class="form-control d-none" id="passwordSigninUsername" name="username" autocomplete="off">
									<button type="button" class="btn btn-admin" id="passwordSigninConfirmed">Sign in</button>
								</div>
							</div>
						</form>
					</div>
					<div>Or <a href="#" class="signin-link">sign in as a different user</a>.</div>
				</div>
			</div>
		</div>
	</div>
</div>

<script @{helper.CSPNonce.attr} type="module">
	import * as Helpers from "@routes.Assets.versioned("lib/jatos-gui/javascripts/helpers.js")";
	import * as Alerts from "@routes.Assets.versioned("lib/jatos-gui/javascripts/alerts.js")";
	import * as FormValidation from "@routes.Assets.versioned("lib/jatos-gui/javascripts/formValidation.js")"
	import * as GoogleSignin from "@routes.Assets.versioned("lib/jatos-gui/javascripts/googleSignin.js")";

	let sessionTimeoutWorker;

	if (!window.common.keepSignedin) {
		sessionTimeoutWorker = new Worker('@routes.Assets.versioned("lib/jatos-gui/javascripts/sessionTimoutChecker.js")');
		resetSessionTimeout();
		sessionTimeoutWorker.onmessage = (msg) => showSigninModal(msg.data);
	}

	function resetSessionTimeout() {
		sessionTimeoutWorker.postMessage({
			// We multiply with 60000 because the values are in minutes
			// and minus 5000 because we want to timeout earlier than the backend
			userSessionTimeout: window.common.userSessionTimeout * 60000 - 5000,
			userSessionInactivity: window.common.userSessionInactivity * 60000 - 5000,
			userSigninTime: window.common.userSigninTime
		});
	}

	function showSigninModal(explanationText) {
		FormValidation.clear('#signinModal');
		$('#signinModal .explanation').text(explanationText);
		$('#signinModal').modal('show');

		switch (window.signedinUser.authMethod) {
			case "OIDC":
				$("#oidcSigninButtonText").text(window.common.oidcSigninButtonText);
				$("#oidcSigninButtonLogoImg").attr("src", Helpers.getOidcLogoUrl());
				$("#oidcSigninDiv").removeClass("d-none");
				break;
			case "ORCID":
				$("#orcidSigninButtonText").text(window.common.orcidSigninButtonText);
        		$("#orcidSigninButtonLogoImg").attr("src", Helpers.getOrcidLogoUrl());
				$("#orcidSigninDiv").removeClass("d-none");
				break;
			case "SRAM":
				$("#sramSigninButtonText").text(window.common.sramSigninButtonText);
        		$("#sramSigninButtonLogoImg").attr("src", Helpers.getSramLogoUrl());
				$("#sramSigninDiv").removeClass("d-none");
				break;
			case "CONEXT":
				$("#conextSigninButtonText").text(window.common.conextSigninButtonText);
        		$("#conextSigninButtonLogoImg").attr("src", Helpers.getConextLogoUrl());
				$("#conextSigninDiv").removeClass("d-none");
				break;
			case "OAUTH_GOOGLE":
				// 266 is the hard-coded width of the Google signin button in a Bootstrap Modal. I found no better way.
				GoogleSignin.drawButton(266);
				$("#googleSigninDiv").removeClass("d-none");
				break;
			default:
				$("#passwordSigninForm")[0].reset();
				$("#passwordSigninUsername").val(window.signedinUser.username);
				$("label[for='passwordSigninPassword']").text(`Password for ${window.signedinUser.username}`);
				$("#passwordSigninDiv").removeClass("d-none");
		}
		$(".signin-link").attr("href", window.routes.Signin.signin);
	}

	$('#oidcSigninButton').click(function() {
		$.ajax({
			url: window.routes.SigninBasicOidc.signin(false),
			success: function(uri) {
				window.location.replace(uri);
			},
			error: function(err) {
				$("p.text-danger").remove();
				const errMsg = err.responseText ? err.responseText : "An error occurred during OIDC sign-in";
				$('.explanation').after(`<p class="text-danger">${errMsg}</p>`);
			}
		});
	});

	$('#orcidSigninButton').click(function() {
		$.ajax({
			url: window.routes.SigninOrcid.signin(false),
			success: function(uri) {
				window.location.replace(uri);
			},
			error: function(err) {
				$("p.text-danger").remove();
				const errMsg = err.responseText ? err.responseText : "An error occurred during ORCID sign-in";
				$('.explanation').after(`<p class="text-danger">${errMsg}</p>`);
			}
		});
	});

	$('#sramSigninButton').click(function() {
		$.ajax({
			url: window.routes.SigninSram.signin(false),
			success: function(uri) {
				window.location.replace(uri);
			},
			error: function(err) {
				$("p.text-danger").remove();
				const errMsg = err.responseText ? err.responseText : "An error occurred during SRAM sign-in";
				$('.explanation').after(`<p class="text-danger">${errMsg}</p>`);
			}
		});
	});

	$('#conextSigninButton').click(function() {
		$.ajax({
			url: window.routes.SigninConext.signin(false),
			success: function(uri) {
				window.location.replace(uri);
			},
			error: function(err) {
				$("p.text-danger").remove();
				const errMsg = err.responseText ? err.responseText : "An error occurred during CONEXT sign-in";
				$('.explanation').after(`<p class="text-danger">${errMsg}</p>`);
			}
		});
	});

	Helpers.triggerButtonByEnter("#passwordSigninForm", "#passwordSigninConfirmed");

	$("#passwordSigninConfirmed").click(function(event) {
		$.ajax({
			type: 'POST',
			url: window.routes.Signin.authenticate,
			headers: { 'Csrf-Token': '@helper.CSRF.getToken.value' },
			data: $('#passwordSigninForm').serialize(),
			success: function(response) {
				window.common.userSigninTime = response.userSigninTime;
				resetSessionTimeout();
				$('#signinModal').modal('hide');
			},
			error: function(err) {
				$("#passwordSigninPassword").val("");
				const errMsg = err.responseText ? err.responseText : "An error occurred during local sign-in";
				FormValidation.show("#passwordSigninForm", {password: [errMsg]});
			}
		});
	});
</script>