Main menu

client/gui/disconnected_screen.ts

@@ -0,0 +1,37 @@
+import { canvas, draw_rect, draw_text, measure_text } from "$/client/renderer/mod.ts";
+import { GuiScreen } from "./gui_screen.ts";
+import { back_to_title } from "./title_screen.ts";
+import { Button, TEXT_HEIGHT, TEXT_SCALE } from "./widgets.ts";
+
+const BUTTON_WIDTH = 440;
+const BUTTON_HEIGHT = 48;
+
+// why the game stopped, like minecraft's DisconnectedScreen
+export class DisconnectedScreen extends GuiScreen {
+	message: string;
+	back = new Button("Back to title screen", BUTTON_WIDTH, BUTTON_HEIGHT, back_to_title);
+
+	constructor(message: string) {
+		super();
+		this.message = message;
+	}
+
+	on_tick(_delta: number): void {
+		this.back.x = (canvas.width - BUTTON_WIDTH) / 2;
+		this.back.y = canvas.height / 2 + 20;
+		this.back.handle_input();
+	}
+
+	on_render(): void {
+		draw_rect(0, 0, canvas.width, canvas.height, [0, 0, 0, 0.6]);
+		this.#centered("Disconnected", canvas.height / 2 - 90, 4, [1, 1, 1, 1]);
+		this.#centered(this.message, canvas.height / 2 - 30, TEXT_SCALE, [0.85, 0.85, 0.85, 1]);
+		this.back.render();
+	}
+
+	on_close(): void {}
+
+	#centered(text: string, y: number, scale: number, color: number[]) {
+		draw_text(text, (canvas.width - measure_text(text, scale)) / 2, y - (TEXT_HEIGHT * scale) / 2, scale, color);
+	}
+}