import { showModal, closeModal } from "./Modal Login.js";
import { loginRequest } from "./API Login.js";

document.getElementById('loginForm').addEventListener('submit', async function(e) {
    e.preventDefault();

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

    // Validasi input kosong
    if (!username || !password) {
        showModal('error', 'Login Gagal!', 'Username dan password tidak boleh kosong.');
        return;
    }

    // Loading state
    const submitBtn = this.querySelector('button[type="submit"]');
    const originalText = submitBtn.textContent;
    submitBtn.innerHTML = '<span>Memproses...</span>';
    submitBtn.disabled = true;

    try {
        const data = await loginRequest(username, password);

        if (data.success) {
            // Simpan data user ke localStorage
            localStorage.setItem('authToken', data.token);
            localStorage.setItem('username', data.username);
            
            // Tampilkan modal sukses
            showModal('success', 'Login Berhasil!', `Selamat datang, ${data.username}!`);
            
        } else {
            // Handle error dari backend
            showModal('error', 'Login Gagal!', data.message || 'Username atau password salah.');
        }
    } catch (error) {
        console.error('Login Error:', error);
        
        // Handle berbagai jenis error
        let errorMessage = 'Terjadi kesalahan koneksi ke server.';
        
        if (error.message === 'Failed to fetch') {
            errorMessage = 'Tidak dapat terhubung ke server. Periksa koneksi internet Anda.';
        } else if (error.message.includes('timeout')) {
            errorMessage = 'Request timeout. Server tidak merespons.';
        } else if (error.response) {
            // Error dari server dengan response
            errorMessage = error.response.data?.message || 'Terjadi kesalahan pada server.';
        } else if (error.status === 401) {
            errorMessage = 'Username atau password salah.';
        } else if (error.status === 403) {
            errorMessage = 'Akun Anda diblokir. Hubungi administrator.';
        } else if (error.status === 500) {
            errorMessage = 'Terjadi kesalahan pada server. Coba lagi nanti.';
        }
        
        showModal('error', 'Error!', errorMessage);
    } finally {
        // Kembalikan button ke state normal
        submitBtn.textContent = originalText;
        submitBtn.disabled = false;
    }
});

// Link register
document.getElementById('registerLink').addEventListener('click', function(e) {
    e.preventDefault();
    showModal('error', 'Info', 'Halaman Register sedang dalam pengembangan.');
});

// Clear error visual saat user mulai mengetik
document.getElementById('username').addEventListener('input', function() {
    this.style.borderColor = '';
});

document.getElementById('password').addEventListener('input', function() {
    this.style.borderColor = '';
});

// Optional: Tambahkan visual error pada input
function setInputError(inputId) {
    const input = document.getElementById(inputId);
    if (input) {
        input.style.borderColor = '#ff0080';
        input.style.boxShadow = '0 0 20px rgba(255, 0, 128, 0.3)';
    }
}

// Optional: Check apakah user sudah login saat buka halaman
window.addEventListener('DOMContentLoaded', function() {
    const token = localStorage.getItem('authToken');
    const username = localStorage.getItem('username');
    
    // Jika sudah ada token, redirect ke homepage
    if (token && username) {
        // Optional: Validasi token dulu ke backend
        console.log('User sudah login:', username);
        // window.location.href = 'homepage.html'; // Uncomment untuk auto redirect
    }
});