Initial import of Brookhaven site
This commit is contained in:
35
templates/play.html
Normal file
35
templates/play.html
Normal file
@@ -0,0 +1,35 @@
|
||||
<!doctype html>
|
||||
<html>
|
||||
<head>
|
||||
<meta name="viewport" content="width=device-width, initial-scale=1" />
|
||||
<script src="https://cdn.tailwindcss.com"></script>
|
||||
<script src="https://cdn.socket.io/4.7.5/socket.io.min.js"></script>
|
||||
</head>
|
||||
<body class="bg-slate-900 text-white min-h-screen grid place-items-center">
|
||||
<div class="grid gap-4 text-center">
|
||||
<h2 class="text-2xl font-bold">Room {{ code }}</h2>
|
||||
<button id="tap" class="text-2xl py-16 px-24 rounded bg-indigo-600 active:scale-95">TAP</button>
|
||||
</div>
|
||||
<script>
|
||||
const code = "{{ code }}";
|
||||
const pid = "{{ pid }}";
|
||||
const socket = io("/game", { transports: ["websocket"] });
|
||||
|
||||
// join the room (server will verify if you're left/right)
|
||||
socket.emit("player_join_room", { code, pid });
|
||||
|
||||
const tapBtn = document.getElementById("tap");
|
||||
tapBtn.addEventListener("pointerdown", sendTap);
|
||||
function sendTap(e){ e && e.preventDefault(); socket.emit("tap", { code, pid }); }
|
||||
|
||||
// optional: hold-to-repeat
|
||||
tapBtn.addEventListener("pointerdown", () => {
|
||||
const t = setInterval(() => socket.emit("tap", { code, pid }), 100);
|
||||
const stop = () => { clearInterval(t); window.removeEventListener("pointerup", stop); tapBtn.removeEventListener("pointerleave", stop); };
|
||||
window.addEventListener("pointerup", stop, { once: true });
|
||||
tapBtn.addEventListener("pointerleave", stop, { once: true });
|
||||
});
|
||||
</script>
|
||||
</body>
|
||||
</html>
|
||||
|
||||
Reference in New Issue
Block a user