Social_Cooking/js/signup.js

// =============================================
// Signup-Logik
// Diese Datei validiert das Formular, speichert
// neue Benutzer lokal und startet direkt die Session.
// =============================================

// Formular und Felder aus dem HTML holen.
const signupForm = document.getElementById('signupForm');
const vornameInput = document.getElementById('vorname');
const nachnameInput = document.getElementById('nachname');
const emailInput = document.getElementById('email');
const passwortInput = document.getElementById('passwort');
const welcomeModal = document.getElementById('welcomeModal');

const USERS_STORAGE_KEY = 'socialCookingUsers';
const CURRENT_USER_KEY = 'socialCookingCurrentUser';

// Liest bestehende Benutzerliste robust aus localStorage.
function getStoredUsers() {
    try {
        const raw = localStorage.getItem(USERS_STORAGE_KEY);
        return raw ? JSON.parse(raw) : [];
    } catch (error) {
        console.error('Benutzerdaten konnten nicht gelesen werden.', error);
        return [];
    }
}

// Schreibt die komplette Benutzerliste in localStorage.
function setStoredUsers(users) {
    localStorage.setItem(USERS_STORAGE_KEY, JSON.stringify(users));
}

// Speichert den aktiven Benutzer fuer nachfolgende Seiten.
function setCurrentUser(user) {
    localStorage.setItem(CURRENT_USER_KEY, JSON.stringify(user));
}

// Funktion zum Öffnen des Welcome Modals
function openWelcomeModal() {
    welcomeModal.classList.add('show');
    document.body.style.overflow = 'hidden';
}

// Funktion zum Schließen des Welcome Modals
function closeWelcomeModal() {
    welcomeModal.classList.remove('show');
    document.body.style.overflow = 'auto';
}

// Hauptfunktion fuer Formularvalidierung und Speicherung.
function validateForm(event) {
    event.preventDefault();
    
    let isValid = true;

    // Vorname-Validierung
    const vornameValue = vornameInput.value.trim();
    const vornameGroup = vornameInput.parentElement;

    if (!vornameValue) {
        vornameGroup.classList.add('has-error');
        isValid = false;
    } else {
        vornameGroup.classList.remove('has-error');
    }

    // Nachname-Validierung
    const nachnameValue = nachnameInput.value.trim();
    const nachnameGroup = nachnameInput.parentElement;

    if (!nachnameValue) {
        nachnameGroup.classList.add('has-error');
        isValid = false;
    } else {
        nachnameGroup.classList.remove('has-error');
    }

    // Email-Validierung
    const emailValue = emailInput.value.trim();
    const emailRegex = /^[^\s@]+@[^\s@]+\.[^\s@]+$/;
    const emailGroup = emailInput.parentElement;

    if (!emailValue) {
        emailGroup.classList.add('has-error');
        document.getElementById('emailError').textContent = 'Bitte gib deine E-Mail Adresse ein.';
        isValid = false;
    } else if (!emailRegex.test(emailValue)) {
        emailGroup.classList.add('has-error');
        document.getElementById('emailError').textContent = 'Bitte gib eine gültige E-Mail Adresse ein.';
        isValid = false;
    } else {
        emailGroup.classList.remove('has-error');
    }

    // Passwort-Validierung
    const passwortValue = passwortInput.value;
    const passwortGroup = passwortInput.parentElement;

    if (!passwortValue) {
        passwortGroup.classList.add('has-error');
        document.getElementById('passwortError').textContent = 'Bitte gib ein Passwort ein.';
        isValid = false;
    } else if (passwortValue.length < 8) {
        passwortGroup.classList.add('has-error');
        document.getElementById('passwortError').textContent = 'Dein Passwort muss mindestens 8 Zeichen lang sein.';
        isValid = false;
    } else {
        passwortGroup.classList.remove('has-error');
    }

    // Wenn alles gueltig ist:
    // 1) auf doppelte E-Mail pruefen
    // 2) neuen Benutzer speichern
    // 3) als aktuellen Benutzer einloggen
    if (isValid) {
        const existingUsers = getStoredUsers();
        const emailLower = emailValue.toLowerCase();
        const emailAlreadyUsed = existingUsers.some(user => user.email?.toLowerCase() === emailLower);

        if (emailAlreadyUsed) {
            emailGroup.classList.add('has-error');
            document.getElementById('emailError').textContent = 'Diese E-Mail ist bereits registriert. Bitte nutze den Login.';
            return;
        }

        const newUser = {
            id: Date.now(),
            vorname: vornameValue,
            nachname: nachnameValue,
            email: emailValue,
            passwort: passwortValue,
            createdAt: new Date().toISOString(),
            source: 'signup'
        };

        setStoredUsers([newUser, ...existingUsers]);
        setCurrentUser(newUser);

        openWelcomeModal();
        // Hier koennte spaeter ein echter API-Call zum Backend stehen.
         
        // Weiterleitung zur Event-Overview-Seite.
        window.location.href = 'event_overview.html';
    }
}

// Fehlerbehandlung bei Input-Änderung (entfernt Fehler wenn Benutzer korrigiert)
vornameInput.addEventListener('input', function() {
    const vornameGroup = this.parentElement;
    if (this.value.trim()) {
        vornameGroup.classList.remove('has-error');
    }
});

nachnameInput.addEventListener('input', function() {
    const nachnameGroup = this.parentElement;
    if (this.value.trim()) {
        nachnameGroup.classList.remove('has-error');
    }
});

emailInput.addEventListener('input', function() {
    const emailGroup = this.parentElement;
    if (this.value.trim()) {
        emailGroup.classList.remove('has-error');
    }
});

passwortInput.addEventListener('input', function() {
    const passwortGroup = this.parentElement;
    if (this.value) {
        passwortGroup.classList.remove('has-error');
    }
});

// Modal schließen wenn außerhalb geklickt wird
welcomeModal.addEventListener('click', function(event) {
    if (event.target === welcomeModal) {
        closeWelcomeModal();
    }
});

// Form Submit Event
signupForm.addEventListener('submit', validateForm);