/*
Hurry Curry! - a game about cooking
Copyright 2024 metamuffin
This program is free software: you can redistribute it and/or modify
it under the terms of the GNU Affero General Public License as published by
the Free Software Foundation, version 3 of the License only.
This program is distributed in the hope that it will be useful,
but WITHOUT ANY WARRANTY; without even the implied warranty of
MERCHANTABILITY or FITNESS FOR A PARTICULAR PURPOSE. See the
GNU Affero General Public License for more details.
You should have received a copy of the GNU Affero General Public License
along with this program. If not, see .
*/
///
import { MovementBase, collide_player_player, update_movement } from "./movement.ts";
import { Gamedata, ItemIndex, ItemLocation, Message, PacketC, PacketS, PlayerID, TileIndex } from "./protocol.ts";
import { V2, lerp_exp_v2_mut, normalize, lerp_exp } from "./util.ts";
import { draw_ingame, draw_wait } from "./visual.ts";
const KEY_INTERACT = "KeyJ"
const KEY_BOOST = "KeyK"
const KEY_UP = "KeyW"
const KEY_DOWN = "KeyS"
const KEY_LEFT = "KeyA"
const KEY_RIGHT = "KeyD"
const KEY_CHAT = "Enter"
const KEY_CLOSE = "Escape"
const HANDLED_KEYS = [KEY_BOOST, KEY_CHAT, KEY_CLOSE, KEY_DOWN, KEY_UP, KEY_LEFT, KEY_RIGHT]
export let ctx: CanvasRenderingContext2D;
export let canvas: HTMLCanvasElement;
let ws: WebSocket;
document.addEventListener("DOMContentLoaded", () => {
const ws_uri = window.location.protocol.endsWith("s:")
? `wss://${window.location.host}/`
: `ws://${window.location.hostname}:27032/`
ws = new WebSocket(ws_uri)
ws.onerror = console.error
ws.onmessage = m => {
packet(JSON.parse(m.data) as PacketC);
}
ws.onclose = () => console.log("close")
ws.onopen = () => {
console.log("open")
send({ type: "join", name: "test", character: Math.floor(Math.random() * 255) })
}
canvas = document.createElement("canvas");
document.body.append(canvas)
ctx = canvas.getContext("2d")!
resize()
globalThis.addEventListener("resize", resize)
draw()
document.addEventListener("keydown", ev => keyboard(ev, true))
document.addEventListener("keyup", ev => keyboard(ev, false))
document.addEventListener("contextmenu", ev => ev.preventDefault())
setInterval(tick_update, 1000 / 25);
})
export interface ItemData {
kind: ItemIndex,
x: number,
y: number,
tracking?: V2,
progress?: number
progress_warn?: boolean
remove_anim?: number
}
export interface PlayerData extends MovementBase {
id: number,
name: string,
item?: ItemData,
direction: V2,
character: number,
anim_position: V2,
message?: MessageData,
message_clear?: number,
}
export interface TileData {
x: number, y: number // tile position
position: V2, // center position
kind: TileIndex
item?: ItemData
}
export interface MessageData {
inner: Message
anim_position: V2,
anim_size: number,
}
export const players = new Map()
export const tiles = new Map()
export const items_removed = new Set()
export let data: Gamedata = { item_names: [], tile_names: [], spawn: [0, 0], tile_collide: [], tile_interact: [], maps: {} }
export let time_remaining: number | null = null
export let global_message: MessageData | undefined = undefined
let global_message_clear: number | undefined = undefined
export let my_id: PlayerID = -1
export let points = 0
export let demands_completed = 0
export let demands_failed = 0
export const camera: V2 = { x: 0, y: 0 }
export let camera_scale = 0.05;
export const interact_target_anim: V2 = { x: 0, y: 0 }
export let interact_possible_anim: number = 0
export let interact_active_anim: number = 0
export let nametag_scale_anim: number = 0
let interacting: V2 | undefined;
let last_server_sent_position: V2 = { x: 0, y: 0 }
function get_item_location(loc: ItemLocation): PlayerData | TileData {
if ("tile" in loc) return tiles.get(loc.tile.toString())!
if ("player" in loc) return players.get(loc.player)!
throw new Error("invalid item location");
}
function send(p: PacketS) { ws.send(JSON.stringify(p)) }
function packet(p: PacketC) {
if (!["position", "set_progress", "update_map"].includes(p.type))
console.log(p);
switch (p.type) {
case "version":
console.log(`Protocol version: ${p.major}.${p.minor}`);
break;
case "joined":
my_id = p.id
break;
case "data":
data = p.data
break;
case "add_player": {
players.set(p.id, {
id: p.id,
position: { x: p.position[0], y: p.position[1], },
anim_position: { x: p.position[0], y: p.position[1] },
character: p.character,
name: p.name,
rot: 0,
facing: { x: 0, y: 1 },
vel: { x: 0, y: 0 },
direction: { x: 0, y: 0 },
stamina: 0,
boosting: false,
})
break;
}
case "remove_player":
players.delete(p.id)
break;
case "movement": {
const pl = players.get(p.player)!
const pos = { x: p.pos[0], y: p.pos[1] }
// const dist = length(sub_v2(pl.position, pos));a
// TODO this is actually not a good idea if latency is too high
// if (p.player == my_id && dist < 3) return; // we know better where we are
if (p.player == my_id) return last_server_sent_position = pos
pl.position.x = pos.x
pl.position.y = pos.y
pl.boosting = p.boost
pl.rot = p.rot
break;
}
case "move_item": {
const from = get_item_location(p.from)
const to = get_item_location(p.to)
to.item = from.item
to.item!.tracking = to.position
from.item = undefined
break;
}
case "set_item": {
const slot = get_item_location(p.location)
if (slot.item !== undefined && slot.item !== null) items_removed.add(slot.item)
slot.item = undefined
if (p.item !== undefined && p.item !== null) slot.item = { kind: p.item, x: slot.position.x, y: slot.position.y, tracking: slot.position }
break;
}
case "set_progress": {
const slot = get_item_location(p.item)
if (!slot.item) return
slot.item.progress = p.progress
slot.item.progress_warn = p.warn
break;
}
case "update_map":
if (p.kind !== undefined && p.kind !== null)
tiles.set(p.tile.toString(), {
x: p.tile[0],
y: p.tile[1],
position: { x: p.tile[0] + 0.5, y: p.tile[1] + 0.5 },
kind: p.kind
})
else
tiles.delete(p.tile.toString())
break;
case "communicate": {
const player = players.get(p.player)!
if (player.message_clear) clearTimeout(player.message_clear)
if (p.message) player.message = { inner: p.message, anim_size: 0., anim_position: player.anim_position }
if (p.persist && !p.message) player.message = undefined
if (!p.persist) player.message_clear = setTimeout(() => delete player.message, 3000)
break;
}
case "score":
demands_completed = p.demands_completed
demands_failed = p.demands_failed
points = p.points
time_remaining = p.time_remaining ?? null
break;
case "error":
if (global_message_clear) clearTimeout(global_message_clear)
global_message = { inner: { text: p.message }, anim_size: 0., anim_position: { x: 0, y: 0 } }
global_message_clear = setTimeout(() => global_message = undefined, 4000)
console.warn(p.message)
break;
case "server_message":
if (global_message_clear) clearTimeout(global_message_clear)
global_message = { inner: { text: p.text }, anim_size: 0., anim_position: { x: 0, y: 0 } }
global_message_clear = setTimeout(() => global_message = undefined, 4000)
break;
case "set_ingame":
console.log(`ingame ${p.state}`);
break;
case "movement_sync":
players.get(my_id)!.position = last_server_sent_position
break;
case "menu":
switch (p.menu) {
case "book": open("https://s.metamuffin.org/static/hurrycurry/book.pdf"); break
case "score": alert("Your score: " + JSON.stringify(p.data)); break
default: console.warn("unknown menu");
}
break;
default:
console.warn("unknown packet", p);
}
}
export let chat: null | HTMLInputElement = null;
export const keys_down = new Set();
function keyboard(ev: KeyboardEvent, down: boolean) {
if (down && ev.code == KEY_CHAT) return toggle_chat()
else if (down && ev.code == KEY_CLOSE && chat) return close_chat()
else if (chat) return
if (HANDLED_KEYS.includes(ev.code)) ev.preventDefault()
if (!keys_down.has(KEY_INTERACT) && ev.code == KEY_INTERACT && down) set_interact(true)
if (keys_down.has(KEY_INTERACT) && ev.code == KEY_INTERACT && !down) set_interact(false)
if (down && ev.code == "Numpad1") send({ player: my_id, type: "communicate", message: { text: "/start junior" }, persist: false })
if (down && ev.code == "Numpad2") send({ player: my_id, type: "communicate", message: { text: "/start senior" }, persist: false })
if (down && ev.code == "Numpad3") send({ player: my_id, type: "communicate", message: { text: "/start sophomore" }, persist: false })
if (down && ev.code == "Numpad4") send({ player: my_id, type: "communicate", message: { text: "/start debug" }, persist: false })
if (down && ev.code == "Numpad5") send({ player: my_id, type: "communicate", message: { text: "/start bus" }, persist: false })
if (down && ev.code == "Numpad0") send({ player: my_id, type: "communicate", message: { text: "/end" }, persist: false })
if (down) keys_down.add(ev.code)
else keys_down.delete(ev.code)
}
function close_chat() {
if (!chat) return
chat.remove()
canvas.focus()
chat = null;
}
function toggle_chat() {
if (chat) {
if (chat.value.length) send({ player: my_id, type: "communicate", message: { text: chat.value }, persist: false })
chat.remove()
canvas.focus()
chat = null;
} else {
chat = document.createElement("input")
chat.type = "text"
chat.placeholder = "Message"
document.body.append(chat)
chat.focus()
}
}
export function get_interact_target(): V2 | undefined {
if (interacting) return interacting
const me = players.get(my_id)
if (!me) return
return {
x: Math.floor(me.position.x + Math.sin(me.rot)),
y: Math.floor(me.position.y + Math.cos(me.rot))
}
}
function set_interact(edge: boolean) {
if (edge) interacting = get_interact_target()
if (interacting) send({ player: my_id, type: "interact", pos: edge ? [interacting.x, interacting.y] : undefined })
if (!edge) interacting = undefined
}
function tick_update() {
const p = players.get(my_id)
if (!p) return
send({ player: my_id, type: "movement", pos: [p.position.x, p.position.y], dir: [p.direction.x, p.direction.y], boost: p.boosting })
}
function frame_update(dt: number) {
const p = players.get(my_id)
if (!p) return
if (time_remaining != null) time_remaining -= dt
const direction = normalize({
x: (+keys_down.has(KEY_RIGHT) - +keys_down.has(KEY_LEFT)),
y: (+keys_down.has(KEY_DOWN) - +keys_down.has(KEY_UP))
})
if (interacting) direction.x *= 0, direction.y *= 0
p.direction = direction
update_movement(p, dt, direction, keys_down.has("KeyK"))
for (const [_, a] of players)
for (const [_, b] of players)
collide_player_player(a, b, dt)
const update_item = (item: ItemData) => {
if (item.tracking) lerp_exp_v2_mut(item, item.tracking, dt * 10.)
}
for (const [pid, player] of players) {
if (pid == my_id) player.anim_position.x = player.position.x, player.anim_position.y = player.position.y
else lerp_exp_v2_mut(player.anim_position, player.position, dt * 15)
if (player.item !== undefined && player.item !== null) update_item(player.item)
if (player.message) player.message.anim_size = lerp_exp(player.message.anim_size, 1, dt * 3)
}
for (const [_, tile] of tiles) {
if (tile.item !== undefined && tile.item !== null) update_item(tile.item)
}
const remove: ItemData[] = []
for (const item of items_removed) {
update_item(item)
if (item.remove_anim === undefined) item.remove_anim = 0
item.remove_anim += dt * 4.
if (item.remove_anim > 1.) remove.push(item)
}
remove.forEach(i => items_removed.delete(i))
lerp_exp_v2_mut(camera, p.position, dt * 10.)
const it = get_interact_target() ?? { x: 0, y: 0 };
const possible = data.tile_interact[tiles.get([it.x, it.y].toString())?.kind ?? 0] ?? false
lerp_exp_v2_mut(interact_target_anim, it, dt * 15.)
interact_possible_anim = lerp_exp(interact_possible_anim, +possible, dt * 18.)
interact_active_anim = lerp_exp(interact_active_anim, +!!interacting, dt * 15.)
const zoom_target = Math.min(canvas.width, canvas.height) * (keys_down.has("KeyL") ? 0.05 : 0.1)
camera_scale = lerp_exp(camera_scale, zoom_target, dt * 5)
nametag_scale_anim = lerp_exp(nametag_scale_anim, +keys_down.has("KeyL"), dt * 10)
}
function resize() {
canvas.width = globalThis.innerWidth
canvas.height = globalThis.innerHeight
}
let last_frame = performance.now()
function draw() {
const now = performance.now()
frame_update((now - last_frame) / 1000)
last_frame = now;
if (ws.readyState == ws.CONNECTING) draw_wait("Connecting...")
else if (ws.readyState == ws.CLOSING) draw_wait("Closing...")
else if (ws.readyState == ws.CLOSED) draw_wait("Disconnected")
else if (ws.readyState == ws.OPEN) draw_ingame()
else throw new Error(`ws state invalid`);
requestAnimationFrame(draw)
}