@guinetik/gcanvas 1.0.2 → 1.0.4

This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.
Files changed (217) hide show
  1. package/dist/gcanvas.es.js +25656 -0
  2. package/dist/gcanvas.es.min.js +1 -0
  3. package/dist/gcanvas.umd.js +1 -0
  4. package/dist/gcanvas.umd.min.js +1 -0
  5. package/package.json +23 -6
  6. package/src/game/objects/index.js +1 -0
  7. package/src/game/objects/spritesheet.js +260 -0
  8. package/src/game/ui/theme.js +6 -0
  9. package/src/io/keys.js +9 -1
  10. package/src/math/boolean.js +481 -0
  11. package/src/math/index.js +1 -0
  12. package/.github/workflows/release.yaml +0 -70
  13. package/.jshintrc +0 -4
  14. package/.vscode/settings.json +0 -22
  15. package/CLAUDE.md +0 -310
  16. package/blackhole.jpg +0 -0
  17. package/demo.png +0 -0
  18. package/demos/CNAME +0 -1
  19. package/demos/animations.html +0 -31
  20. package/demos/basic.html +0 -38
  21. package/demos/baskara.html +0 -31
  22. package/demos/bezier.html +0 -35
  23. package/demos/beziersignature.html +0 -29
  24. package/demos/blackhole.html +0 -28
  25. package/demos/blob.html +0 -35
  26. package/demos/coordinates.html +0 -698
  27. package/demos/cube3d.html +0 -23
  28. package/demos/demos.css +0 -303
  29. package/demos/dino.html +0 -42
  30. package/demos/easing.html +0 -28
  31. package/demos/events.html +0 -195
  32. package/demos/fluent.html +0 -647
  33. package/demos/fluid-simple.html +0 -22
  34. package/demos/fluid.html +0 -37
  35. package/demos/fractals.html +0 -36
  36. package/demos/gameobjects.html +0 -626
  37. package/demos/genart.html +0 -26
  38. package/demos/gendream.html +0 -26
  39. package/demos/group.html +0 -36
  40. package/demos/home.html +0 -587
  41. package/demos/index.html +0 -376
  42. package/demos/isometric.html +0 -34
  43. package/demos/js/animations.js +0 -452
  44. package/demos/js/basic.js +0 -204
  45. package/demos/js/baskara.js +0 -751
  46. package/demos/js/bezier.js +0 -692
  47. package/demos/js/beziersignature.js +0 -241
  48. package/demos/js/blackhole/accretiondisk.obj.js +0 -379
  49. package/demos/js/blackhole/blackhole.obj.js +0 -318
  50. package/demos/js/blackhole/index.js +0 -409
  51. package/demos/js/blackhole/particle.js +0 -56
  52. package/demos/js/blackhole/starfield.obj.js +0 -218
  53. package/demos/js/blob.js +0 -2276
  54. package/demos/js/coordinates.js +0 -840
  55. package/demos/js/cube3d.js +0 -789
  56. package/demos/js/dino.js +0 -1420
  57. package/demos/js/easing.js +0 -477
  58. package/demos/js/fluent.js +0 -183
  59. package/demos/js/fluid-simple.js +0 -253
  60. package/demos/js/fluid.js +0 -527
  61. package/demos/js/fractals.js +0 -931
  62. package/demos/js/fractalworker.js +0 -93
  63. package/demos/js/gameobjects.js +0 -176
  64. package/demos/js/genart.js +0 -268
  65. package/demos/js/gendream.js +0 -209
  66. package/demos/js/group.js +0 -140
  67. package/demos/js/info-toggle.js +0 -25
  68. package/demos/js/isometric.js +0 -863
  69. package/demos/js/kerr.js +0 -1556
  70. package/demos/js/lavalamp.js +0 -590
  71. package/demos/js/layout.js +0 -354
  72. package/demos/js/mondrian.js +0 -285
  73. package/demos/js/opacity.js +0 -275
  74. package/demos/js/painter.js +0 -484
  75. package/demos/js/particles-showcase.js +0 -514
  76. package/demos/js/particles.js +0 -299
  77. package/demos/js/patterns.js +0 -397
  78. package/demos/js/penrose/artifact.js +0 -69
  79. package/demos/js/penrose/blackhole.js +0 -121
  80. package/demos/js/penrose/constants.js +0 -73
  81. package/demos/js/penrose/game.js +0 -943
  82. package/demos/js/penrose/lore.js +0 -278
  83. package/demos/js/penrose/penrosescene.js +0 -892
  84. package/demos/js/penrose/ship.js +0 -216
  85. package/demos/js/penrose/sounds.js +0 -211
  86. package/demos/js/penrose/voidparticle.js +0 -55
  87. package/demos/js/penrose/voidscene.js +0 -258
  88. package/demos/js/penrose/voidship.js +0 -144
  89. package/demos/js/penrose/wormhole.js +0 -46
  90. package/demos/js/pipeline.js +0 -555
  91. package/demos/js/plane3d.js +0 -256
  92. package/demos/js/platformer.js +0 -1579
  93. package/demos/js/scene.js +0 -304
  94. package/demos/js/scenes.js +0 -320
  95. package/demos/js/schrodinger.js +0 -410
  96. package/demos/js/schwarzschild.js +0 -1023
  97. package/demos/js/shapes.js +0 -628
  98. package/demos/js/space/alien.js +0 -171
  99. package/demos/js/space/boom.js +0 -98
  100. package/demos/js/space/boss.js +0 -353
  101. package/demos/js/space/buff.js +0 -73
  102. package/demos/js/space/bullet.js +0 -102
  103. package/demos/js/space/constants.js +0 -85
  104. package/demos/js/space/game.js +0 -1884
  105. package/demos/js/space/hud.js +0 -112
  106. package/demos/js/space/laserbeam.js +0 -179
  107. package/demos/js/space/lightning.js +0 -277
  108. package/demos/js/space/minion.js +0 -192
  109. package/demos/js/space/missile.js +0 -212
  110. package/demos/js/space/player.js +0 -430
  111. package/demos/js/space/powerup.js +0 -90
  112. package/demos/js/space/starfield.js +0 -58
  113. package/demos/js/space/starpower.js +0 -90
  114. package/demos/js/spacetime.js +0 -559
  115. package/demos/js/sphere3d.js +0 -229
  116. package/demos/js/sprite.js +0 -473
  117. package/demos/js/svgtween.js +0 -204
  118. package/demos/js/tde/accretiondisk.js +0 -471
  119. package/demos/js/tde/blackhole.js +0 -219
  120. package/demos/js/tde/blackholescene.js +0 -209
  121. package/demos/js/tde/config.js +0 -59
  122. package/demos/js/tde/index.js +0 -820
  123. package/demos/js/tde/jets.js +0 -290
  124. package/demos/js/tde/lensedstarfield.js +0 -154
  125. package/demos/js/tde/tdestar.js +0 -297
  126. package/demos/js/tde/tidalstream.js +0 -372
  127. package/demos/js/tde_old/blackhole.obj.js +0 -354
  128. package/demos/js/tde_old/debris.obj.js +0 -791
  129. package/demos/js/tde_old/flare.obj.js +0 -239
  130. package/demos/js/tde_old/index.js +0 -448
  131. package/demos/js/tde_old/star.obj.js +0 -812
  132. package/demos/js/tiles.js +0 -312
  133. package/demos/js/tweendemo.js +0 -79
  134. package/demos/js/visibility.js +0 -102
  135. package/demos/kerr.html +0 -28
  136. package/demos/lavalamp.html +0 -27
  137. package/demos/layouts.html +0 -37
  138. package/demos/logo.svg +0 -4
  139. package/demos/loop.html +0 -84
  140. package/demos/mondrian.html +0 -32
  141. package/demos/og_image.png +0 -0
  142. package/demos/opacity.html +0 -36
  143. package/demos/painter.html +0 -39
  144. package/demos/particles-showcase.html +0 -28
  145. package/demos/particles.html +0 -24
  146. package/demos/patterns.html +0 -33
  147. package/demos/penrose-game.html +0 -31
  148. package/demos/pipeline.html +0 -737
  149. package/demos/plane3d.html +0 -24
  150. package/demos/platformer.html +0 -43
  151. package/demos/scene.html +0 -33
  152. package/demos/scenes.html +0 -96
  153. package/demos/schrodinger.html +0 -27
  154. package/demos/schwarzschild.html +0 -27
  155. package/demos/shapes.html +0 -16
  156. package/demos/space.html +0 -85
  157. package/demos/spacetime.html +0 -27
  158. package/demos/sphere3d.html +0 -24
  159. package/demos/sprite.html +0 -18
  160. package/demos/svgtween.html +0 -29
  161. package/demos/tde.html +0 -28
  162. package/demos/tiles.html +0 -28
  163. package/demos/transforms.html +0 -400
  164. package/demos/tween.html +0 -45
  165. package/demos/visibility.html +0 -33
  166. package/docs/README.md +0 -230
  167. package/docs/api/FluidSystem.md +0 -173
  168. package/docs/concepts/architecture-overview.md +0 -204
  169. package/docs/concepts/coordinate-system.md +0 -384
  170. package/docs/concepts/lifecycle.md +0 -255
  171. package/docs/concepts/rendering-pipeline.md +0 -279
  172. package/docs/concepts/shapes-vs-gameobjects.md +0 -187
  173. package/docs/concepts/tde-zorder.md +0 -106
  174. package/docs/concepts/two-layer-architecture.md +0 -229
  175. package/docs/fluid-dynamics.md +0 -99
  176. package/docs/getting-started/first-game.md +0 -354
  177. package/docs/getting-started/hello-world.md +0 -269
  178. package/docs/getting-started/installation.md +0 -175
  179. package/docs/modules/collision/README.md +0 -453
  180. package/docs/modules/fluent/README.md +0 -1075
  181. package/docs/modules/game/README.md +0 -303
  182. package/docs/modules/isometric-camera.md +0 -210
  183. package/docs/modules/isometric.md +0 -275
  184. package/docs/modules/painter/README.md +0 -328
  185. package/docs/modules/particle/README.md +0 -559
  186. package/docs/modules/shapes/README.md +0 -221
  187. package/docs/modules/shapes/base/euclidian.md +0 -123
  188. package/docs/modules/shapes/base/geometry2d.md +0 -204
  189. package/docs/modules/shapes/base/renderable.md +0 -215
  190. package/docs/modules/shapes/base/shape.md +0 -262
  191. package/docs/modules/shapes/base/transformable.md +0 -243
  192. package/docs/modules/shapes/hierarchy.md +0 -218
  193. package/docs/modules/state/README.md +0 -577
  194. package/docs/modules/util/README.md +0 -99
  195. package/docs/modules/util/camera3d.md +0 -412
  196. package/docs/modules/util/scene3d.md +0 -395
  197. package/index.html +0 -17
  198. package/jsdoc.json +0 -50
  199. package/scripts/build-demo.js +0 -69
  200. package/scripts/bundle4llm.js +0 -276
  201. package/scripts/clearconsole.js +0 -48
  202. package/test/math/orbital.test.js +0 -61
  203. package/test/math/tensor.test.js +0 -114
  204. package/test/particle/emitter.test.js +0 -204
  205. package/test/particle/particle-system.test.js +0 -310
  206. package/test/particle/particle.test.js +0 -116
  207. package/test/particle/updaters.test.js +0 -386
  208. package/test/setup.js +0 -120
  209. package/test/shapes/euclidian.test.js +0 -44
  210. package/test/shapes/geometry.test.js +0 -86
  211. package/test/shapes/group.test.js +0 -86
  212. package/test/shapes/rectangle.test.js +0 -64
  213. package/test/shapes/transform.test.js +0 -379
  214. package/test/util/camera3d.test.js +0 -428
  215. package/test/util/scene3d.test.js +0 -352
  216. package/vite.config.js +0 -50
  217. package/vitest.config.js +0 -13
package/demos/index.html DELETED
@@ -1,376 +0,0 @@
1
- <!doctype html>
2
- <html lang="en">
3
- <head>
4
- <meta charset="UTF-8" />
5
- <meta name="viewport" content="width=device-width, initial-scale=1.0" />
6
-
7
- <!-- Primary Meta Tags -->
8
- <title>GCanvas Demos - Interactive Examples & Documentation</title>
9
- <meta name="title" content="GCanvas Demos - Interactive Examples & Documentation">
10
- <meta name="description" content="Explore interactive demos and examples of GCanvas, a modular 2D canvas rendering and game framework. See shapes, animations, physics simulations, games, and more in action.">
11
- <meta name="keywords" content="gcanvas, canvas demos, 2d canvas examples, game framework demos, javascript canvas, html5 canvas examples, interactive demos, creative coding examples">
12
- <meta name="author" content="GCanvas">
13
- <meta name="robots" content="index, follow">
14
- <link rel="canonical" href="https://gcanvas.guinetik.com/">
15
-
16
- <!-- Open Graph / Facebook -->
17
- <meta property="og:type" content="website">
18
- <meta property="og:url" content="https://gcanvas.guinetik.com/">
19
- <meta property="og:title" content="GCanvas Demos - Interactive Examples & Documentation">
20
- <meta property="og:description" content="Explore interactive demos and examples of GCanvas, a modular 2D canvas rendering and game framework. See shapes, animations, physics simulations, games, and more in action.">
21
- <meta property="og:image" content="https://gcanvas.guinetik.com/og_image.png">
22
- <meta property="og:image:width" content="1200">
23
- <meta property="og:image:height" content="630">
24
- <meta property="og:image:alt" content="GCanvas interactive demos and examples">
25
- <meta property="og:site_name" content="GCanvas">
26
- <meta property="og:locale" content="en_US">
27
-
28
- <!-- Twitter -->
29
- <meta name="twitter:card" content="summary_large_image">
30
- <meta name="twitter:url" content="https://gcanvas.guinetik.com/">
31
- <meta name="twitter:title" content="GCanvas Demos - Interactive Examples & Documentation">
32
- <meta name="twitter:description" content="Explore interactive demos and examples of GCanvas, a modular 2D canvas rendering and game framework. See shapes, animations, physics simulations, games, and more in action.">
33
- <meta name="twitter:image" content="https://gcanvas.guinetik.com/og_image.png">
34
- <meta name="twitter:image:alt" content="GCanvas interactive demos and examples">
35
- <meta name="twitter:creator" content="@guinetik">
36
-
37
- <!-- Favicon -->
38
- <link rel="icon" type="image/svg+xml" href="./logo.svg">
39
- <link rel="apple-touch-icon" href="./logo.svg">
40
- <meta name="theme-color" content="#000000">
41
-
42
- <!-- Structured Data (JSON-LD) -->
43
- <script type="application/ld+json">
44
- {
45
- "@context": "https://schema.org",
46
- "@type": "WebSite",
47
- "name": "GCanvas Demos",
48
- "url": "https://gcanvas.guinetik.com/",
49
- "description": "Interactive demos and examples for GCanvas, a modular 2D canvas rendering and game framework",
50
- "publisher": {
51
- "@type": "Organization",
52
- "name": "GCanvas",
53
- "url": "https://github.com/guinetik/gcanvas"
54
- },
55
- "potentialAction": {
56
- "@type": "SearchAction",
57
- "target": "https://gcanvas.guinetik.com/?q={search_term_string}",
58
- "query-input": "required name=search_term_string"
59
- }
60
- }
61
- </script>
62
-
63
- <link rel="stylesheet" href="demos.css" />
64
-
65
- <!-- Google Analytics -->
66
- <script
67
- async
68
- src="https://www.googletagmanager.com/gtag/js?id=G-1GHJD0LM4Z"
69
- ></script>
70
- <script>
71
- window.dataLayer = window.dataLayer || [];
72
- function gtag() {
73
- dataLayer.push(arguments);
74
- }
75
- gtag("js", new Date());
76
- gtag("config", "G-1GHJD0LM4Z", { send_page_view: false });
77
-
78
- // Track virtual pageviews on hash changes
79
- function trackPageView(route) {
80
- gtag("event", "page_view", {
81
- page_title: route + " - GCanvas Demos",
82
- page_path: "/demos/" + route,
83
- });
84
- }
85
- </script>
86
- </head>
87
-
88
- <body>
89
- <!-- Mobile Header (hidden on desktop) -->
90
- <header class="mobile-header">
91
- <img src="./logo.svg" alt="GCanvas Logo" class="mobile-logo" />
92
- <span class="mobile-title">GCANVAS</span>
93
- <button
94
- class="hamburger"
95
- id="hamburger-btn"
96
- aria-label="Toggle menu"
97
- >
98
- <span></span>
99
- <span></span>
100
- <span></span>
101
- </button>
102
- </header>
103
-
104
- <!-- Overlay for closing menu when clicking outside -->
105
- <div class="nav-overlay" id="nav-overlay"></div>
106
-
107
- <nav id="main-nav">
108
- <div class="nav-branding">
109
- <div style="text-align: center; margin-bottom: 1em">
110
- <img
111
- src="./logo.svg"
112
- alt="Logo"
113
- width="90"
114
- height="80"
115
- style="display: inline-block; vertical-align: middle"
116
- />
117
- </div>
118
- <div style="text-align: center; margin-bottom: 1em">
119
- <h1
120
- style="
121
- letter-spacing: 2px;
122
- margin-bottom: 0.3em;
123
- margin-top: 0.25em;
124
- font-family: monospace;
125
- font-size: 2em;
126
- color: #ccc;
127
- "
128
- >
129
- GCANVAS
130
- </h1>
131
- <hr style="margin: 0.5em 1.6em" />
132
- <a
133
- href="https://github.com/guinetik/gcanvas"
134
- target="_blank"
135
- title="View on GitHub"
136
- style="
137
- display: inline-block;
138
- background: #1F1F1F;
139
- border-radius: 50%;
140
- width: 36px;
141
- height: 36px;
142
- margin: 0.5em;
143
- box-shadow: 0 2px 6px #0002;
144
- "
145
- >
146
- <svg
147
- viewBox="0 0 16 16"
148
- width="22"
149
- height="22"
150
- aria-hidden="true"
151
- fill="#fff"
152
- style="margin: 7px 0 0 0"
153
- >
154
- <path
155
- d="M8 0C3.58 0 0 3.58 0 8c0 3.54 2.29 6.53 5.47 7.59.4.07.55-.17.55-.38
156
- 0-.19-.01-.82-.01-1.49-2.01.37-2.53-.49-2.69-.94-.09-.23-.48-.94-.82-1.13-.28-.15-.68-.52
157
- -.01-.53.63-.01 1.08.58 1.23.82.72 1.21 1.87.87 2.33.66.07-.52.28-.87.5-1.07-1.78-.2
158
- -3.64-.89-3.64-3.95 0-.87.31-1.59.82-2.15-.08-.2-.36-1.02.08-2.12
159
- 0 0 .67-.21 2.2.82.64-.18 1.32-.27 2-.27.68 0 1.36.09 2 .27 1.53-1.04
160
- 2.2-.82 2.2-.82.44 1.1.16 1.92.08 2.12.51.56.82 1.27.82 2.15
161
- 0 3.07-1.87 3.75-3.65 3.95.29.25.54.73.54 1.48 0 1.07-.01 1.93-.01
162
- 2.2 0 .21.15.46.55.38A8.013 8.013 0 0 0 16 8c0-4.42-3.58-8-8-8z"
163
- ></path>
164
- </svg>
165
- </a>
166
- </div>
167
- <hr />
168
- </div>
169
- <h2 style="margin-bottom: 0.3em">Home</h2>
170
- <a href="home.html" target="demo-frame" class="active">Welcome</a>
171
- <hr />
172
- <h2 style="margin-bottom: 0.3em">Docs</h2>
173
- <a href="pipeline.html" target="demo-frame">Rendering Pipeline</a>
174
- <a href="gameobjects.html" target="demo-frame">Game Objects</a>
175
- <a href="coordinates.html" target="demo-frame">Coordinate System</a>
176
- <a href="fluent.html" target="demo-frame">Fluent API</a>
177
- <hr />
178
- <h2>Demos</h2>
179
- <h3>Game</h3>
180
- <a href="basic.html" target="demo-frame">Basic</a>
181
- <a href="loop.html" target="demo-frame">Game Loop</a>
182
- <a href="events.html" target="demo-frame">Event Handlers</a>
183
- <h3>Shapes</h3>
184
- <a href="shapes.html" target="demo-frame" class="active"
185
- >Shape Gallery</a
186
- >
187
- <a href="visibility.html" target="demo-frame">Visibility</a>
188
- <a href="opacity.html" target="demo-frame">Opacity</a>
189
- <a href="transforms.html" target="demo-frame">Transforms</a>
190
- <a href="group.html" target="demo-frame">Groups</a>
191
- <a href="particles.html" target="demo-frame">Shape Particles</a>
192
- <h3>Painter</h3>
193
- <a href="painter.html" target="demo-frame">Painter</a>
194
- <a href="bezier.html" target="demo-frame">Bezier Curves</a>
195
- <a href="beziersignature.html" target="demo-frame"
196
- >Bezier Signature</a
197
- >
198
- <a href="svgtween.html" target="demo-frame">SVG Motion</a>
199
- <h3>Image</h3>
200
- <a href="patterns.html" target="demo-frame">Image Patterns</a>
201
- <a href="fractals.html" target="demo-frame">Fractals</a>
202
- <h3>Motion</h3>
203
- <a href="animations.html" target="demo-frame">Animations</a>
204
- <a href="easing.html" target="demo-frame">Easing</a>
205
- <a href="tween.html" target="demo-frame">Tween</a>
206
- <a href="sprite.html" target="demo-frame">Sprite Timeline</a>
207
- <a href="particles-showcase.html" target="demo-frame"
208
- >Particle System</a
209
- >
210
- <h3>Scene</h3>
211
- <a href="scene.html" target="demo-frame">Scene</a>
212
- <a href="layouts.html" target="demo-frame">Scene Layouts</a>
213
- <a href="tiles.html" target="demo-frame">Tile Layout</a>
214
- <a href="isometric.html" target="demo-frame">Isometric</a>
215
- <a href="scenes.html" target="demo-frame">Scene Transforms</a>
216
- <hr />
217
- <h2 style="margin-bottom: 0.3em">3D</h2>
218
- <a href="sphere3d.html" target="demo-frame">Sphere3D Showcase</a>
219
- <a href="plane3d.html" target="demo-frame">Plane3D Showcase</a>
220
- <a href="cube3d.html" target="demo-frame">Rubik's Cube</a>
221
- <hr />
222
- <h2 style="margin-bottom: 0.3em">Generative Art</h2>
223
- <a href="genart.html" target="demo-frame">Hypnotic Mandala</a>
224
- <a href="mondrian.html" target="demo-frame">Mondrian</a>
225
- <a href="gendream.html" target="demo-frame">Fractal Plasma</a>
226
- <a href="lavalamp.html" target="demo-frame">Lava Lamp</a>
227
- <a href="baskara.html" target="demo-frame">Root Dance</a>
228
- <hr />
229
- <h2 style="margin-bottom: 0.3em">Math & Physics</h2>
230
- <a href="fluid.html" target="demo-frame">Fluid Playground</a>
231
- <a href="fluid-simple.html" target="demo-frame">Fluid System</a>
232
- <a href="schrodinger.html" target="demo-frame">Schrodinger Wave</a>
233
- <a href="spacetime.html" target="demo-frame">Spacetime Curvature</a>
234
- <a href="schwarzschild.html" target="demo-frame"
235
- >Schwarzschild Metric</a
236
- >
237
- <a href="kerr.html" target="demo-frame">Kerr Metric</a>
238
- <a href="blackhole.html" target="demo-frame">Black Hole</a>
239
- <a href="tde.html" target="demo-frame">Tidal Disruption</a>
240
- <hr />
241
- <h2 style="margin-bottom: 0.3em">Games</h2>
242
- <a href="blob.html" target="demo-frame">Bezier Blob</a>
243
- <a href="space.html" target="demo-frame">Space Invaders</a>
244
- <a href="dino.html" target="demo-frame">Dino Run</a>
245
- <a href="platformer.html" target="demo-frame">Tron Platformer</a>
246
- <a href="penrose-game.html" target="demo-frame"
247
- >Penrose Spacetime</a
248
- >
249
- <hr />
250
- </nav>
251
- <iframe name="demo-frame" id="demo-frame" src="home.html"></iframe>
252
-
253
- <!-- Simple script to highlight the active link -->
254
- <script>
255
- // Wait for the DOM to load
256
- document.addEventListener("DOMContentLoaded", () => {
257
- const links = document.querySelectorAll("nav a");
258
-
259
- links.forEach((link) => {
260
- link.addEventListener("click", () => {
261
- // Remove .active from all links
262
- links.forEach((l) => l.classList.remove("active"));
263
- // Add .active to the clicked link
264
- link.classList.add("active");
265
- });
266
- });
267
- });
268
- </script>
269
-
270
- <script>
271
- document.addEventListener("DOMContentLoaded", () => {
272
- const links = document.querySelectorAll("nav a");
273
- const iframe = document.getElementById("demo-frame");
274
-
275
- /**
276
- * Parse the hash in the form "#/shapes" => returns "shapes".
277
- * Default to "shapes" if there's no valid hash.
278
- */
279
- function getRouteFromHash() {
280
- if (location.hash.startsWith("#/")) {
281
- return location.hash.slice(2); // remove "#/"
282
- }
283
- return "home"; // fallback route
284
- }
285
-
286
- /**
287
- * Load the given route into the iframe, e.g. route="shapes" => "shapes.html"
288
- * Also highlight the corresponding link and track pageview.
289
- */
290
- function loadRoute(route) {
291
- // Set iframe src
292
- iframe.src = route + ".html";
293
-
294
- // Highlight the active link
295
- links.forEach((link) => {
296
- // link.href might be "shapes.html"
297
- // remove ".html" => "shapes"
298
- const linkRoute = link
299
- .getAttribute("href")
300
- .replace(".html", "");
301
- link.classList.toggle("active", linkRoute === route);
302
- });
303
-
304
- // Track virtual pageview
305
- if (typeof trackPageView === "function") {
306
- trackPageView(route);
307
- }
308
- }
309
-
310
- /**
311
- * On initial load (and whenever the hash changes), parse the route and load it.
312
- */
313
- function handleHashChange() {
314
- const route = getRouteFromHash();
315
- loadRoute(route);
316
- }
317
-
318
- // 1) On page load, handle the existing hash (if any).
319
- handleHashChange();
320
-
321
- // 2) Listen for future hash changes
322
- window.addEventListener("hashchange", handleHashChange);
323
-
324
- // 3) Intercept clicks on nav links so we can
325
- // set location.hash instead of letting them navigate directly.
326
- links.forEach((link) => {
327
- link.addEventListener("click", (e) => {
328
- e.preventDefault(); // stop normal link navigation
329
-
330
- // e.g. "shapes.html"
331
- const href = link.getAttribute("href");
332
- // remove ".html" => "shapes"
333
- const routeName = href.replace(".html", "");
334
-
335
- // set the hash: "#/shapes"
336
- location.hash = "/" + routeName;
337
- });
338
- });
339
- });
340
- </script>
341
-
342
- <!-- Hamburger Menu Toggle -->
343
- <script>
344
- document.addEventListener("DOMContentLoaded", () => {
345
- const hamburgerBtn = document.getElementById("hamburger-btn");
346
- const nav = document.getElementById("main-nav");
347
- const overlay = document.getElementById("nav-overlay");
348
-
349
- function toggleMenu() {
350
- nav.classList.toggle("open");
351
- overlay.classList.toggle("open");
352
- hamburgerBtn.classList.toggle("active");
353
- }
354
-
355
- function closeMenu() {
356
- nav.classList.remove("open");
357
- overlay.classList.remove("open");
358
- hamburgerBtn.classList.remove("active");
359
- }
360
-
361
- hamburgerBtn.addEventListener("click", toggleMenu);
362
- overlay.addEventListener("click", closeMenu);
363
-
364
- // Close menu when a link is clicked (on mobile)
365
- const links = document.querySelectorAll("nav a");
366
- links.forEach((link) => {
367
- link.addEventListener("click", () => {
368
- if (window.innerWidth <= 768) {
369
- closeMenu();
370
- }
371
- });
372
- });
373
- });
374
- </script>
375
- </body>
376
- </html>
package/demos/isometric.html DELETED
@@ -1,34 +0,0 @@
1
- <!DOCTYPE html>
2
- <html lang="en">
3
-
4
- <head>
5
- <meta charset="UTF-8" />
6
- <meta name="viewport" content="width=device-width, initial-scale=1.0" />
7
- <title>Isometric Scene</title>
8
- <link rel="stylesheet" href="demos.css" />
9
- <script src="./js/info-toggle.js"></script>
10
- </head>
11
-
12
- <body>
13
- <div id="info" class="light">
14
- <strong>Marble Madness</strong>
15
- <span>
16
- A mini <code>IsometricScene</code> demo with platforms at different heights.<br>
17
- <b>WASD</b> to move, <b>Space</b> to jump. Navigate the platforms!<br>
18
- <b>Q/E</b> or <b>arrow buttons</b> to rotate the view 90°.<br>
19
- The ball will reset if it falls off the edge.<br>
20
- </span>
21
- </div>
22
- <canvas id="game"></canvas>
23
- <script type="module">
24
- import { IsometricGame } from './js/isometric.js';
25
-
26
- window.addEventListener("load", () => {
27
- const canvas = document.getElementById("game");
28
- const game = new IsometricGame(canvas);
29
- game.start();
30
- });
31
- </script>
32
- </body>
33
-
34
- </html>