Upgrade a game
Follow these steps to move a framework v1 game to this framework. upgrade_framework answers this section when it moves a game here.
What is new
| Framework v1 | This framework |
|---|---|
Boardweaver draws the board from each def's render(), getLayout and renderOverlay. |
Your React client in /src/frontend.tsx draws everything below the top bar: the board, player info, scores, buttons and the end of the match. |
getSelectableItems lists the click targets. |
getAvailableActions lists every legal action with its intent: choice, confirm, cancel or undo. getSelectableItems still works. |
A piece's looks are orientations or render(). |
A piece needs exactly one of them to build, but Boardweaver never draws from it. |
These carry over unchanged: /src/game.ts and its hooks, gameConfig, the defs, the GameState API, the three state buckets, uploaded art and fonts, /theme.json, the rules pages and the marketing page.
1. Read the new contract
Read React frontends and The match API. Call get_example with tic-tac-toe-react for a complete client.
Done when you know which hook gives the client the state, the legal actions and the buttons.
2. Write the client
Write /src/frontend.tsx. Its default export is a component with no props. Draw every space, piece, button and score that the v1 render() methods, getLayout and renderOverlay drew. Send moves with match.click and the actions of useAvailableActions().
Done when validate_code answers no error that names /src/frontend.tsx.
3. List actions, not targets
Replace getSelectableItems with getAvailableActions in /src/game.ts. Give each action the intent that says what it does. See Game logic hooks.
Done when start_game answers each active player's moves, and a session plays to the end with apply_action.
4. Remove what draws nothing
Replace each render() with a single orientations entry, such as [{ imageSrc: GameImage.XPiece }]. Delete getLayout, renderOverlay and the BWSS nodes only they used.
Done when validate_code answers valid: true.
5. Commit
Call commit. The commit builds against this framework and pins the game to it. Its matches then load the client.
Done when commit succeeds, and render_game on a new start_game session shows the board.
Tips
- Keep every rule in
/src/game.ts. The client runs the same functions to predict a click, so a rule written in the client is a rule that can disagree with the server. - Draw the client from
useGameState(). Do not copy shared state into React state. - The client has no network, no
windowand no browser storage. See React frontends. - To stay on framework v1, call
upgrade_frameworkwithframeworkMajor: 1before you commit. It removes the pending upgrade, and your file changes stay.