Skip to content

Commit 4d473e6

Browse files
author
DavidQ
committed
BUILD_PR_INTERACTIVE_DEV_CONSOLE_UI
- Added on-canvas interactive dev console UI - Wired typed command input into sample-level debug integration - Preserved combo-key controls and engine-safe boundaries
1 parent a653453 commit 4d473e6

File tree

10 files changed

+570
-63
lines changed

10 files changed

+570
-63
lines changed

‎docs/dev/CODEX_COMMANDS.md‎

Lines changed: 25 additions & 9 deletions
Original file line numberDiff line numberDiff line change
@@ -7,16 +7,32 @@ MODEL: GPT-5.4-codex
77
REASONING: high
88

99
COMMAND:
10-
Create BUILD_PR_INTERACTIVE_DEV_CONSOLE_UI as a docs-only, repo-structured delta.
10+
Create BUILD_PR_INTERACTIVE_DEV_CONSOLE_UI implementation.
1111

1212
Requirements:
13-
- Follow PLAN_PR -> BUILD_PR -> APPLY_PR
14-
- Docs-first only
15-
- No implementation code in this bundle
16-
- Plan a canvas-rendered interactive console UI
17-
- Reuse existing runtime and combo-key controls
18-
- Scope implementation to tools/dev and one sample entry only
19-
- Define input behavior, output history, validation steps, and rollback notes
13+
- Create tools/dev/interactiveDevConsoleRenderer.js
14+
- Update tools/dev/devConsoleIntegration.js
15+
- Modify ONE sample entry file only
16+
- Reuse existing runtime executeConsoleInput()
17+
- Preserve combo keys exactly:
18+
- Shift + ` => toggle console
19+
- Ctrl + Shift + ` => toggle overlay
20+
- Ctrl + Shift + R => reload
21+
- Ctrl + Shift + ] => next panel
22+
- Ctrl + Shift + [ => previous panel
23+
- Add typed console input behavior only while console is open
24+
- Draw console on canvas
25+
- Do not modify engine core
26+
- No F-key bindings
27+
- Use save()/restore() around canvas changes
2028
- Keep commit_comment.txt header-free
21-
- Package output to:
29+
- Run node --check on touched JS files
30+
- Package implementation output to:
2231
<project folder>/tmp/BUILD_PR_INTERACTIVE_DEV_CONSOLE_UI_delta.zip
32+
33+
Report back:
34+
- exact files changed
35+
- selected sample file
36+
- how console input is captured
37+
- how console draw is invoked
38+
- validation command results

‎docs/dev/COMMIT_COMMENT.txt‎

Lines changed: 4 additions & 4 deletions
Original file line numberDiff line numberDiff line change
@@ -1,5 +1,5 @@
1-
PLAN_PR_INTERACTIVE_DEV_CONSOLE_UI
1+
BUILD_PR_INTERACTIVE_DEV_CONSOLE_UI
22

3-
- Planned interactive on-canvas dev console UI
4-
- Reused existing runtime and combo-key architecture
5-
- Scoped implementation to tools/dev plus one sample
3+
- Added on-canvas interactive dev console UI
4+
- Wired typed command input into sample-level debug integration
5+
- Preserved combo-key controls and engine-safe boundaries

‎docs/dev/NEXT_COMMAND.txt‎

Lines changed: 1 addition & 1 deletion
Original file line numberDiff line numberDiff line change
@@ -1 +1 @@
1-
BUILD_PR_INTERACTIVE_DEV_CONSOLE_UI
1+
APPLY_PR_INTERACTIVE_DEV_CONSOLE_UI

‎docs/dev/change_summary.txt‎

Lines changed: 3 additions & 3 deletions
Original file line numberDiff line numberDiff line change
@@ -4,6 +4,6 @@ David Quesenberry
44
change_summary.txt
55

66
Summary
7-
- Added PLAN PR for interactive dev console UI
8-
- Preserved sample-safe integration boundaries
9-
- Preserved docs-first workflow and commit_comment no-header exception
7+
- Added BUILD PR for interactive dev console UI
8+
- Scoped implementation to tools/dev plus one sample entry
9+
- Preserved existing runtime, HUD, and combo-key architecture

‎docs/dev/file_tree.txt‎

Lines changed: 1 addition & 1 deletion
Original file line numberDiff line numberDiff line change
@@ -3,7 +3,7 @@ David Quesenberry
33
04/05/2026
44
file_tree.txt
55

6-
docs/pr/PLAN_PR_INTERACTIVE_DEV_CONSOLE_UI.md
6+
docs/pr/BUILD_PR_INTERACTIVE_DEV_CONSOLE_UI.md
77
docs/dev/codex_commands.md
88
docs/dev/commit_comment.txt
99
docs/dev/change_summary.txt

‎docs/dev/validation_checklist.txt‎

Lines changed: 20 additions & 12 deletions
Original file line numberDiff line numberDiff line change
@@ -6,18 +6,26 @@ validation_checklist.txt
66
VALIDATION CHECKLIST
77

88
Workflow
9-
- PLAN_PR created
9+
- BUILD_PR created
1010
- One PR per purpose
11-
- No implementation code in bundle
11+
- commit_comment.txt has no header
1212

13-
Header Rules
14-
- Header present in all new files except docs/dev/commit_comment.txt
15-
- commit_comment.txt contains no Toolbox Aid header
13+
Files
14+
- tools/dev/interactiveDevConsoleRenderer.js created
15+
- tools/dev/devConsoleIntegration.js updated
16+
- one sample entry updated
1617

17-
Plan Quality
18-
- Interactive console UI scope defined
19-
- Input behavior defined
20-
- Output history behavior defined
21-
- Sample-only integration boundary defined
22-
- Acceptance criteria defined
23-
- Validation steps defined
18+
Functional
19+
- Shift + ` toggles console
20+
- Typed input appears while console is open
21+
- Enter executes command
22+
- Escape closes console
23+
- ArrowUp/ArrowDown navigate command history
24+
- Console output visible on canvas
25+
- HUD and console can coexist safely
26+
27+
Safety
28+
- No engine core files modified
29+
- No F-key bindings remain
30+
- Canvas save/restore used
31+
- No duplicate listeners/runtime instances

‎docs/pr/BUILD_PR_INTERACTIVE_DEV_CONSOLE_UI.md‎

Lines changed: 118 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,118 @@
1+
Toolbox Aid
2+
David Quesenberry
3+
04/05/2026
4+
BUILD_PR_INTERACTIVE_DEV_CONSOLE_UI.md
5+
6+
# BUILD PR
7+
Interactive Dev Console UI
8+
9+
## Objective
10+
Build an on-canvas interactive developer console UI on top of the existing dev console runtime, combo-key controls,
11+
and canvas HUD so commands can be typed and executed directly in one running sample.
12+
13+
## Implementation Scope
14+
- Create a dedicated interactive console renderer/input state module
15+
- Update the existing sample-level dev console integration to support typed input
16+
- Modify one sample entry file only
17+
- Keep engine core untouched
18+
- Reuse existing runtime command execution pipeline
19+
20+
## Required Output
21+
Codex must produce implementation code and package:
22+
<project folder>/tmp/BUILD_PR_INTERACTIVE_DEV_CONSOLE_UI_delta.zip
23+
24+
## Target Files
25+
Expected implementation focus:
26+
- tools/dev/interactiveDevConsoleRenderer.js
27+
- tools/dev/devConsoleIntegration.js
28+
- one sample entry file only
29+
- optional test file if needed
30+
31+
## Implementation Requirements
32+
33+
### 1. New interactive console renderer
34+
Create:
35+
tools/dev/interactiveDevConsoleRenderer.js
36+
37+
Responsibilities:
38+
- render a console surface on canvas
39+
- render input prompt + current input buffer
40+
- render visible output history window
41+
- render command history cursor state when navigating
42+
- clip safely when output exceeds visible area
43+
- tolerate empty history and empty input safely
44+
- remain dependency-free
45+
46+
### 2. Update dev console integration
47+
Update:
48+
tools/dev/devConsoleIntegration.js
49+
50+
Requirements:
51+
- preserve existing combo keys:
52+
- Shift + ` => toggle console
53+
- Ctrl + Shift + ` => toggle overlay
54+
- Ctrl + Shift + R => reload
55+
- Ctrl + Shift + ] => next panel
56+
- Ctrl + Shift + [ => previous panel
57+
- when console is open:
58+
- capture printable character input
59+
- Backspace edits current buffer
60+
- Enter executes command through existing runtime
61+
- Escape closes console
62+
- ArrowUp browses older commands
63+
- ArrowDown browses newer commands
64+
- when console is closed:
65+
- do not capture gameplay typing
66+
- expose a drawConsole(ctx, state) method
67+
- keep HUD and console draw paths separate but coordinated
68+
69+
### 3. Sample wiring
70+
Modify ONE sample entry file only.
71+
72+
Requirements:
73+
- initialize integration once
74+
- update diagnostics in the loop
75+
- draw world first
76+
- draw HUD last when enabled
77+
- draw console surface when enabled
78+
- prevent duplicate listeners/runtime instances across reinit or reload
79+
80+
## UI Rules
81+
- on-canvas only
82+
- no DOM dependency required
83+
- readable font, padding, and translucent background
84+
- visible prompt marker
85+
- bounded history size
86+
- safe line wrapping or truncation strategy
87+
- save()/restore() around canvas state changes
88+
89+
## Minimum Commands to Validate
90+
- help
91+
- status
92+
- scene.info
93+
94+
## Acceptance Criteria
95+
- console opens and closes reliably
96+
- typed text appears on canvas
97+
- Enter executes commands
98+
- output history is visible
99+
- ArrowUp/ArrowDown history navigation works
100+
- Escape closes cleanly
101+
- sample still runs normally
102+
- no F-key bindings reintroduced
103+
- no engine core files modified
104+
105+
## Validation
106+
- node --check on all touched JS files
107+
- manual browser run
108+
- verify text input
109+
- verify command output
110+
- verify invalid command output is shown safely
111+
- verify input stops being captured after close
112+
- verify no duplicate listeners after repeated toggles/reloads
113+
114+
## Rollback
115+
If instability appears:
116+
- disable console surface rendering
117+
- preserve runtime and HUD behavior
118+
- keep combo-key control path intact

‎samples/Phase 12 - Demo Games/Demo 1205 - Multi-System Demo/MultiSystemDemoScene.js‎

Lines changed: 2 additions & 1 deletion
Original file line numberDiff line numberDiff line change
@@ -252,6 +252,7 @@ export default class MultiSystemDemoScene extends Scene {
252252
'No enemies, trigger/switch systems, or broader game systems.',
253253
'Debug: Shift+` console, Ctrl+Shift+` overlay, Ctrl+Shift+R reload.',
254254
'Debug Panels: Ctrl+Shift+] next panel, Ctrl+Shift+[ previous panel.',
255+
'Console Input: type command + Enter (Up/Down history, Esc clear).',
255256
]);
256257

257258
renderer.strokeRect(this.screen.x, this.screen.y, this.camera.viewportWidth, this.camera.viewportHeight, '#d8d5ff', 2);
@@ -278,7 +279,7 @@ export default class MultiSystemDemoScene extends Scene {
278279
`Goal: ${complete}`,
279280
`Camera X: ${this.camera.x.toFixed(1)}`,
280281
`Parallax Far/Near: ${this.parallaxLayers[0].speed}/${this.parallaxLayers[2].speed}`,
281-
'Controls: Left/Right + Space + Shift+` + Ctrl+Shift+`',
282+
'Controls: Left/Right + Space + Shift+` (console input while open)',
282283
]);
283284

284285
if (this.devConsoleIntegration) {

0 commit comments

Comments
 (0)