Press n or j to go to the next uncovered block, b, p or k for the previous block.
| 1 2 3 4 5 6 7 8 9 10 11 12 13 14 15 16 17 18 19 20 21 22 23 24 25 26 27 28 29 30 31 32 33 34 35 36 37 38 39 40 41 42 43 44 45 46 47 48 49 50 51 52 53 54 55 56 57 58 59 60 61 62 63 64 65 66 67 68 69 70 71 72 73 74 75 76 77 78 79 80 81 82 83 84 85 86 87 88 89 90 91 92 93 94 95 96 97 98 99 100 101 102 103 104 105 106 107 108 109 110 111 112 113 114 115 116 117 118 119 120 121 122 123 124 125 126 127 128 129 | 6x 6x 6x 6x 6x 5x 5x 5x 5x 5x 5x 3x 3x 3x 3x 5x 5x 1x 1x 1x 1x 1x 1x 5x 4x 4x 4x 4x 4x 4x 4x 4x 1x 1x 1x 1x 1x 4x 4x 5x 5x 5x 3x 3x 3x 3x 1x 3x 3x 3x 3x 3x 5x 5x 5x 5x 5x 5x 3x 5x 5x 5x 5x 5x 5x 5x 5x 6x | import { Encounter, Hero, ResultEnum, Scenario } from "../@models";
import { createTitle } from "../helper";
export const loadProgression = (
body: HTMLBodyElement,
heroes: Hero[],
scenarios: Scenario[],
encounters: Encounter[],
): void => {
createTitle("Progression", body);
const table = document.createElement("table");
const progressionTargets = new Map<string, number>();
// first row
const firstRow = document.createElement("tr");
firstRow.appendChild(document.createElement("td"));
// load scenarios
scenarios.forEach((scenario) => {
const td = document.createElement("th");
td.innerText = scenario.name;
progressionTargets.set(scenario.name, 0);
firstRow.append(td);
});
table.appendChild(firstRow);
const encountersHeroes = encounters
.filter((encounter) => encounter.result === ResultEnum.WON)
.reduce((acc, e) => {
e.heroes.forEach((hero) => {
if (null !== hero && !acc.has(hero.name)) {
acc.set(hero.name, new Set());
}
acc.get(hero.name).add(e.scenario.name);
});
return acc;
}, new Map());
// console.table(encountersHeroes);
// load heroes
heroes.forEach((hero) => {
const row = document.createElement("tr");
const firstCol = document.createElement("th");
firstCol.innerText = hero.name;
row.appendChild(firstCol);
scenarios.forEach((scenario) => {
const td = document.createElement("td");
const heroEncounter = encountersHeroes.get(hero.name);
if (null != heroEncounter && heroEncounter.has(scenario.name)) {
td.innerText = "✓";
if (progressionTargets.has(scenario.name)) {
const target = progressionTargets.get(scenario.name);
if (null != target) {
progressionTargets.set(scenario.name, target + 1);
}
}
}
row.append(td);
});
table.appendChild(row);
});
// Show Progression
const progressionRow = document.createElement("tr");
progressionRow.appendChild(document.createElement("td"));
scenarios.forEach((scenario) => {
const progressionTh = document.createElement("th");
let progression = 0;
const target = progressionTargets.get(scenario.name);
if (target) {
progression = (target / heroes.length) * 100;
}
const progressionElement = document.createElement("jga-ui-progress");
progressionElement.setAttribute("value", progression.toFixed(0));
progressionElement.setAttribute("max", "100");
// progressionTh.innerText = `${progression} %`;
progressionTh.appendChild(progressionElement);
progressionRow.appendChild(progressionTh);
});
table.appendChild(progressionRow);
// Show global progression
const globalProgressionRow = document.createElement("tr");
const globalProgressionTh = document.createElement("th");
globalProgressionTh.setAttribute("rows", (scenarios.length - 1).toString());
let globalProgression = 0;
scenarios.forEach((scenario) => {
globalProgression += Number(progressionTargets.get(scenario.name));
});
globalProgression = (globalProgression / (scenarios.length * heroes.length)) * 100;
const progressionElement = document.createElement("jga-ui-progress");
progressionElement.setAttribute("value", globalProgression.toFixed(0));
progressionElement.setAttribute("max", "100");
// globalProgressionTh.innerText = `${globalProgression.toFixed(0)} %`;
globalProgressionTh.appendChild(progressionElement);
globalProgressionRow.appendChild(globalProgressionTh);
table.appendChild(globalProgressionRow);
body.appendChild(table);
};
|