implemented optional authentification app and stricter password and user rules.

Also against brute force.
2026-04-01 10:38:29 +02:00
parent f2de165c55
commit 9cc1a22232
21 changed files with 1124 additions and 170 deletions
@@ -1,32 +1,69 @@
-const button = document.querySelector(".magnetic");
+const magneticButtons = document.querySelectorAll(".magnetic");

-button.addEventListener("mousemove", (e) => {
-    const rect = button.getBoundingClientRect();
-    const x = e.clientX - rect.left - rect.width / 2;
-    const y = e.clientY - rect.top - rect.height / 2;
+magneticButtons.forEach((button) => {
+    button.addEventListener("mousemove", (event) => {
+        const rect = button.getBoundingClientRect();
+        const x = event.clientX - rect.left - rect.width / 2;
+        const y = event.clientY - rect.top - rect.height / 2;

-    button.style.transform = `translate(${x * 0.2}px, ${y * 0.2}px)`;
-});
+        button.style.transform = `translate(${x * 0.15}px, ${y * 0.15}px)`;
+    });

-button.addEventListener("mouseleave", () => {
-    button.style.transform = "translate(0,0)";
-});
-
-const inputs = document.querySelectorAll("input");
-
-inputs.forEach(input => {
-    input.addEventListener("input", () => {
-        input.style.boxShadow = "0 0 8px rgba(79,172,254,0.6)";
-
-        setTimeout(() => {
-            input.style.boxShadow = "";
-        }, 300);
+    button.addEventListener("mouseleave", () => {
+        button.style.transform = "translate(0, 0)";
    });
 });

-const form = document.querySelector("form");
+document.querySelectorAll("input").forEach((input) => {
+    input.addEventListener("input", () => {
+        input.style.boxShadow = "0 0 8px rgba(59, 130, 246, 0.4)";

-form.addEventListener("submit", () => {
-    button.innerText = "Logging in...";
-    button.style.opacity = "0.7";
+        window.clearTimeout(input._loginGlowTimeout);
+        input._loginGlowTimeout = window.setTimeout(() => {
+            input.style.boxShadow = "";
+        }, 250);
+    });
+});
+
+document.querySelectorAll("form").forEach((form) => {
+    form.addEventListener("submit", (event) => {
+        const submitter = event.submitter;
+
+        if (!submitter || submitter.dataset.loadingLabelApplied === "true") {
+            return;
+        }
+
+        const loadingLabel = submitter.dataset.loadingLabel;
+
+        if (loadingLabel) {
+            submitter.dataset.loadingLabelApplied = "true";
+            submitter.dataset.originalLabel = submitter.innerText;
+            submitter.innerText = loadingLabel;
+            submitter.style.opacity = "0.7";
+        }
+    });
+});
+
+document.querySelectorAll(".qr-code[data-qr-value]").forEach((container) => {
+    const qrValue = container.dataset.qrValue;
+
+    if (!qrValue) {
+        return;
+    }
+
+    if (typeof window.QRCode !== "function") {
+        container.textContent = "QR preview could not be loaded.";
+        return;
+    }
+
+    container.innerHTML = "";
+
+    new window.QRCode(container, {
+        text: qrValue,
+        width: 220,
+        height: 220,
+        colorDark: "#172033",
+        colorLight: "#ffffff",
+        correctLevel: window.QRCode.CorrectLevel.M
+    });
 });