135 lines
4.8 KiB
JavaScript
135 lines
4.8 KiB
JavaScript
import * as Data from "./data.js";
|
|
import * as Form from "./form.js";
|
|
|
|
const dropdownsDiv = document.getElementById('dropdowns-div');
|
|
const sportDropdown = document.getElementById('sport-dropdown');
|
|
const seasonDropdown = document.getElementById('year-dropdown');
|
|
const genderDropdown = document.getElementById('gender-dropdown');
|
|
const divisionDropdown = document.getElementById('division-dropdown');
|
|
const teamDropdown = document.getElementById('team-dropdown');
|
|
const gamesTable = document.getElementById('games-table');
|
|
const gamesTableHeader = document.getElementById('games-table-header');
|
|
const noScoresMessage = document.getElementById('no-scores-message');
|
|
const addScoreButton = document.getElementById('add-score-button');
|
|
const manageButton = document.getElementById('manage-button');
|
|
const loadingSpan = document.getElementById('loading');
|
|
|
|
|
|
|
|
|
|
|
|
async function initializeForm() {
|
|
const data = await (await fetch(`/fetch/index/dropdown`)).json();
|
|
|
|
await Form.populateSeasons(seasonDropdown, null, data);
|
|
await Form.populateSports(sportDropdown, null, data);
|
|
await Form.populateGenders(genderDropdown, null, null, data);
|
|
await Form.populateDivisions(divisionDropdown, null, null, null, data);
|
|
await Form.populateTeams(teamDropdown, null, null, data);
|
|
|
|
seasonDropdown.onchange = loadTable;
|
|
|
|
sportDropdown.onchange = async () => {
|
|
await Form.populateGenders(genderDropdown, sportDropdown.value)
|
|
await Form.populateDivisions(divisionDropdown, sportDropdown.value, genderDropdown.value);
|
|
await Form.populateTeams(teamDropdown, sportDropdown.value);
|
|
loadTable();
|
|
};
|
|
|
|
genderDropdown.onchange = async () => {
|
|
await Form.populateDivisions(divisionDropdown, sportDropdown.value, genderDropdown.value);
|
|
loadTable();
|
|
};
|
|
|
|
divisionDropdown.onchange = loadTable;
|
|
teamDropdown.onchange = loadTable;
|
|
|
|
loadingSpan.textContent = '';
|
|
dropdownsDiv.style.visibility = 'visible';
|
|
|
|
loadTable();
|
|
|
|
|
|
}
|
|
initializeForm();
|
|
|
|
async function loadTable() {
|
|
gamesTable.innerHTML = "";
|
|
gamesTableHeader.textContent = "";
|
|
noScoresMessage.textContent = "";
|
|
|
|
const selectedTeamID = teamDropdown.value;
|
|
const selectedDivisionID = divisionDropdown.value;
|
|
const selectedSeasonID = seasonDropdown.value;
|
|
|
|
if(selectedTeamID && selectedDivisionID) {
|
|
gamesTableHeader.textContent = `Scores for ${teamDropdown.options[teamDropdown.selectedIndex].text}`;
|
|
|
|
noScoresMessage.textContent = "Loading scores...";
|
|
const requestURL = `/fetch/index/scores?team=${+selectedTeamID}&division=${+selectedDivisionID}&season=${+selectedSeasonID}`;
|
|
const gamesList = await (await fetch(requestURL)).json();
|
|
noScoresMessage.textContent = "";
|
|
if(gamesList.length > 0) {
|
|
await setupGamesTableHeaders();
|
|
|
|
gamesList.forEach((game) => {
|
|
const row = document.createElement('tr');
|
|
|
|
const scoreCell = document.createElement('td');
|
|
const winLossLine = document.createElement('span');
|
|
winLossLine.textContent = (game.team1Score > game.team2Score) ? "Win" : (game.team1Score < game.team2Score) ? "Loss" : "Tie";
|
|
scoreCell.appendChild(winLossLine);
|
|
const scoreLine = document.createElement('span');
|
|
scoreLine.textContent = game.team1Score + "-" + game.team2Score;
|
|
scoreCell.appendChild(scoreLine);
|
|
row.appendChild(scoreCell);
|
|
|
|
const opponentCell = document.createElement('td');
|
|
opponentCell.textContent = game.opponent.name;
|
|
row.appendChild(opponentCell);
|
|
|
|
const dateCell = document.createElement('td');
|
|
dateCell.textContent = game.date;
|
|
dateCell.style['white-space'] = 'nowrap';
|
|
row.appendChild(dateCell);
|
|
|
|
gamesTable.appendChild(row);
|
|
});
|
|
}
|
|
else {
|
|
noScoresMessage.textContent = "No scores available";
|
|
}
|
|
}
|
|
}
|
|
|
|
async function setupGamesTableHeaders() {
|
|
const row = document.createElement('tr');
|
|
|
|
const scoresHeader = document.createElement('th');
|
|
scoresHeader.textContent = "Score"
|
|
row.appendChild(scoresHeader);
|
|
|
|
const opponentHeader = document.createElement('th');
|
|
opponentHeader.textContent = "Opponent";
|
|
row.appendChild(opponentHeader);
|
|
|
|
const dateHeader = document.createElement('th');
|
|
dateHeader.textContent = "Date";
|
|
row.appendChild(dateHeader);
|
|
|
|
gamesTable.appendChild(row);
|
|
}
|
|
|
|
|
|
|
|
if(addScoreButton) {
|
|
addScoreButton.addEventListener('click', () => {
|
|
window.location.href = '/manage/game';
|
|
});
|
|
}
|
|
|
|
if(manageButton) {
|
|
manageButton.addEventListener('click', () => {
|
|
window.location.href = '/manage'
|
|
});
|
|
} |