All files / projects-dev/apps/mc/src/lib progression.svelte

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
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
<svelte:options customElement="mc-progression" />

<script lang="ts">
    import type { Encounter, Hero, Scenario } from "$models";
    import type { HeroProgression } from "$lib/interface";

    import { ResultEnum } from "$models";

    import Progress from "$ui/progress/src/progress.svelte";
    import Title from "$lib/title.svelte";

    // eslint-disable-next-line import/no-mutable-exports
    export let heroes: Hero[] = [];
    // eslint-disable-next-line import/no-mutable-exports
    export let encounters: Encounter[] = [];
    // eslint-disable-next-line import/no-mutable-exports
    export let scenarios: Scenario[] = [];

    const progressionTargets: Map<string, number> = new Map<string, number>();
    let globalProgression = 0;

    let heroesLines: HeroProgression[] = [];

    $: {
        // heroes = heroes;
        // encounters = encounters;
        // scenarios = scenarios;

        const encountersHeroes = encounters
            .filter((encounter) => encounter.result === ResultEnum.WON)
            .reduce((accumulator, e) => {
                for (const hero of e.heroes) {
                    if (hero !== null && !accumulator.has(hero.name)) {
                        accumulator.set(hero.name, new Set());
                    }

                    accumulator.get(hero.name).add(e.scenario.name);
                }

                return accumulator;
            }, new Map());

        heroesLines = heroes.map((hero) => {
            const heroEncounters = encountersHeroes.get(hero.name);

            const heroScenarios = new Map<string, boolean>();

            for (const scenario of scenarios) {
                heroScenarios.set(scenario.name, heroEncounters != undefined && heroEncounters.has(scenario.name));
            }

            return {
                name: hero.name,
                scenarios: heroScenarios,
            };
        });

        for (const scenario of scenarios) {
            progressionTargets.set(scenario.name, 0);

            const scenarioProgression = heroesLines
                .map((line) => line.scenarios.get(scenario.name))
                .filter((result) => result === true).length;

            progressionTargets.set(scenario.name, scenarioProgression);
            globalProgression += scenarioProgression;
        }
    }
</script>

<Title title="Progression (at least {scenarios.length * heroes.length - globalProgression} to play)" />

{#if scenarios.length > 0}
    <table>
        <thead>
            <tr>
                <th></th>
                {#each scenarios as scenario}
                    <th>{scenario.name}</th>
                {/each}
            </tr>
        </thead>
        <tbody>
            {#each heroesLines as hero}
                <tr>
                    <th>{hero.name}</th>
                    {#each Array.from(hero.scenarios.values()) as won}
                        <td>
                            {#if won === true}
                                ✓
                            {/if}
                        </td>
                    {/each}
                </tr>
            {/each}
            <!-- Percentage-->
            <tr>
                <th>
                    <Progress value="{globalProgression}" max="{scenarios.length * heroes.length}" />
                </th>
                {#each scenarios as scenario}
                    <th>
                        <Progress value="{progressionTargets.get(scenario.name)}" max="{scenarios.length}" />
                    </th>
                {/each}
            </tr>
        </tbody>
    </table>
{/if}