Start of data filling
This commit is contained in:
parent
e637dc1889
commit
a78057de8c
9 changed files with 184 additions and 87 deletions
|
@ -90,3 +90,8 @@ main {
|
|||
display: flex;
|
||||
flex-direction: row;
|
||||
}
|
||||
|
||||
.col {
|
||||
display: flex;
|
||||
flex-direction: column;
|
||||
}
|
||||
|
|
|
@ -1,6 +1,6 @@
|
|||
import '@/app/globals.css';
|
||||
import { Game, GameGroup } from '@/types/stellaris';
|
||||
import { GameView } from '@/components/gui/game-view';
|
||||
import { GameView } from '@/components/gui/client/game-view';
|
||||
import { generateUrl } from '@/components/server/fetchers';
|
||||
|
||||
export default async function Home() {
|
||||
|
|
137
components/gui/client/game-info-tabs.tsx
Normal file
137
components/gui/client/game-info-tabs.tsx
Normal file
|
@ -0,0 +1,137 @@
|
|||
'use client';
|
||||
import { Ethic, Game, GameData, GameGroup } from "@/types/stellaris";
|
||||
import { Dispatch, Key, SetStateAction, Suspense, useEffect, useState } from 'react';
|
||||
import { Empire } from '../../../types/stellaris';
|
||||
import { generateUrl } from "@/components/server/fetchers";
|
||||
|
||||
type SelectionType = "all" | Set<Key>;
|
||||
|
||||
export const GameInfoTabs = (
|
||||
props: {
|
||||
game: Game,
|
||||
groups: GameGroup[]
|
||||
}) => {
|
||||
|
||||
const [currentTab, setCurrentTab] = useState(1);
|
||||
|
||||
// won't work with a class, needs to be a type
|
||||
const [gameData, setGameData] = useState({info: props.game, groups: props.groups, empires: new Array<Empire>});
|
||||
|
||||
useEffect(() => {
|
||||
const getEmpires = async () => {
|
||||
const tmpEmpires = await fetch(
|
||||
generateUrl('/empires', [
|
||||
//{ key: "group_id", val: this.gr }, // TODO: wait for firq to implement multi calls, for now return all empires in game and manual parse
|
||||
{ key: "group_game_id", val: gameData.info.id },]
|
||||
)).then((res) => res.json());
|
||||
|
||||
let empires: Empire[] = []
|
||||
|
||||
tmpEmpires.forEach((empire: Empire) => {
|
||||
if (gameData.groups.map(group => group.id).includes(empire.group_id)) {
|
||||
empires.push(empire)
|
||||
}
|
||||
});
|
||||
return empires;
|
||||
}
|
||||
|
||||
const fetchData = async () => {
|
||||
let tmpData = gameData
|
||||
tmpData.groups = props.groups;
|
||||
tmpData.empires = await getEmpires();
|
||||
setGameData((prevGameData) => ({
|
||||
...prevGameData,
|
||||
groups: tmpData.groups,
|
||||
empires: tmpData.empires
|
||||
}));
|
||||
}
|
||||
|
||||
if (gameData.groups != props.groups) {
|
||||
fetchData()
|
||||
}
|
||||
}, [gameData, props.groups])
|
||||
|
||||
let currentTabView;
|
||||
switch (currentTab) {
|
||||
case (1):
|
||||
case (2): {
|
||||
currentTabView = <p>{currentTab}</p>
|
||||
break;
|
||||
}
|
||||
case (3): {
|
||||
const gestaltSums = getGestaltCount(gameData.empires, 13);
|
||||
currentTabView =
|
||||
<div className="col">
|
||||
<p>Legacy View for {props.groups.length > 1 ? "Groups" : "Group"} {props.groups.map(elem => elem.name).join(", ")}</p>
|
||||
<p>Empires: {gameData.empires.length}</p>
|
||||
<div className="row">
|
||||
<p>Ethics</p>
|
||||
<div className="col">
|
||||
<p>Total Gestalts: {gestaltSums.total}</p>
|
||||
Hive Minds: {gestaltSums.total - gestaltSums.machines}
|
||||
<br></br>
|
||||
Machines: {gestaltSums.machines}
|
||||
<br></br>
|
||||
<p>Machine Ethics</p>
|
||||
</div>
|
||||
</div>
|
||||
<div className="col">
|
||||
<div className="row">
|
||||
<p>Portrait 1</p>
|
||||
<p>Portrait 2</p>
|
||||
<p>Portrait 3</p>
|
||||
</div>
|
||||
<div className="row">
|
||||
<p>Portrait 1</p>
|
||||
<p>Portrait 2</p>
|
||||
<p>Portrait 3</p>
|
||||
</div>
|
||||
</div>
|
||||
</div>;
|
||||
break;
|
||||
}
|
||||
default:
|
||||
currentTabView = <p>Oops, something went wrong</p>
|
||||
}
|
||||
|
||||
return (
|
||||
<>
|
||||
<div className="row">
|
||||
<button key={1} onClick={() => setCurrentTab(_currentTab => 1)}>
|
||||
Tab 1
|
||||
</button>
|
||||
<button key={2} onClick={() => setCurrentTab(_currentTab => 2)}>
|
||||
Tab 2
|
||||
</button>
|
||||
<button key={3} onClick={() => setCurrentTab(_currentTab => 3)}>
|
||||
Legacy Visuals
|
||||
</button>
|
||||
</div>
|
||||
{currentTabView}
|
||||
</>
|
||||
)
|
||||
}
|
||||
|
||||
function getEthicSum(ethic: Ethic, empires: Empire[]) {
|
||||
let sum = 0;
|
||||
empires.forEach(empire => { empire.ethic_ids.includes(ethic.id) ? sum = sum + 1 : sum });
|
||||
return sum;
|
||||
}
|
||||
|
||||
function getGestaltCount(empires: Empire[], machineId: number) {
|
||||
let sum = 0;
|
||||
let sumMachines = 0;
|
||||
|
||||
empires.forEach(empire => {
|
||||
if(empire.gestalt) {
|
||||
if(empire.empire_portrait_group_id == machineId) {
|
||||
sumMachines = sumMachines + 1;
|
||||
sum = sum + 1;
|
||||
}
|
||||
else {
|
||||
sum = sum + 1
|
||||
}
|
||||
|
||||
}});
|
||||
return {total: sum, machines: sumMachines}
|
||||
}
|
|
@ -1,8 +1,8 @@
|
|||
'use client';
|
||||
import { Game } from "@/types/stellaris";
|
||||
import { GameSelect } from "./game-select";
|
||||
import { GameSelect } from "../server/game-select";
|
||||
import { useState } from 'react';
|
||||
import { GameGroupSelect } from "./game-group-select";
|
||||
import { GameGroupSelect } from "../server/game-group-select";
|
||||
import { SSRProvider } from "react-bootstrap";
|
||||
import { GameInfoTabs } from "./game-info-tabs";
|
||||
|
|
@ -1,17 +0,0 @@
|
|||
import { fetchGameGroups } from "@/components/server/fetchers";
|
||||
import { Game, GameGroup } from "@/types/stellaris";
|
||||
import { Dispatch, SetStateAction } from "react";
|
||||
|
||||
export const GameInfoHandler = async (
|
||||
props: {
|
||||
game: Game,
|
||||
groups: GameGroup[]
|
||||
}) => {
|
||||
if (props) {
|
||||
const currentGame = props.game;
|
||||
const currentGroups = props.groups;
|
||||
|
||||
}
|
||||
|
||||
return <></>
|
||||
}
|
|
@ -1,65 +0,0 @@
|
|||
'use client';
|
||||
import { Game, GameGroup } from "@/types/stellaris";
|
||||
import { Dropdown } from "@nextui-org/react";
|
||||
import { Dispatch, Key, SetStateAction, Suspense, useState } from 'react';
|
||||
import { fetchGameGroups } from "@/components/server/fetchers";
|
||||
import { GameInfoHandler } from "./data-handlers/game-info-handler";
|
||||
|
||||
type SelectionType = "all" | Set<Key>;
|
||||
|
||||
export const GameInfoTabs = (
|
||||
props: {
|
||||
game: Game,
|
||||
groups: GameGroup[]
|
||||
}) => {
|
||||
|
||||
const [currentTab, setCurrentTab] = useState(1);
|
||||
|
||||
let currentTabView;
|
||||
switch(currentTab) {
|
||||
case(1):
|
||||
case(2): {
|
||||
currentTabView = <p>{currentTab}</p>
|
||||
break;
|
||||
}
|
||||
case(3): {
|
||||
currentTabView = <GameInfoLegacyView game={props.game} groups={props.groups}/>
|
||||
break;
|
||||
}
|
||||
default:
|
||||
currentTabView = <p>Oops, something went wrong</p>
|
||||
}
|
||||
|
||||
return (
|
||||
<>
|
||||
<Suspense>
|
||||
<GameInfoHandler game={props.game} groups={props.groups} />
|
||||
</Suspense>
|
||||
<div className="row">
|
||||
<button key={1} onClick={() => setCurrentTab(_currentTab => 1)}>
|
||||
Tab 1
|
||||
</button>
|
||||
<button key={2} onClick={() => setCurrentTab(_currentTab => 2)}>
|
||||
Tab 2
|
||||
</button>
|
||||
<button key={3} onClick={() => setCurrentTab(_currentTab => 3)}>
|
||||
Legacy Visuals
|
||||
</button>
|
||||
</div>
|
||||
{currentTabView}
|
||||
</>
|
||||
)
|
||||
}
|
||||
|
||||
const GameInfoLegacyView = (
|
||||
props: {
|
||||
game: Game,
|
||||
groups: GameGroup[]
|
||||
}
|
||||
) => {
|
||||
return (
|
||||
<div>
|
||||
<p>Legacy View for {props.groups.length > 1 ? "Groups" : "Group"} {props.groups.map(elem => elem.name).join(", ")}</p>
|
||||
</div>
|
||||
)
|
||||
}
|
|
@ -1,3 +1,4 @@
|
|||
import { generateUrl } from '../components/server/fetchers';
|
||||
// Ethics Data should be stored differently after Game 15, class will stil be needed for compat reasons afterwards
|
||||
export class EthicsDataG15 {
|
||||
// Array index determines fanatic or regular, Index value represents number of occurences
|
||||
|
@ -75,3 +76,39 @@ export type GameGroup = {
|
|||
game_id: number,
|
||||
name: string
|
||||
}
|
||||
|
||||
export class Empire {
|
||||
id: number = 0;
|
||||
group_id: number = 0;
|
||||
group_game_id: number = 0;
|
||||
private discord_user: string | undefined;
|
||||
private empire_name: string | undefined;
|
||||
gestalt: boolean = false;
|
||||
empire_portrait_group_id: number = 0;
|
||||
empire_portrait_id: number = 0;
|
||||
ethic_ids: number[] = [];
|
||||
|
||||
async getEthics() {
|
||||
let tmpEthics = await fetch(
|
||||
generateUrl('/empire_ethics', [
|
||||
{ key: "empires_id", val: this.id },
|
||||
{ key: "empires_group_id", val: this.group_id },
|
||||
{ key: "empires_group_game_id", val: this.group_game_id }]
|
||||
)).then((res) => res.json());
|
||||
tmpEthics.forEach((empireEthic: { empires_id: number, empires_group_id: number, empires_group_name_id: number, ethics_id: number }) => {
|
||||
this.ethic_ids.push(empireEthic.ethics_id)
|
||||
});
|
||||
}
|
||||
}
|
||||
|
||||
export type Ethic = {
|
||||
id: number,
|
||||
name: string,
|
||||
fanatic: boolean
|
||||
}
|
||||
|
||||
export type GameData = {
|
||||
info: Game;
|
||||
groups: GameGroup[];
|
||||
empires: Empire[];
|
||||
}
|
||||
|
|
Reference in a new issue