e391417cf9
- tools/gen_music.py: pure-stdlib 8-bit synth -> music/{calm,eerie,tense,
jolly,spooky}.wav, five loop-clean mood tracks (the shop floor gets a
four-on-the-floor house groove, obviously). Engine plays them per room;
web build serves them next to the wasm.
- web/index.html: MORPQUEST page shell (EGA palette, README tab, no
account chrome).
- deploy.sh: builds the wasm via MRPGI/web/build.sh with this game baked
in and swaps it into forum-nginx:/usr/share/nginx/html/morpquest/,
right next door to /beyondmorp/.
Co-Authored-By: Claude Fable 5 <noreply@anthropic.com>
105 lines
4.5 KiB
HTML
105 lines
4.5 KiB
HTML
<!DOCTYPE html>
|
|
<html lang="en">
|
|
<head>
|
|
<meta charset="utf-8">
|
|
<meta name="viewport" content="width=device-width, initial-scale=1">
|
|
<title>MORPQUEST: Record Store Day</title>
|
|
<meta name="description" content="A Sierra-style EGA adventure. Record Store Day, one car park, one white label, a wall of Beckies. Runs in your browser on the MRPGI engine.">
|
|
<style>
|
|
html, body { margin: 0; padding: 0; height: 100%; background: #000; overflow: hidden; }
|
|
canvas {
|
|
position: absolute; inset: 0;
|
|
width: 100%; height: 100%;
|
|
image-rendering: pixelated;
|
|
background: #000;
|
|
}
|
|
#boot {
|
|
position: absolute; inset: 0; display: flex; flex-direction: column;
|
|
align-items: center; justify-content: center; gap: 12px;
|
|
color: #55ff55; font-family: ui-monospace, Menlo, monospace; font-size: 14px;
|
|
pointer-events: none; transition: opacity .4s;
|
|
}
|
|
#boot b { font-size: 22px; letter-spacing: 3px; color: #ff55ff; }
|
|
#readme-tab {
|
|
position: fixed; bottom: 0; right: 24px; z-index: 10;
|
|
background: #ff55ff; color: #000; border: 0;
|
|
border-radius: 8px 8px 0 0; padding: 7px 14px 5px;
|
|
font: bold 13px ui-monospace, Menlo, monospace; letter-spacing: 1px;
|
|
cursor: pointer;
|
|
}
|
|
#readme {
|
|
position: fixed; bottom: 34px; right: 12px; z-index: 10; display: none;
|
|
width: min(360px, calc(100vw - 24px)); max-height: 80vh; overflow-y: auto;
|
|
background: #0a0a12; color: #ccc; border: 1px solid #ff55ff; border-radius: 8px;
|
|
padding: 14px 16px; font: 13px/1.5 ui-monospace, Menlo, monospace;
|
|
}
|
|
#readme.open { display: block; }
|
|
#readme h1 { font-size: 15px; color: #ff55ff; margin: 0 0 6px; letter-spacing: 1px; }
|
|
#readme h2 { font-size: 13px; color: #55ffff; margin: 12px 0 2px; }
|
|
#readme p { margin: 4px 0; }
|
|
#readme kbd {
|
|
background: #16161f; border: 1px solid #444; border-radius: 4px;
|
|
padding: 0 5px; font: inherit; color: #fff;
|
|
}
|
|
</style>
|
|
</head>
|
|
<body>
|
|
<div id="boot"><b>MORPQUEST</b><span>queueing since sunrise…</span></div>
|
|
<canvas id="glcanvas" tabindex="1"></canvas>
|
|
<button id="readme-tab">README</button>
|
|
<div id="readme">
|
|
<h1>MORPQUEST: Record Store Day</h1>
|
|
<p>You're meant to be doing a quick cat-food run. Uncle's list is in the
|
|
glovebox. The record shop's front door is a wall of Taylor Swift superfans.
|
|
Morp is not cruel; Morp is accurate.</p>
|
|
<h2>Playing</h2>
|
|
<p><kbd>←↑↓→</kbd> or click to walk · type verbs +
|
|
<kbd>Enter</kbd> (<i>look, take paperclip, use seatbelt, talk becky…</i>)
|
|
· <kbd>1</kbd>–<kbd>6</kbd> pick a dialogue reply ·
|
|
<kbd>Esc</kbd> leaves a chat · <kbd>F1</kbd> CRT scanlines ·
|
|
<kbd>F2</kbd> sound.</p>
|
|
<h2>Advice from the walls</h2>
|
|
<p>Elastic. Eyepatch. Gratitude. Door.</p>
|
|
<p>DELAYS HAPPEN. DON'T PANIC. PANIC IS FOR TOURISTS.</p>
|
|
<p>There are 250 points, two deaths, and a true ending. Don't read signs
|
|
aloud unless you have all the words. Don't eat the kebab. (You'll eat the
|
|
kebab.)</p>
|
|
<h2>Made with</h2>
|
|
<p>The <a href="manual.html" target="_blank" style="color:#55ffff">MRPGI engine</a>
|
|
(a Rust reimagining of Sierra's AGI), backgrounds by nano banana squeezed
|
|
into 160×168 EGA, chiptunes by a 60-line Python synth. Adapted from
|
|
the <a href="../beyondmorp/" style="color:#55ffff">Beyond Morp</a> text
|
|
adventure next door. Monster Robot Party.</p>
|
|
</div>
|
|
<script src="mq_js_bundle.js"></script>
|
|
<script>
|
|
// --- engine <-> page bridge (must register before the wasm loads) ------
|
|
miniquad_add_plugin({
|
|
register_plugin: (importObject) => {
|
|
importObject.env.mrpgi_world_saved = () => {};
|
|
importObject.env.mrpgi_open_manual = () => { window.open('manual.html', '_blank'); };
|
|
},
|
|
version: "1",
|
|
name: "mrpgi_bridge",
|
|
});
|
|
load("mrpgi.wasm");
|
|
const t = setInterval(() => {
|
|
if (typeof wasm_exports !== "undefined" && wasm_exports) {
|
|
document.getElementById("boot").style.opacity = "0";
|
|
clearInterval(t);
|
|
}
|
|
}, 250);
|
|
</script>
|
|
<script>
|
|
const canvas = document.getElementById('glcanvas');
|
|
const tab = document.getElementById('readme-tab');
|
|
const panel = document.getElementById('readme');
|
|
tab.addEventListener('click', () => {
|
|
panel.classList.toggle('open');
|
|
tab.textContent = panel.classList.contains('open') ? 'CLOSE' : 'README';
|
|
if (!panel.classList.contains('open')) canvas.focus();
|
|
});
|
|
</script>
|
|
</body>
|
|
</html>
|