From e71e4a4d126700ce4d3c8e08760a48ab37e22bdc Mon Sep 17 00:00:00 2001 From: Lavender Date: Mon, 5 Apr 2021 20:01:14 -0700 Subject: [PATCH] Add option to include shadowed players (also results div is back with its sibling results_shadowed div) --- index.html | 13 ++++++++- main.js | 79 +++++++++++++++++++++++++++++++++++++++++------------- style.css | 4 +++ 3 files changed, 77 insertions(+), 19 deletions(-) diff --git a/index.html b/index.html index 679b894..70dc49e 100644 --- a/index.html +++ b/index.html @@ -6,6 +6,16 @@ +
+ + +
+
+
+
+

Loading...

@@ -20,7 +30,8 @@ diff --git a/main.js b/main.js index d8e97e7..59826c8 100644 --- a/main.js +++ b/main.js @@ -6,26 +6,69 @@ request.open( request.send(); request.onload = function() { - let ending = x => (Math.abs(x) === 1 ? "" : "s") - let teams = JSON.parse(this.response) let totals = teams.map(team => team.lineup.length + team.rotation.length) - // Get all player counts that there are from greatest to least - // & make headers & lists for them - totals.slice().sort((x, y) => x - y) - .filter((item, pos, array) => !pos || item !== array[pos - 1]) - .forEach(function(item) { - document.body.insertAdjacentHTML("afterbegin", - `

${item} player${ending(item)}

- `) - }) - // Put the teams in the lists - teams.forEach(function(item, pos) { - document.getElementById("tlist" + totals[pos]).insertAdjacentHTML("beforeend", - `
  • ${item.fullName} - (${item.lineup.length} hitter${ending(item.lineup.length)}, - ${item.rotation.length} pitcher${ending(item.rotation.length)})
    • `) - }) + + let results = document.getElementById("results") + let results_shadowed = document.getElementById("results_shadowed") + let shadows = document.getElementById("shadows") + + display_teams( + totals, + teams, + results, + team => team.lineup.length, + team => team.rotation.length, + ) + // Results are ready so we can show them now + results.style.display = "block" + + // Now get the shadowed results ready to display + display_teams( + totals.map((total, pos) => + total + teams[pos].bullpen.length + teams[pos].bench.length), + teams, + results_shadowed, + team => team.lineup.length + team.bullpen.length, + team => team.rotation.length + team.bench.length, + ) + + // Set the toggle function for & display the checkbox + shadows.oninput = shadows_on = function() { + results_shadowed.style.display = "block" + results.style.display = "none" + // Toggle off function + shadows.oninput = function() { + results.style.display = "block" + results_shadowed.style.display = "none" + shadows.oninput = shadows_on + } + } + shadows.style.display = "block" document.getElementById("progress").remove() } + +function display_teams(totals, teams, div_container, hitters_fn, pitchers_fn) { + const ENDING = x => (Math.abs(x) === 1 ? "" : "s") + // Make the headers & lists for teams + totals.slice().sort((x, y) => x - y) + .filter((total, pos, array) => !pos || total !== array[pos - 1]) + .forEach(function(total) { + div_container.insertAdjacentHTML("afterbegin", + `

    ${total} player${ENDING(total)}

    + `) + }) + // Put the teams in the lists + teams.forEach(function(team, pos) { + let hitters = hitters_fn(team) + let pitchers = pitchers_fn(team) + document.getElementById(div_container.id + "_tlist" + totals[pos]) + .insertAdjacentHTML( + "beforeend", + `
  • ${team.fullName} + (${hitters} hitter${ENDING(hitters)}, + ${pitchers} pitcher${ENDING(pitchers)})
    • ` + ) + }) +} diff --git a/style.css b/style.css index ab25313..76b92da 100644 --- a/style.css +++ b/style.css @@ -7,3 +7,7 @@ body { li { list-style: decimal-leading-zero; } + +form { + display: none; +}