Files
OpenFrontIO/src/client/LocalServer.ts
T
YoussfeCantCode 1c52d20e83 Added pause functionality for private multiplayer games (#2657)
If this PR fixes an issue, link it below. If not, delete these two
lines.
Resolves #2491

## Description:
Adds pause/unpause functionality for private multiplayer games. Only the
lobby creator can pause the game, and all players see a pause overlay
when the game is paused.

  **Key features:**
- Lobby creator sees pause/play button in control panel (alongside
existing singleplayer/replay controls)
  - Server validates that only lobby creator can toggle pause
  - All players see "Game paused by Lobby Creator" overlay when paused
  - Game state freezes (no turn execution) while paused
  - Unpause resumes normal gameplay

  **Implementation details:**
- Server-side pause state (`isPaused`) prevents turn execution during
pause
- Each client receives `isLobbyCreator` flag in `GameStartInfo` to
show/hide pause button
- Added `TogglePauseIntent` that broadcasts to all clients via
`NoOpExecution`
  - New `PauseOverlay` component (shows in single player also)

## Please complete the following:

- [x] I have added screenshots for all UI updates
- [x] I process any text displayed to the user through translateText()
and I've added it to the en.json file
- [x] I have added relevant tests to the test directory
- [x] I confirm I have thoroughly tested these changes and take full
responsibility for any bugs introduced

## Please put your Discord username so you can be contacted if a bug or
regression is found:

furo18

<img width="1459" height="861" alt="Screenshot 2025-12-20 at 15 16 33"
src="https://github.com/user-attachments/assets/f5a3222f-f54b-473c-b0f6-104ce4c1e7a8"
/>
2025-12-26 10:21:18 -08:00

291 lines
8.5 KiB
TypeScript

import { z } from "zod";
import { EventBus } from "../core/EventBus";
import {
AllPlayersStats,
ClientMessage,
ClientSendWinnerMessage,
Intent,
PartialGameRecordSchema,
PlayerRecord,
ServerMessage,
ServerStartGameMessage,
Turn,
} from "../core/Schemas";
import {
createPartialGameRecord,
decompressGameRecord,
getClanTag,
replacer,
} from "../core/Util";
import { getPersistentID } from "./Auth";
import { LobbyConfig } from "./ClientGameRunner";
import { ReplaySpeedChangeEvent } from "./InputHandler";
import { defaultReplaySpeedMultiplier } from "./utilities/ReplaySpeedMultiplier";
export class LocalServer {
// All turns from the game record on replay.
private replayTurns: Turn[] = [];
private turns: Turn[] = [];
private intents: Intent[] = [];
private startedAt: number;
private paused = false;
private replaySpeedMultiplier = defaultReplaySpeedMultiplier;
private winner: ClientSendWinnerMessage | null = null;
private allPlayersStats: AllPlayersStats = {};
private turnsExecuted = 0;
private turnStartTime = 0;
private turnCheckInterval: NodeJS.Timeout;
private clientConnect: () => void;
private clientMessage: (message: ServerMessage) => void;
constructor(
private lobbyConfig: LobbyConfig,
private isReplay: boolean,
private eventBus: EventBus,
) {}
public updateCallback(
clientConnect: () => void,
clientMessage: (message: ServerMessage) => void,
) {
this.clientConnect = clientConnect;
this.clientMessage = clientMessage;
}
start() {
console.log("local server starting");
this.turnCheckInterval = setInterval(() => {
const turnIntervalMs =
this.lobbyConfig.serverConfig.turnIntervalMs() *
this.replaySpeedMultiplier;
if (
this.turnsExecuted === this.turns.length &&
Date.now() > this.turnStartTime + turnIntervalMs
) {
this.turnStartTime = Date.now();
// End turn on the server means the client will start processing the turn.
this.endTurn();
}
}, 5);
this.eventBus.on(ReplaySpeedChangeEvent, (event) => {
this.replaySpeedMultiplier = event.replaySpeedMultiplier;
});
this.startedAt = Date.now();
this.clientConnect();
if (this.lobbyConfig.gameRecord) {
this.replayTurns = decompressGameRecord(
this.lobbyConfig.gameRecord,
).turns;
}
if (this.lobbyConfig.gameStartInfo === undefined) {
throw new Error("missing gameStartInfo");
}
this.clientMessage({
type: "start",
gameStartInfo: this.lobbyConfig.gameStartInfo,
turns: [],
lobbyCreatedAt: this.lobbyConfig.gameStartInfo.lobbyCreatedAt,
} satisfies ServerStartGameMessage);
}
onMessage(clientMsg: ClientMessage) {
if (clientMsg.type === "rejoin") {
this.clientMessage({
type: "start",
gameStartInfo: this.lobbyConfig.gameStartInfo!,
turns: this.turns,
lobbyCreatedAt: this.lobbyConfig.gameStartInfo!.lobbyCreatedAt,
} satisfies ServerStartGameMessage);
}
if (clientMsg.type === "intent") {
if (clientMsg.intent.type === "toggle_pause") {
if (clientMsg.intent.paused) {
// Pausing: add intent and end turn before pause takes effect
this.intents.push(clientMsg.intent);
this.endTurn();
this.paused = true;
} else {
// Unpausing: clear pause flag before adding intent so next turn can execute
this.paused = false;
this.intents.push(clientMsg.intent);
this.endTurn();
}
return;
}
// Don't process non-pause intents during replays or while paused
if (this.lobbyConfig.gameRecord || this.paused) {
return;
}
this.intents.push(clientMsg.intent);
}
if (clientMsg.type === "hash") {
if (!this.lobbyConfig.gameRecord) {
if (clientMsg.turnNumber % 100 === 0) {
// In singleplayer, only store hash every 100 turns to reduce size of game record.
this.turns[clientMsg.turnNumber].hash = clientMsg.hash;
}
return;
}
// If we are replaying a game then verify hash.
const archivedHash = this.replayTurns[clientMsg.turnNumber].hash;
if (!archivedHash) {
console.warn(
`no archived hash found for turn ${clientMsg.turnNumber}, client hash: ${clientMsg.hash}`,
);
return;
}
if (archivedHash !== clientMsg.hash) {
console.error(
`desync detected on turn ${clientMsg.turnNumber}, client hash: ${clientMsg.hash}, server hash: ${archivedHash}`,
);
this.clientMessage({
type: "desync",
turn: clientMsg.turnNumber,
correctHash: archivedHash,
clientsWithCorrectHash: 0,
totalActiveClients: 1,
yourHash: clientMsg.hash,
});
} else {
console.log(
`hash verified on turn ${clientMsg.turnNumber}, client hash: ${clientMsg.hash}, server hash: ${archivedHash}`,
);
}
}
if (clientMsg.type === "winner") {
this.winner = clientMsg;
this.allPlayersStats = clientMsg.allPlayersStats;
}
}
// This is so the client can tell us when it finished processing the turn.
public turnComplete() {
this.turnsExecuted++;
}
// endTurn in this context means the server has collected all the intents
// and will send the turn to the client.
private endTurn() {
if (this.paused) {
return;
}
if (this.replayTurns.length > 0) {
if (this.turns.length >= this.replayTurns.length) {
this.endGame();
return;
}
this.intents = this.replayTurns[this.turns.length].intents;
}
const pastTurn: Turn = {
turnNumber: this.turns.length,
intents: this.intents,
};
this.turns.push(pastTurn);
this.intents = [];
this.clientMessage({
type: "turn",
turn: pastTurn,
});
}
public endGame() {
console.log("local server ending game");
clearInterval(this.turnCheckInterval);
if (this.isReplay) {
return;
}
const players: PlayerRecord[] = [
{
persistentID: getPersistentID(),
username: this.lobbyConfig.playerName,
clientID: this.lobbyConfig.clientID,
stats: this.allPlayersStats[this.lobbyConfig.clientID],
cosmetics: this.lobbyConfig.gameStartInfo?.players[0].cosmetics,
clanTag: getClanTag(this.lobbyConfig.playerName) ?? undefined,
},
];
if (this.lobbyConfig.gameStartInfo === undefined) {
throw new Error("missing gameStartInfo");
}
const record = createPartialGameRecord(
this.lobbyConfig.gameStartInfo.gameID,
this.lobbyConfig.gameStartInfo.config,
players,
this.turns,
this.startedAt,
Date.now(),
this.winner?.winner,
);
const result = PartialGameRecordSchema.safeParse(record);
if (!result.success) {
const error = z.prettifyError(result.error);
console.error("Error parsing game record", error);
return;
}
const workerPath = this.lobbyConfig.serverConfig.workerPath(
this.lobbyConfig.gameStartInfo.gameID,
);
const jsonString = JSON.stringify(result.data, replacer);
compress(jsonString)
.then((compressedData) => {
return fetch(`/${workerPath}/api/archive_singleplayer_game`, {
method: "POST",
headers: {
"Content-Type": "application/json",
"Content-Encoding": "gzip",
},
body: compressedData,
keepalive: true, // Ensures request completes even if page unloads
});
})
.catch((error) => {
console.error("Failed to archive singleplayer game:", error);
});
}
}
async function compress(data: string): Promise<ArrayBuffer> {
const stream = new CompressionStream("gzip");
const writer = stream.writable.getWriter();
const reader = stream.readable.getReader();
// Write the data to the compression stream
writer.write(new TextEncoder().encode(data));
writer.close();
// Read the compressed data
const chunks: Uint8Array[] = [];
let done = false;
while (!done) {
const { value, done: readerDone } = await reader.read();
done = readerDone;
if (value) {
chunks.push(value);
}
}
// Combine all chunks into a single Uint8Array
const totalLength = chunks.reduce((acc, chunk) => acc + chunk.length, 0);
const compressedData = new Uint8Array(totalLength);
let offset = 0;
for (const chunk of chunks) {
compressedData.set(chunk, offset);
offset += chunk.length;
}
return compressedData.buffer;
}