Skip to content

README.md

Latest commit

 

History

History
49 lines (41 loc) · 3.53 KB

README.md

File metadata and controls

49 lines (41 loc) · 3.53 KB

CCG Studio Prototype

A small, dependency-free prototype for a game-agnostic card set editor. It ships JSON schemas, a minimal CLI for validating/rendering sets, and a static web prototype (card editor + layout editor) that exercises the same data shapes.

What's inside

  • Node 20+ project with no runtime deps (package.json only) and a tiny static server in tools/dev-server.js.
  • JSON Schemas for games, cards, and sets in schemas/.
  • CLI (src/cli.js) that validates sets and renders a simple HTML preview.
  • Static web prototypes in web/: a set editor (index.html) and a layout editor (layout-editor.html).
  • Sample game/set data in samples/ (generic TCG, simple duel, MTG with atomic data).

Commands

  • npm run validate:sample - validate samples/generic-tcg/set.sample.json against the set schema.
  • npm run render:sample - render the same sample to dist/sample.html.
  • npm run dev:web - start a static server at http://127.0.0.1:5173/web/ for the web prototypes.
  • Direct CLI usage: node src/cli.js validate <set.json> or node src/cli.js render <set.json> --out dist/out.html.

Data formats (schemas/)

  • game.schema.json - game id/name, layouts (field definitions with labels/kinds), types (with required/default fields and optional layout override).
  • card.schema.json - card id/name/layout plus free-form fields, keywords, tags, and optional art metadata.
  • set.schema.json - set id/name/gameId, metadata, and an array of cards (each matching the card schema shape).

Samples (samples/)

  • generic-tcg - simple cost/type/rules/stats layout with creature/sorcery/instant types.
  • simple-duel - minimal fighter layout with power/guard stats.
  • mtg - MTGJSON-inspired fields (manaCost, typeLine, rules text, P/T, loyalty, rarity, flavor, artist, etc.), layout HTML/CSS, and derived rules for preview flags.
  • MTG atomic registry: samples/mtg/atomic.sample.json (shared card definitions by name).

CLI output

  • Validate prints a success line or a list of schema violations.
  • Render writes a lightweight HTML grid with card name/type/rules/stats using src/render.js (creates dist/ if missing).

Web prototypes (web/)

  • Card/set editor (index.html + app.js):
    • Load sample games/sets, or import your own JSON; download the active set.
    • Manage games/sets, add cards, switch layouts/types, and edit dynamic fields with optional "advanced" toggle.
    • Live preview of the active card; warnings for missing required fields or layout/type mismatches.
    • Type defaults surface as apply/dismiss suggestions; atomic registry shares fields across same-name cards and supports freezing to lock shared fields; freeze a whole set to snapshot atomics.
    • Layout picker updates fields; validation warnings are non-blocking.
  • Layout editor (layout-editor.html + layout-editor.js):
    • Load sample games, add/edit layouts, and toggle which fields are visible in the mini preview.
    • Edit HTML/CSS templates with a small mustache-style renderer ({{field}}, {{#if field}}...{{/if}}, {{#if_eq field "x"}}...{{/if_eq}}, {{else}}).
    • Derived rules from the game definition populate computed placeholders (see MTG sample for mana/pt/loyalty helpers).
    • Download the current game definition with updated layouts.

Notes and limitations

  • Everything is static JS/HTML; no bundler/build. The dev server only serves files.
  • Schemas are intentionally minimal; renderer is a simple HTML preview (no image export or persistence beyond downloads).
  • No automated tests or CI are included yet. Verify CLI commands locally after edits.