document.addEventListener('DOMContentLoaded', async () => {
    // Containers
    const loginContainer = document.getElementById('login-container');
    const settingsContainer = document.getElementById('settings-container');

    // Login Form Elements
    const loginForm = document.getElementById('login-form');
    const loginUsernameInput = document.getElementById('login-username');
    const loginPasswordInput = document.getElementById('login-password');
    const btnLoginCancel = document.getElementById('btn-login-cancel');

    // Config Form Elements
    const configForm = document.getElementById('config-form');
    const clientNameInput = document.getElementById('clientName');
    const serverUrlInput = document.getElementById('serverUrl');
    const monitorPathInput = document.getElementById('monitorPath');
    const serverEmailInput = document.getElementById('serverEmail');
    const serverPasswordInput = document.getElementById('serverPassword');
    const tokenInput = document.getElementById('token');
    const adminUsernameInput = document.getElementById('adminUsername');
    const adminPasswordInput = document.getElementById('adminPassword');
    
    // Action Buttons
    const btnTest = document.getElementById('btn-test');
    const testSpinner = document.getElementById('test-spinner');
    const testText = document.getElementById('test-text');
    const btnCancel = document.getElementById('btn-cancel');

    let loadedConfig = null;

    // Show message notification
    function showToast(message, type = 'success') {
        const toast = document.getElementById('toast');
        toast.textContent = message;
        toast.className = `toast show ${type}`;
        setTimeout(() => {
            toast.className = 'toast';
        }, 3000);
    }

    // Initialize layout and load config
    try {
        if (window.api && window.api.getVersion) {
            const version = await window.api.getVersion();
            const badge = document.getElementById('app-version-badge');
            if (badge) badge.innerText = `Client v${version}`;
        }
        
        if (window.api && window.api.getLogs) {
            const logs = await window.api.getLogs();
            if (logs && logs.length > 0) {
                const terminalLogs = document.getElementById('terminal-logs');
                if (terminalLogs) {
                    terminalLogs.innerHTML = ''; // clear wait message
                    logs.forEach(log => {
                        const div = document.createElement('div');
                        div.className = 'log-line';
                        div.textContent = log;
                        terminalLogs.appendChild(div);
                    });
                    terminalLogs.scrollTop = terminalLogs.scrollHeight;
                }
            }
        }

        loadedConfig = await window.api.getConfig();
        
        // Populate settings form
        if (loadedConfig.clientName === 'DIGITE-O-NOME-DA-MAQUINA') {
            clientNameInput.value = '';
        } else {
            clientNameInput.value = loadedConfig.clientName || '';
        }
        
        serverUrlInput.value = loadedConfig.serverUrl || 'https://rx.scoreodonto.com';
        monitorPathInput.value = loadedConfig.monitorPath || 'C:\\ProgramData\\RF\\Dental Sensor\\Images';
        serverEmailInput.value = loadedConfig.serverEmail || '';
        serverPasswordInput.value = loadedConfig.serverPassword || '';
        tokenInput.value = loadedConfig.token || '';
        adminUsernameInput.value = loadedConfig.adminUsername || 'admin';
        adminPasswordInput.value = loadedConfig.adminPassword || 'admin';

        // Check if it is a first run (clientName not configured yet)
        const isFirstRun = !loadedConfig.clientName || loadedConfig.clientName === 'DIGITE-O-NOME-DA-MAQUINA';

        if (isFirstRun) {
            // Bypass login overlay and show setup screen directly
            loginContainer.classList.add('hidden');
            settingsContainer.classList.remove('hidden');
        } else {
            // Show login screen
            loginContainer.classList.remove('hidden');
            settingsContainer.classList.add('hidden');
        }
    } catch (e) {
        showToast('Erro ao carregar configurações: ' + e.message, 'error');
    }

    // Handle Login Submit
    loginForm.addEventListener('submit', (e) => {
        e.preventDefault();
        
        const username = loginUsernameInput.value.trim();
        const password = loginPasswordInput.value;

        const correctUsername = loadedConfig.adminUsername || 'admin';
        const correctPassword = loadedConfig.adminPassword || 'admin';

        if (username === correctUsername && password === correctPassword) {
            showToast('Autenticado com sucesso!', 'success');
            // Transition panels
            loginContainer.classList.add('hidden');
            settingsContainer.classList.remove('hidden');
        } else {
            showToast('Usuário ou senha inválidos.', 'error');
            loginPasswordInput.value = '';
            loginPasswordInput.focus();
        }
    });

    // Handle Config Form Submit
    configForm.addEventListener('submit', async (e) => {
        e.preventDefault();

        const name = clientNameInput.value.trim();
        if (!name || name === 'DIGITE-O-NOME-DA-MAQUINA') {
            showToast('Por favor, informe um nome válido para o computador.', 'error');
            return;
        }

        const serverUrl = serverUrlInput.value.trim();
        const serverEmail = serverEmailInput.value.trim();
        const serverPassword = serverPasswordInput.value;
        const token = tokenInput.value.trim();

        // Validar credenciais no servidor
        const saveSpinner = document.getElementById('save-spinner');
        const saveBtn = document.getElementById('btn-save');
        saveBtn.disabled = true;
        if (saveSpinner) saveSpinner.style.display = 'inline-block';

        try {
            showToast('Validando credenciais com o servidor...', 'info');
            const verifyResult = await window.api.verifyCredentials(serverUrl, serverEmail, serverPassword, token);
            
            if (saveSpinner) saveSpinner.style.display = 'none';
            saveBtn.disabled = false;

            if (!verifyResult.success) {
                showToast('Falha na validação: ' + verifyResult.error, 'error');
                return;
            }

            showToast('Credenciais confirmadas pelo servidor!', 'success');
        } catch (authErr) {
            if (saveSpinner) saveSpinner.style.display = 'none';
            saveBtn.disabled = false;
            showToast('Erro ao conectar ao servidor para validar: ' + authErr.message, 'error');
            return;
        }

        const newConfig = {
            ...loadedConfig,
            clientName: name,
            serverUrl: serverUrl,
            monitorPath: monitorPathInput.value.trim(),
            apiKey: token, // Salva o token também como apiKey para compatibilidade retroativa
            serverEmail: serverEmail,
            serverPassword: serverPassword,
            token: token,
            adminUsername: adminUsernameInput.value.trim(),
            adminPassword: adminPasswordInput.value.trim(),
            clientType: 'windows'
        };

        try {
            const success = await window.api.saveConfig(newConfig);
            if (success) {
                showToast('Configurações salvas!');
                setTimeout(() => {
                    window.api.closeWindow();
                }, 1000);
            } else {
                showToast('Falha ao salvar as configurações.', 'error');
            }
        } catch (err) {
            showToast('Erro: ' + err.message, 'error');
        }
    });

    // Handle Test Connection
    btnTest.addEventListener('click', async () => {
        const url = serverUrlInput.value.trim();
        if (!url) {
            showToast('Informe a URL do servidor.', 'error');
            return;
        }

        btnTest.disabled = true;
        testSpinner.style.display = 'inline-block';
        testText.textContent = ' Testando...';

        try {
            const result = await window.api.testServer(url);
            if (result.success) {
                showToast('Conexão estabelecida com sucesso!', 'success');
            } else {
                showToast('Falha na conexão: ' + result.error, 'error');
            }
        } catch (err) {
            showToast('Erro: ' + err.message, 'error');
        } finally {
            btnTest.disabled = false;
            testSpinner.style.display = 'none';
            testText.textContent = '⚡ Testar Conexão';
        }
    });

    // Toggle Admin Password Visibility
    const toggleAdminPassword = document.getElementById('toggle-admin-password');
    if (toggleAdminPassword) {
        toggleAdminPassword.addEventListener('click', () => {
            const type = adminPasswordInput.getAttribute('type') === 'password' ? 'text' : 'password';
            adminPasswordInput.setAttribute('type', type);
            toggleAdminPassword.textContent = type === 'password' ? '👁️' : '🙈';
        });
    }

    // Handle Minimize / Close Window
    btnCancel.addEventListener('click', () => {
        window.api.closeWindow();
    });

    btnLoginCancel.addEventListener('click', () => {
        window.api.closeWindow();
    });

    // Terminal Logs
    const terminalLogs = document.getElementById('terminal-logs');
    const btnCopyLogs = document.getElementById('btn-copy-logs');
    
    if (window.api.onLog) {
        window.api.onLog((log) => {
            if (terminalLogs) {
                // remove the waiting message if present
                const waitingMsg = terminalLogs.querySelector('.log-line');
                if (waitingMsg && waitingMsg.textContent.includes('Aguardando logs')) {
                    terminalLogs.innerHTML = '';
                }

                const div = document.createElement('div');
                div.className = 'log-line';
                div.textContent = log;
                terminalLogs.appendChild(div);
                
                // Auto scroll to bottom
                terminalLogs.scrollTop = terminalLogs.scrollHeight;
                
                // Keep max 100 logs
                while (terminalLogs.children.length > 100) {
                    terminalLogs.removeChild(terminalLogs.firstChild);
                }
            }
        });
    }

    if (btnCopyLogs && terminalLogs) {
        btnCopyLogs.addEventListener('click', () => {
            const logsText = Array.from(terminalLogs.children)
                .map(el => el.textContent)
                .join('\n');
            
            navigator.clipboard.writeText(logsText).then(() => {
                const icon = document.getElementById('copy-icon');
                const originalText = btnCopyLogs.innerHTML;
                btnCopyLogs.innerHTML = '✅ Copiado';
                setTimeout(() => {
                    btnCopyLogs.innerHTML = originalText;
                }, 2000);
            }).catch(err => {
                showToast('Erro ao copiar logs', 'error');
            });
        });
    }
});