Dedicated project page for chip8 sim.

2026-07-06 07:45:49 +02:00
parent 706789c81b
commit ecd411a9de
7 changed files with 12643 additions and 8 deletions
@@ -0,0 +1,95 @@
+<?php require ROOT . '/web/partials/head.php'; ?>
+
+<style>
+	body {
+		margin: 0px;
+		background-color: black;
+		max-width: 2200px;
+	}
+	.game_wrapper {
+		max-width: 1500px;
+		margin-left: auto;
+		margin-right: auto;
+		font-family: sans-serif;
+		color: white;
+	}
+	.game_title {
+		text-align: center;
+		font-size: 1.8rem;
+		margin: 20px 0 12px 0;
+	}
+	canvas.game_canvas {
+		width: 100%;
+		height: auto;
+		/* match this to your actual internal render resolution ratio */
+		aspect-ratio: 16 / 9;
+		border: 0px none;
+		background-color: black;
+		display: block;
+		cursor: pointer;
+	}
+	.too_small_message {
+		display: none;
+		color: white;
+		font-family: sans-serif;
+		text-align: center;
+		padding: 40px 20px;
+	}
+	.game_info {
+		max-width: 900px;
+		margin: 20px auto 40px auto;
+		padding: 0 16px;
+		line-height: 1.5;
+		text-align: center;
+		color: #ccc;
+		font-size: 0.95rem;
+	}
+	.game_info strong {
+		color: white;
+	}
+	.game_info a {
+		color: #9cf;
+	}
+	.game_info p {
+		margin: 6px 0;
+	}
+	/* Below this width, hide the canvas and show the message instead */
+	@media (max-width: 950px) {
+		canvas.game_canvas {
+			display: none;
+		}
+		.too_small_message {
+			display: block;
+		}
+	}
+</style>
+
+<div class="game_wrapper">
+	<h1 class="game_title">Octal Cookie - Chip 8 Simulator</h1>
+
+	<canvas class="game_canvas" id="canvas" oncontextmenu="event.preventDefault()" tabindex="-1" onmousedown="event.target.focus()" onkeydown="event.preventDefault()"></canvas>
+
+	<div class="game_info">
+		<p><strong>Click inside the simulator to focus it</strong>, click outside to release focus.</p>
+		<p>Keypad is mapped to <strong>1234 / QWER / ASDF / ZXCV</strong>.</p>
+		<hr>
+		<p>A CHIP-8 emulator built in Odin and Raylib as a refresher project.</p>
+
+		<p> Functional Work in progress, not perfect.</p>
+		<p> Planned new features when time allows: </p>
+		<p><strong>Instruction Quirks with gui to toggle on/off</strong></p>
+		<p><strong>Super Chip8 implementation</strong></p>
+		</br><a href="https://gitea.sc.koldsoftware.com/jasonhilder/octal_cookie" target="_blank" rel="noopener">View source on Gitea →</a></p>
+	</div>
+
+	<div class="too_small_message">
+		Your screen is too small to run this app. Please use a larger window or device.
+	</div>
+
+</div>
+
+<script src="/web/static/apps/sim/odin.js"></script>
+<script src="/web/static/apps/sim/init.js"></script>
+<script src="/web/static/apps/sim/index.js"></script>
+
+<?php require ROOT . '/web/partials/footer.php'; ?>