// login.js — login / register page logic

// Redirect if already logged in
(function () {
    const raw = localStorage.getItem('user');
    if (raw) {
        try {
            const user = JSON.parse(raw);
            if (user.exp > Date.now() / 1000) {
                window.location.href = '/';
                return;
            }
        } catch (_) {}
        localStorage.removeItem('user');
    }
})();

function showLogin() {
    document.getElementById('register-panel').style.display = 'none';
    document.getElementById('login-panel').style.display = 'block';
    document.getElementById('username').focus();
}

function showRegister() {
    document.getElementById('login-panel').style.display = 'none';
    document.getElementById('register-panel').style.display = 'block';
    document.getElementById('reg-username').focus();
}

function showError(elId, text) {
    const el = document.getElementById(elId);
    el.textContent = text;
    el.className = 'message error visible';
}

document.addEventListener('DOMContentLoaded', () => {
    document.getElementById('show-register-link').addEventListener('click', (e) => {
        e.preventDefault();
        showRegister();
    });

    document.getElementById('show-login-link').addEventListener('click', (e) => {
        e.preventDefault();
        showLogin();
    });

    // ── Login ──
    document.getElementById('login-form').addEventListener('submit', async (e) => {
        e.preventDefault();
        const btn = document.getElementById('login-btn');
        btn.disabled = true;
        btn.textContent = 'Signing in…';
        document.getElementById('login-msg').className = 'message';

        const username = document.getElementById('username').value.trim();
        const password = document.getElementById('password').value;

        try {
            const res = await fetch('/api/auth/login', {
                method: 'POST',
                credentials: 'include',
                headers: { 'Content-Type': 'application/json' },
                body: JSON.stringify({ username, password }),
            });
            const data = await res.json();
            if (res.status === 429) { showError('login-msg', 'Too many attempts — please wait a minute and try again.'); return; }
            if (!res.ok) { showError('login-msg', data.detail || 'Login failed'); return; }
            localStorage.setItem('user', JSON.stringify(data.user));
            window.location.href = '/';
        } catch (err) {
            showError('login-msg', 'Could not reach the server. Please try again.');
        } finally {
            btn.disabled = false;
            btn.textContent = 'Sign In';
        }
    });

    // ── Register ──
    document.getElementById('reg-form').addEventListener('submit', async (e) => {
        e.preventDefault();
        const btn = document.getElementById('reg-btn');
        const username = document.getElementById('reg-username').value.trim();
        const password = document.getElementById('reg-password').value;
        const confirm  = document.getElementById('reg-confirm').value;

        if (password !== confirm) { showError('reg-msg', 'Passwords do not match'); return; }

        btn.disabled = true;
        btn.textContent = 'Creating account…';
        document.getElementById('reg-msg').className = 'message';

        try {
            const res = await fetch('/api/auth/register', {
                method: 'POST',
                credentials: 'include',
                headers: { 'Content-Type': 'application/json' },
                body: JSON.stringify({ username, password }),
            });
            const data = await res.json();
            if (!res.ok) { showError('reg-msg', data.detail || 'Registration failed'); return; }
            localStorage.setItem('user', JSON.stringify(data.user));
            window.location.href = '/';
        } catch (err) {
            showError('reg-msg', 'Could not reach the server. Please try again.');
        } finally {
            btn.disabled = false;
            btn.textContent = 'Create Account';
        }
    });
});