particle-overlay 1.0.0 → 1.0.1

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 (2) hide show
  1. package/README.md +80 -0
  2. package/package.json +2 -1
package/README.md ADDED
@@ -0,0 +1,80 @@
1
+ # particle-overlay 🌌
2
+
3
+ A high-performance, off-thread particle overlay rendering engine for the web. Powered by a WebAssembly physics core compiled from Rust, it runs entirely inside a Web Worker using `OffscreenCanvas`, ensuring your main UI thread never drops a frame.
4
+
5
+ ---
6
+
7
+ ## 🚀 Features
8
+
9
+ * **Zero Main-Thread Blocking**: All physics ticks and Canvas 2D paint commands are executed off-thread inside a Web Worker.
10
+ * **Rust/WASM Physics**: Particle movements, swings, and speeds are computed in compiled WebAssembly.
11
+ * **Zero-Copy Memory Sharing**: JavaScript reads coordinate floats directly from the WASM linear memory heap.
12
+ * **Pre-built Presets**: Includes 12 overlays out-of-the-box (Rain, Falling Hearts, Snow, Matrix Rain, Bubbles, etc.).
13
+
14
+ ---
15
+
16
+ ## 📦 Installation
17
+
18
+ ```bash
19
+ npm install particle-overlay
20
+ ```
21
+
22
+ ---
23
+
24
+ ## 🛠️ Quick Start
25
+
26
+ Place a `<canvas>` element in your HTML:
27
+
28
+ ```html
29
+ <canvas id="effects-canvas" style="position: absolute; inset: 0; width: 100%; height: 100%; pointer-events: none;"></canvas>
30
+ ```
31
+
32
+ Mount your desired particle overlay:
33
+
34
+ ```javascript
35
+ import { ParticleOverlayHost } from 'particle-overlay';
36
+
37
+ const canvas = document.getElementById('effects-canvas');
38
+
39
+ // Start the rain effect
40
+ const overlay = new ParticleOverlayHost(canvas, 'rain-shower', {
41
+ density: 80,
42
+ speed: 14,
43
+ size: 2.25,
44
+ color: '#aedbf0'
45
+ });
46
+
47
+ // Update parameters dynamically
48
+ overlay.updateParams({
49
+ density: 120,
50
+ speed: 18
51
+ });
52
+
53
+ // Terminate the effect and clean up the worker
54
+ // overlay.destroy();
55
+ ```
56
+
57
+ ---
58
+
59
+ ## 🎨 Included Presets
60
+
61
+ You can pass any of these IDs to `ParticleOverlayHost`:
62
+
63
+ * `rain-shower` - Continuous rain with bottom splashes.
64
+ * `falling-hearts` - Floating hearts with swaying rotations.
65
+ * `snow-fall` - Wobbling snowflakes.
66
+ * `floating-bubbles` - Rising bubbles.
67
+ * `thunderstorm` - Heavy storm with lightning flashes.
68
+ * `fireworks` - Explosive color bursts.
69
+ * `starry-night` - Twinkling stars and shooting stars.
70
+ * `drifting-clouds` - Soft moving clouds.
71
+ * `matrix-rain` - Cascading digital code columns.
72
+ * `sakura-petals` - Fluttering cherry blossoms.
73
+ * `moonlight` - Crescent moon, glowing light beams, and dust.
74
+ * `autumn-leaves` - Wind-swept swaying leaves.
75
+
76
+ ---
77
+
78
+ ## 📄 License
79
+
80
+ MIT
package/package.json CHANGED
@@ -1,6 +1,6 @@
1
1
  {
2
2
  "name": "particle-overlay",
3
- "version": "1.0.0",
3
+ "version": "1.0.1",
4
4
  "description": "High-performance, off-thread particle overlay engine using WebAssembly and Web Workers",
5
5
  "main": "host.js",
6
6
  "type": "module",
@@ -11,6 +11,7 @@
11
11
  "host.js",
12
12
  "worker.js",
13
13
  "presets.json",
14
+ "README.md",
14
15
  "dist/particle_overlay.wasm"
15
16
  ],
16
17
  "keywords": [