Skip to content

Commit ca44995

Browse files
committed
Reorganize Toolbox landing page into Game Journey navigation groups with unique rainbow colors - PR_26170_001-toolbox-game-journey-navigation
1 parent 6a7c732 commit ca44995

13 files changed

Lines changed: 1335 additions & 826 deletions

assets/theme-v2/css/colors.css

Lines changed: 90 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -13,6 +13,11 @@
1313
--green: #7dd957;
1414
--pink: #ff4f8b;
1515
--red: #ff2d2d;
16+
--journey-yellow: #facc15;
17+
--journey-lime: #a3e635;
18+
--journey-teal: #2dd4bf;
19+
--journey-indigo: #818cf8;
20+
--journey-magenta: #d946ef;
1621
--deep-red: #ff5757;
1722
--mint: #22c55e;
1823
--white: #ffffff;
@@ -102,6 +107,14 @@
102107
background: var(--forge-gold)
103108
}
104109

110+
.swatch-yellow {
111+
background: var(--journey-yellow)
112+
}
113+
114+
.swatch-lime {
115+
background: var(--journey-lime)
116+
}
117+
105118
.swatch-black {
106119
background: var(--bg)
107120
}
@@ -110,6 +123,10 @@
110123
background: var(--bot-cyan)
111124
}
112125

126+
.swatch-teal {
127+
background: var(--journey-teal)
128+
}
129+
113130
.swatch-green {
114131
background: var(--green)
115132
}
@@ -126,6 +143,14 @@
126143
background: var(--purple)
127144
}
128145

146+
.swatch-indigo {
147+
background: var(--journey-indigo)
148+
}
149+
150+
.swatch-magenta {
151+
background: var(--journey-magenta)
152+
}
153+
129154
.swatch-blue {
130155
background: var(--electric-blue)
131156
}
@@ -221,6 +246,71 @@
221246
--tool-group-accent: var(--toolbox-group-play-color)
222247
}
223248

249+
.tool-group-idea {
250+
--tool-group-color: var(--red);
251+
--tool-group-accent: var(--red)
252+
}
253+
254+
.tool-group-journey-design {
255+
--tool-group-color: var(--molten-orange);
256+
--tool-group-accent: var(--molten-orange)
257+
}
258+
259+
.tool-group-graphics {
260+
--tool-group-color: var(--forge-gold);
261+
--tool-group-accent: var(--forge-gold)
262+
}
263+
264+
.tool-group-journey-audio {
265+
--tool-group-color: var(--journey-yellow);
266+
--tool-group-accent: var(--journey-yellow)
267+
}
268+
269+
.tool-group-objects {
270+
--tool-group-color: var(--journey-lime);
271+
--tool-group-accent: var(--journey-lime)
272+
}
273+
274+
.tool-group-worlds {
275+
--tool-group-color: var(--green);
276+
--tool-group-accent: var(--green)
277+
}
278+
279+
.tool-group-interface {
280+
--tool-group-color: var(--journey-teal);
281+
--tool-group-accent: var(--journey-teal)
282+
}
283+
284+
.tool-group-controls {
285+
--tool-group-color: var(--bot-cyan);
286+
--tool-group-accent: var(--bot-cyan)
287+
}
288+
289+
.tool-group-rules {
290+
--tool-group-color: var(--electric-blue);
291+
--tool-group-accent: var(--electric-blue)
292+
}
293+
294+
.tool-group-progression {
295+
--tool-group-color: var(--journey-indigo);
296+
--tool-group-accent: var(--journey-indigo)
297+
}
298+
299+
.tool-group-play-test {
300+
--tool-group-color: var(--purple);
301+
--tool-group-accent: var(--purple)
302+
}
303+
304+
.tool-group-publish {
305+
--tool-group-color: var(--journey-magenta);
306+
--tool-group-accent: var(--journey-magenta)
307+
}
308+
309+
.tool-group-journey-share {
310+
--tool-group-color: var(--pink);
311+
--tool-group-accent: var(--pink)
312+
}
313+
224314
.meaning-molten-orange {
225315
--meaning-color: var(--molten-orange);
226316
--meaning-soft: var(--meaning-molten-orange-soft);

assets/theme-v2/css/status.css

Lines changed: 4 additions & 1 deletion
Original file line numberDiff line numberDiff line change
@@ -130,7 +130,10 @@
130130

131131
.swatch-label.swatch-cyan,
132132
.swatch-label.swatch-gold,
133-
.swatch-label.swatch-green {
133+
.swatch-label.swatch-green,
134+
.swatch-label.swatch-lime,
135+
.swatch-label.swatch-teal,
136+
.swatch-label.swatch-yellow {
134137
color: var(--bg);
135138
text-shadow: none
136139
}
Lines changed: 52 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,52 @@
1+
# PR_26170_001 Toolbox Game Journey Navigation
2+
3+
## Branch Validation
4+
5+
- PASS: Current branch verified as `main`.
6+
7+
## Requirement Checklist
8+
9+
| Requirement | Status | Notes |
10+
| --- | --- | --- |
11+
| Read `docs_build/dev/PROJECT_INSTRUCTIONS.md` first. | PASS | Read before implementation. |
12+
| Create `PR_26170_001-toolbox-game-journey-navigation`. | PASS | Build doc added under `docs_build/pr/`. |
13+
| Update `/toolbox/index.html` under the Toolbox section. | PASS | Added a non-inline marker to the existing Toolbox group list container. |
14+
| Replace displayed Toolbox groups with Game Journey order. | PASS | `toolbox/tools-page-accordions.js` now renders Idea, Design, Graphics, Audio, Objects, Worlds, Interface, Controls, Rules, Progression, Play Test, Publish, Share. |
15+
| Assign every displayed group a unique rainbow color with no duplicates. | PASS | Added Theme V2 swatch/tool-group classes and validated thirteen unique computed colors. |
16+
| Preserve tool cards, routes, statuses, and links. | PASS | Display grouping changed only; registered routes/statuses remain sourced from the registry. |
17+
| Do not change database behavior, metadata contracts, Workspace, runtime behavior, status values, or routes. | PASS | Registry/admin/build-path metadata remains unchanged; Build Path still exposes registry metadata groups. |
18+
| Do not add inline CSS/JS, `<style>`, `<script>`, or inline event handlers. | PASS | HTML source and rendered DOM checks passed. |
19+
20+
## Implementation Notes
21+
22+
- Added a Toolbox page presentation mapping from active tool IDs to the requested Game Journey groups.
23+
- Kept Build Path and admin metadata on the existing registry/toolbox metadata grouping path.
24+
- Added reusable Theme V2 colors/classes in CSS rather than inline styles.
25+
- Updated directly affected Playwright expectations for the new displayed grouping and the preserved registry metadata split.
26+
27+
## Validation Lane Report
28+
29+
| Lane | Command | Result |
30+
| --- | --- | --- |
31+
| Branch | `git status --short --branch` | PASS, branch `main`. |
32+
| JS syntax | `node --check toolbox/tools-page-accordions.js; node --check tests/playwright/tools/ToolboxRoutePages.spec.mjs; node --check tests/playwright/tools/GameJourneyTool.spec.mjs; node --check tests/playwright/tools/RootToolsFutureState.spec.mjs; node --check tests/playwright/tools/ToolNavigationPrevNext.spec.mjs; node --check tests/playwright/tools/ToolDisplayModeNavigation.spec.mjs` | PASS |
33+
| Diff whitespace | `git diff --check` | PASS |
34+
| Inline HTML guard | Node scan of `toolbox/index.html` for inline script/style/handlers | PASS |
35+
| Targeted Toolbox Playwright | `npx playwright test tests/playwright/tools/ToolboxRoutePages.spec.mjs --grep "toolbox grouped view renders Game Journey order" --workers=1 --reporter=line` | PASS, 1 passed |
36+
| Adjacent Game Journey route check | `npx playwright test tests/playwright/tools/GameJourneyTool.spec.mjs --grep "Toolbox registration exposes Game Journey navigation" --workers=1 --reporter=line` | PASS, 1 passed |
37+
| Extra adjacent navigation check | `npx playwright test tests/playwright/tools/ToolNavigationPrevNext.spec.mjs --grep "multi-path next control routes" --workers=1 --reporter=line` | FAIL: existing `/api/toolbox/game-configuration/.../makeValidGameDesign` returned 500; group URL assertion was not the failing condition. |
38+
| Extra adjacent display-mode check | `npx playwright test tests/playwright/tools/ToolDisplayModeNavigation.spec.mjs --grep "multi-path fallback opens Toolbox Group view" --workers=1 --reporter=line` | FAIL: same `game-configuration` API 500. |
39+
40+
## Playwright Result
41+
42+
- Required targeted Toolbox page validation passed.
43+
- Playwright coverage reports were refreshed by the targeted runs.
44+
- Two extra non-required adjacent navigation checks were attempted and failed on an out-of-scope `game-configuration` API 500.
45+
46+
## Manual Validation Notes
47+
48+
- Confirmed all thirteen Game Journey groups render in order when Planned and Deprecated are enabled.
49+
- Confirmed each rendered group label has a unique computed background color.
50+
- Confirmed displayed Toolbox links still match their registered routes.
51+
- Confirmed Build Path keeps registry metadata groups such as `Build/Create` for Game Workspace and `Design` for Colors.
52+
- Confirmed `toolbox/index.html` has no inline style/script/event-handler additions.
Lines changed: 10 additions & 8 deletions
Original file line numberDiff line numberDiff line change
@@ -1,11 +1,13 @@
1-
docs_build/dev/reports/codex_changed_files.txt
1+
assets/theme-v2/css/colors.css
2+
assets/theme-v2/css/status.css
3+
docs_build/dev/reports/PR_26170_001-toolbox-game-journey-navigation.md
4+
docs_build/dev/reports/codex_changed_files.txt
25
docs_build/dev/reports/codex_review.diff
36
docs_build/dev/reports/coverage_changed_js_guardrail.txt
47
docs_build/dev/reports/playwright_v8_coverage_report.txt
5-
docs_build/dev/reports/PR_26169_029-db-viewer-table-groups-regression.md
6-
docs_build/pr/BUILD_PR_26169_029-db-viewer-table-groups-regression.md
7-
src/api/db-viewer-ui.js
8-
src/dev-runtime/auth/provider-contract-stubs.mjs
9-
src/dev-runtime/server/local-api-router.mjs
10-
tests/dev-runtime/DbViewerConfiguredSnapshot.test.mjs
11-
tests/playwright/tools/AdminDbViewer.spec.mjs
8+
docs_build/pr/BUILD_PR_26170_001-toolbox-game-journey-navigation.md
9+
tests/playwright/tools/GameJourneyTool.spec.mjs
10+
tests/playwright/tools/RootToolsFutureState.spec.mjs
11+
tests/playwright/tools/ToolboxRoutePages.spec.mjs
12+
toolbox/index.html
13+
toolbox/tools-page-accordions.js

0 commit comments

Comments
 (0)