seasonLength = 22
function magicNumber(teamA, teamB) {
// return nothing if both arguments are the same team
if (teamA == teamB) {
return "";
}
// calculate possible points remaining and magic number
let pointsRemainingA =
(seasonLength - teamA.wins - teamA.losses - teamA.draws) * 3;
let pointsRemainingB =
(seasonLength - teamB.wins - teamB.losses - teamB.draws) * 3;
let num = teamB.points - teamA.points + pointsRemainingB + 1;
// if number is unachievable, replace with a hyphen
if (num > pointsRemainingA + pointsRemainingB) {
return "-";
}
if (num <= 0) {
return "-";
}
// otherwise, return the number
return num;
}
async function getSeasonsData(urlSeasons) {
try {
const seasonsResponse = await axios.get(urlSeasons);
const seasonsData = await Promise.all(
seasonsResponse.data.items.map(async (season) => {
const seasonData = await axios.get(season.$ref.replace("http://", "https://"));
return seasonData.data;
})
);
return seasonsData;
} catch (error) {
console.error("Error fetching seasons data:", error);
throw error; // Rethrow to allow error handling by the caller
}
}
seasons = await getSeasonsData(urlSeasons)
async function getTeamsData(url, selectedSeason) {
const urlTeams = `${url}${selectedSeason}/teams/`;
try {
const teamsResponse = await axios.get(urlTeams);
const teamsData = await Promise.all(
teamsResponse.data.items.map(async (team) => {
const teamData = await axios.get(
team.$ref.replace("http://", "https://")
);
return teamData.data;
})
);
return teamsData;
} catch (error) {
console.error("Error fetching teams data:", error);
throw error;
}
}
teams = await getTeamsData(urlTeams, selectedSeason)
teamTable = htl.html`
<table>
<tbody>
${teams.map(
(row, i) =>
html`<tr><td><img src='${
row.logos[0].href
}' height=50></td><td style='vertical-align:middle'><a href='${
row.links.find((e) => e.text === "Stats").href
}' target='_blank'>${row.displayName}</a></td></tr>`
)}
</tbody>
</table>`
async function getTeamStatistics(teams) {
try {
const teamsWithStats = await Promise.all(
teams.map(async (team) => {
const statsResponse = await axios.get(
team.statistics.$ref.replace("http://", "https://")
);
const generalStats = statsResponse.data.splits.categories.find(
(cat) => cat.name === "general"
).stats;
team.stats = generalStats;
team.wins = generalStats.find((stat) => stat.name === "wins").value;
team.losses = generalStats.find((stat) => stat.name === "losses").value;
team.draws = generalStats.find((stat) => stat.name === "draws").value;
team.points =
3 * generalStats.find((stat) => stat.name === "wins").value +
generalStats.find((stat) => stat.name === "draws").value;
team.recordString = team.wins + "-" + team.draws + "-" + team.losses;
return team;
})
);
return teamsWithStats.sort((a, b) => b.points - a.points);
} catch (error) {
console.error("Error fetching team statistics:", error);
throw error;
}
}
teamData = await getTeamStatistics(teams)
htmlTable = htl.html`
<table>
<tbody>
<tr>
<th></th><th>Team Name</th><th>Record (W-D-L)</th><th>Points</th>
</tr>
${teamData.map((row, i) => {
return html`<tr><td><img src='${row.logos[0].href}' height=50></td>
<td style='vertical-align:middle'><a href='${row.links[1].href}' target='_blank'>${row.displayName}</a></td>
<td style='vertical-align:middle'>${row.recordString}</td>
<td style='vertical-align:middle'>${row.points}</td>
</tr>`;
})}
</tbody>
</table>`
teamDataFlat = teamData.map((d) => {
let dflat = new Object(d);
dflat.nameLink = d.name.link(d.links[1].href);
return dflat;
})
One platform to build and deploy the best data apps
Experiment and prototype by building visualizations in live JavaScript notebooks. Collaborate with your team and decide which concepts to build out.
Use Observable Framework to build data apps locally. Use data loaders to build in any language or library, including Python, SQL, and R.
Seamlessly deploy to Observable. Test before you ship, use automatic deploy-on-commit, and ensure your projects are always up-to-date.