import * as Data from "../data.js";


const nameTextbox = document.getElementById('name-textbox');
const submitButton = document.getElementById('submit-button');
const deleteButton = document.getElementById('delete-button');
const submissionForm = document.getElementById('submission-form');
const loadingSpan = document.getElementById('loading-message');


async function initializeForm() {
    let params = new URLSearchParams(location.search);
    let sportID = params.get('sport')
    if(sportID) {
        const sportName = await Data.getSportName(sportID);

        nameTextbox.value = sportName;
        deleteButton.style.visibility = "visible";
        deleteButton.disabled = false;

        const sportIDInput = document.createElement('input');
        sportIDInput.setAttribute('name', 'sport');
        sportIDInput.setAttribute('value', sportID);
        sportIDInput.setAttribute('type', 'hidden');
        submissionForm.appendChild(sportIDInput);
    }
    nameTextbox.disabled = false;

    nameTextbox.addEventListener('keyup', checkDataValidity);

    loadingSpan.textContent = '';
    submissionForm.style.visibility = 'visible';
}
initializeForm();

async function checkDataValidity() {
    let dataIsValid = true;

    if(!nameTextbox.value) dataIsValid = false;


    if(dataIsValid) submitButton.disabled = false;
    else submitButton.disabled = true;
}

async function removeSport() {
    const removeInput = document.createElement('input');
    removeInput.setAttribute('name', 'remove');
    removeInput.setAttribute('value', 1);
    removeInput.setAttribute('type', 'hidden');
    submissionForm.appendChild(removeInput);
    submissionForm.submit();
}

deleteButton.addEventListener('click', () => {
    const verified = confirm("This sport will be removed.");

    if(verified) removeSport();
});