Add email verification and password reset

src/main/resources/templates/index.html

@@ -29,7 +29,12 @@
 
           <div th:if="${param.error}" class="mf-alert err">Benutzername oder Passwort sind falsch.</div>
           <div th:if="${param.logout}" class="mf-alert ok">Du hast dich erfolgreich abgemeldet.</div>
-          <div th:if="${param.registerSuccess}" class="mf-alert ok">Registrierung erfolgreich! Du kannst dich jetzt einloggen.</div>
+          <div th:if="${param.registerSuccess}" class="mf-alert ok">Fast geschafft: Wir haben dir einen Bestätigungslink per E-Mail gesendet.</div>
+          <div th:if="${param.emailVerified}" class="mf-alert ok">Deine E-Mail-Adresse wurde bestätigt. Du kannst dich jetzt anmelden.</div>
+          <div th:if="${param.passwordReset}" class="mf-alert ok">Dein Passwort wurde geändert. Du kannst dich jetzt anmelden.</div>
+          <div th:if="${param.verificationSent}" class="mf-alert ok">Falls ein unbestätigter Account zu dieser Adresse existiert, wurde ein neuer Link versendet.</div>
+          <div th:if="${param.verificationInvalid}" class="mf-alert err">Dieser Bestätigungslink ist ungültig oder abgelaufen.</div>
+          <div th:if="${param.resetInvalid}" class="mf-alert err">Dieser Passwort-Link ist ungültig oder abgelaufen.</div>
 
           <form th:action="@{/login}" method="post">
             <div class="mf-field">
@@ -43,6 +48,8 @@
             <button class="neon-btn" type="submit">Login</button>
           </form>
 
+          <p class="mobile-switch"><a href="/forgot-password">Passwort vergessen?</a></p>
+
           <p class="mobile-switch">Noch keinen Account? <a data-goto="signup">Jetzt registrieren</a></p>
         </div>
       </div>
@@ -61,6 +68,8 @@
           <div th:if="${param.passwordMismatch}" class="mf-alert err">Die Passwörter stimmen nicht überein. Bitte erneut eingeben.</div>
           <div th:if="${param.passwordPolicy}" class="mf-alert err">Das Passwort muss mindestens 8 Zeichen lang sein.</div>
           <div th:if="${param.emailInvalid}" class="mf-alert err">Bitte gib eine gültige E-Mail-Adresse an.</div>
+          <div th:if="${param.emailTaken}" class="mf-alert err">Diese E-Mail-Adresse wird bereits verwendet.</div>
+          <div th:if="${param.registerMailError}" class="mf-alert err">Der Account wurde angelegt, aber die Bestätigungs-E-Mail konnte nicht gesendet werden. Fordere unten einen neuen Link an.</div>
 
           <form th:action="@{/register}" method="post">
             <div class="mf-field">
@@ -83,6 +92,14 @@
             <button class="neon-btn" type="submit">Account erstellen</button>
           </form>
 
+          <form th:action="@{/verification/resend}" method="post" style="margin-top:1rem">
+            <label class="mf-label" for="resend-email">Bestätigungslink erneut senden</label>
+            <div style="display:flex; gap:.5rem; flex-wrap:wrap; margin-top:.35rem">
+              <input id="resend-email" class="mf-input" type="email" name="email" placeholder="E-Mail-Adresse" required>
+              <button class="mf-btn outline" type="submit">Link senden</button>
+            </div>
+          </form>
+
           <p class="mobile-switch">Schon dabei? <a data-goto="login">Zum Login</a></p>
         </div>
       </div>
@@ -138,7 +155,7 @@
 
     // Bei Registrierungs-/Passwortfehler direkt das Signup-Panel öffnen
     var qp = new URLSearchParams(window.location.search);
-    if (qp.has('registerError') || qp.has('passwordMismatch')) {
+    if (qp.has('registerError') || qp.has('passwordMismatch') || qp.has('passwordPolicy') || qp.has('emailInvalid') || qp.has('emailTaken') || qp.has('registerMailError')) {
       c.classList.add('active');
     }