Skip to content

Make the contraption builder palette professional: collapsible sections + polish#25

Merged
SethMorrowSoftware merged 2 commits into
mainfrom
claude/gracious-curie-fazDz
Jun 5, 2026
Merged

Make the contraption builder palette professional: collapsible sections + polish#25
SethMorrowSoftware merged 2 commits into
mainfrom
claude/gracious-curie-fazDz

Conversation

@SethMorrowSoftware
Copy link
Copy Markdown
Owner

What & why

The left palette (sidebar) of the Contraption Builder worked, but read as unpolished: a single long scrolling column of 26 buttons whose labels didn't line up (the glyph was baked into each button label, and the Unicode glyphs have different widths), behind a dated native scrollbar, with hover driven by a fragile hardcoded-colour string match and ~66 chrome colours hardcoded inline.

This PR makes it look intentional and easier to scan, without changing any tool behaviour. All work is in one file: examples/box2dxt-contraption-builder.livecodescript.

Changes

Collapsible (accordion) sections

  • Each section header (SHAPES, TERRAIN, SPECIAL, VEHICLES, JOINTS) is now a clickable button with a chevron ( expanded / collapsed).
  • New layoutPalette repositions/shows/hides rows from gPalOpen state; hidden controls drop out of the group's scroll extent, so the scrollbar only appears when the visible content actually overflows.
  • Routed through the existing mouseUphandleUiClick dispatch (new ui_hdr_ branch + togglePaletteSection) — no new card handler. mouseDown already ignores ui_ targets, so headers never disturb physics. Default is all sections expanded, preserving today's first-run discoverability.

Visual polish

  • Stopped baking the glyph into the button label. Each glyph now lives in a fixed-width gutter field (ui_g_<id>), centered, so every label lines up regardless of glyph width.
  • Roomier rows/headers (button height 24→28, gap 3→4, header 18→22).

Robust hover + selection (DRY)

  • New setBtnIdle / setBtnActive helpers are the single source of button styling, used by highlightGroup, makeAction, makePropBtn, setToggle, highlightActions, and the inspector-tab highlighter.
  • hoverTool now derives idle/active state from the current selection (gTool/gJointTool), not from reading a pixel colour — it can't mis-read an accent or fight the selected/collapsed styling.

Easy wins folded in

  • Theme constants: the repeated chrome colours are unified into one kCol* block (kColBtnIdle, kColAccentGreen, kColAccentAmber, kColDanger, …). Scene-part fill colours (red game pieces) are intentionally left as literals.
  • Magic numbers extracted: kDefaultMotorSpeed (was 120) and kDefaultGravity (was -10).

A note on verification

This UI is LiveCode/xTalk script that runs only inside the LiveCode/OpenXTalk IDE — there's no headless way to run it in CI or a container, so I verified by careful static review (structure, handler balance, grouping/clearUI/raiseUI conventions, coordinate math). All edits are script-and-control only, with no new external assets, so the standalone build is unaffected.

Manual verification checklist (run in the IDE)

  1. Open the card → 5 headers each with a chevron, rule, and tool rows. All labels left-align (glyphs centered in the gutter).
  2. Polish: taller rows, comfortable gaps, bold light-grey headers, no clipping at the scrollbar edge.
  3. Collapse/expand: click SHAPES → chevron , rows hide, sections below slide up; click again → restores.
  4. Multi-collapse: collapse several → content compacts and the scrollbar disappears when it all fits, returns when overflowing.
  5. Scroll (all open) → native scrollbar moves only palette content; collapsed controls never flash in.
  6. Select: Box → green, HUD "Tool: …"; Delete → red; a joint → amber. Selection survives collapsing/expanding other sections.
  7. Hover: idle tool lightens; the selected tool does not; leaving restores correct idle/accent (no stuck colour).
  8. Run / Build: Run starts the simulation and parts fall; the palette still collapses and selecting a tool drops back to Build; Build/Reset returns to edit.
  9. Rebuild integrity: leave & return to the card → palette returns all-expanded; no stray ui_g_* orphans or duplicate ui_palettescroll.
  10. Other top-bar actions (Clear/Save/Load/Recipes/Help) still work.

https://claude.ai/code/session_01XpBcQg2DbncrBcFZLHqhMj


Generated by Claude Code

claude added 2 commits June 5, 2026 15:00
… polish

Redesign the left palette (sidebar) of the Contraption Builder so it reads as
intentional and is easier to scan, without changing any tool behaviour:

- Collapsible accordion sections (SHAPES, TERRAIN, SPECIAL, VEHICLES, JOINTS)
  with clickable chevron headers. The scrollbar now appears only when the
  visible content actually overflows the viewport.
- A fixed-width glyph gutter so every tool label lines up regardless of glyph
  width (the main "unpolished" tell), plus roomier rows and headers.
- Selection-aware hover: idle/active state is derived from the current tool,
  not by matching a hardcoded pixel colour, so it never mis-reads an accent
  or fights the selected/collapsed styling.

Easy wins folded in while reviewing the stack:
- Unify the repeated chrome colours into one block of named constants (kCol*),
  routed through new setBtnIdle/setBtnActive helpers used by every styler.
- Extract the remaining magic numbers (kDefaultMotorSpeed, kDefaultGravity).

The UI runs only inside the LiveCode/OpenXTalk IDE, so this was verified by
static review; runtime checks follow the manual checklist in the PR.

https://claude.ai/code/session_01XpBcQg2DbncrBcFZLHqhMj
LiveCode case labels don't use a colon and the action goes on the following
line; the C-style `case "SHAPES": return ...` form fails to compile. Rewrite to
the canonical bare-label form used elsewhere in the file (toolHelp, dirName).

https://claude.ai/code/session_01XpBcQg2DbncrBcFZLHqhMj
@SethMorrowSoftware SethMorrowSoftware marked this pull request as ready for review June 5, 2026 15:40
@SethMorrowSoftware SethMorrowSoftware merged commit ec42775 into main Jun 5, 2026
4 checks passed
Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment

Labels

None yet

Projects

None yet

Development

Successfully merging this pull request may close these issues.

2 participants