// Version: 24.09.2025 16:29

// === DOM-Elemente ===
const loginFormContainer = document.getElementById('login-form-container');
const registerFormContainer = document.getElementById('register-form-container');
const showRegisterLink = document.getElementById('showRegister');
const showLoginLink = document.getElementById('showLogin');
const registerForm = document.getElementById('registerForm');
const loginForm = document.getElementById('loginForm');

const AUTH_API_URL = 'auth_api.php';

// === Toast-Funktion (isoliert für diese Seite) ===
function showToast(message, isError = false) {
    const existingToast = document.querySelector('.toast');
    if (existingToast) existingToast.remove();

    const toast = document.createElement('div');
    toast.className = `toast ${isError ? 'error' : ''}`;
    toast.textContent = message;
    document.body.appendChild(toast);
    
    setTimeout(() => toast.classList.add('show'), 10);
    
    setTimeout(() => {
        toast.classList.remove('show');
        setTimeout(() => document.body.removeChild(toast), 300);
    }, 3000);
}


// === Event Handlers ===

function switchForms(e) {
    e.preventDefault();
    if (loginFormContainer.style.display === 'none') {
        registerFormContainer.style.display = 'none';
        loginFormContainer.style.display = 'block';
    } else {
        loginFormContainer.style.display = 'none';
        registerFormContainer.style.display = 'block';
    }
}

async function handleRegister(e) {
    e.preventDefault();
    const submitBtn = registerForm.querySelector('button[type="submit"]');
    submitBtn.disabled = true;
    submitBtn.textContent = 'Erstelle Konto...';

    const formData = new FormData(registerForm);
    const data = Object.fromEntries(formData.entries());
    data.action = 'register';

    try {
        const response = await fetch(AUTH_API_URL, {
            method: 'POST',
            headers: { 'Content-Type': 'application/json' },
            body: JSON.stringify(data),
        });
        const result = await response.json();
        if (!response.ok) throw new Error(result.error);

        showToast(result.message || 'Registrierung erfolgreich!');
        registerForm.reset();
        switchForms(e); // Zum Login wechseln
    } catch (error) {
        showToast(error.message, true);
    } finally {
        submitBtn.disabled = false;
        submitBtn.textContent = 'Konto erstellen';
    }
}


async function handleLogin(e) {
    e.preventDefault();
    const submitBtn = loginForm.querySelector('button[type="submit"]');
    submitBtn.disabled = true;
    submitBtn.textContent = 'Logge ein...';

    const formData = new FormData(loginForm);
    const data = Object.fromEntries(formData.entries());
    data.action = 'login';
    
    try {
        const response = await fetch(AUTH_API_URL, {
            method: 'POST',
            headers: { 'Content-Type': 'application/json' },
            body: JSON.stringify(data),
        });
        const result = await response.json();
        if (!response.ok) throw new Error(result.error);
        
        // Login war erfolgreich, lade die Seite neu
        // Der Server wird uns jetzt die Pflanzen-Ansicht schicken
        location.reload();

    } catch(error) {
        showToast(error.message, true);
    } finally {
        submitBtn.disabled = false;
        submitBtn.textContent = 'Einloggen';
    }
}


// === Initialisierung ===
function init() {
    showRegisterLink.addEventListener('click', switchForms);
    showLoginLink.addEventListener('click', switchForms);
    registerForm.addEventListener('submit', handleRegister);
    loginForm.addEventListener('submit', handleLogin);
}

document.addEventListener('DOMContentLoaded', init);