five-on-it / apps/client/src/gui/layout
apps/client/src/gui/layout
The in-game UI's panels as data, and their layout: a panel is a tree of blocks (lines of text, rows of buttons, boxes with a background, side-by-side columns, a numeric field, a map), described by the pure builders (phone-blocks.ts, item-blocks.ts, mission-blocks.ts, label-blocks.ts) from the game's state, and laid out here into absolute rectangles: one node per thing to draw (a box, a line of text, a key cap, a button, a field, a map), in drawing order, at pixel positions inside the panel. Text is wrapped here, with the canvas' own measure, so the GUI layer (panel.ts) only places Babylon controls where this says and every height is known before anything is drawn. Every block with an id is also listed with its rectangle and its text: the end-to-end tests' view of the panel (window.__poc().gui) and where they click.