dopaminejs 1.0.2 β 1.2.0
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.
- package/ARCHITECTURE.md +71 -0
- package/CHANGELOG.md +36 -0
- package/README.md +73 -0
- package/dist/dopamine.mjs +360 -283
- package/dist/dopamine.umd.js +12 -12
- package/package.json +4 -2
- package/src/audio/SoundManager.js +118 -12
- package/src/effects/ParticleSystem.js +201 -131
package/ARCHITECTURE.md
ADDED
|
@@ -0,0 +1,71 @@
|
|
|
1
|
+
# DopamineJS Architecture & Roadmap ποΈ
|
|
2
|
+
|
|
3
|
+
**Vision**: To become the standard "Game Feel Engine" for the webβa plug-and-play layer that handles the "juice" (feedback, rewards, satisfaction) so developers can focus on core mechanics.
|
|
4
|
+
|
|
5
|
+
## π§ Design Philosophy
|
|
6
|
+
1. **Zero-Config Start**: It must work beautifully out of the box.
|
|
7
|
+
2. **Infinite Extensibility**: Every default (sound, particle, UI style) must be replaceable.
|
|
8
|
+
3. **Asset Agnostic**: Support synthesized sounds/shapes (no assets) AND custom assets (mp3/png).
|
|
9
|
+
4. **AI-First**: APIs should be self-documenting and predictable for AI agents to use effectively.
|
|
10
|
+
|
|
11
|
+
## πΊοΈ Roadmap
|
|
12
|
+
|
|
13
|
+
### Phase 1: Audio Extensibility (v1.1.0)
|
|
14
|
+
**Goal**: Allow developers to bring their own soundscapes.
|
|
15
|
+
|
|
16
|
+
- **[NEW] Asset Loader**: A lightweight preloader for audio files.
|
|
17
|
+
- **[UPDATE] SoundManager**:
|
|
18
|
+
- Add `registerSound(key, url)` method.
|
|
19
|
+
- Support `Howler.js` integration (optional) or robust Web Audio buffer caching.
|
|
20
|
+
- **Feature**: "Sound Packs" - Allow switching between 'Retro', 'Modern', 'Cute' preset packs.
|
|
21
|
+
|
|
22
|
+
### Phase 2: Visual Customization (v1.2.0)
|
|
23
|
+
**Goal**: Break free from geometric primitives.
|
|
24
|
+
|
|
25
|
+
- **[UPDATE] ParticleSystem**:
|
|
26
|
+
- **Sprite Support**: Allow `image` or `sprite` properties in particle config.
|
|
27
|
+
- **Custom Emitters**: Define custom particle behaviors (gravity, velocity, life, decay) via JSON config.
|
|
28
|
+
- **Editor**: (Long term) A web-based particle editor that exports JSON for DopamineJS.
|
|
29
|
+
|
|
30
|
+
### Phase 3: UI Theming & Templates (v1.3.0)
|
|
31
|
+
**Goal**: Make the UI fit any game art style.
|
|
32
|
+
|
|
33
|
+
- **[NEW] Theme Engine**:
|
|
34
|
+
- Use CSS Variables for all colors, fonts, and spacing.
|
|
35
|
+
- `Dopamine.setTheme('dark-cyberpunk')`
|
|
36
|
+
- **[UPDATE] GameUI**:
|
|
37
|
+
- **Icon Sets**: Allow passing an icon map (SVG strings or URLs) to replace default emojis.
|
|
38
|
+
- **Slots**: Allow developers to inject custom HTML into notifications or level-up screens.
|
|
39
|
+
|
|
40
|
+
### Phase 4: The "Dopamine Ecosystem" (v2.0.0)
|
|
41
|
+
**Goal**: Community-driven content.
|
|
42
|
+
|
|
43
|
+
- **Plugin System**: Middleware for the `RewardSystem` (e.g., "BattlePass Plugin", "Leaderboard Plugin").
|
|
44
|
+
- **Backend Integration**: Webhooks for `onLevelUp` or `onAchievement` to validate rewards on a server.
|
|
45
|
+
|
|
46
|
+
## π Developer Guide: How to Extend (Current Best Practices)
|
|
47
|
+
|
|
48
|
+
While we build these features, here is how you can extend DopamineJS today:
|
|
49
|
+
|
|
50
|
+
### Custom Achievements
|
|
51
|
+
You can already define any achievement logic you want:
|
|
52
|
+
|
|
53
|
+
```javascript
|
|
54
|
+
achievements: {
|
|
55
|
+
'die_100_times': {
|
|
56
|
+
name: 'You Tried',
|
|
57
|
+
icon: '<img src="skull.png" width="20">', // HTML is supported in icons!
|
|
58
|
+
check: (p) => p.stats.deaths >= 100
|
|
59
|
+
}
|
|
60
|
+
}
|
|
61
|
+
```
|
|
62
|
+
|
|
63
|
+
### Custom CSS
|
|
64
|
+
Override the default styles by adding your own CSS *after* importing DopamineJS:
|
|
65
|
+
|
|
66
|
+
```css
|
|
67
|
+
/* Override the XP bar color */
|
|
68
|
+
.xp-bar-fill {
|
|
69
|
+
background: linear-gradient(90deg, #ff00cc, #3333ff) !important;
|
|
70
|
+
}
|
|
71
|
+
```
|
package/CHANGELOG.md
ADDED
|
@@ -0,0 +1,36 @@
|
|
|
1
|
+
# Changelog
|
|
2
|
+
|
|
3
|
+
All notable changes to this project will be documented in this file.
|
|
4
|
+
|
|
5
|
+
## [1.2.0] - 2025-12-04
|
|
6
|
+
### Added
|
|
7
|
+
- **Visual Customization**:
|
|
8
|
+
- `registerSprite(key, url)`: Use custom images for particles.
|
|
9
|
+
- `emit(config)`: Create fully custom particle explosions.
|
|
10
|
+
- `registerEffect(name, callback)`: Define reusable custom effects.
|
|
11
|
+
- **Multi-Screen Support**: Pass `container` selector to `ParticleSystem` to target specific elements.
|
|
12
|
+
- **Optimization**: Implemented Object Pooling to reduce garbage collection and improve performance.
|
|
13
|
+
|
|
14
|
+
## [1.1.0] - 2025-12-04
|
|
15
|
+
### Added
|
|
16
|
+
- **Audio Extensibility**: Support for custom audio files (`.mp3`, `.wav`).
|
|
17
|
+
- `SoundManager.registerSound(key, url)`: Register custom assets.
|
|
18
|
+
- `SoundManager.play(key)`: Unified API to play custom sounds or fallback to synth.
|
|
19
|
+
- Support for `customSounds` in the initial configuration.
|
|
20
|
+
|
|
21
|
+
## [1.0.2] - 2025-12-04
|
|
22
|
+
### Fixed
|
|
23
|
+
- Fixed `npm run release` script failing due to missing `vitest` dependency.
|
|
24
|
+
- Uncommented `npm publish` in deployment script to ensure package is actually published to npm.
|
|
25
|
+
|
|
26
|
+
## [1.0.1] - 2025-12-04
|
|
27
|
+
### Added
|
|
28
|
+
- Initial release of DopamineJS.
|
|
29
|
+
- Core systems: `RewardSystem`, `ParticleSystem`, `SoundManager`, `GameUI`.
|
|
30
|
+
- Basic gamification features: XP, Levels, Streaks, Achievements.
|
|
31
|
+
- Built-in visual effects: Confetti, Coin Shower, Sparkles, Fire, Star Burst.
|
|
32
|
+
- Synthesized sound effects.
|
|
33
|
+
- Comprehensive README with "Vibe Coding" instructions for AI agents.
|
|
34
|
+
|
|
35
|
+
## [1.0.0] - 2025-12-04
|
|
36
|
+
- Initial scaffold.
|
package/README.md
CHANGED
|
@@ -121,6 +121,79 @@ Pre-loaded satisfying sound effects (generated synthetically or minimal assets).
|
|
|
121
121
|
soundManager.playSuccess();
|
|
122
122
|
```
|
|
123
123
|
|
|
124
|
+
### π§ Audio Customization (New in v1.1.0)
|
|
125
|
+
You can replace the default synthesized sounds with your own audio files (`.mp3`, `.wav`, etc.).
|
|
126
|
+
|
|
127
|
+
```javascript
|
|
128
|
+
// 1. Register custom sounds
|
|
129
|
+
soundManager.registerSound('jump', '/assets/audio/jump_v2.mp3');
|
|
130
|
+
soundManager.registerSound('win', '/assets/audio/epic_win.wav');
|
|
131
|
+
|
|
132
|
+
// 2. Play them (auto-loads on first play if not preloaded)
|
|
133
|
+
soundManager.play('jump');
|
|
134
|
+
|
|
135
|
+
// 3. Or pass them in initial config
|
|
136
|
+
const app = new Dopamine({
|
|
137
|
+
sound: {
|
|
138
|
+
customSounds: {
|
|
139
|
+
'click': '/assets/ui_click.mp3',
|
|
140
|
+
'level_up': '/assets/level_up.mp3'
|
|
141
|
+
}
|
|
142
|
+
}
|
|
143
|
+
});
|
|
144
|
+
```
|
|
145
|
+
|
|
146
|
+
### π¨ Visual Customization (New in v1.2.0)
|
|
147
|
+
|
|
148
|
+
#### Custom Sprites
|
|
149
|
+
Use your own images instead of shapes.
|
|
150
|
+
|
|
151
|
+
```javascript
|
|
152
|
+
// 1. Register sprite
|
|
153
|
+
particleSystem.registerSprite('gold_coin', '/assets/coin.png');
|
|
154
|
+
|
|
155
|
+
// 2. Emit particles using that sprite
|
|
156
|
+
particleSystem.emit({
|
|
157
|
+
x: 100, y: 100,
|
|
158
|
+
sprite: 'gold_coin',
|
|
159
|
+
count: 10,
|
|
160
|
+
size: 20,
|
|
161
|
+
gravity: 0.5
|
|
162
|
+
});
|
|
163
|
+
```
|
|
164
|
+
|
|
165
|
+
#### Custom Effects
|
|
166
|
+
Create reusable effects that you can call anywhere.
|
|
167
|
+
|
|
168
|
+
```javascript
|
|
169
|
+
// Define "Blood Splatter"
|
|
170
|
+
particleSystem.registerEffect('blood', (x, y) => {
|
|
171
|
+
particleSystem.emit({
|
|
172
|
+
x, y,
|
|
173
|
+
count: 15,
|
|
174
|
+
color: ['#8a0303', '#ff0000'],
|
|
175
|
+
speed: 4,
|
|
176
|
+
gravity: 0.3,
|
|
177
|
+
decay: 0.05
|
|
178
|
+
});
|
|
179
|
+
});
|
|
180
|
+
|
|
181
|
+
// Use it
|
|
182
|
+
particleSystem.play('blood', 200, 300);
|
|
183
|
+
```
|
|
184
|
+
|
|
185
|
+
#### Multi-Screen Support
|
|
186
|
+
Target a specific game container instead of the whole screen.
|
|
187
|
+
|
|
188
|
+
```javascript
|
|
189
|
+
const app = new Dopamine({
|
|
190
|
+
particles: {
|
|
191
|
+
container: '#game-board', // Selector or HTMLElement
|
|
192
|
+
zIndex: 10
|
|
193
|
+
}
|
|
194
|
+
});
|
|
195
|
+
```
|
|
196
|
+
|
|
124
197
|
### π¨ Game UI
|
|
125
198
|
Built-in UI components to show progress without coding HTML/CSS.
|
|
126
199
|
- **Notifications**: "Achievement Unlocked", "Level Up", etc.
|