Theodor-Springmann-Stiftung/musenalm
1
0
Fork 0
mirror of https://github.com/Theodor-Springmann-Stiftung/musenalm.git synced 2025-10-29 09:15:33 +00:00
Code Issues Packages Projects Releases Wiki Activity

resetbutton & almanach edit start

Browse Source
This commit is contained in:
Simon Martens
2025-05-30 19:30:50 +02:00
parent d8e50b27b0
commit 8ea36da40f
28 changed files with 1789 additions and 763 deletions
Download Patch File Download Diff File Expand all files Collapse all files

71
views/routes/user/management/access/body.gohtml
View File

@@ -4,73 +4,8 @@
<script src="/assets/js/qrcode.min.js"></script>
<script type="module">
/**
* @param {number} timeout - Maximum time to wait in milliseconds.
* @param {number} interval - How often to check in milliseconds.
* @returns {Promise<Function>} Resolves with the QRCode constructor when available.
*/
function getQRCodeWhenAvailable(timeout = 5000, interval = 100) {
return new Promise((resolve, reject) => {
let elapsedTime = 0;
const checkInterval = setInterval(() => {
if (typeof window.QRCode === "function") {
clearInterval(checkInterval);
resolve(window.QRCode); // Resolve with the QRCode object/function
} else {
elapsedTime += interval;
if (elapsedTime >= timeout) {
clearInterval(checkInterval);
console.error("Timed out waiting for QRCode to become available.");
reject(new Error("QRCode not available after " + timeout + "ms. Check if qrcode.min.js is loaded correctly and sets window.QRCode."));
}
}
}, interval);
});
}
// INFO: We have to wait for the QRCode object to be available. It's messy.
async function genQRCode() {
console.debug("Generating QR Code...");
const QRCode = await getQRCodeWhenAvailable();
const tokenElement = document.getElementById("token");
const qrElement = document.getElementById("qr");
if (qrElement) {
// INFO: Clear previous QR code if any
// Also hide it initially to prevent flickering
qrElement.innerHTML = "";
qrElement.classList.add("hidden");
new QRCode(qrElement, {
text: tokenElement.value,
width: 1280,
height: 1280,
colorDark: "#000000",
colorLight: "#ffffff",
correctLevel: QRCode.CorrectLevel.H,
});
setTimeout(() => {
qrElement.classList.remove("hidden");
}, 20);
}
// Add event listeners to the token input field to select its content on focus or click
if (tokenElement) {
tokenElement.addEventListener("focus", (ev) => {
ev.preventDefault();
tokenElement.select();
});
tokenElement.addEventListener("mousedown", (ev) => {
ev.preventDefault();
tokenElement.select();
});
tokenElement.addEventListener("mouseup", (ev) => {
ev.preventDefault();
tokenElement.select();
});
}
}
genQRCode();
window.genQRCode = genQRCode;
GenQRCode(token.value);
SelectableInput(token);
</script>
<div class="flex container-normal bg-slate-100 mx-auto !pt-36 px-8">
@@ -135,7 +70,7 @@
<i class="ri-external-link-line"></i>
</a>
</tool-tip>
<form class="" method="POST" hx-boost="false" x-target="token access-link qrinfo" @ajax:after="genQRCode()">
<form class="" method="POST" hx-boost="false" x-target="token access-link qrinfo" @ajax:after="GenQRCode(token.value); SelectableInput(token)">
<input type="hidden" name="csrf_token" id="csrf_token" required value="{{ $model.csrf_token }}" />
<div class="col-span-9 flex flex-row items-center justify-center">
<tool-tip position="top">