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


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


async function initializeForm() {
    let params = new URLSearchParams(location.search);
    let teamID = params.get('team');
    if(teamID) {
        const team = await Data.getTeam(teamID);

        nameTextbox.value = team.name;

        deleteButton.style.visibility = "visible";
        deleteButton.disabled = false;

        Form.populateSports(sportDropdown, team.sportID);

        Form.addHiddenValue('team', teamID, submissionForm);
    }
    else {
        sportDropdown.disabled = false;

        Form.populateSports(sportDropdown);
    }

    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;

    const sportHasContent = sportDropdown.options.length;
    if(!sportHasContent) dataIsValid = false;

    submitButton.disabled = !dataIsValid;
}

Form.addRemoveFunction(deleteButton, submissionForm, "team");