Skip to content
SlashClone
DiscoverUse in ClaudeSubmit a link
Sign in
Made by@gameforge

Browser game starter

@gameforge/browser-game-starter

Turn a one-line game idea into a complete, playable single-file HTML5 canvas game: game loop, keyboard and touch input, score, best score, game over, and restart. Ships a template, a working Block Dodge example, and a script that copies either into your project.

SkillOtherv1.0.0 (latest)Tested
Use in Claude Save Like Clone Comment
Activity
New: be the first to try it
  1. 1#!/usr/bin/env node
  2. 2// Copy the browser-game-starter template (or the Block Dodge example) into the project.
  3. 3// Usage:
  4. 4// node scripts/new-game.mjs --title "Star Catcher" --idea "catch stars, dodge meteors" [--out game/index.html] [--from template|example] [--force]
  5. 5import { existsSync, mkdirSync, readFileSync, writeFileSync } from "node:fs";
  6. 6import { dirname, isAbsolute, normalize } from "node:path";
  7. 7import { fileURLToPath } from "node:url";
  8. 8
  9. 9const here = dirname(fileURLToPath(import.meta.url));
  10. 10const SOURCES = {
  11. 11 template: `${here}/../templates/game.html`,
  12. 12 example: `${here}/../examples/block-dodge.html`,
  13. 13};
  14. 14
  15. 15function fail(msg) {
  16. 16 console.error(`new-game: ${msg}`);
  17. 17 process.exit(1);
  18. 18}
  19. 19
  20. 20const args = process.argv.slice(2);
  21. 21const opts = { out: "game/index.html", from: "template", title: "", idea: "", force: false };
  22. 22for (let i = 0; i < args.length; i++) {
  23. 23 const a = args[i];
  24. 24 if (a === "--force") opts.force = true;
  25. 25 else if (["--out", "--from", "--title", "--idea"].includes(a)) {
  26. 26 const v = args[++i];
  27. 27 if (v === undefined) fail(`${a} needs a value`);
  28. 28 opts[a.slice(2)] = v;
  29. 29 } else if (a === "--help" || a === "-h") {
  30. 30 console.log('Usage: node scripts/new-game.mjs --title "Name" --idea "one line" [--out game/index.html] [--from template|example] [--force]');
  31. 31 process.exit(0);
  32. 32 } else fail(`unknown argument ${a}`);
  33. 33}
  34. 34
  35. 35if (!(opts.from in SOURCES)) fail(`--from must be "template" or "example", got "${opts.from}"`);
  36. 36if (opts.from === "template" && !opts.title.trim()) fail('--title is required, for example --title "Star Catcher"');
  37. 37const out = normalize(opts.out);
  38. 38if (isAbsolute(out) || out.startsWith("..")) fail(`--out must be a path inside the project, got "${opts.out}"`);
  39. 39if (!out.endsWith(".html")) fail(`--out should end in .html, got "${opts.out}"`);
  40. 40if (existsSync(out) && !opts.force) fail(`${out} already exists. Pick another --out, or pass --force to replace it.`);
  41. 41
  42. 42const escapeHtml = (s) => s.replace(/&/g, "&amp;").replace(/</g, "&lt;").replace(/>/g, "&gt;").replace(/"/g, "&quot;");
  43. 43// The title also lands inside JS strings, so keep it to safe characters there.
  44. 44const safeTitle = escapeHtml(opts.title.trim()).replace(/[\\`'{}]/g, "");
  45. 45const safeIdea = escapeHtml(opts.idea.trim() || "no idea given").replace(/--/g, "-");
  46. 46
  47. 47let html = readFileSync(SOURCES[opts.from], "utf8");
  48. 48if (opts.from === "template") {
  49. 49 html = html.replaceAll("{{TITLE}}", safeTitle).replaceAll("{{IDEA}}", safeIdea);
  50. 50}
  51. 51
  52. 52mkdirSync(dirname(out), { recursive: true });
  53. 53writeFileSync(out, html);
  54. 54console.log(`Wrote ${out} (${opts.from === "template" ? `"${safeTitle}"` : "Block Dodge example"}). Open it in a browser to play.`);
Sign in to comment on a line