Skip to content

Commit 032d49c

Browse files
KjirKjir
committed
Add Awards page
1 parent 5b59dca commit 032d49c

6 files changed

Lines changed: 223 additions & 80 deletions

File tree

‎src/components/AwardTable.vue‎

Lines changed: 60 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,60 @@
1+
<script setup lang="ts">
2+
const { winners } = defineProps<{
3+
winners: { name: string; total: number }[];
4+
title: string;
5+
description: string;
6+
}>();
7+
</script>
8+
<template>
9+
<div class="pico">
10+
<hgroup>
11+
<h4>{{ title }}</h4>
12+
<small :class="$style.tiny">{{ description }}</small>
13+
</hgroup>
14+
<table class="striped">
15+
<thead>
16+
<tr>
17+
<th scope="col"></th>
18+
<th scope="col">Player</th>
19+
<th scope="col">Total</th>
20+
</tr>
21+
</thead>
22+
<tbody>
23+
<tr :class="$style.first">
24+
<th scope="row">1.</th>
25+
<td>
26+
<strong>{{ winners[0]?.name }}</strong>
27+
</td>
28+
<td>{{ winners[0]?.total }}</td>
29+
</tr>
30+
<tr :class="$style.second">
31+
<th scope="row">2.</th>
32+
<td>{{ winners[1]?.name }}</td>
33+
<td>{{ winners[1]?.total }}</td>
34+
</tr>
35+
<tr :class="$style.third">
36+
<th scope="row">3.</th>
37+
<td>{{ winners[2]?.name }}</td>
38+
<td>{{ winners[2]?.total }}</td>
39+
</tr>
40+
</tbody>
41+
</table>
42+
<hr />
43+
</div>
44+
</template>
45+
<style lang="css" module>
46+
.first td {
47+
color: var(--vp-c-yellow-2);
48+
}
49+
50+
.second td {
51+
color: var(--vp-c-indigo-1);
52+
}
53+
.third td {
54+
color: var(--vp-c-red-2);
55+
}
56+
57+
:global(.pico) hgroup > .tiny:not(:first-child):last-child {
58+
font-size: 0.875rem;
59+
}
60+
</style>

‎src/components/AwardsStats.vue‎

Lines changed: 138 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,138 @@
1+
<script setup lang="ts">
2+
import { computed, Ref, ref, watchEffect } from "vue";
3+
import { Unit } from "../types";
4+
import { fetchData } from "../utils";
5+
import AwardTable from "./AwardTable.vue";
6+
7+
const props = defineProps({
8+
code: { type: String, required: true },
9+
presetMapNames: { type: Object, required: true },
10+
});
11+
12+
const units: Ref<Unit[]> = ref([]);
13+
function unitCounts(counts: Unit[], unit_ids: number[]) {
14+
return Object.entries(
15+
counts
16+
.filter((unit) => unit_ids.includes(unit.unit_id))
17+
.reduce(
18+
(playerTotals, unitCount) => {
19+
return {
20+
...playerTotals,
21+
[unitCount.player]:
22+
(playerTotals[unitCount.player] ?? 0) + unitCount.amount,
23+
};
24+
},
25+
{} as Record<string, number>,
26+
),
27+
)
28+
.map(([player, total]) => ({ name: player, total }))
29+
.toSorted((a, b) => b.total - a.total)
30+
.slice(0, 3);
31+
}
32+
33+
const monkCounts = computed(() => {
34+
return unitCounts(units.value, [125, 775, 1023]);
35+
});
36+
37+
const militiaCounts = computed(() => {
38+
return unitCounts(units.value, [74]);
39+
});
40+
41+
const ramsCounts = computed(() => {
42+
return unitCounts(units.value, [35, 422, 548, 1258]);
43+
});
44+
45+
const xolotlCounts = computed(() => {
46+
return unitCounts(units.value, [1570]);
47+
});
48+
49+
const tradeCounts = computed(() => {
50+
return unitCounts(units.value, [17, 128]);
51+
});
52+
53+
const battleElephantCounts = computed(() => {
54+
return unitCounts(units.value, [1132, 1134]);
55+
});
56+
57+
const elephantsCounts = computed(() => {
58+
return unitCounts(
59+
units.value,
60+
[1132, 1134, 239, 558, 873, 875, 1120, 1122, 1744, 1746],
61+
);
62+
});
63+
64+
const phosphoruCounts = computed(() => {
65+
return unitCounts(
66+
units.value,
67+
[
68+
1962, 1980, 1704, 1706, 869, 871, 1001, 1003, 1738, 1739, 1740, 1759,
69+
1760, 1761, 1126, 1127, 1128,
70+
],
71+
);
72+
});
73+
74+
const teutonicCounts = computed(() => {
75+
return unitCounts(units.value, [25, 554]);
76+
});
77+
78+
watchEffect(async () => {
79+
units.value = await fetchData(props.code, "units");
80+
});
81+
</script>
82+
83+
<template>
84+
<div :class="$style.container">
85+
<AwardTable
86+
:winners="monkCounts"
87+
title="Holy Clown"
88+
description="Who created the most monks, missionaries and priests."
89+
/>
90+
<AwardTable
91+
:winners="militiaCounts"
92+
title="Bullyboi"
93+
description="Who is addicted to Militia?"
94+
/>
95+
<AwardTable
96+
:winners="ramsCounts"
97+
title="Choo Choo"
98+
description="Who created the most rams."
99+
/>
100+
<AwardTable
101+
:winners="xolotlCounts"
102+
title="Wololo Guru"
103+
description="Who created the most Xolotl Warriors."
104+
/>
105+
<AwardTable
106+
:winners="tradeCounts"
107+
title="The Trader"
108+
description="Who created the most Trade Carts and Trade Cogs."
109+
/>
110+
<AwardTable
111+
:winners="battleElephantCounts"
112+
title="The legend of Liar"
113+
description="Who created the most Battle Elephants."
114+
/>
115+
<AwardTable
116+
:winners="elephantsCounts"
117+
title="The Chonker"
118+
description="Who created the most Elephants (of any kind!)."
119+
/>
120+
<AwardTable
121+
:winners="phosphoruCounts"
122+
title="Phosphoru Disciple"
123+
description="Who created the most Phosphoru-esque units (War Chariots, Hussite Wagons, Magyar Huszar, Organ Guns, Ratha, Arambai)."
124+
/>
125+
<AwardTable
126+
:winners="teutonicCounts"
127+
title="Grand Master of the Teutonic Order"
128+
description="Who created the most Teutonic Knights."
129+
/>
130+
</div>
131+
</template>
132+
133+
<style lang="css" module>
134+
.container {
135+
display: grid;
136+
grid-template-columns: 1fr 1fr;
137+
}
138+
</style>

‎src/components/Tournament.vue‎

Lines changed: 9 additions & 9 deletions
Original file line numberDiff line numberDiff line change
@@ -2,13 +2,13 @@
22
import { computed } from "vue";
33
import TournamentOverview from "./TournamentOverview.vue";
44
import PlayerStats from "./PlayerStats.vue";
5-
import UnitStats from "./UnitStats.vue";
5+
import AwardsStats from "./AwardsStats.vue";
66
const {
77
page = "overview",
88
code,
99
presetMapNames,
1010
} = defineProps<{
11-
page: "overview" | "players" | "results" | "units";
11+
page: "overview" | "players" | "results" | "awards";
1212
code: string;
1313
presetMapNames: Record<string, string>;
1414
}>();
@@ -18,7 +18,7 @@ const statsPages = {
1818
overview: TournamentOverview,
1919
results: TournamentOverview,
2020
players: PlayerStats,
21-
units: UnitStats,
21+
awards: AwardsStats,
2222
};
2323
</script>
2424

@@ -44,12 +44,12 @@ const statsPages = {
4444
:class="{ secondary: page != 'players' }"
4545
>Players</a
4646
>
47-
<!-- <a -->
48-
<!-- :href="`${baseLink}/units`" -->
49-
<!-- role="button" -->
50-
<!-- :class="{ secondary: page != 'units' }" -->
51-
<!-- >Units</a -->
52-
<!-- > -->
47+
<a
48+
:href="`${baseLink}/awards`"
49+
role="button"
50+
:class="{ secondary: page != 'awards' }"
51+
>Awards</a
52+
>
5353
</div>
5454
</div>
5555
<hr />

‎src/components/UnitStats.vue‎

Lines changed: 0 additions & 71 deletions
This file was deleted.

‎tournaments/[tournament]/awards.md‎

Lines changed: 14 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,14 @@
1+
---
2+
title: "%TOURNAMENT% Unit Stats"
3+
lastUpdated: true
4+
footer: true
5+
layout: home
6+
---
7+
8+
<script setup>
9+
import Tournament from "../../src/components/Tournament.vue";
10+
import { parseJSON, format } from "date-fns";
11+
</script>
12+
13+
<Tournament :code="$params.tournament" :preset-map-names="$params.presetMapChoices" page="awards" />
14+
Last updated: {{ format(parseJSON($params.lastUpdated), "PP HH:mm:ss O") }}

‎tournaments/[tournament]/awards.paths.ts‎

Lines changed: 2 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,2 @@
1+
import tournamentPaths from "./index.paths";
2+
export default tournamentPaths;

0 commit comments

Comments
 (0)