Aelita4
/
AstroCol
1
0
Fork 0
Code Issues 2 Pull Requests Packages Projects 1 Releases Wiki Activity

Implement layout for logged user and cleanup styles

This commit is contained in:
Aelita4 2024-11-15 22:53:09 +01:00
parent 8f7ca6b9d2
commit 639cece8f5
Signed by: Aelita4
GPG Key ID: E44490C2025906C1
18 changed files with 625 additions and 1261 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

61
src/components/Card.astro
View File

@ -1,61 +0,0 @@
---
interface Props {
title: string;
body: string;
href: string;
}
const { href, title, body } = Astro.props;
---
<li class="link-card">
<a href={href}>
<h2>
{title}
<span>&rarr;</span>
</h2>
<p>
{body}
</p>
</a>
</li>
<style>
.link-card {
list-style: none;
display: flex;
padding: 1px;
background-color: #23262d;
background-image: none;
background-size: 400%;
border-radius: 7px;
background-position: 100%;
transition: background-position 0.6s cubic-bezier(0.22, 1, 0.36, 1);
box-shadow: inset 0 0 0 1px rgba(255, 255, 255, 0.1);
}
.link-card > a {
width: 100%;
text-decoration: none;
line-height: 1.4;
padding: calc(1.5rem - 1px);
border-radius: 8px;
color: white;
background-color: #23262d;
opacity: 0.8;
}
h2 {
margin: 0;
font-size: 1.25rem;
transition: color 0.6s cubic-bezier(0.22, 1, 0.36, 1);
}
p {
margin-top: 0.5rem;
margin-bottom: 0;
}
.link-card:is(:hover, :focus-within) {
background-position: 0;
background-image: var(--accent-gradient);
}
.link-card:is(:hover, :focus-within) h2 {
color: rgb(var(--accent-light));
}
</style>

5
src/components/NavBar.astro
View File

@ -1,5 +1,6 @@
--- ---
import { getHighestWeightedLanguage, getLocales, getName } from '../lib/utils/langDriver'; import { getHighestWeightedLanguage, getLocales, getName } from '../lib/utils/langDriver';
interface Props { interface Props {
loggedIn: string; loggedIn: string;
active: string; active: string;
@ -133,7 +134,6 @@ const bottomRow = filteredList.filter(element => element.position === "bottom");
const username = Astro.cookies.get('username')?.value ?? ""; const username = Astro.cookies.get('username')?.value ?? "";
--- ---
<nav> <nav>
<div class="row"> <div class="row">
<ul> <ul>
@ -166,7 +166,6 @@ const username = Astro.cookies.get('username')?.value ?? "";
</ul> </ul>
</div> </div>
</nav> </nav>
<style> <style>
nav { nav {
background-color: rgb(56, 59, 99); background-color: rgb(56, 59, 99);
@ -213,8 +212,6 @@ nav ul {
} }
.avatar-icon { .avatar-icon {
/* object-fit: contain; */
/* width: 100%; */
height: 50px; height: 50px;
border-radius: 50%; border-radius: 50%;
border: 1px solid white; border: 1px solid white;

2
src/components/ResourceBar.astro
View File

@ -54,7 +54,6 @@ for(const key of planet.resources.resources) {
)} )}
</div> </div>
</div> </div>
<style> <style>
#resourcebar { #resourcebar {
color: white; color: white;
@ -144,7 +143,6 @@ for(const key of planet.resources.resources) {
opacity: 1; opacity: 1;
} }
</style> </style>
<script> <script>
function numWithPrefix(x: number) { function numWithPrefix(x: number) {
x = Math.floor(x); x = Math.floor(x);

9
src/env.d.ts vendored
View File

@ -1,2 +1,11 @@
/// <reference path="../.astro/types.d.ts" /> /// <reference path="../.astro/types.d.ts" />
/// <reference types="astro/client" /> /// <reference types="astro/client" />
declare namespace App {
interface Locals {
token: string;
lang: { [key: string]: { id: string; name: string; description: string | null; }[]; };
user: User;
active: SystemManager | Planet;
}
}

30
src/layouts/Layout.astro
View File

@ -19,7 +19,6 @@ if(!Astro.cookies.has('language')) {
}); });
} }
--- ---
<!doctype html> <!doctype html>
<html lang="en"> <html lang="en">
<head> <head>
@ -36,32 +35,3 @@ if(!Astro.cookies.has('language')) {
<!-- <PlanetView /> --> <!-- <PlanetView /> -->
</body> </body>
</html> </html>
<style is:global>
:root {
--accent: 136, 58, 234;
--accent-light: 224, 204, 250;
--accent-dark: 49, 10, 101;
--accent-gradient: linear-gradient(
45deg,
rgb(var(--accent)),
rgb(var(--accent-light)) 30%,
white 60%
);
}
html {
font-family: system-ui, sans-serif;
background: #13151a;
background-size: 224px;
}
code {
font-family:
Menlo,
Monaco,
Lucida Console,
Liberation Mono,
DejaVu Sans Mono,
Bitstream Vera Sans Mono,
Courier New,
monospace;
}
</style>

34
src/layouts/LoggedIn.astro Normal file
View File

@ -0,0 +1,34 @@
---
import NavBar from '../components/NavBar.astro';
import ResourceBar from '../components/ResourceBar.astro';
interface Props {
id: string;
title: string;
}
const { title } = Astro.props;
---
<!doctype html>
<html lang="en">
<head>
<meta charset="UTF-8" />
<meta name="description" content="Astro description" />
<meta name="viewport" content="width=device-width" />
<link rel="icon" type="image/svg+xml" href="/favicon.svg" />
<link rel="stylesheet" href="/css/markdown.css" />
<meta name="generator" content={Astro.generator} />
<title>{title}</title>
</head>
<body>
<NavBar loggedIn="true" active={Astro.props.id} />
<ResourceBar />
<slot />
</body>
</html>
<style>
html {
font-family: system-ui, sans-serif;
background: #13151a;
}
</style>

35
src/middleware.ts Normal file
View File

@ -0,0 +1,35 @@
import { getUserByAccessToken } from "./lib/db/users";
import { getHighestWeightedLanguage, getLocales } from "./lib/utils/langDriver";
import locationManager from "./lib/classes/managers/LocationManager";
import { defineMiddleware } from "astro/middleware";
import { APIContext, MiddlewareNext } from "astro";
import { ObjectId } from "mongodb";
const frontend = async (context: APIContext, next: MiddlewareNext) => {
const loggedToken = context.cookies.get('sessionToken')?.value ?? null;
const username = context.cookies.get('username')?.value ?? "";
if(loggedToken === null || username === "") return context.redirect('/logout');
const checkUser = await getUserByAccessToken(loggedToken);
if(checkUser === null || checkUser.username !== username) return context.redirect('/logout');
const user = locationManager.getUser(checkUser._id);
if(user === null) return context.redirect('/logout');
const lang = await getLocales(context.cookies.get('language')?.value ?? await getHighestWeightedLanguage(context.request.headers.get('accept-language')));
const activeId = context.cookies.get('currentPlanet')?.value ?? "0";
const active = locationManager.findId(new ObjectId(activeId));
if(active === null) return context.redirect('/logout');
context.locals.token = loggedToken;
context.locals.lang = lang;
context.locals.user = user;
context.locals.active = active;
return next();
}
export const onRequest = defineMiddleware(async (context, next) => {
return context.url.pathname.startsWith('/game') ? frontend(context, next) : next();
});

126
src/pages/game/buildings.astro
View File

@ -1,34 +1,21 @@
--- ---
import Layout from '../../layouts/Layout.astro';
import NavBar from '../../components/NavBar.astro';
import ItemCard from '../../components/ItemCard.astro'; import ItemCard from '../../components/ItemCard.astro';
import { getUserByAccessToken } from '../../lib/db/users'; import LoggedIn from '../../layouts/LoggedIn.astro';
import { getHighestWeightedLanguage, getLocales, getName, getObj } from '../../lib/utils/langDriver'; import { Planet } from '../../lib/classes/managers/PlanetManager';
import ResourceBar from '../../components/ResourceBar.astro'; import SystemManager from '../../lib/classes/managers/SystemManager';
import { getAllBuildings } from '../../lib/db/buildings'; import { getAllBuildings } from '../../lib/db/buildings';
import locationManager from '../../lib/classes/managers/LocationManager'; import { getName, getObj } from '../../lib/utils/langDriver';
import { ObjectId } from 'mongodb';
import DBBuilding from '../../types/db/DBBuilding'; import DBBuilding from '../../types/db/DBBuilding';
const { token, lang } = Astro.locals;
const active: SystemManager | Planet = Astro.locals.active;
if(active instanceof SystemManager) {
return Astro.redirect('/game');
}
const buildingsList = await getAllBuildings(); const buildingsList = await getAllBuildings();
const loggedToken = Astro.cookies.get('sessionToken')?.value ?? null;
const username = Astro.cookies.get('username')?.value ?? "";
if(loggedToken === null || username === "") return Astro.redirect('/logout');
const checkUser = await getUserByAccessToken(loggedToken);
if(checkUser === null || checkUser.username !== username) return Astro.redirect('/logout');
const locale = Astro.cookies.get('language')?.value ?? await getHighestWeightedLanguage(Astro.request.headers.get('accept-language'));
const lang = await getLocales(locale);
const planetId = Astro.cookies.get('currentPlanet')?.value ?? "";
if(planetId === "") return "No planet selected";
const planet = locationManager.getPlanet(new ObjectId(planetId));
if(!planet) return "Planet not found";
if(Astro.request.method === "POST") { if(Astro.request.method === "POST") {
const selectedBuildingId = (await Astro.request.formData()).get('id') as string | null; const selectedBuildingId = (await Astro.request.formData()).get('id') as string | null;
@ -36,10 +23,10 @@ if(Astro.request.method === "POST") {
method: 'POST', method: 'POST',
headers: { headers: {
'Content-Type': 'application/json', 'Content-Type': 'application/json',
'Authorization': 'Bearer ' + loggedToken 'Authorization': 'Bearer ' + token
}, },
body: JSON.stringify({ body: JSON.stringify({
planet: planetId, planet: active._id,
building: selectedBuildingId building: selectedBuildingId
}) })
})).json(); })).json();
@ -54,7 +41,7 @@ for(const building of buildingsList) {
resources: building.requirements.resources.map(resource => { resources: building.requirements.resources.map(resource => {
return { return {
id: resource.id, id: resource.id,
amount: Math.pow(building.multiplier, (planet.buildings.getBuildingById(building.id)?.level ?? 0) ) * resource.amount amount: Math.pow(building.multiplier, (active.buildings.getBuildingById(building.id)?.level ?? 0) ) * resource.amount
}; };
}), }),
research: building.requirements.research, research: building.requirements.research,
@ -65,15 +52,12 @@ for(const building of buildingsList) {
const buildingsByCategory = buildingsList.reduce((acc: { [key: string]: Array<DBBuilding & { level: number }> }, building) => { const buildingsByCategory = buildingsList.reduce((acc: { [key: string]: Array<DBBuilding & { level: number }> }, building) => {
if(!acc[building.category]) acc[building.category] = []; if(!acc[building.category]) acc[building.category] = [];
acc[building.category].push({ ...building, level: planet.buildings.getBuildingById(building.id)?.level ?? 0 }); acc[building.category].push({ ...building, level: active.buildings.getBuildingById(building.id)?.level ?? 0 });
return acc; return acc;
}, {}); }, {});
--- ---
<Layout title="Buildings"> <LoggedIn id="buildings" title="Buildings">
<NavBar loggedIn="true" active="buildings" />
<ResourceBar />
<div id="building-modal-background"> <div id="building-modal-background">
<div id="building-modal-details" data-building-id=""> <div id="building-modal-details" data-building-id="">
<h3>Required resources</h3> <h3>Required resources</h3>
@ -84,7 +68,6 @@ const buildingsByCategory = buildingsList.reduce((acc: { [key: string]: Array<DB
<div class="building-modal-text" id="building-modal-req-research">None</div> <div class="building-modal-text" id="building-modal-req-research">None</div>
</div> </div>
</div> </div>
{Object.entries(buildingsByCategory).map(([category, buildings]) => <> {Object.entries(buildingsByCategory).map(([category, buildings]) => <>
<h1>{getName(lang, 'buildings', `cat-${category}`)}</h1> <h1>{getName(lang, 'buildings', `cat-${category}`)}</h1>
<div class="building-cat"> <div class="building-cat">
@ -101,23 +84,8 @@ const buildingsByCategory = buildingsList.reduce((acc: { [key: string]: Array<DB
))} ))}
</div> </div>
</>)} </>)}
</Layout> </LoggedIn>
<style> <style>
* {
color: white;
}
main {
margin: auto;
padding: 1rem;
width: 800px;
max-width: calc(100% - 2rem);
color: white;
font-size: 20px;
line-height: 1.6;
}
.building-cat { .building-cat {
display: flex; display: flex;
flex-direction: row; flex-direction: row;
@ -151,74 +119,20 @@ const buildingsByCategory = buildingsList.reduce((acc: { [key: string]: Array<DB
z-index: 101; z-index: 101;
} }
.astro-a { h1 {
position: absolute;
top: -32px;
left: 50%;
transform: translatex(-50%);
width: 220px;
height: auto;
z-index: -1;
}
h3 {
font-size: 2rem; font-size: 2rem;
font-weight: 700; font-weight: 700;
line-height: 1; line-height: 1;
text-align: center; text-align: center;
margin-bottom: 1em; margin-bottom: 1em;
color: white;
} }
.building-modal-text { .building-modal-text {
font-size: 1.5rem; font-size: 1.5rem;
} }
.text-gradient {
background-image: var(--accent-gradient);
-webkit-background-clip: text;
-webkit-text-fill-color: transparent;
background-size: 400%;
background-position: 0%;
}
.instructions {
margin-bottom: 2rem;
border: 1px solid rgba(var(--accent-light), 25%);
background: linear-gradient(rgba(var(--accent-dark), 66%), rgba(var(--accent-dark), 33%));
padding: 1.5rem;
border-radius: 8px;
}
.instructions code {
font-size: 0.8em;
font-weight: bold;
background: rgba(var(--accent-light), 12%);
color: rgb(var(--accent-light));
border-radius: 4px;
padding: 0.3em 0.4em;
}
.instructions strong {
color: rgb(var(--accent-light));
}
.link-card-grid {
display: grid;
grid-template-columns: repeat(auto-fit, minmax(24ch, 1fr));
gap: 2rem;
padding: 0;
}
.a-button {
text-decoration: none;
color: green;
}
.a-button:hover {
color: lime;
}
</style> </style>
<script define:vars={{ modalSet, lang, planetId }}> <script define:vars={{ modalSet, lang }}>
const modalResources = document.getElementById("building-modal-req-resources"); const modalResources = document.getElementById("building-modal-req-resources");
const modalBuildings = document.getElementById("building-modal-req-buildings"); const modalBuildings = document.getElementById("building-modal-req-buildings");
const modalResearch = document.getElementById("building-modal-req-research"); const modalResearch = document.getElementById("building-modal-req-research");

144
src/pages/game/fleet.astro
View File

@ -1,30 +1,14 @@
--- ---
import Layout from '../../layouts/Layout.astro'; import LoggedIn from '../../layouts/LoggedIn.astro';
import NavBar from '../../components/NavBar.astro';
import { getUserByAccessToken } from '../../lib/db/users';
import { getHighestWeightedLanguage, getLocales, getName, getObj } from '../../lib/utils/langDriver';
import ResourceBar from '../../components/ResourceBar.astro';
import locationManager from '../../lib/classes/managers/LocationManager'; import locationManager from '../../lib/classes/managers/LocationManager';
import { Planet } from '../../lib/classes/managers/PlanetManager';
import SystemManager from '../../lib/classes/managers/SystemManager';
import { getAllFleetByUser } from '../../lib/db/fleet'; import { getAllFleetByUser } from '../../lib/db/fleet';
import { getAllShips } from '../../lib/db/ships'; import { getAllShips } from '../../lib/db/ships';
import { ObjectId } from 'mongodb'; import { getName } from '../../lib/utils/langDriver';
import SystemManager from '../../lib/classes/managers/SystemManager';
const loggedToken = Astro.cookies.get('sessionToken')?.value ?? null; const { token, user, lang } = Astro.locals;
const username = Astro.cookies.get('username')?.value ?? ""; const active: SystemManager | Planet = Astro.locals.active;
if(loggedToken === null || username === "") return Astro.redirect('/logout');
const checkUser = await getUserByAccessToken(loggedToken);
if(checkUser === null || checkUser.username !== username) return Astro.redirect('/logout');
const user = locationManager.getUser(checkUser._id);
if(!user) return Astro.redirect('/logout');
const planetId = Astro.cookies.get('currentPlanet')?.value ?? "";
if(planetId === "") return "No planet selected";
const planet = locationManager.findId(new ObjectId(planetId));
if(!planet) return "Planet not found";
const ships = await getAllShips(); const ships = await getAllShips();
@ -47,7 +31,7 @@ if(Astro.request.method === "POST") {
}); });
const fleetData = { const fleetData = {
source: planet instanceof SystemManager ? planet.data._id : planet._id, source: active instanceof SystemManager ? active.data._id : active._id,
destination: form.get('toSystem') ? form.get('destination-system')?.toString() : form.get('destination-planet')?.toString(), destination: form.get('toSystem') ? form.get('destination-system')?.toString() : form.get('destination-planet')?.toString(),
mission: form.get('mission')?.toString() ?? "NULL", mission: form.get('mission')?.toString() ?? "NULL",
ships: ships.map(ship => { ships: ships.map(ship => {
@ -64,7 +48,7 @@ if(Astro.request.method === "POST") {
method: 'POST', method: 'POST',
headers: { headers: {
'Content-Type': 'application/json', 'Content-Type': 'application/json',
'Authorization': `Bearer ${loggedToken}` 'Authorization': `Bearer ${token}`
}, },
body: JSON.stringify(fleetData) body: JSON.stringify(fleetData)
}); });
@ -79,7 +63,6 @@ await locationManager.updateFleet();
const fleet = (await getAllFleetByUser(user.id)).filter(f => new Date().getTime() - f.arrivalTime.getTime() < 0); const fleet = (await getAllFleetByUser(user.id)).filter(f => new Date().getTime() - f.arrivalTime.getTime() < 0);
fleet.sort((a, b) => a.departureTime.getTime() - b.departureTime.getTime()); fleet.sort((a, b) => a.departureTime.getTime() - b.departureTime.getTime());
const userSystems = locationManager.getSystemsOwnedBy(user.id);
const galaxies = locationManager.galaxies; const galaxies = locationManager.galaxies;
let own = 0; let own = 0;
@ -99,28 +82,6 @@ for(const f of fleet) {
} }
} }
// for(const system of userSystems) {
// for(const planet of system.planets) {
// for(const f of fleet) {
// if(f.source.equals(planet._id) || f.source.equals(system.data._id)) own++;
// else if(f.destination.equals(planet._id) || f.destination.equals(system.data._id)) {
// if(f.mission === 'ATTACK') enemy++;
// else {
// const sourceObj = locationManager.findId(f.source);
// const destinationObj = locationManager.findId(f.destination);
// if(!sourceObj || !destinationObj) continue;
// const source = sourceObj instanceof SystemManager ? sourceObj.data.ownedBy.id : sourceObj.system.data.ownedBy.id;
// const destination = destinationObj instanceof SystemManager ? destinationObj.data.ownedBy.id : destinationObj.system.data.ownedBy.id;
// if(!source?.equals(destination)) friendly++;
// }
// }
// }
// }
// }
const sectorsList = galaxies.map(galaxy => { const sectorsList = galaxies.map(galaxy => {
return { return {
_id: galaxy._id, _id: galaxy._id,
@ -145,13 +106,8 @@ const sectorsList = galaxies.map(galaxy => {
}) })
} }
}); });
const lang = await getLocales(Astro.cookies.get('language')?.value ?? await getHighestWeightedLanguage(Astro.request.headers.get('accept-language')));
--- ---
<LoggedIn id="fleet" title="Fleet">
<Layout title="Fleet">
<NavBar loggedIn="true" active="fleet" />
<ResourceBar />
<label for="fleet-toggle"> <label for="fleet-toggle">
<input type="checkbox" id="fleet-toggle"> <input type="checkbox" id="fleet-toggle">
<div class="fleet-status"> <div class="fleet-status">
@ -179,11 +135,11 @@ const lang = await getLocales(Astro.cookies.get('language')?.value ?? await getH
</label> </label>
<div class="fleet-send-container"> <div class="fleet-send-container">
<form method="post"> <form method="post">
<h1>Sending fleet from {planet instanceof SystemManager ? planet.data.name : planet.name}</h1> <h1>Sending fleet from {active instanceof SystemManager ? active.data.name : active.name}</h1>
<hr /> <hr />
<h2>Ships</h2> <h2>Ships</h2>
<div class="fleet-send-ships"> <div class="fleet-send-ships">
{planet.ships.ships.map(ship => <div class="fleet-ship-card"> {active.ships.ships.map(ship => <div class="fleet-ship-card">
<h3>{getName(lang, 'ships', ship.data.id)} - {ship.amount}</h3> <h3>{getName(lang, 'ships', ship.data.id)} - {ship.amount}</h3>
<input type="number" value="0" min="0" max={ship.amount} id={ship.data.id} name={`ship-amount-${ship.data.id}`} /> <input type="number" value="0" min="0" max={ship.amount} id={ship.data.id} name={`ship-amount-${ship.data.id}`} />
</div>)} </div>)}
@ -233,87 +189,13 @@ const lang = await getLocales(Astro.cookies.get('language')?.value ?? await getH
<button type="submit">Send fleet</button> <button type="submit">Send fleet</button>
</form> </form>
</div> </div>
</Layout> </LoggedIn>
<style> <style>
* { * {
color: white; color: white;
} }
main {
margin: auto;
padding: 1rem;
width: 800px;
max-width: calc(100% - 2rem);
color: white;
font-size: 20px;
line-height: 1.6;
}
.astro-a {
position: absolute;
top: -32px;
left: 50%;
transform: translatex(-50%);
width: 220px;
height: auto;
z-index: -1;
}
h3 {
font-size: 2rem;
font-weight: 700;
line-height: 1;
text-align: center;
margin-bottom: 1em;
}
.text-gradient {
background-image: var(--accent-gradient);
-webkit-background-clip: text;
-webkit-text-fill-color: transparent;
background-size: 400%;
background-position: 0%;
}
.instructions {
margin-bottom: 2rem;
border: 1px solid rgba(var(--accent-light), 25%);
background: linear-gradient(rgba(var(--accent-dark), 66%), rgba(var(--accent-dark), 33%));
padding: 1.5rem;
border-radius: 8px;
}
.instructions code {
font-size: 0.8em;
font-weight: bold;
background: rgba(var(--accent-light), 12%);
color: rgb(var(--accent-light));
border-radius: 4px;
padding: 0.3em 0.4em;
}
.instructions strong {
color: rgb(var(--accent-light));
}
.link-card-grid {
display: grid;
grid-template-columns: repeat(auto-fit, minmax(24ch, 1fr));
gap: 2rem;
padding: 0;
}
.a-button {
text-decoration: none;
color: green;
height: fit-content;
}
.a-button:hover {
color: lime;
}
.ship-cards { .ship-cards {
display: flex; display: flex;
flex-direction: row; flex-direction: row;
@ -360,7 +242,6 @@ const lang = await getLocales(Astro.cookies.get('language')?.value ?? await getH
opacity: 0; opacity: 0;
max-height: 0; max-height: 0;
overflow: hidden; overflow: hidden;
transition-property: max-height; transition-property: max-height;
transition-duration: 0.5s; transition-duration: 0.5s;
transition-timing-function: ease; transition-timing-function: ease;
@ -565,5 +446,4 @@ const lang = await getLocales(Astro.cookies.get('language')?.value ?? await getH
cargoContainer.appendChild(cargoItem); cargoContainer.appendChild(cargoItem);
}); });
</script> </script>

24
src/pages/game/galaxyView.astro
View File

@ -1,16 +1,6 @@
--- ---
import Layout from '../../layouts/Layout.astro'; import LoggedIn from '../../layouts/LoggedIn.astro';
import NavBar from '../../components/NavBar.astro';
import { getUserByAccessToken } from '../../lib/db/users';
import locationManager from '../../lib/classes/managers/LocationManager'; import locationManager from '../../lib/classes/managers/LocationManager';
import ResourceBar from '../../components/ResourceBar.astro';
const loggedToken = Astro.cookies.get('sessionToken')?.value ?? null;
const username = Astro.cookies.get('username')?.value ?? "";
if(loggedToken === null || username === "") return Astro.redirect('/logout');
const checkUser = await getUserByAccessToken(loggedToken);
if(checkUser === null || checkUser.username !== username) return Astro.redirect('/logout');
const allGalaxies = locationManager.galaxies; const allGalaxies = locationManager.galaxies;
@ -33,10 +23,7 @@ const galaxies = allGalaxies.map(galaxy => {
}; };
}) })
--- ---
<LoggedIn id="galaxyView" title="Galaxy view">
<Layout title="Galaxy view">
<NavBar loggedIn="true" active="galaxyView" />
<ResourceBar />
<div class="container"> <div class="container">
<div class="galaxy-container"> <div class="galaxy-container">
{galaxies.map(galaxy => <> {galaxies.map(galaxy => <>
@ -49,13 +36,10 @@ const galaxies = allGalaxies.map(galaxy => {
</div> </div>
<div class="galaxy-details"> <div class="galaxy-details">
<h2></h2> <h2></h2>
<div class="galaxy-sector-list"> <div class="galaxy-sector-list"></div>
</div> </div>
</div> </div>
</div> </LoggedIn>
</Layout>
<style is:global> <style is:global>
.container { .container {
display: flex; display: flex;

101
src/pages/game/index.astro
View File

@ -1,100 +1,15 @@
--- ---
import Layout from '../../layouts/Layout.astro'; import LoggedIn from '../../layouts/LoggedIn.astro';
import NavBar from '../../components/NavBar.astro'; import { Planet } from '../../lib/classes/managers/PlanetManager';
import ResourceBar from '../../components/ResourceBar.astro'; import SystemManager from '../../lib/classes/managers/SystemManager';
import { getUserByAccessToken } from '../../lib/db/users';
import locationManager from '../../lib/classes/managers/LocationManager';
import { ObjectId } from 'mongodb';
const loggedToken = Astro.cookies.get('sessionToken')?.value ?? null; const active: SystemManager | Planet = Astro.locals.active;
const username = Astro.cookies.get('username')?.value ?? "";
if(loggedToken === null || username === "") return Astro.redirect('/logout');
const checkUser = await getUserByAccessToken(loggedToken);
if(checkUser === null || checkUser.username !== username) return Astro.redirect('/logout');
const currentPlanetId = Astro.cookies.get('currentPlanet')?.value ?? null;
if(currentPlanetId === null) return Astro.redirect('/logout');
const currentPlanet = locationManager.getPlanet(new ObjectId(currentPlanetId));
if(currentPlanet === undefined) {
Astro.cookies.delete('planetid');
return Astro.redirect('/logout');
}
--- ---
<LoggedIn id="overview" title="Overview">
<Layout title="Overview"> <h1>{active instanceof SystemManager ? `${active.data.name} system` : `${active.name} in ${active.system.data.name}`}</h1>
<NavBar loggedIn="true" active="overview" /> </LoggedIn>
<ResourceBar />
<h1>{currentPlanet.name} in {currentPlanet.system.data.name}</h1>
</Layout>
<style> <style>
* { h1 {
color: white; color: white;
} }
main {
margin: auto;
padding: 1rem;
width: 800px;
max-width: calc(100% - 2rem);
color: white;
font-size: 20px;
line-height: 1.6;
}
.astro-a {
position: absolute;
top: -32px;
left: 50%;
transform: translatex(-50%);
width: 220px;
height: auto;
z-index: -1;
}
h3 {
font-size: 2rem;
font-weight: 700;
line-height: 1;
text-align: center;
margin-bottom: 1em;
}
.text-gradient {
background-image: var(--accent-gradient);
-webkit-background-clip: text;
-webkit-text-fill-color: transparent;
background-size: 400%;
background-position: 0%;
}
.instructions {
margin-bottom: 2rem;
border: 1px solid rgba(var(--accent-light), 25%);
background: linear-gradient(rgba(var(--accent-dark), 66%), rgba(var(--accent-dark), 33%));
padding: 1.5rem;
border-radius: 8px;
}
.instructions code {
font-size: 0.8em;
font-weight: bold;
background: rgba(var(--accent-light), 12%);
color: rgb(var(--accent-light));
border-radius: 4px;
padding: 0.3em 0.4em;
}
.instructions strong {
color: rgb(var(--accent-light));
}
.link-card-grid {
display: grid;
grid-template-columns: repeat(auto-fit, minmax(24ch, 1fr));
gap: 2rem;
padding: 0;
}
</style> </style>

104
src/pages/game/profile.astro
View File

@ -1,10 +1,11 @@
--- ---
import Layout from '../../layouts/Layout.astro'; import LoggedIn from '../../layouts/LoggedIn.astro';
import NavBar from '../../components/NavBar.astro'; import User from '../../lib/classes/User';
import { getUserByAccessToken, getUserByNickOrEmail } from '../../lib/db/users';
import { getHighestWeightedLanguage, getLocales, getName, getSupportedLanguages } from '../../lib/utils/langDriver';
import ResourceBar from '../../components/ResourceBar.astro';
import format from '../../lib/utils/format'; import format from '../../lib/utils/format';
import { getName, getSupportedLanguages } from '../../lib/utils/langDriver';
const { token, lang } = Astro.locals;
const user: User = Astro.locals.user;
const availableLanguages = await getSupportedLanguages(); const availableLanguages = await getSupportedLanguages();
@ -23,28 +24,10 @@ if(Astro.request.method === "POST") {
secure: true secure: true
}); });
} }
const loggedToken = Astro.cookies.get('sessionToken')?.value ?? null;
const username = Astro.cookies.get('username')?.value ?? "";
if(loggedToken === null || username === "") return Astro.redirect('/logout');
const checkUser = await getUserByAccessToken(loggedToken);
if(checkUser === null || checkUser.username !== username) return Astro.redirect('/logout');
const locale = Astro.cookies.get('language')?.value ?? await getHighestWeightedLanguage(Astro.request.headers.get('accept-language') ?? "en");
const user = await getUserByNickOrEmail(username);
const lang = await getLocales(locale);
const currentLanguage = Astro.cookies.get('language')?.value ?? "en"; const currentLanguage = Astro.cookies.get('language')?.value ?? "en";
--- ---
<LoggedIn id="profile" title="Profile">
<Layout title="Profile"> {token}
<NavBar loggedIn="true" active="profile" />
<ResourceBar loggedIn="true" />
{loggedToken}
<div class="wrapper"> <div class="wrapper">
<h3>{format(getName(lang, 'general', 'user-creation-date'), user?.createdAt.toISOString().slice(0, 19).replace(/-/g, "/").replace("T", " ").toString() ?? "")}</h3> <h3>{format(getName(lang, 'general', 'user-creation-date'), user?.createdAt.toISOString().slice(0, 19).replace(/-/g, "/").replace("T", " ").toString() ?? "")}</h3>
<a href="/logout" class="a-button">{getName(lang, 'general', 'nav-logout')}</a> <a href="/logout" class="a-button">{getName(lang, 'general', 'nav-logout')}</a>
@ -66,7 +49,7 @@ const currentLanguage = Astro.cookies.get('language')?.value ?? "en";
<input class="data-form-button" type="button" value={getName(lang, 'general', 'change-password')} /> <input class="data-form-button" type="button" value={getName(lang, 'general', 'change-password')} />
</form> </form>
<form id="changeLanguageForm" class="data-form" method="post"> <form id="changeLanguageForm" class="data-form" method="post">
<h4>{getName(lang, 'general', 'current-language')}: {availableLanguages.find(l => l.id === currentLanguage)?.name ?? "N/A"}</h4> <h3>{getName(lang, 'general', 'current-language')}: {availableLanguages.find(l => l.id === currentLanguage)?.name ?? "N/A"}</h3>
<select class="data-form-input" name="language"> <select class="data-form-input" name="language">
{availableLanguages.map((lang) => ( {availableLanguages.map((lang) => (
<option value={lang.id}>{lang.name}</option> <option value={lang.id}>{lang.name}</option>
@ -74,10 +57,9 @@ const currentLanguage = Astro.cookies.get('language')?.value ?? "en";
</select> </select>
<input type="submit" class="data-form-button" value={getName(lang, 'general', 'change-language')} /> <input type="submit" class="data-form-button" value={getName(lang, 'general', 'change-language')} />
</form> </form>
</Layout> </LoggedIn>
<style> <style>
* { h3 {
color: white; color: white;
} }
@ -107,70 +89,6 @@ const currentLanguage = Astro.cookies.get('language')?.value ?? "en";
color: white; color: white;
} }
main {
margin: auto;
padding: 1rem;
width: 800px;
max-width: calc(100% - 2rem);
color: white;
font-size: 20px;
line-height: 1.6;
}
.astro-a {
position: absolute;
top: -32px;
left: 50%;
transform: translatex(-50%);
width: 220px;
height: auto;
z-index: -1;
}
h3 {
font-size: 2rem;
font-weight: 700;
line-height: 1;
text-align: center;
margin-bottom: 1em;
}
.text-gradient {
background-image: var(--accent-gradient);
-webkit-background-clip: text;
-webkit-text-fill-color: transparent;
background-size: 400%;
background-position: 0%;
}
.instructions {
margin-bottom: 2rem;
border: 1px solid rgba(var(--accent-light), 25%);
background: linear-gradient(rgba(var(--accent-dark), 66%), rgba(var(--accent-dark), 33%));
padding: 1.5rem;
border-radius: 8px;
}
.instructions code {
font-size: 0.8em;
font-weight: bold;
background: rgba(var(--accent-light), 12%);
color: rgb(var(--accent-light));
border-radius: 4px;
padding: 0.3em 0.4em;
}
.instructions strong {
color: rgb(var(--accent-light));
}
.link-card-grid {
display: grid;
grid-template-columns: repeat(auto-fit, minmax(24ch, 1fr));
gap: 2rem;
padding: 0;
}
.a-button { .a-button {
text-decoration: none; text-decoration: none;
color: green; color: green;

124
src/pages/game/research.astro
View File

@ -1,24 +1,18 @@
--- ---
import Layout from '../../layouts/Layout.astro';
import NavBar from '../../components/NavBar.astro';
import { getUserByAccessToken } from '../../lib/db/users';
import { getHighestWeightedLanguage, getLocales, getName, getObj } from '../../lib/utils/langDriver';
import ResourceBar from '../../components/ResourceBar.astro';
import ItemCard from '../../components/ItemCard.astro'; import ItemCard from '../../components/ItemCard.astro';
import LoggedIn from '../../layouts/LoggedIn.astro';
import User from '../../lib/classes/User';
import { Planet } from '../../lib/classes/managers/PlanetManager';
import SystemManager from '../../lib/classes/managers/SystemManager';
import { getAllResearch } from '../../lib/db/research'; import { getAllResearch } from '../../lib/db/research';
import { getObj } from '../../lib/utils/langDriver';
const { token, lang } = Astro.locals;
const active: SystemManager | Planet = Astro.locals.active;
const user: User = Astro.locals.user;
const researchList = await getAllResearch(); const researchList = await getAllResearch();
const loggedToken = Astro.cookies.get('sessionToken')?.value ?? null;
const username = Astro.cookies.get('username')?.value ?? "";
if(loggedToken === null || username === "") return Astro.redirect('/logout');
const checkUser = await getUserByAccessToken(loggedToken);
if(checkUser === null || checkUser.username !== username) return Astro.redirect('/logout');
const planetId = Astro.cookies.get('currentPlanet')?.value ?? "";
if(planetId === "") return Astro.redirect('/logout');
if(Astro.request.method === "POST") { if(Astro.request.method === "POST") {
const selectedResearchId = (await Astro.request.formData()).get('id') as string | null; const selectedResearchId = (await Astro.request.formData()).get('id') as string | null;
@ -26,21 +20,17 @@ if(Astro.request.method === "POST") {
method: 'POST', method: 'POST',
headers: { headers: {
'Content-Type': 'application/json', 'Content-Type': 'application/json',
'Authorization': 'Bearer ' + loggedToken 'Authorization': 'Bearer ' + token
}, },
body: JSON.stringify({ body: JSON.stringify({
research: selectedResearchId, research: selectedResearchId,
planetId planetId: active instanceof SystemManager ? active.data._id : active._id
}) })
})).json(); })).json();
console.log(request); console.log(request);
} }
const locale = Astro.cookies.get('language')?.value ?? await getHighestWeightedLanguage(Astro.request.headers.get('accept-language'));
const lang = await getLocales(locale);
const modalSet: { [key: string]: { resources: Array<any>, research: Array<any>, buildings: Array<any> } } = {}; const modalSet: { [key: string]: { resources: Array<any>, research: Array<any>, buildings: Array<any> } } = {};
for(const research of researchList) { for(const research of researchList) {
@ -52,11 +42,7 @@ for(const research of researchList) {
}; };
} }
--- ---
<LoggedIn id="research" title="Research">
<Layout title="Research">
<NavBar loggedIn="true" active="research" />
<ResourceBar />
<div id="research-modal-background"> <div id="research-modal-background">
<div id="research-modal-details" data-building-id=""> <div id="research-modal-details" data-building-id="">
<h3>Required resources</h3> <h3>Required resources</h3>
@ -67,101 +53,21 @@ for(const research of researchList) {
<div class="research-modal-text" id="research-modal-req-research">None</div> <div class="research-modal-text" id="research-modal-req-research">None</div>
</div> </div>
</div> </div>
<div class="research-cards"> <div class="research-cards">
{researchList.map(research => <> {researchList.map(research => <>
<ItemCard <ItemCard
category="research" category="research"
id={research.id} id={research.id}
name={getObj(lang, "research", research.id).name} name={getObj(lang, "research", research.id).name}
level={checkUser.research.find(x => x.id === research.id)?.level.toString() ?? "0"} level={user.research.getResearchById(research.id)?.level.toString() ?? "0"}
description={getObj(lang, "research", research.id).description ?? ""} description={getObj(lang, "research", research.id).description ?? ""}
image={`/images/research/${research.id}.jpeg`} image={`/images/research/${research.id}.jpeg`}
button_type="general" button_type="general"
button_name="nav-research" /> button_name="nav-research" />
</>)} </>)}
</div> </div>
</Layout> </LoggedIn>
<style> <style>
* {
color: white;
}
main {
margin: auto;
padding: 1rem;
width: 800px;
max-width: calc(100% - 2rem);
color: white;
font-size: 20px;
line-height: 1.6;
}
.astro-a {
position: absolute;
top: -32px;
left: 50%;
transform: translatex(-50%);
width: 220px;
height: auto;
z-index: -1;
}
h3 {
font-size: 2rem;
font-weight: 700;
line-height: 1;
text-align: center;
margin-bottom: 1em;
}
.text-gradient {
background-image: var(--accent-gradient);
-webkit-background-clip: text;
-webkit-text-fill-color: transparent;
background-size: 400%;
background-position: 0%;
}
.instructions {
margin-bottom: 2rem;
border: 1px solid rgba(var(--accent-light), 25%);
background: linear-gradient(rgba(var(--accent-dark), 66%), rgba(var(--accent-dark), 33%));
padding: 1.5rem;
border-radius: 8px;
}
.instructions code {
font-size: 0.8em;
font-weight: bold;
background: rgba(var(--accent-light), 12%);
color: rgb(var(--accent-light));
border-radius: 4px;
padding: 0.3em 0.4em;
}
.instructions strong {
color: rgb(var(--accent-light));
}
.link-card-grid {
display: grid;
grid-template-columns: repeat(auto-fit, minmax(24ch, 1fr));
gap: 2rem;
padding: 0;
}
.a-button {
text-decoration: none;
color: green;
height: fit-content;
}
.a-button:hover {
color: lime;
}
.research-cards { .research-cards {
display: flex; display: flex;
flex-direction: row; flex-direction: row;
@ -196,7 +102,7 @@ for(const research of researchList) {
z-index: 101; z-index: 101;
} }
</style> </style>
<script define:vars={{ modalSet, lang, planetId }}> <script define:vars={{ modalSet, lang }}>
const modalResources = document.getElementById("research-modal-req-resources"); const modalResources = document.getElementById("research-modal-req-resources");
const modalBuildings = document.getElementById("research-modal-req-buildings"); const modalBuildings = document.getElementById("research-modal-req-buildings");
const modalResearch = document.getElementById("research-modal-req-research"); const modalResearch = document.getElementById("research-modal-req-research");

125
src/pages/game/ships.astro
View File

@ -1,37 +1,16 @@
--- ---
import Layout from '../../layouts/Layout.astro';
import NavBar from '../../components/NavBar.astro';
import { getUserByAccessToken } from '../../lib/db/users';
import { getHighestWeightedLanguage, getLocales, getObj } from '../../lib/utils/langDriver';
import ResourceBar from '../../components/ResourceBar.astro';
import { getAllShips } from '../../lib/db/ships';
import ItemCard from '../../components/ItemCard.astro'; import ItemCard from '../../components/ItemCard.astro';
import locationManager from '../../lib/classes/managers/LocationManager'; import LoggedIn from '../../layouts/LoggedIn.astro';
import { ObjectId } from 'mongodb'; import { Planet } from '../../lib/classes/managers/PlanetManager';
import SystemManager from '../../lib/classes/managers/SystemManager';
import { getAllShips } from '../../lib/db/ships';
import { getObj } from '../../lib/utils/langDriver';
const loggedToken = Astro.cookies.get('sessionToken')?.value ?? null; const { lang } = Astro.locals;
const username = Astro.cookies.get('username')?.value ?? ""; const active: SystemManager | Planet = Astro.locals.active;
if(loggedToken === null || username === "") return Astro.redirect('/logout');
const checkUser = await getUserByAccessToken(loggedToken);
if(checkUser === null || checkUser.username !== username) return Astro.redirect('/logout');
const ships = await getAllShips(); const ships = await getAllShips();
const planetId = Astro.cookies.get('currentPlanet')?.value ?? "";
if(planetId === "") {
console.error("No planet selected");
return Astro.redirect('/logout');
}
const planet = locationManager.getPlanet(new ObjectId(planetId));
if(!planet) {
console.error("Planet not found");
return Astro.redirect('/logout');
}
const lang = await getLocales(Astro.cookies.get('language')?.value ?? await getHighestWeightedLanguage(Astro.request.headers.get('accept-language')));
const modalSet: { [key: string]: { resources: Array<any>, research: Array<any>, buildings: Array<any> } } = {}; const modalSet: { [key: string]: { resources: Array<any>, research: Array<any>, buildings: Array<any> } } = {};
for(const ship of ships) { for(const ship of ships) {
@ -42,12 +21,10 @@ for(const ship of ships) {
// energy: building.energy // energy: building.energy
}; };
} }
const planetId = active instanceof SystemManager ? active.data._id : active._id;
--- ---
<LoggedIn id="ships" title="Ships">
<Layout title="Ships">
<NavBar loggedIn="true" active="ships" />
<ResourceBar />
<div id="ship-modal-background"> <div id="ship-modal-background">
<div id="ship-modal-details" data-building-id=""> <div id="ship-modal-details" data-building-id="">
<h3>Required resources</h3> <h3>Required resources</h3>
@ -65,94 +42,16 @@ for(const ship of ships) {
category="ships" category="ships"
id={ship.id} id={ship.id}
name={getObj(lang, "ships", ship.id).name} name={getObj(lang, "ships", ship.id).name}
level={planet.ships.getShipById(ship.id)?.amount.toString() ?? "0"} level={active.ships.getShipById(ship.id)?.amount.toString() ?? "0"}
description={getObj(lang, "ships", ship.id).description ?? ""} description={getObj(lang, "ships", ship.id).description ?? ""}
image={`/images/ships/${ship.id}.jpeg`} image={`/images/ships/${ship.id}.jpeg`}
button_type="general" button_type="general"
button_name="nav-build" /> button_name="nav-build" />
</>)} </>)}
</div> </div>
</Layout> </LoggedIn>
<style> <style>
* {
color: white;
}
main {
margin: auto;
padding: 1rem;
width: 800px;
max-width: calc(100% - 2rem);
color: white;
font-size: 20px;
line-height: 1.6;
}
.astro-a {
position: absolute;
top: -32px;
left: 50%;
transform: translatex(-50%);
width: 220px;
height: auto;
z-index: -1;
}
h3 {
font-size: 2rem;
font-weight: 700;
line-height: 1;
text-align: center;
margin-bottom: 1em;
}
.text-gradient {
background-image: var(--accent-gradient);
-webkit-background-clip: text;
-webkit-text-fill-color: transparent;
background-size: 400%;
background-position: 0%;
}
.instructions {
margin-bottom: 2rem;
border: 1px solid rgba(var(--accent-light), 25%);
background: linear-gradient(rgba(var(--accent-dark), 66%), rgba(var(--accent-dark), 33%));
padding: 1.5rem;
border-radius: 8px;
}
.instructions code {
font-size: 0.8em;
font-weight: bold;
background: rgba(var(--accent-light), 12%);
color: rgb(var(--accent-light));
border-radius: 4px;
padding: 0.3em 0.4em;
}
.instructions strong {
color: rgb(var(--accent-light));
}
.link-card-grid {
display: grid;
grid-template-columns: repeat(auto-fit, minmax(24ch, 1fr));
gap: 2rem;
padding: 0;
}
.a-button {
text-decoration: none;
color: green;
height: fit-content;
}
.a-button:hover {
color: lime;
}
.ship-cards { .ship-cards {
display: flex; display: flex;
flex-direction: row; flex-direction: row;

21
src/pages/game/systemManager/index.astro
View File

@ -1,24 +1,12 @@
--- ---
import { ObjectId } from "mongodb"; import { ObjectId } from "mongodb";
import NavBar from "../../../components/NavBar.astro"; import LoggedIn from "../../../layouts/LoggedIn.astro";
import ResourceBar from "../../../components/ResourceBar.astro";
import Layout from "../../../layouts/Layout.astro";
import locationManager from "../../../lib/classes/managers/LocationManager"; import locationManager from "../../../lib/classes/managers/LocationManager";
import { getUserByAccessToken } from "../../../lib/db/users";
const loggedToken = Astro.cookies.get('sessionToken')?.value ?? null;
const username = Astro.cookies.get('username')?.value ?? "";
if(loggedToken === null || username === "") return Astro.redirect('/logout');
const checkUser = await getUserByAccessToken(loggedToken);
if(checkUser === null || checkUser.username !== username) return Astro.redirect('/logout');
const currentSystemId = Astro.cookies.get('currentSystem')?.value ?? null; const currentSystemId = Astro.cookies.get('currentSystem')?.value ?? null;
if(currentSystemId === null) return Astro.redirect('/game/systemManager/select'); if(currentSystemId === null) return Astro.redirect('/game/systemManager/select');
const currentSystem = locationManager.getSystem(new ObjectId(currentSystemId)); const currentSystem = locationManager.getSystem(new ObjectId(currentSystemId));
if(currentSystem === undefined) { if(currentSystem === undefined) {
Astro.cookies.delete('currentSystem'); Astro.cookies.delete('currentSystem');
return Astro.redirect('/game/systemManager/select'); return Astro.redirect('/game/systemManager/select');
@ -39,10 +27,7 @@ if(Astro.request.method === "POST") {
return Astro.redirect('/game/systemManager'); return Astro.redirect('/game/systemManager');
} }
--- ---
<Layout title="System Manager"> <LoggedIn id="systemManager" title="System Manager">
<NavBar loggedIn="true" active="systemManager" />
<ResourceBar />
<h1>Selected system: {currentSystem.data.name} in {currentSystem.data.sector.name} in {currentSystem.data.sector.galaxy.name} <a href="/game/systemManager/select">(change)</a></h1> <h1>Selected system: {currentSystem.data.name} in {currentSystem.data.sector.name} in {currentSystem.data.sector.galaxy.name} <a href="/game/systemManager/select">(change)</a></h1>
<div class="system-links"> <div class="system-links">
<a href="/game/systemManager">Overview</a> <a href="/game/systemManager">Overview</a>
@ -85,7 +70,7 @@ if(Astro.request.method === "POST") {
</div> </div>
))} ))}
</div> </div>
</Layout> </LoggedIn>
<style> <style>
* { * {
color: white; color: white;

22
src/pages/game/systemManager/select.astro
View File

@ -1,16 +1,9 @@
--- ---
import NavBar from "../../../components/NavBar.astro"; import LoggedIn from "../../../layouts/LoggedIn.astro";
import ResourceBar from "../../../components/ResourceBar.astro"; import User from "../../../lib/classes/User";
import Layout from "../../../layouts/Layout.astro";
import locationManager from "../../../lib/classes/managers/LocationManager"; import locationManager from "../../../lib/classes/managers/LocationManager";
import { getUserByAccessToken } from "../../../lib/db/users";
const loggedToken = Astro.cookies.get('sessionToken')?.value ?? null; const user: User = Astro.locals.user;
const username = Astro.cookies.get('username')?.value ?? "";
if(loggedToken === null || username === "") return Astro.redirect('/logout');
const checkUser = await getUserByAccessToken(loggedToken);
if(checkUser === null || checkUser.username !== username) return Astro.redirect('/logout');
if(Astro.request.method === "POST") { if(Astro.request.method === "POST") {
const selectedSystemId = (await Astro.request.formData()).get('systemId') as string | null; const selectedSystemId = (await Astro.request.formData()).get('systemId') as string | null;
@ -27,12 +20,9 @@ if(Astro.request.method === "POST") {
} }
} }
const systems = locationManager.getSystemsOwnedBy(checkUser._id); const systems = locationManager.getSystemsOwnedBy(user.id);
--- ---
<Layout title="System Manager"> <LoggedIn id="systemManager" title="System Manager">
<NavBar loggedIn="true" active="systemManager" />
<ResourceBar />
<div class="systems-list"> <div class="systems-list">
{systems.map(system => ( {systems.map(system => (
<div class="system-card"> <div class="system-card">
@ -41,7 +31,7 @@ const systems = locationManager.getSystemsOwnedBy(checkUser._id);
</div> </div>
))} ))}
</div> </div>
</Layout> </LoggedIn>
<style> <style>
.systems-list { .systems-list {
display: flex; display: flex;

29
src/pages/game/systemManager/structures.astro
View File

@ -1,26 +1,16 @@
--- ---
import { ObjectId } from "mongodb"; import { ObjectId } from "mongodb";
import NavBar from "../../../components/NavBar.astro";
import ResourceBar from "../../../components/ResourceBar.astro";
import Layout from "../../../layouts/Layout.astro";
import locationManager from "../../../lib/classes/managers/LocationManager";
import { getUserByAccessToken } from "../../../lib/db/users";
import { getHighestWeightedLanguage, getLocales, getName, getObj } from "../../../lib/utils/langDriver";
import ItemCard from "../../../components/ItemCard.astro"; import ItemCard from "../../../components/ItemCard.astro";
import LoggedIn from "../../../layouts/LoggedIn.astro";
import locationManager from "../../../lib/classes/managers/LocationManager";
import { getName, getObj } from "../../../lib/utils/langDriver";
const loggedToken = Astro.cookies.get('sessionToken')?.value ?? null; const { token, lang } = Astro.locals;
const username = Astro.cookies.get('username')?.value ?? "";
if(loggedToken === null || username === "") return Astro.redirect('/logout');
const checkUser = await getUserByAccessToken(loggedToken);
if(checkUser === null || checkUser.username !== username) return Astro.redirect('/logout');
const currentSystemId = Astro.cookies.get('currentSystem')?.value ?? null; const currentSystemId = Astro.cookies.get('currentSystem')?.value ?? null;
if(currentSystemId === null) return Astro.redirect('/game/systemManager/select'); if(currentSystemId === null) return Astro.redirect('/game/systemManager/select');
const currentSystem = locationManager.getSystem(new ObjectId(currentSystemId)); const currentSystem = locationManager.getSystem(new ObjectId(currentSystemId));
if(currentSystem === undefined) { if(currentSystem === undefined) {
Astro.cookies.delete('currentSystem'); Astro.cookies.delete('currentSystem');
return Astro.redirect('/game/systemManager/select'); return Astro.redirect('/game/systemManager/select');
@ -33,7 +23,7 @@ if(Astro.request.method === "POST") {
method: 'POST', method: 'POST',
headers: { headers: {
'Content-Type': 'application/json', 'Content-Type': 'application/json',
'Authorization': 'Bearer ' + loggedToken 'Authorization': 'Bearer ' + token
}, },
body: JSON.stringify({ body: JSON.stringify({
system: currentSystemId, system: currentSystemId,
@ -44,8 +34,6 @@ if(Astro.request.method === "POST") {
console.log(request); console.log(request);
} }
const lang = await getLocales(Astro.cookies.get('language')?.value ?? await getHighestWeightedLanguage(Astro.request.headers.get('accept-language')));
const modalSet: { [key: string]: { resources: Array<any>, research: Array<any>, structures: Array<any>, energy: number } } = {}; const modalSet: { [key: string]: { resources: Array<any>, research: Array<any>, structures: Array<any>, energy: number } } = {};
const structureList = currentSystem.structures.structuresDB; const structureList = currentSystem.structures.structuresDB;
@ -63,10 +51,7 @@ for(const structure of structureList) {
}; };
} }
--- ---
<Layout title="System Manager"> <LoggedIn id="systemManager" title="System Manager">
<NavBar loggedIn="true" active="systemManager" />
<ResourceBar />
<h1>Selected system: {currentSystem.data.name} <a href="/game/systemManager/select">(change)</a></h1> <h1>Selected system: {currentSystem.data.name} <a href="/game/systemManager/select">(change)</a></h1>
<div class="system-links"> <div class="system-links">
<a href="/game/systemManager">Overview</a> <a href="/game/systemManager">Overview</a>
@ -98,7 +83,7 @@ for(const structure of structureList) {
/> />
))} ))}
</div> </div>
</Layout> </LoggedIn>
<style> <style>
* { * {
color: white; color: white;

8
tsconfig.json
View File

@ -4,5 +4,11 @@
"verbatimModuleSyntax": false, "verbatimModuleSyntax": false,
"module": "ES2022", "module": "ES2022",
"moduleResolution": "node" "moduleResolution": "node"
} },
"include": [
"src/env.d.ts",
"src/**/*.ts",
"src/**/*.tsx",
"src/**/*.astro"
]
} }