Skip to content

Board spec editor: page list layout and readable connector pinouts - #347

Merged
lovyan03 merged 1 commit into
m5stack:developfrom
ainyan03:board_spec_editor_pages
Oct 12, 2026
Merged

lovyan03 merged 1 commit into
m5stack:developfrom
ainyan03:board_spec_editor_pages

Conversation

@ainyan03

@ainyan03 ainyan03 commented Oct 12, 2026 •

Copy link
Copy Markdown
Contributor

Summary

Reworks the layout of the board specification editor (extras/board_spec/editor, bundled as dist/board_spec_editor.html) so that the catalog can be reviewed comfortably, especially the connector pinouts. Builds on the exposed-connector catalog changes merged in #346.

  • Header in one row: title, toolbar, revision options, mode bar and view tabs are merged into a single row; runtime choices open from a compact condition panel, and the first-run guide becomes a dialog.
  • Page list: a list on the left (board information, GPIO, each connector or connector group, buses, devices, accessories, revisions, pin owners, validation) selects the page shown at full height. Navigation goes through one function with a one-step back history; all pages stay rendered so links into hidden pages work.
  • Connector pages: notes, verification and official links are shown next to the pinout. Sockets in the same connector.group are shown side by side with aligned rows. Terminal, endpoint and wire-color columns are sized to their content, functions take the remaining width, and role chips use the same colors as the GPIO table.
  • The diagram view is removed; tables cover every connector type in the catalog.
  • No change to the catalog data model semantics or to generated C++.

Testing

  • extras/board_spec: npm test (236 tests, also with M5Unified absent) and npm run check.
  • Checked in a browser with boards that have many connectors (Tab5), paired sockets (Atom, StopWatch), long pin rows (Stamp-P4) and Grove ports.

…r pinouts

Header: merge the title, toolbar, revision options, mode bar and view tabs into one row. Runtime choices open from a compact condition panel, New/Duplicate/Remove move into an Open menu, the first-run guide becomes a dialog and JSON files can be dropped anywhere. "Edit raw data" is renamed to describe what it does: return to base data by clearing the resolved selection.

Pages: a list on the left (board information, GPIO, each connector or connector group, buses, devices, accessories, revisions, pin owners, validation) selects the page shown at full height. All pages stay rendered and only visibility changes, so links into hidden pages resolve. Every navigation goes through one function with a one-step back history and scroll restoration, and falls back to the category when an object disappears after switching boards or importing. Editing a role does not change the page. Validation errors open the GPIO row when they resolve to one, otherwise the affected object's page. Layout state uses a new storage key.

Connector pages: show the connector note, verification, type view, layout status and clickable official links next to the pinout. Sockets that share a connector group are shown side by side with headers, references and tables aligned in shared grid rows, while names, first-terminal marks, notes and editing stay per socket. Role chips and power terminals use the same owner colors as the GPIO table, and wire colors get their own column only for connector types that define them. Each endpoint sits beside its terminal number; terminal and endpoint columns are sized to their content and functions take the remaining width, mirrored around the center of two-row connectors. The diagram view is removed because tables cover every connector type in the catalog, and the undo button moves into the page heading, shown only when there is something to undo.

A GPIO shared by several connector positions lists all of them, and hovering only highlights; moving between a terminal and its GPIO row needs an explicit click or key.
@ainyan03
ainyan03 force-pushed the board_spec_editor_pages branch from 38cf228 to 4eaf657 Compare October 12, 2026 08:49
@lovyan03
lovyan03 merged commit a85d1dc into m5stack:develop Oct 12, 2026
26 checks passed
@ainyan03
ainyan03 deleted the board_spec_editor_pages branch October 12, 2026 09:07
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