Skip to content

Commit 32540ae

Browse files
author
DavidQ
committed
Add raw shared Toolbox Aid header source plus importable module in src/engine/theme.
Include: - shared header template html - shared header css - shared header js - shared re-export entry PR: BUILD_PR_LEVEL_24_6_TOOLBOXAID_SHARED_THEME_HEADER
1 parent 1120a18 commit 32540ae

12 files changed

Lines changed: 1683 additions & 566 deletions

‎docs/dev/reports/theme_header_validation_checklist.txt‎

Lines changed: 5 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,5 @@
1+
[ ] Raw header template present
2+
[ ] CSS present
3+
[ ] JS module present
4+
[ ] Re-export present
5+
[ ] Import path documented

‎docs/pr/BUILD_PR_LEVEL_24_6_TOOLBOXAID_SHARED_THEME_HEADER.md‎

Lines changed: 22 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,22 @@
1+
# BUILD_PR_LEVEL_24_6_TOOLBOXAID_SHARED_THEME_HEADER
2+
3+
## Purpose
4+
Provide the shared Toolbox Aid header as real importable source under `src/engine/theme`.
5+
6+
## Required Shared Source
7+
- `src/engine/theme/toolboxaid-header.template.html`
8+
- `src/engine/theme/toolboxaid-header.css`
9+
- `src/engine/theme/toolboxaid-header.js`
10+
- `src/engine/theme/index.js`
11+
12+
## Menu
13+
- Home
14+
- Games
15+
- Samples
16+
- Tools
17+
18+
## Acceptance
19+
- Other pages can import from `src/engine/theme/index.js`
20+
- Raw header source file is present in the ZIP
21+
- CSS is shared in one place
22+
- No duplicated header copies across pages

‎games/index.html‎

Lines changed: 235 additions & 179 deletions
Large diffs are not rendered by default.

‎index.html‎

Lines changed: 108 additions & 98 deletions
Original file line numberDiff line numberDiff line change
@@ -6,121 +6,131 @@
66
-->
77
<!DOCTYPE html>
88
<html lang="en">
9+
910
<head>
1011
<meta charset="UTF-8" />
1112
<meta name="viewport" content="width=device-width, initial-scale=1.0" />
1213
<title>HTML JavaScript Gaming</title>
1314
<link rel="icon" href="favicon.ico" />
1415
<link rel="stylesheet" href="src/engine/ui/hubCommon.css" />
16+
<link rel="stylesheet" href="src/engine/theme/toolboxaid-header.css" />
1517
</head>
18+
1619
<body class="hub-page-home">
1720
<div class="wrap">
21+
<div class="hideme">
22+
<div id="shared-theme-header"></div>
23+
<p class="subtitle">A home base for playable arcade builds, sample-driven engine patterns, and shared tooling.
24+
Start with the hubs below to jump into games, samples, or the asset pipeline.</p>
25+
</div>
26+
1827
<section class="hero">
19-
<h1>HTML JavaScript Gaming</h1>
20-
<p class="subtitle">
21-
A home base for playable arcade builds, sample-driven engine patterns, and shared tooling. Start with the hubs below to jump into games, samples, or the asset pipeline.
22-
</p>
23-
<div class="hero-links">
24-
<a class="cta primary" href="games/index.html">Open Games Hub</a>
25-
<a class="cta" href="samples/index.html">Browse Samples</a>
26-
<a class="cta" href="tools/index.html">Open Tools Hub</a>
27-
</div>
28-
</section>
2928

30-
<section class="section">
31-
<h2>Start Here</h2>
32-
<p>Three primary hubs: explore sample patterns, play shipped games, and open the supporting tools.</p>
33-
<div class="grid">
34-
<a class="card" href="samples/index.html">
35-
<div class="eyebrow">Samples</div>
36-
<h3>Samples Hub</h3>
37-
<p>Explore 182 micro-demos (001-182) that showcase engine patterns, input/camera/collision systems, and UI helpers.</p>
38-
<div class="path">samples/index.html</div>
39-
<div class="badges">
40-
<span class="badge sample">Patterns</span>
41-
<span class="badge sample">Demos</span>
42-
</div>
43-
</a>
4429

45-
<a class="card" href="games/index.html">
46-
<div class="eyebrow">Games</div>
47-
<h3>Games Hub</h3>
48-
<p>Launch the current playable titles, see Pong queued up next, and track the broader classic arcade roadmap.</p>
49-
<div class="path">games/index.html</div>
50-
<div class="badges">
51-
<span class="badge game">Playable Games</span>
52-
<span class="badge roadmap">Roadmap</span>
53-
</div>
54-
</a>
30+
<section class="section">
31+
<h2>Start Here</h2>
32+
<p>Three primary hubs: explore sample patterns, play shipped games, and open the supporting tools.</p>
33+
<div class="grid">
34+
<a class="card" href="samples/index.html">
35+
<div class="eyebrow">Samples</div>
36+
<h3>Samples Hub</h3>
37+
<p>Explore 182 micro-demos (001-182) that showcase engine patterns, input/camera/collision
38+
systems, and UI helpers.</p>
39+
<div class="path">samples/index.html</div>
40+
<div class="badges">
41+
<span class="badge sample">Patterns</span>
42+
<span class="badge sample">Demos</span>
43+
</div>
44+
</a>
5545

56-
<a class="card" href="tools/index.html">
57-
<div class="eyebrow">Tools</div>
58-
<h3>Tools Hub</h3>
59-
<p>Open the Sprite Editor, review the Tilemap Editor priority, and see how the shared palette workflow fits into future asset tools.</p>
60-
<div class="path">tools/index.html</div>
61-
<div class="badges">
62-
<span class="badge tool">Sprite Editor</span>
63-
<span class="badge roadmap">Tool Roadmap</span>
64-
</div>
65-
</a>
66-
</div>
67-
</section>
46+
<a class="card" href="games/index.html">
47+
<div class="eyebrow">Games</div>
48+
<h3>Games Hub</h3>
49+
<p>Launch the current playable titles, see Pong queued up next, and track the broader classic
50+
arcade roadmap.</p>
51+
<div class="path">games/index.html</div>
52+
<div class="badges">
53+
<span class="badge game">Playable Games</span>
54+
<span class="badge roadmap">Roadmap</span>
55+
</div>
56+
</a>
6857

69-
<section class="section">
70-
<h2>Playable Today</h2>
71-
<p>These are the games currently linked from the launcher and ready to open from the repo.</p>
72-
<div class="grid">
73-
<a class="card" href="games/GravityWell/index.html">
74-
<div class="eyebrow">Live Game</div>
75-
<h3>Gravity Well</h3>
76-
<p>Vector-style orbital flight built around gravity assists, route planning, and collecting every beacon in one run.</p>
77-
<div class="path">games/GravityWell/index.html</div>
78-
<div class="badges">
79-
<span class="badge game">Playable</span>
80-
</div>
81-
</a>
58+
<a class="card" href="tools/index.html">
59+
<div class="eyebrow">Tools</div>
60+
<h3>Tools Hub</h3>
61+
<p>Open the Sprite Editor, review the Tilemap Editor priority, and see how the shared palette
62+
workflow fits into future asset tools.</p>
63+
<div class="path">tools/index.html</div>
64+
<div class="badges">
65+
<span class="badge tool">Sprite Editor</span>
66+
<span class="badge roadmap">Tool Roadmap</span>
67+
</div>
68+
</a>
69+
</div>
70+
</section>
8271

83-
<a class="card" href="games/Asteroids/index.html">
84-
<div class="eyebrow">Live Game</div>
85-
<h3>Asteroids</h3>
86-
<p>Classic arcade shooter with vector presentation, score chase flow, and polished moment-to-moment ship combat.</p>
87-
<div class="path">games/Asteroids/index.html</div>
88-
<div class="badges">
89-
<span class="badge game">Playable</span>
90-
</div>
91-
</a>
92-
</div>
93-
</section>
72+
<section class="section">
73+
<h2>Playable Today</h2>
74+
<p>These are the games currently linked from the launcher and ready to open from the repo.</p>
75+
<div class="grid">
76+
<a class="card" href="games/GravityWell/index.html">
77+
<div class="eyebrow">Live Game</div>
78+
<h3>Gravity Well</h3>
79+
<p>Vector-style orbital flight built around gravity assists, route planning, and collecting
80+
every beacon in one run.</p>
81+
<div class="path">games/GravityWell/index.html</div>
82+
<div class="badges">
83+
<span class="badge game">Playable</span>
84+
</div>
85+
</a>
9486

95-
<section class="section">
96-
<h2>Build Direction</h2>
97-
<p>This PR keeps the focus on navigation and planning: Pong is next, and the tools work stays centered on asset creation rather than engine changes.</p>
98-
<div class="grid">
99-
<a class="card" href="games/index.html">
100-
<div class="eyebrow">Next Game</div>
101-
<h3>Pong</h3>
102-
<p>The next build target, positioned as the foundation for more classic arcade releases.</p>
103-
<div class="path">games/index.html</div>
104-
<div class="badges">
105-
<span class="badge roadmap">Next Build</span>
106-
</div>
107-
</a>
87+
<a class="card" href="games/Asteroids/index.html">
88+
<div class="eyebrow">Live Game</div>
89+
<h3>Asteroids</h3>
90+
<p>Classic arcade shooter with vector presentation, score chase flow, and polished
91+
moment-to-moment ship combat.</p>
92+
<div class="path">games/Asteroids/index.html</div>
93+
<div class="badges">
94+
<span class="badge game">Playable</span>
95+
</div>
96+
</a>
97+
</div>
98+
</section>
10899

109-
<a class="card" href="tools/index.html">
110-
<div class="eyebrow">Next Tooling</div>
111-
<h3>Tilemap + Palette Workflow</h3>
112-
<p>The tool roadmap prioritizes a Tilemap Editor and a palette-driven asset workflow that stays aligned with shared data.</p>
113-
<div class="path">tools/index.html</div>
114-
<div class="badges">
115-
<span class="badge roadmap">Planned</span>
116-
</div>
117-
</a>
118-
</div>
119-
</section>
100+
<section class="section">
101+
<h2>Build Direction</h2>
102+
<p>This PR keeps the focus on navigation and planning: Pong is next, and the tools work stays centered
103+
on asset creation rather than engine changes.</p>
104+
<div class="grid">
105+
<a class="card" href="games/index.html">
106+
<div class="eyebrow">Next Game</div>
107+
<h3>Pong</h3>
108+
<p>The next build target, positioned as the foundation for more classic arcade releases.</p>
109+
<div class="path">games/index.html</div>
110+
<div class="badges">
111+
<span class="badge roadmap">Next Build</span>
112+
</div>
113+
</a>
114+
115+
<a class="card" href="tools/index.html">
116+
<div class="eyebrow">Next Tooling</div>
117+
<h3>Tilemap + Palette Workflow</h3>
118+
<p>The tool roadmap prioritizes a Tilemap Editor and a palette-driven asset workflow that stays
119+
aligned with shared data.</p>
120+
<div class="path">tools/index.html</div>
121+
<div class="badges">
122+
<span class="badge roadmap">Planned</span>
123+
</div>
124+
</a>
125+
</div>
126+
</section>
120127

121-
<div class="footer-note">
122-
Open the repo through a local web server for the best results. Some browsers restrict module loading and asset access when pages are opened directly with <code>file:///</code>.
123-
</div>
128+
<div class="footer-note">
129+
Open the repo through a local web server for the best results. Some browsers restrict module loading and
130+
asset access when pages are opened directly with <code>file:///</code>.
131+
</div>
124132
</div>
133+
<script type="module" src="./src/engine/theme/mount-shared-header.js"></script>
125134
</body>
126-
</html>
135+
136+
</html>

0 commit comments

Comments
 (0)