Added partial Sign Up Info in excel style

src/lib/types/chellaris.ts

@@ -1,19 +1,27 @@
 export interface ChellarisInfo {
-  games: Map<number, ChellarisGame>,
+  games: Map<number, ChellarisGame>, // Key is Game Id
   ethics: Array<null>, // TODO implement
   portraits: Array<null>, // TODO implement
 }
 
 export type ChellarisGame = {
   name: string,
-  groups: Map<number, ChellarisGameGroup>,
+  groups: Map<number, ChellarisGameGroup>, // Key is Group Id
-  empires: Array<null>, // TODO implement
+  empires: Map<number, ChellarisEmpire>, // Key is Empire Id
 }
 
 export type ChellarisGameGroup = {
   name: string,
 }
 
+export type ChellarisEmpire = {
+  gestalt: boolean,
+  group: number,
+  empire_portrait: number, // TODO replace with Enum?
+  empire_portrait_group: number, // TODO replace with Enum?
+  discord_user?: string,
+}
+
 export const createChellarisInfo = (): ChellarisInfo => {
   const newChellarisInfo = {
     games: new Map(),
@@ -28,7 +36,7 @@ export const createChellarisGame = (): ChellarisGame => {
   const newChellarisGame = {
     name: "",
     groups: new Map(),
-    empires: [],
+    empires: new Map(),
   };
 
   return newChellarisGame;
@@ -40,4 +48,26 @@ export const createChellarisGameGroup = (): ChellarisGameGroup => {
   };
 
   return newChellarisGameGroup;
+}
+
+export const createChellarisEmpire = (
+  { 
+    id, discord_user, group_id, gestalt, empire_portrait_id, empire_portrait_group_id, group_game_id
+  }: {
+    id: number, 
+    discord_user?: string, 
+    group_id: number,
+    gestalt: boolean,
+    empire_portrait_id: number, 
+    empire_portrait_group_id: number, 
+    group_game_id: number
+  }): ChellarisEmpire => {
+  const newChellarisEmpire = {
+    gestalt: gestalt,
+    group: group_id,
+    empire_portrait: empire_portrait_id,
+    empire_portrait_group: empire_portrait_group_id,
+  };
+
+  return newChellarisEmpire;
 }

src/routes/graphs/+layout.ts

@@ -1,7 +1,7 @@
 import type { PageLoad } from "../$types";
 import ChellarisDataStore from '$lib/stores/ChellarisData';
 import SelectedGameStore from '$lib/stores/GameFilter';
-import { type ChellarisInfo, type ChellarisGame, type ChellarisGameGroup, createChellarisInfo, createChellarisGameGroup, createChellarisGame } from '../../lib/types/chellaris';
+import { type ChellarisInfo, type ChellarisGame, type ChellarisGameGroup, createChellarisInfo, createChellarisGameGroup, createChellarisGame, createChellarisEmpire } from '../../lib/types/chellaris';
 import SelectedGameGroupsStore from "$lib/stores/GameGroupFilter";
 import GraphsTabStore from '$lib/stores/GraphsTab';
 
@@ -34,6 +34,26 @@ export const load: PageLoad = async () => {
     }
   })
 
+  const empires: {
+    id: number, 
+    discord_user?: string, 
+    group_id: number,
+    gestalt: boolean,
+    empire_portrait_id: number, 
+    empire_portrait_group_id: number, 
+    group_game_id: number}[] = await (await fetch(apiBaseUrl + '/empires')).json();
+
+  empires.sort((a, b) => (a.id < b.id ? -1 : 1));
+  empires.forEach(empire => {
+    const gameData = chellarisData.games.get(empire.group_game_id);
+
+    if (typeof gameData !== "undefined") {
+      const newEmpire = createChellarisEmpire(empire);
+      gameData.empires.set(empire.id, newEmpire);
+    }
+  });
+
+  console.log(chellarisData); //DEBUG
   ChellarisDataStore.set(chellarisData);
 
   // Local Storage Code
@@ -57,11 +77,12 @@ export const load: PageLoad = async () => {
     store = localStorage.getItem('gameGroupSelection');
 
     if (typeof store == 'string') {
+      let selectedGameGroups: Array<number> = [];
       const gameGroupSelectionMap = new Map<number, Array<number>>(JSON.parse(store));
       const tmp = gameGroupSelectionMap.get(selectedGame);
-      let selectedGameGroups: Array<number> = [];
+      
       if (typeof tmp !== 'undefined') {
-        selectedGameGroups = [...tmp.values()];
+        selectedGameGroups = tmp;
       } else {
         const tmpGameData = chellarisData.games.get(selectedGame);
         // If this fails an empty array is precisely what we want

src/routes/graphs/excel-style/+page.svelte

@@ -1,19 +1,30 @@
 <script lang="ts">
 	import SelectedGameGroupsStore from '$lib/stores/GameGroupFilter';
 	import SelectedGameStore from '$lib/stores/GameFilter';
-	import type { ChellarisGameGroup, ChellarisInfo } from '$lib/types/chellaris';
+	import {
+		createChellarisInfo,
+		type ChellarisGameGroup,
+		type ChellarisInfo,
+		type ChellarisGame,
+		createChellarisGame,
+		type ChellarisEmpire
+	} from '$lib/types/chellaris';
 	import ChellarisDataStore from '$lib/stores/ChellarisData';
 	import GraphsTabStore from '$lib/stores/GraphsTab';
 
 	let selectedGameGroups: Array<number> = [];
 	let selectedGameGroupsMap: Map<number, Array<number>> = new Map();
 	let gameGroups: Map<number, ChellarisGameGroup> = new Map();
-	let chellarisData: ChellarisInfo = {
+	let chellarisData: ChellarisInfo = createChellarisInfo();
-		games: new Map(),
+	let selectedGameIdx: number;
-		ethics: [],
+	let selectedGame: ChellarisGame = createChellarisGame();;
-		portraits: []
+	let pageData: {
+		empireCount: number;
+		gestaltCount: { total: number; machines: number };
+	} = {
+		empireCount: 0,
+		gestaltCount: { total: 0, machines: 0 }
 	};
-	let selectedGame: number;
 
 	// Save Tab to Store
 	GraphsTabStore.update(() => 'excel-style');
@@ -23,7 +34,7 @@
 		if (!selectedGame) {
 			tmpData = chellarisData.games.get(chellarisData.games.keys().next().value);
 		} else {
-			tmpData = chellarisData.games.get(selectedGame);
+			tmpData = chellarisData.games.get(selectedGameIdx);
 		}
 
 		if (typeof tmpData !== 'undefined') {
@@ -31,6 +42,30 @@
 		}
 	};
 
+	const updatePageData = () => {
+		let tmpGameData = chellarisData.games.get(selectedGameIdx);
+
+		if (typeof tmpGameData !== 'undefined') {
+			let groupEmpires: Map<number, ChellarisEmpire> = new Map();
+			pageData.gestaltCount = { total: 0, machines: 0 };
+
+			tmpGameData.empires.forEach((empire, index) => {
+				if (selectedGameGroups.includes(empire.group)) {
+					groupEmpires.set(index, empire);
+
+					if (empire.gestalt) {
+						pageData.gestaltCount.total = pageData.gestaltCount.total + 1;
+						if (empire.empire_portrait_group == 13) {
+							// TODO replace static number with generated one in case Machine Portrait ID changes
+							pageData.gestaltCount.machines = pageData.gestaltCount.machines + 1;
+						}
+					}
+				}
+			});
+			pageData.empireCount = groupEmpires.size;
+		}
+	};
+
 	ChellarisDataStore.subscribe((data) => {
 		chellarisData = data;
 
@@ -39,24 +74,31 @@
 	});
 
 	SelectedGameStore.subscribe((selection) => {
-		selectedGame = selection;
+		selectedGameIdx = selection;
-
+		const tmpGameData = chellarisData.games.get(selectedGameIdx);
+		if (typeof tmpGameData !== "undefined") {
+			selectedGame = tmpGameData;
+		}
+		
 		updateGameGroups();
 
 		if (selectedGameGroupsMap.size != 0) {
-			const tmp = selectedGameGroupsMap.get(selectedGame);
+			const tmp = selectedGameGroupsMap.get(selectedGameIdx);
 			if (typeof tmp !== 'undefined') {
 				selectedGameGroups = [...tmp.values()];
 			}
 		}
+
+		updatePageData();
 	});
 
 	SelectedGameGroupsStore.subscribe((selection) => {
 		selectedGameGroupsMap = selection;
-		const tmp = selection.get(selectedGame);
+		const tmp = selection.get(selectedGameIdx);
 		if (typeof tmp !== 'undefined') {
 			selectedGameGroups = [...tmp.values()];
 		}
+		updatePageData();
 	});
 
 	const groupNoun = selectedGameGroups.length > 1 ? 'Groups' : 'Group';
@@ -69,47 +111,81 @@
 </svelte:head>
 
 <h1>
-	Sign-Up Info for {groupNoun}
+	{selectedGame.name} Sign-Up Info for {groupNoun}
 	{selectedGameGroups.map((selection) => gameGroups.get(selection)?.name).join(groupJoiner)}
 </h1>
 
 <div class="text-column">
-	<p>
+	<h4>
-		{groupNoun}
+		Empires signed up: {pageData.empireCount}
-		{selectedGameGroups.map((selection) => gameGroups.get(selection)?.name).join(groupJoiner)}
+	</h4>
-		{selectedGameGroups.length > 1 ? 'are' : 'is'} selected
+	<section class="ethics-columns">
-	</p>
+		<div class="ethics-column">
-	<div class="text-column">
+			<table>
-		<p>Legacy View for</p>
+				<tr>
-		<p>Empires: gameData.empires.length</p>
+					<th>Ethic</th>
-		<div class="row">
+					<th># Regular</th>
-			<div class="text-column">
+					<th># Fanatic</th>
-				<p>Ethics</p>
+				</tr>
-			</div>
+				<tr>
-			<div class="text-column">
+					<td />
-				<p>Total Gestalts: gestaltSums.total</p>
+					<td />
-				<p>Hive Minds: gestaltSums.total - gestaltSums.machines</p>
+					<td />
-				<p>Machines: gestaltSums.machines</p>
+				</tr>
-				<br>
+			</table>
-				<p>Machine Ethics</p>
-			</div>
 		</div>
-		<div class="text-column">
+		<div class="ethics-column">
-			<div class="row">
+			<p>Total Gestalts: {pageData.gestaltCount.total}</p>
-				<p>Portrait 1</p>
+			<p>> Hive Minds: {pageData.gestaltCount.total - pageData.gestaltCount.machines}</p>
-				<p>Portrait 2</p>
+			<p>> Machines: {pageData.gestaltCount.machines}</p>
-				<p>Portrait 3</p>
+			<table>
-			</div>
+				<tr>
-			<div class="row">
+					<th>Machine Ethic</th>
-				<p>Portrait 1</p>
+					<th>#</th>
-				<p>Portrait 2</p>
+				</tr>
-				<p>Portrait 3</p>
+			</table>
-			</div>
+		</div>
+	</section>
+	<div class="text-column">
+		<div class="row">
+			<p>Portrait 1</p>
+			<p>Portrait 2</p>
+			<p>Portrait 3</p>
+		</div>
+		<div class="row">
+			<p>Portrait 1</p>
+			<p>Portrait 2</p>
+			<p>Portrait 3</p>
 		</div>
 	</div>
 </div>
 
 <style>
+	table {
+		border: 1px solid var(--color-text);
+	}
+
+	th,
+	td {
+		padding: 0.3rem 0.5rem;
+		border: 1px solid var(--color-text);
+	}
+
+	h4 {
+		text-align: center;
+	}
+	.ethics-columns {
+		width: 100%;
+		display: flex;
+		flex-direction: row;
+		justify-content: start;
+		justify-content: space-between;
+		gap: 2rem;
+	}
+
+	.ethics-column {
+		min-width: fit-content;
+	}
 	.row {
 		display: flex;
 		flex-direction: row;