npm - @guinetik/gcanvas - Versions diffs - 1.0.2 → 1.0.4 - Mend

@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

package/dist/gcanvas.es.js +25656 -0
package/dist/gcanvas.es.min.js +1 -0
package/dist/gcanvas.umd.js +1 -0
package/dist/gcanvas.umd.min.js +1 -0
package/package.json +23 -6
package/src/game/objects/index.js +1 -0
package/src/game/objects/spritesheet.js +260 -0
package/src/game/ui/theme.js +6 -0
package/src/io/keys.js +9 -1
package/src/math/boolean.js +481 -0
package/src/math/index.js +1 -0
package/.github/workflows/release.yaml +0 -70
package/.jshintrc +0 -4
package/.vscode/settings.json +0 -22
package/CLAUDE.md +0 -310
package/blackhole.jpg +0 -0
package/demo.png +0 -0
package/demos/CNAME +0 -1
package/demos/animations.html +0 -31
package/demos/basic.html +0 -38
package/demos/baskara.html +0 -31
package/demos/bezier.html +0 -35
package/demos/beziersignature.html +0 -29
package/demos/blackhole.html +0 -28
package/demos/blob.html +0 -35
package/demos/coordinates.html +0 -698
package/demos/cube3d.html +0 -23
package/demos/demos.css +0 -303
package/demos/dino.html +0 -42
package/demos/easing.html +0 -28
package/demos/events.html +0 -195
package/demos/fluent.html +0 -647
package/demos/fluid-simple.html +0 -22
package/demos/fluid.html +0 -37
package/demos/fractals.html +0 -36
package/demos/gameobjects.html +0 -626
package/demos/genart.html +0 -26
package/demos/gendream.html +0 -26
package/demos/group.html +0 -36
package/demos/home.html +0 -587
package/demos/index.html +0 -376
package/demos/isometric.html +0 -34
package/demos/js/animations.js +0 -452
package/demos/js/basic.js +0 -204
package/demos/js/baskara.js +0 -751
package/demos/js/bezier.js +0 -692
package/demos/js/beziersignature.js +0 -241
package/demos/js/blackhole/accretiondisk.obj.js +0 -379
package/demos/js/blackhole/blackhole.obj.js +0 -318
package/demos/js/blackhole/index.js +0 -409
package/demos/js/blackhole/particle.js +0 -56
package/demos/js/blackhole/starfield.obj.js +0 -218
package/demos/js/blob.js +0 -2276
package/demos/js/coordinates.js +0 -840
package/demos/js/cube3d.js +0 -789
package/demos/js/dino.js +0 -1420
package/demos/js/easing.js +0 -477
package/demos/js/fluent.js +0 -183
package/demos/js/fluid-simple.js +0 -253
package/demos/js/fluid.js +0 -527
package/demos/js/fractals.js +0 -931
package/demos/js/fractalworker.js +0 -93
package/demos/js/gameobjects.js +0 -176
package/demos/js/genart.js +0 -268
package/demos/js/gendream.js +0 -209
package/demos/js/group.js +0 -140
package/demos/js/info-toggle.js +0 -25
package/demos/js/isometric.js +0 -863
package/demos/js/kerr.js +0 -1556
package/demos/js/lavalamp.js +0 -590
package/demos/js/layout.js +0 -354
package/demos/js/mondrian.js +0 -285
package/demos/js/opacity.js +0 -275
package/demos/js/painter.js +0 -484
package/demos/js/particles-showcase.js +0 -514
package/demos/js/particles.js +0 -299
package/demos/js/patterns.js +0 -397
package/demos/js/penrose/artifact.js +0 -69
package/demos/js/penrose/blackhole.js +0 -121
package/demos/js/penrose/constants.js +0 -73
package/demos/js/penrose/game.js +0 -943
package/demos/js/penrose/lore.js +0 -278
package/demos/js/penrose/penrosescene.js +0 -892
package/demos/js/penrose/ship.js +0 -216
package/demos/js/penrose/sounds.js +0 -211
package/demos/js/penrose/voidparticle.js +0 -55
package/demos/js/penrose/voidscene.js +0 -258
package/demos/js/penrose/voidship.js +0 -144
package/demos/js/penrose/wormhole.js +0 -46
package/demos/js/pipeline.js +0 -555
package/demos/js/plane3d.js +0 -256
package/demos/js/platformer.js +0 -1579
package/demos/js/scene.js +0 -304
package/demos/js/scenes.js +0 -320
package/demos/js/schrodinger.js +0 -410
package/demos/js/schwarzschild.js +0 -1023
package/demos/js/shapes.js +0 -628
package/demos/js/space/alien.js +0 -171
package/demos/js/space/boom.js +0 -98
package/demos/js/space/boss.js +0 -353
package/demos/js/space/buff.js +0 -73
package/demos/js/space/bullet.js +0 -102
package/demos/js/space/constants.js +0 -85
package/demos/js/space/game.js +0 -1884
package/demos/js/space/hud.js +0 -112
package/demos/js/space/laserbeam.js +0 -179
package/demos/js/space/lightning.js +0 -277
package/demos/js/space/minion.js +0 -192
package/demos/js/space/missile.js +0 -212
package/demos/js/space/player.js +0 -430
package/demos/js/space/powerup.js +0 -90
package/demos/js/space/starfield.js +0 -58
package/demos/js/space/starpower.js +0 -90
package/demos/js/spacetime.js +0 -559
package/demos/js/sphere3d.js +0 -229
package/demos/js/sprite.js +0 -473
package/demos/js/svgtween.js +0 -204
package/demos/js/tde/accretiondisk.js +0 -471
package/demos/js/tde/blackhole.js +0 -219
package/demos/js/tde/blackholescene.js +0 -209
package/demos/js/tde/config.js +0 -59
package/demos/js/tde/index.js +0 -820
package/demos/js/tde/jets.js +0 -290
package/demos/js/tde/lensedstarfield.js +0 -154
package/demos/js/tde/tdestar.js +0 -297
package/demos/js/tde/tidalstream.js +0 -372
package/demos/js/tde_old/blackhole.obj.js +0 -354
package/demos/js/tde_old/debris.obj.js +0 -791
package/demos/js/tde_old/flare.obj.js +0 -239
package/demos/js/tde_old/index.js +0 -448
package/demos/js/tde_old/star.obj.js +0 -812
package/demos/js/tiles.js +0 -312
package/demos/js/tweendemo.js +0 -79
package/demos/js/visibility.js +0 -102
package/demos/kerr.html +0 -28
package/demos/lavalamp.html +0 -27
package/demos/layouts.html +0 -37
package/demos/logo.svg +0 -4
package/demos/loop.html +0 -84
package/demos/mondrian.html +0 -32
package/demos/og_image.png +0 -0
package/demos/opacity.html +0 -36
package/demos/painter.html +0 -39
package/demos/particles-showcase.html +0 -28
package/demos/particles.html +0 -24
package/demos/patterns.html +0 -33
package/demos/penrose-game.html +0 -31
package/demos/pipeline.html +0 -737
package/demos/plane3d.html +0 -24
package/demos/platformer.html +0 -43
package/demos/scene.html +0 -33
package/demos/scenes.html +0 -96
package/demos/schrodinger.html +0 -27
package/demos/schwarzschild.html +0 -27
package/demos/shapes.html +0 -16
package/demos/space.html +0 -85
package/demos/spacetime.html +0 -27
package/demos/sphere3d.html +0 -24
package/demos/sprite.html +0 -18
package/demos/svgtween.html +0 -29
package/demos/tde.html +0 -28
package/demos/tiles.html +0 -28
package/demos/transforms.html +0 -400
package/demos/tween.html +0 -45
package/demos/visibility.html +0 -33
package/docs/README.md +0 -230
package/docs/api/FluidSystem.md +0 -173
package/docs/concepts/architecture-overview.md +0 -204
package/docs/concepts/coordinate-system.md +0 -384
package/docs/concepts/lifecycle.md +0 -255
package/docs/concepts/rendering-pipeline.md +0 -279
package/docs/concepts/shapes-vs-gameobjects.md +0 -187
package/docs/concepts/tde-zorder.md +0 -106
package/docs/concepts/two-layer-architecture.md +0 -229
package/docs/fluid-dynamics.md +0 -99
package/docs/getting-started/first-game.md +0 -354
package/docs/getting-started/hello-world.md +0 -269
package/docs/getting-started/installation.md +0 -175
package/docs/modules/collision/README.md +0 -453
package/docs/modules/fluent/README.md +0 -1075
package/docs/modules/game/README.md +0 -303
package/docs/modules/isometric-camera.md +0 -210
package/docs/modules/isometric.md +0 -275
package/docs/modules/painter/README.md +0 -328
package/docs/modules/particle/README.md +0 -559
package/docs/modules/shapes/README.md +0 -221
package/docs/modules/shapes/base/euclidian.md +0 -123
package/docs/modules/shapes/base/geometry2d.md +0 -204
package/docs/modules/shapes/base/renderable.md +0 -215
package/docs/modules/shapes/base/shape.md +0 -262
package/docs/modules/shapes/base/transformable.md +0 -243
package/docs/modules/shapes/hierarchy.md +0 -218
package/docs/modules/state/README.md +0 -577
package/docs/modules/util/README.md +0 -99
package/docs/modules/util/camera3d.md +0 -412
package/docs/modules/util/scene3d.md +0 -395
package/index.html +0 -17
package/jsdoc.json +0 -50
package/scripts/build-demo.js +0 -69
package/scripts/bundle4llm.js +0 -276
package/scripts/clearconsole.js +0 -48
package/test/math/orbital.test.js +0 -61
package/test/math/tensor.test.js +0 -114
package/test/particle/emitter.test.js +0 -204
package/test/particle/particle-system.test.js +0 -310
package/test/particle/particle.test.js +0 -116
package/test/particle/updaters.test.js +0 -386
package/test/setup.js +0 -120
package/test/shapes/euclidian.test.js +0 -44
package/test/shapes/geometry.test.js +0 -86
package/test/shapes/group.test.js +0 -86
package/test/shapes/rectangle.test.js +0 -64
package/test/shapes/transform.test.js +0 -379
package/test/util/camera3d.test.js +0 -428
package/test/util/scene3d.test.js +0 -352
package/vite.config.js +0 -50
package/vitest.config.js +0 -13

package/docs/getting-started/hello-world.md DELETED Viewed

@@ -1,269 +0,0 @@
-# Hello World
-> Draw your first shape with GCanvas.
-## Overview
-This guide shows the simplest way to draw a shape on canvas using GCanvas. We'll start with the Shape Layer (no game loop) and progress to a simple animation.
-## Basic Setup
-Create an HTML file with a canvas:
-```html
-<!DOCTYPE html>
-<html>
-<head>
-  <title>GCanvas Hello World</title>
-  <style>
-    body { margin: 0; background: #000; }
-    canvas { display: block; }
-  </style>
-</head>
-<body>
-  <canvas id="canvas" width="800" height="600"></canvas>
-  <script type="module">
-    // Your code here
-  </script>
-</body>
-</html>
-```
-## Step 1: Draw a Circle
-```js
-import { Circle, Painter } from './dist/gcanvas.es.min.js';
-// Get canvas and initialize Painter
-const canvas = document.getElementById('canvas');
-Painter.init(canvas.getContext('2d'));
-// Create a circle
-const circle = new Circle(50, {
-  x: 400,
-  y: 300,
-  color: 'red'
-});
-// Draw it
-circle.draw();
-```
-**Result:** A red circle with radius 50, centered at (400, 300).
-## Step 2: Add More Shapes
-```js
-import { Circle, Rectangle, Star, Painter } from './dist/gcanvas.es.min.js';
-const canvas = document.getElementById('canvas');
-Painter.init(canvas.getContext('2d'));
-// Circle
-const circle = new Circle(50, {
-  x: 200,
-  y: 300,
-  color: '#ff6b6b'
-});
-// Rectangle
-const rect = new Rectangle({
-  x: 400,
-  y: 300,
-  width: 120,
-  height: 80,
-  color: '#4ecdc4',
-  stroke: '#fff',
-  lineWidth: 2
-});
-// Star
-const star = new Star(40, 5, {
-  x: 600,
-  y: 300,
-  color: '#ffe66d',
-  rotation: Math.PI / 10
-});
-// Draw all shapes
-circle.draw();
-rect.draw();
-star.draw();
-```
-## Step 3: Group Shapes Together
-```js
-import { Circle, Rectangle, TextShape, Group, Painter } from './dist/gcanvas.es.min.js';
-const canvas = document.getElementById('canvas');
-Painter.init(canvas.getContext('2d'));
-// Create a group
-const group = new Group({ x: 400, y: 300 });
-// Add shapes to the group (positions relative to group)
-group.add(new Rectangle({
-  width: 200,
-  height: 80,
-  color: '#333',
-  stroke: '#0f0',
-  lineWidth: 2
-}));
-group.add(new TextShape('Hello World!', {
-  font: '24px monospace',
-  color: '#0f0',
-  align: 'center',
-  baseline: 'middle'
-}));
-// Draw the group
-group.draw();
-// Rotate the entire group
-group.rotation = Math.PI / 12;  // 15 degrees
-Painter.clear();
-group.draw();
-```
-## Step 4: Simple Animation
-Add a render loop for animation:
-```js
-import { Circle, Painter } from './dist/gcanvas.es.min.js';
-const canvas = document.getElementById('canvas');
-const ctx = canvas.getContext('2d');
-Painter.init(ctx);
-// Create a circle
-const circle = new Circle(50, {
-  x: 400,
-  y: 300,
-  color: '#4ecdc4'
-});
-// Animation variables
-let time = 0;
-function animate() {
-  // Clear canvas
-  Painter.clear();
-  // Update circle position (oscillate)
-  time += 0.02;
-  circle.x = 400 + Math.sin(time) * 200;
-  circle.y = 300 + Math.cos(time * 0.5) * 100;
-  // Pulse the opacity
-  circle.opacity = 0.5 + Math.sin(time * 2) * 0.5;
-  // Draw
-  circle.draw();
-  // Next frame
-  requestAnimationFrame(animate);
-}
-// Start animation
-animate();
-```
-## Complete Example
-Here's a complete example with multiple animated shapes:
-```html
-<!DOCTYPE html>
-<html>
-<head>
-  <title>GCanvas Hello World</title>
-  <style>
-    body { margin: 0; background: #1a1a2e; overflow: hidden; }
-    canvas { display: block; }
-  </style>
-</head>
-<body>
-  <canvas id="canvas"></canvas>
-  <script type="module">
-    import { Circle, Rectangle, Star, Group, Painter } from './dist/gcanvas.es.min.js';
-    // Setup
-    const canvas = document.getElementById('canvas');
-    canvas.width = window.innerWidth;
-    canvas.height = window.innerHeight;
-    Painter.init(canvas.getContext('2d'));
-    const centerX = canvas.width / 2;
-    const centerY = canvas.height / 2;
-    // Create shapes
-    const circle = new Circle(60, { color: '#ff6b6b' });
-    const rect = new Rectangle({ width: 100, height: 60, color: '#4ecdc4' });
-    const star = new Star(40, 5, { color: '#ffe66d' });
-    let time = 0;
-    function animate() {
-      Painter.clear();
-      time += 0.016;
-      // Orbit the shapes around center
-      const radius = 150;
-      circle.x = centerX + Math.cos(time) * radius;
-      circle.y = centerY + Math.sin(time) * radius;
-      rect.x = centerX + Math.cos(time + Math.PI * 0.66) * radius;
-      rect.y = centerY + Math.sin(time + Math.PI * 0.66) * radius;
-      rect.rotation = time;
-      star.x = centerX + Math.cos(time + Math.PI * 1.33) * radius;
-      star.y = centerY + Math.sin(time + Math.PI * 1.33) * radius;
-      star.rotation = -time * 2;
-      // Draw
-      circle.draw();
-      rect.draw();
-      star.draw();
-      requestAnimationFrame(animate);
-    }
-    animate();
-    // Handle resize
-    window.addEventListener('resize', () => {
-      canvas.width = window.innerWidth;
-      canvas.height = window.innerHeight;
-    });
-  </script>
-</body>
-</html>
-```
-## Key Concepts
-| Concept | Description |
-|---------|-------------|
-| `Painter.init(ctx)` | Initialize the drawing system with canvas context |
-| `Painter.clear()` | Clear the entire canvas |
-| `shape.draw()` | Draw a shape at its current position |
-| `shape.x`, `shape.y` | Position (center of shape) |
-| `shape.rotation` | Rotation in radians |
-| `shape.opacity` | Transparency (0 to 1) |
-| `Group` | Container for multiple shapes |
-## Next Steps
-- [First Game](./first-game.md) - Add interactivity with the Game layer
-- [Rendering Pipeline](../concepts/rendering-pipeline.md) - Understand the shape hierarchy
-- [Shapes Module](../modules/shapes/README.md) - Explore all available shapes
-## Related
-- [Installation](./installation.md)
-- [Two-Layer Architecture](../concepts/two-layer-architecture.md)
-- [Shapes Module](../modules/shapes/README.md)

package/docs/getting-started/installation.md DELETED Viewed

@@ -1,175 +0,0 @@
-# Installation
-> How to set up GCanvas in your project.
-## Prerequisites
-- Node.js 18+ (for development)
-- Modern browser with ES6 support
-## Option 1: Clone Repository
-The recommended way to get started:
-```bash
-git clone https://github.com/guinetik/gcanvas.git
-cd gcanvas
-npm install
-```
-### Run Development Server
-```bash
-npm run dev
-```
-This starts Vite's dev server with hot reload. Open `http://localhost:5173` to see the demos.
-### Build the Library
-```bash
-npm run build
-```
-Outputs to `dist/`:
-- `gcanvas.es.js` - ES Module
-- `gcanvas.es.min.js` - ES Module (minified)
-- `gcanvas.umd.js` - UMD bundle
-- `gcanvas.umd.min.js` - UMD bundle (minified)
-## Option 2: NPM
-```bash
-npm install @guinetik/gcanvas
-```
-Then import in your project:
-```js
-import { Game, Circle, Rectangle } from '@guinetik/gcanvas';
-```
-## Option 3: Direct Script Include
-### ES Module
-```html
-<script type="module">
-  import { Circle, Painter } from './dist/gcanvas.es.min.js';
-  const canvas = document.getElementById('canvas');
-  Painter.init(canvas.getContext('2d'));
-  const circle = new Circle(50, { x: 100, y: 100, color: 'red' });
-  circle.draw();
-</script>
-```
-### UMD Bundle
-```html
-<script src="./dist/gcanvas.umd.min.js"></script>
-<script>
-  const { Circle, Painter } = GCanvas;
-  const canvas = document.getElementById('canvas');
-  Painter.init(canvas.getContext('2d'));
-  const circle = new GCanvas.Circle(50, { x: 100, y: 100, color: 'red' });
-  circle.draw();
-</script>
-```
-## Project Structure
-```
-gcanvas/
-├── src/              # Source code
-│   ├── shapes/       # Shape classes
-│   ├── game/         # Game loop, objects
-│   ├── painter/      # Canvas abstraction
-│   ├── motion/       # Animation
-│   ├── io/           # Input handling
-│   └── index.js      # Main entry point
-├── demos/            # Demo applications
-├── dist/             # Built library
-└── docs/             # Documentation
-```
-## NPM Scripts
-| Script | Description |
-|--------|-------------|
-| `npm run dev` | Start development server |
-| `npm run build` | Build library |
-| `npm run build:demo` | Build demos for deployment |
-| `npm run docs` | Generate JSDoc documentation |
-| `npm run test` | Run tests |
-## TypeScript Support
-GCanvas includes full TypeScript definitions. After installing, you get complete type support:
-```typescript
-import { Game, Circle, Camera3D, ParticleSystem } from '@guinetik/gcanvas';
-// Full IntelliSense and type checking
-const game = new Game(document.getElementById('canvas') as HTMLCanvasElement);
-const circle = new Circle(50, { x: 100, y: 100, fill: 'red' });
-```
-The types require ES2015+ target in your `tsconfig.json`:
-```json
-{
-  "compilerOptions": {
-    "lib": ["es2015", "dom"]
-  }
-}
-```
-## Browser Support
-GCanvas works in all modern browsers:
-- Chrome 60+
-- Firefox 55+
-- Safari 11+
-- Edge 79+
-## Next Steps
-- [Hello World](./hello-world.md) - Draw your first shape
-- [First Game](./first-game.md) - Create an interactive game
-- [Architecture Overview](../concepts/architecture-overview.md) - Understand the design
-## Troubleshooting
-### Canvas not found
-Make sure your canvas element has an ID and the script runs after DOM is ready:
-```html
-<canvas id="game"></canvas>
-<script type="module">
-  // Script runs after DOM is parsed when using type="module"
-  const canvas = document.getElementById('game');
-</script>
-```
-### Module not found
-When using ES modules, ensure paths are correct:
-```js
-// Relative path from your script
-import { Circle } from './dist/gcanvas.es.min.js';
-// Or absolute path
-import { Circle } from '/dist/gcanvas.es.min.js';
-```
-## Related
-- [Hello World](./hello-world.md)
-- [Architecture Overview](../concepts/architecture-overview.md)