Ninjaserver/public/js/login.js

// Supabase configuration
const SUPABASE_URL = 'https://lfxlplnypzvjrhftaoog.supabase.co';
const SUPABASE_ANON_KEY = 'eyJhbGciOiJIUzI1NiIsInR5cCI6IkpXVCJ9.eyJpc3MiOiJzdXBhYmFzZSIsInJlZiI6ImxmeGxwbG55cHp2anJoZnRhb29nIiwicm9sZSI6ImFub24iLCJpYXQiOjE3NDkyMTQ3NzIsImV4cCI6MjA2NDc5MDc3Mn0.XR4preBqWAQ1rT4PFbpkmRdz57BTwIusBI89fIxDHM8';

// Initialize Supabase client
const supabase = window.supabase.createClient(SUPABASE_URL, SUPABASE_ANON_KEY);

// Check if user is already logged in
async function checkAuth() {
    const { data: { session } } = await supabase.auth.getSession();
    if (session) {
        window.location.href = '/';
    }
}

// Toggle between login and register forms
function toggleForm() {
    const loginForm = document.getElementById('loginForm');
    const registerForm = document.getElementById('registerForm');
    
    if (loginForm.classList.contains('active')) {
        loginForm.classList.remove('active');
        registerForm.classList.add('active');
    } else {
        registerForm.classList.remove('active');
        loginForm.classList.add('active');
    }
    clearMessage();
    showPasswordReset(false); // Hide password reset when switching forms
}

// Show message
function showMessage(message, type = 'success') {
    const messageDiv = document.getElementById('message');
    messageDiv.innerHTML = `<div class="message ${type}">${message}</div>`;
    setTimeout(() => {
        messageDiv.innerHTML = '';
    }, 5000);
}

// Clear message
function clearMessage() {
    document.getElementById('message').innerHTML = '';
}

// Show/hide password reset container
function showPasswordReset(show) {
    const resetContainer = document.getElementById('passwordResetContainer');
    if (show) {
        resetContainer.classList.add('active');
    } else {
        resetContainer.classList.remove('active');
    }
}

// Show/hide loading
function setLoading(show) {
    const loading = document.getElementById('loading');
    if (show) {
        loading.classList.add('active');
    } else {
        loading.classList.remove('active');
    }
}

// Event Listeners Setup
function setupEventListeners() {
    // Handle login
    document.getElementById('loginFormElement').addEventListener('submit', async (e) => {
        e.preventDefault();
        setLoading(true);
        clearMessage();
        showPasswordReset(false); // Hide reset button initially

        const email = document.getElementById('loginEmail').value;
        const password = document.getElementById('loginPassword').value;

        try {
            const { data, error } = await supabase.auth.signInWithPassword({
                email: email,
                password: password
            });

            if (error) {
                showMessage(error.message, 'error');
                // Show password reset button on login failure
                showPasswordReset(true);
            } else {
                showMessage('Login successful! Redirecting...', 'success');
                setTimeout(() => {
                    window.location.href = '/';
                }, 1000);
            }
        } catch (error) {
            showMessage('An unexpected error occurred', 'error');
            showPasswordReset(true);
        } finally {
            setLoading(false);
        }
    });

    // Handle registration
    document.getElementById('registerFormElement').addEventListener('submit', async (e) => {
        e.preventDefault();
        setLoading(true);
        clearMessage();

        const email = document.getElementById('registerEmail').value;
        const password = document.getElementById('registerPassword').value;
        const confirmPassword = document.getElementById('confirmPassword').value;

        if (password !== confirmPassword) {
            showMessage('Passwords do not match', 'error');
            setLoading(false);
            return;
        }

        if (password.length < 6) {
            showMessage('Password must be at least 6 characters', 'error');
            setLoading(false);
            return;
        }

        try {
            const { data, error } = await supabase.auth.signUp({
                email: email,
                password: password
            });

            if (error) {
                showMessage(error.message, 'error');
            } else {
                if (data.user && !data.user.email_confirmed_at) {
                    showMessage('Registration successful! Please check your email to confirm your account.', 'success');
                } else {
                    showMessage('Registration successful! Redirecting...', 'success');
                    setTimeout(() => {
                        window.location.href = '/';
                    }, 1000);
                }
            }
        } catch (error) {
            showMessage('An unexpected error occurred', 'error');
        } finally {
            setLoading(false);
        }
    });

    // Handle password reset
    document.getElementById('resetPasswordBtn').addEventListener('click', async () => {
        const email = document.getElementById('loginEmail').value;
        
        if (!email) {
            showMessage('Bitte geben Sie zuerst Ihre E-Mail-Adresse ein', 'error');
            return;
        }

        setLoading(true);
        clearMessage();

        try {
            const { error } = await supabase.auth.resetPasswordForEmail(email, {
                redirectTo: `${window.location.origin}/reset-password.html`
            });

            if (error) {
                showMessage('Fehler beim Senden der E-Mail: ' + error.message, 'error');
            } else {
                showMessage('Passwort-Reset-E-Mail wurde gesendet! Bitte überprüfen Sie Ihr E-Mail-Postfach.', 'success');
                showPasswordReset(false);
            }
        } catch (error) {
            showMessage('Ein unerwarteter Fehler ist aufgetreten', 'error');
        } finally {
            setLoading(false);
        }
    });
}

// Initialize page
async function init() {
    await checkAuth();
    setupEventListeners();
}

// Start the application when DOM is loaded
document.addEventListener('DOMContentLoaded', init);