summaryrefslogtreecommitdiff
path: root/client
diff options
context:
space:
mode:
Diffstat (limited to 'client')
-rw-r--r--client/.eslintrc.js6
-rw-r--r--client/index.html2
-rw-r--r--client/public/css/colors.css2
-rw-r--r--client/public/css/style.css10
-rw-r--r--client/public/css/tf.css2
-rw-r--r--client/public/css/theme.css2
-rw-r--r--client/src/JumpStorm.ts69
-rw-r--r--client/src/components/GameCanvas.svelte5
-rw-r--r--client/src/components/LeaderBoard.svelte2
-rw-r--r--client/src/main.ts4
-rw-r--r--client/src/routes/Home.svelte3
-rw-r--r--client/svelte.config.js6
-rw-r--r--client/vite.config.ts22
13 files changed, 77 insertions, 58 deletions
diff --git a/client/.eslintrc.js b/client/.eslintrc.js
index f200fbf..a9b1e2d 100644
--- a/client/.eslintrc.js
+++ b/client/.eslintrc.js
@@ -1,11 +1,11 @@
module.exports = {
extends: [
// add more generic rule sets here, such as:
- "eslint:recommended",
- "plugin:svelte/recommended",
+ 'eslint:recommended',
+ 'plugin:svelte/recommended'
],
rules: {
// override/add rules settings here, such as:
// 'svelte/rule-name': 'error'
- },
+ }
};
diff --git a/client/index.html b/client/index.html
index 00b94e7..892a3af 100644
--- a/client/index.html
+++ b/client/index.html
@@ -1,4 +1,4 @@
-<!DOCTYPE html>
+<!doctype html>
<html lang="en">
<head>
<meta charset="UTF-8" />
diff --git a/client/public/css/colors.css b/client/public/css/colors.css
index 067ddcd..6108028 100644
--- a/client/public/css/colors.css
+++ b/client/public/css/colors.css
@@ -10,7 +10,7 @@
--orange: #af3a03;
}
-[data-theme="dark"] {
+[data-theme='dark'] {
--bg: #282828;
--text: #f9f5d7;
--red: #fb4934;
diff --git a/client/public/css/style.css b/client/public/css/style.css
index cdfef76..4dfe605 100644
--- a/client/public/css/style.css
+++ b/client/public/css/style.css
@@ -1,15 +1,15 @@
-@import url("./theme.css");
-@import url("./tf.css");
+@import url('./theme.css');
+@import url('./tf.css');
@font-face {
- font-family: "scientifica";
- src: url("/fonts/scientifica.ttf");
+ font-family: 'scientifica';
+ src: url('/fonts/scientifica.ttf');
}
* {
padding: 0;
margin: 0;
- font-family: "scientifica", monospace;
+ font-family: 'scientifica', monospace;
transition: background 0.2s ease-in-out;
font-smooth: never;
}
diff --git a/client/public/css/tf.css b/client/public/css/tf.css
index c1acd72..855fe0d 100644
--- a/client/public/css/tf.css
+++ b/client/public/css/tf.css
@@ -17,7 +17,7 @@
rgba(162, 254, 254, 1) 100%
);
- content: "";
+ content: '';
width: 100%;
height: 100%;
top: 0;
diff --git a/client/public/css/theme.css b/client/public/css/theme.css
index c65b2a8..eeb15ee 100644
--- a/client/public/css/theme.css
+++ b/client/public/css/theme.css
@@ -1,4 +1,4 @@
-@import url("./colors.css");
+@import url('./colors.css');
.primary {
color: var(--aqua);
diff --git a/client/src/JumpStorm.ts b/client/src/JumpStorm.ts
index 01cc8d8..92bddcf 100644
--- a/client/src/JumpStorm.ts
+++ b/client/src/JumpStorm.ts
@@ -1,6 +1,6 @@
-import { Game } from "@engine/Game";
-import { Entity } from "@engine/entities";
-import { Grid } from "@engine/structures";
+import { Game } from '@engine/Game';
+import { Entity, Floor } from '@engine/entities';
+import { Grid } from '@engine/structures';
import {
WallBounds,
FacingDirection,
@@ -8,17 +8,19 @@ import {
Physics,
Input,
Collision,
- NetworkUpdate,
-} from "@engine/systems";
+ NetworkUpdate
+} from '@engine/systems';
import {
type MessageQueueProvider,
type MessagePublisher,
type MessageProcessor,
type Message,
type EntityAddBody,
- MessageType,
-} from "@engine/network";
-import { stringify, parse } from "@engine/utils";
+ MessageType
+} from '@engine/network';
+import { stringify, parse } from '@engine/utils';
+import { BoundingBox, Sprite } from '@engine/components';
+import { Miscellaneous } from '@engine/config';
class ClientMessageProcessor implements MessageProcessor {
private game: Game;
@@ -29,14 +31,19 @@ class ClientMessageProcessor implements MessageProcessor {
public process(message: Message) {
switch (message.type) {
- case MessageType.NEW_ENTITY:
- const entityAddBody = message.body as unknown as EntityAddBody;
- this.game.addEntity(
- Entity.from(entityAddBody.entityName, entityAddBody.args),
+ case MessageType.NEW_ENTITIES:
+ const entityAdditions = message.body as unknown as EntityAddBody[];
+ entityAdditions.forEach((addBody) =>
+ this.game.addEntity(Entity.from(addBody.entityName, addBody.args))
);
break;
+ case MessageType.REMOVE_ENTITIES:
+ const ids = message.body as unknown as string[];
+ ids.forEach((id) => this.game.removeEntity(id));
+ break;
+ default:
+ break;
}
-
console.log(message);
}
}
@@ -49,9 +56,9 @@ class ClientSocketMessageQueueProvider implements MessageQueueProvider {
this.socket = socket;
this.messages = [];
- this.socket.addEventListener("message", (e) => {
- const message = parse<Message>(e.data);
- this.messages.push(message);
+ this.socket.addEventListener('message', (e) => {
+ const messages = parse<Message[]>(e.data);
+ this.messages = this.messages.concat(messages);
});
}
@@ -79,7 +86,7 @@ class ClientSocketMessagePublisher implements MessagePublisher {
public publish() {
this.messages.forEach((message: Message) =>
- this.socket.send(stringify(message)),
+ this.socket.send(stringify(message))
);
}
}
@@ -96,7 +103,7 @@ export class JumpStorm {
ctx: CanvasRenderingContext2D,
httpMethod: string,
wsMethod: string,
- host: string,
+ host: string
) {
await fetch(`${httpMethod}://${host}/assign`)
.then((resp) => {
@@ -115,7 +122,7 @@ export class JumpStorm {
const clientSocketMessageQueueProvider =
new ClientSocketMessageQueueProvider(socket);
const clientSocketMessagePublisher = new ClientSocketMessagePublisher(
- socket,
+ socket
);
const clientMessageProcessor = new ClientMessageProcessor(this.game);
[
@@ -123,14 +130,28 @@ export class JumpStorm {
new FacingDirection(),
new Physics(),
new Collision(grid),
- new WallBounds(ctx.canvas.width),
+ new WallBounds(),
new NetworkUpdate(
clientSocketMessageQueueProvider,
clientSocketMessagePublisher,
- clientMessageProcessor,
+ clientMessageProcessor
),
- new Render(ctx),
+ new Render(ctx)
].forEach((system) => this.game.addSystem(system));
+
+ const floor = new Floor(160);
+ const floorHeight = 40;
+
+ floor.addComponent(
+ new BoundingBox(
+ {
+ x: Miscellaneous.WIDTH / 2,
+ y: Miscellaneous.HEIGHT - floorHeight / 2
+ },
+ { width: Miscellaneous.WIDTH, height: floorHeight }
+ )
+ );
+ this.game.addEntity(floor);
}
public play() {
@@ -146,13 +167,13 @@ export class JumpStorm {
private createInputSystem(): Input {
const inputSystem = new Input(this.clientId);
- window.addEventListener("keydown", (e) => {
+ window.addEventListener('keydown', (e) => {
if (!e.repeat) {
inputSystem.keyPressed(e.key);
}
});
- window.addEventListener("keyup", (e) => inputSystem.keyReleased(e.key));
+ window.addEventListener('keyup', (e) => inputSystem.keyReleased(e.key));
return inputSystem;
}
diff --git a/client/src/components/GameCanvas.svelte b/client/src/components/GameCanvas.svelte
index ed16f33..ea7dd15 100644
--- a/client/src/components/GameCanvas.svelte
+++ b/client/src/components/GameCanvas.svelte
@@ -3,7 +3,7 @@
import { loadAssets } from "@engine/config";
import { Game } from "@engine/Game";
import { JumpStorm } from "../JumpStorm";
-
+
let canvas: HTMLCanvasElement;
let ctx: CanvasRenderingContext2D;
@@ -19,8 +19,7 @@
const game = new Game();
const jumpStorm = new JumpStorm(game);
- const url = new URL(document.location);
- await jumpStorm.init(ctx, "http", "ws", url.host + "/api");
+ await jumpStorm.init(ctx, "http", "ws", document.location.host + "/api");
jumpStorm.play();
});
</script>
diff --git a/client/src/components/LeaderBoard.svelte b/client/src/components/LeaderBoard.svelte
index 8343c56..2f3e411 100644
--- a/client/src/components/LeaderBoard.svelte
+++ b/client/src/components/LeaderBoard.svelte
@@ -3,7 +3,7 @@
const MAX_ENTRIES = 8;
- export let entries: { name: string, score: number }[] = [];
+ export let entries: { name: string; score: number }[] = [];
</script>
<div class="leaderboard">
diff --git a/client/src/main.ts b/client/src/main.ts
index 5332616..aa7431f 100644
--- a/client/src/main.ts
+++ b/client/src/main.ts
@@ -1,7 +1,7 @@
-import App from "./App.svelte";
+import App from './App.svelte';
const app = new App({
- target: document.getElementById("app"),
+ target: document.getElementById('app')
});
export default app;
diff --git a/client/src/routes/Home.svelte b/client/src/routes/Home.svelte
index 9ada10e..71ad324 100644
--- a/client/src/routes/Home.svelte
+++ b/client/src/routes/Home.svelte
@@ -3,10 +3,9 @@
import LeaderBoard from "../components/LeaderBoard.svelte";
import { Miscellaneous } from "@engine/config";
-
+
let width: number = Miscellaneous.WIDTH;
let height: number = Miscellaneous.HEIGHT;
-
</script>
<div class="centered-game">
diff --git a/client/svelte.config.js b/client/svelte.config.js
index b0683fd..db735be 100644
--- a/client/svelte.config.js
+++ b/client/svelte.config.js
@@ -1,7 +1,7 @@
-import { vitePreprocess } from '@sveltejs/vite-plugin-svelte'
+import { vitePreprocess } from '@sveltejs/vite-plugin-svelte';
export default {
// Consult https://svelte.dev/docs#compile-time-svelte-preprocess
// for more information about preprocessors
- preprocess: vitePreprocess(),
-}
+ preprocess: vitePreprocess()
+};
diff --git a/client/vite.config.ts b/client/vite.config.ts
index cdf1ab1..d8b999c 100644
--- a/client/vite.config.ts
+++ b/client/vite.config.ts
@@ -1,23 +1,23 @@
-import { defineConfig } from "vite";
-import { svelte } from "@sveltejs/vite-plugin-svelte";
-import { fileURLToPath, URL } from "node:url";
+import { defineConfig } from 'vite';
+import { svelte } from '@sveltejs/vite-plugin-svelte';
+import { fileURLToPath, URL } from 'node:url';
// https://vitejs.dev/config/
export default defineConfig({
server: {
proxy: {
- "/api": {
- target: "http://localhost:8080",
+ '/api': {
+ target: 'http://localhost:8080',
ws: true,
- rewrite: (path) => path.replace(/^\/api/, ""),
- },
- },
+ rewrite: (path) => path.replace(/^\/api/, '')
+ }
+ }
},
cors: true,
plugins: [svelte()],
resolve: {
alias: {
- "@engine": fileURLToPath(new URL("../engine", import.meta.url)),
- },
- },
+ '@engine': fileURLToPath(new URL('../engine', import.meta.url))
+ }
+ }
});
generated by cgit v1.2.3-70-g09d2 (git 2.46.0) at 2025-09-22 12:02:16 +0000