Added re-authentication modal

This commit is contained in:
2025-11-28 22:27:06 +01:00
parent 464e5e8603
commit bc3e678e25
8 changed files with 189 additions and 45 deletions

View File

@@ -78,32 +78,32 @@
const BARCODE_TYPE = "@barcodeType";
if (!isEnteredManually)
{
switch (BARCODE_TYPE.toUpperCase()) {
case "EAN13":
decodedText = decodedText.slice(0,-1);
break;
case "EAN8":
decodedText = decodedText.slice(0,-1);
break;
case "UPC":
decodedText = decodedText.slice(0,-1);
break;
case "ITF14":
decodedText = decodedText.slice(0,-1);
break;
case "MSI10":
decodedText = decodedText.slice(0,-1);
break;
case "MSI11":
decodedText = decodedText.slice(0,-1);
break;
case "MSI1010":
decodedText = decodedText.slice(0,-2);
break;
case "MSI1110":
decodedText = decodedText.slice(0,-1);
break;
}
switch (BARCODE_TYPE.toUpperCase()) {
case "EAN13":
decodedText = decodedText.slice(0,-1);
break;
case "EAN8":
decodedText = decodedText.slice(0,-1);
break;
case "UPC":
decodedText = decodedText.slice(0,-1);
break;
case "ITF14":
decodedText = decodedText.slice(0,-1);
break;
case "MSI10":
decodedText = decodedText.slice(0,-1);
break;
case "MSI11":
decodedText = decodedText.slice(0,-1);
break;
case "MSI1010":
decodedText = decodedText.slice(0,-2);
break;
case "MSI1110":
decodedText = decodedText.slice(0,-1);
break;
}
}
decodedText = decodedText.replace(/^0+/, '');
console.log(`Code matched = ${decodedText}`, decodedResult);

View File

@@ -15,17 +15,5 @@
</div>
}
}
<form method="post" action="/Home/Login" class="mt-4" style="max-width: 400px; margin: auto;">
<div class="form-group mb-3">
<label for="username" class="form-label">@T["Username"]</label>
<input autofocus type="text" class="form-control" id="username" name="username" autocomplete="username" required>
</div>
<div class="form-group mb-3">
<label for="password" class="form-label">@T["Password"]</label>
<input type="password" class="form-control" id="password" name="password" autocomplete="current-password" required>
</div>
<button type="submit" class="btn btn-primary w-100">@T["Login"]</button>
</form>
<partial name="_Login" />
</div>

View File

@@ -139,6 +139,88 @@
&copy; 2025 - Berufsschule_HAM
</div>
</footer>
<!-- Re-authentication Modal -->
<div class="modal fade" id="reAuthModal" tabindex="-1" aria-labelledby="reAuthModalLabel" aria-hidden="true">
<div class="modal-dialog modal-dialog-centered">
<div class="modal-content">
<div class="modal-header bg-info text-dark">
<h3 class="modal-title" id="detailModalLabel">@T["Extend session duration"]</h3>
<button type="button" class="btn-close btn-close-white" style="filter: invert(0);" aria-label="Close" data-bs-dismiss="modal"></button>
</div>
<form id="reAuthForm">
<div class="modal-body">
<p id="reAuthModalLabel" class="text-center">@T["The session expires soon."]<br/>@T["Please authenticate to continue without losing data."]</p>
<div class="mb-3">
<label for="reAuthUsername" class="form-label">@T["Username"]</label>
<input type="text" class="form-control" id="reAuthUsername" name="Username"
value="@User.Identity?.Name" readonly />
</div>
<div class="mb-3">
<label for="reAuthPassword" class="form-label">@T["Password"]</label>
<input type="password" class="form-control" id="reAuthPassword" name="Password" required />
</div>
<div class="alert alert-danger d-none" id="reAuthError"></div>
</div>
<div class="modal-footer">
<button type="submit" class="btn btn-primary">@T["Re-authenticate"]</button>
</div>
</form>
</div>
</div>
</div>
<script>
document.addEventListener('DOMContentLoaded', () => {
// Flag so modal only opens once
window.reAuthModalOpen = false;
function openReAuthModal() {
window.reAuthModalOpen = true;
const reAuthModal = new bootstrap.Modal(document.getElementById('reAuthModal'));
reAuthModal.show();
}
function scheduleReAuthModal() {
fetch('/Home/RemainingTime')
.then(res => res.json())
.then(data => {
let remainingMinutesThreshold = 20;
let remainingMinutes = data.remainingMinutes;
let triggerMinutes = Math.max(0, remainingMinutes - remainingMinutesThreshold);
let triggerMs = triggerMinutes * 60 * 1000;
setTimeout(() => {
if (!window.reAuthModalOpen) {
openReAuthModal();
}
}, triggerMs);
})
.catch(console.error);
}
scheduleReAuthModal();
$('#reAuthForm').on('submit', function (e) {
e.preventDefault();
const formData = $(this).serialize();
$.post('/Home/Login', formData)
.done(function () {
window.reAuthModalOpen = false;
$('#reAuthModal').modal('hide');
})
.fail(function (data) {
console.log(data);
const parser = new DOMParser();
const doc = parser.parseFromString(data.responseText, 'text/html');
const errorHeading = doc.querySelector("main div div h2");
let responseText = data.responseText;
document.getElementById("reAuthError").textContent = errorHeading.textContent;
$('#reAuthError').removeClass('d-none');
});
});
});
</script>
@* <script src="~/lib/jquery/dist/jquery.min.js" defer></script> *@
<script src="https://code.jquery.com/jquery-3.7.1.min.js"
crossorigin="anonymous" defer></script>

View File

@@ -0,0 +1,16 @@
@using Microsoft.AspNetCore.Mvc.Localization
@inject IViewLocalizer T
<form method="post" action="/Home/Login" class="mt-4" style="max-width: 400px; margin: auto;">
<div class="form-group mb-3">
<label for="username" class="form-label">@T["Username"]</label>
<input autofocus type="text" class="form-control" id="username" name="username" autocomplete="username" required>
</div>
<div class="form-group mb-3">
<label for="password" class="form-label">@T["Password"]</label>
<input type="password" class="form-control" id="password" name="password" autocomplete="current-password" required>
</div>
<button type="submit" class="btn btn-primary w-100">@T["Login"]</button>
</form>