import '../common'

import { BASE_URL, User } from '../common'

//
// Page Element
//

const elErrorString = document.querySelector('#error-string')

const elLoginUsernameInput = document.querySelector('#input-login-username')
const elLoginPasswordInput = document.querySelector('#input-login-password')

const elLoginButton = document.querySelector('#button-login')

//
// Display error message
//

let errorTimeoutHandle = null
function displayFormErrorMessage(e) {
    if (errorTimeoutHandle) clearTimeout(errorTimeoutHandle)
    elErrorString.classList.toggle('hidden', false)
    elErrorString.innerText = e.toString()
    errorTimeoutHandle = setTimeout(() => {
        elErrorString.classList.toggle('hidden', true)
        elErrorString.innerText = ''
    }, 5 * 1000)
}

//
// Handle Login Button
//

async function onLoginButtonClick() {
    const res = await User.login(elLoginUsernameInput.value, elLoginPasswordInput.value)
    if (res.error) {
        displayFormErrorMessage(res.error)
    }
}

//
// Main
//

async function main() {
    const user = await User.getLogged()
    if (user) {
        location.href = `${BASE_URL}/`
    }

    elLoginButton.addEventListener('click', () => {
        onLoginButtonClick()
    })

    elLoginPasswordInput.addEventListener('keydown', e => {
        if (e.key === 'Enter') onLoginButtonClick()
    })

    elLoginUsernameInput.focus()
}

main()