auth.js

// static/js/auth.js
console.log("auth.js loaded successfully!");

async function login() {
    console.log("Login function called");
    
    const username = document.getElementById('username').value.trim();
    const password = document.getElementById('password').value.trim();

    console.log("Username:", username);
    console.log("Password:", password);

    if (!username || !password) {
        showAlert('Please fill in all fields', 'error');
        return;
    }

    try {
        console.log("Sending login request...");
        const response = await fetch('/api/auth/login', {
            method: 'POST',
            headers: {
                'Content-Type': 'application/json'
            },
            body: JSON.stringify({ username, password })
        });

        const data = await response.json();
        console.log("Login response:", data);

        if (data.success) {
            showAlert('Login successful! Welcome back! 🎉');
            setTimeout(() => {
                window.location.href = '/';
            }, 1500);
        } else {
            showAlert('Login failed: ' + data.message, 'error');
        }
    } catch (error) {
        console.error('Login error:', error);
        showAlert('An error occurred during login', 'error');
    }
}

async function register() {
    console.log("Register function called");
    
    const username = document.getElementById('username').value.trim();
    const email = document.getElementById('email').value.trim();
    const password = document.getElementById('password').value.trim();
    const confirmPassword = document.getElementById('confirm_password').value.trim();
    const displayName = document.getElementById('display_name').value.trim();
    const mobileNumber = document.getElementById('mobile_number').value.trim();
    const location = document.getElementById('location').value.trim();
    const bio = document.getElementById('bio').value.trim();

    if (!username || !email || !password || !confirmPassword || !displayName || !mobileNumber || !location) {
        showAlert('Please fill in all required fields', 'error');
        return;
    }

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

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

    if (!validateEmail(email)) {
        showAlert('Please enter a valid email address', 'error');
        return;
    }

    try {
        console.log("Sending registration request...");
        const response = await fetch('/api/auth/register', {
            method: 'POST',
            headers: {
                'Content-Type': 'application/json'
            },
            body: JSON.stringify({ 
                username, 
                email, 
                password, 
                display_name: displayName,
                mobile_number: mobileNumber,
                location,
                bio
            })
        });

        const data = await response.json();
        console.log("Registration response:", data);

        if (data.success) {
            showAlert('Registration successful! Welcome to our community! 🎉');
            setTimeout(() => {
                window.location.href = '/';
            }, 2000);
        } else {
            showAlert('Registration failed: ' + data.message, 'error');
        }
    } catch (error) {
        console.error('Registration error:', error);
        showAlert('An error occurred during registration', 'error');
    }
}

// Make functions globally available
window.login = login;
window.register = register;