Added partial Sign Up Info in excel style
This commit is contained in:
parent
6d5fc6f6f6
commit
a285c0820e
3 changed files with 176 additions and 49 deletions
|
@ -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>,
|
||||
empires: Array<null>, // TODO implement
|
||||
groups: Map<number, ChellarisGameGroup>, // Key is Group Id
|
||||
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;
|
||||
|
@ -41,3 +49,25 @@ 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;
|
||||
}
|
|
@ -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
|
||||
|
|
|
@ -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 = {
|
||||
games: new Map(),
|
||||
ethics: [],
|
||||
portraits: []
|
||||
let chellarisData: ChellarisInfo = createChellarisInfo();
|
||||
let selectedGameIdx: number;
|
||||
let selectedGame: ChellarisGame = createChellarisGame();;
|
||||
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>
|
||||
{groupNoun}
|
||||
{selectedGameGroups.map((selection) => gameGroups.get(selection)?.name).join(groupJoiner)}
|
||||
{selectedGameGroups.length > 1 ? 'are' : 'is'} selected
|
||||
</p>
|
||||
<div class="text-column">
|
||||
<p>Legacy View for</p>
|
||||
<p>Empires: gameData.empires.length</p>
|
||||
<div class="row">
|
||||
<div class="text-column">
|
||||
<p>Ethics</p>
|
||||
</div>
|
||||
<div class="text-column">
|
||||
<p>Total Gestalts: gestaltSums.total</p>
|
||||
<p>Hive Minds: gestaltSums.total - gestaltSums.machines</p>
|
||||
<p>Machines: gestaltSums.machines</p>
|
||||
<br>
|
||||
<p>Machine Ethics</p>
|
||||
</div>
|
||||
<h4>
|
||||
Empires signed up: {pageData.empireCount}
|
||||
</h4>
|
||||
<section class="ethics-columns">
|
||||
<div class="ethics-column">
|
||||
<table>
|
||||
<tr>
|
||||
<th>Ethic</th>
|
||||
<th># Regular</th>
|
||||
<th># Fanatic</th>
|
||||
</tr>
|
||||
<tr>
|
||||
<td />
|
||||
<td />
|
||||
<td />
|
||||
</tr>
|
||||
</table>
|
||||
</div>
|
||||
<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 class="ethics-column">
|
||||
<p>Total Gestalts: {pageData.gestaltCount.total}</p>
|
||||
<p>> Hive Minds: {pageData.gestaltCount.total - pageData.gestaltCount.machines}</p>
|
||||
<p>> Machines: {pageData.gestaltCount.machines}</p>
|
||||
<table>
|
||||
<tr>
|
||||
<th>Machine Ethic</th>
|
||||
<th>#</th>
|
||||
</tr>
|
||||
</table>
|
||||
</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;
|
||||
|
|
Reference in a new issue