window.onload = () => {
    document.getElementById('username').focus();
}

function showPasswd() {
    let x = document.getElementById("password");
    let y = document.getElementById("sPassword");
    if(x.type == "password"){
        x.type = "text";
        y.type = "text";
    } else {
        x.type = "password";
        y.type = "password";
    }
}

document.getElementById('signupForm').addEventListener('submit',async function (event) {
    event.preventDefault();
    const messageBox = document.getElementById('messageBox');
    const username = document.getElementById('username').value.trim();
    const password = document.getElementById("password").value.trim();
    const sPassword = document.getElementById("sPassword").value.trim();
    const jsonData = JSON.stringify({ username, password });

    if(password !== sPassword){
        messageBox.innerText = "Passwords don't match!"
        return;
    }



    const response = await fetch ('/auth/signup', {
        method: 'POST',
        headers: {
            'Content-Type': 'application/json'
        },
        body: jsonData
    });

    const result = await response.json();
    if(response.ok) {
        messageBox.innerText = result.message;
        messageBox.style.color = 'green';
    } else {
        messageBox.innerText = result.message;
        messageBox.style.color = 'red';
    }
})