littlejsengine 1.11.13 → 1.12.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.
- package/dist/littlejs.d.ts +1418 -109
- package/dist/littlejs.esm.js +3495 -581
- package/dist/littlejs.esm.min.js +1 -1
- package/dist/littlejs.js +3258 -399
- package/dist/littlejs.min.js +1 -1
- package/dist/littlejs.release.js +3147 -379
- package/examples/box2d/game.js +73 -45
- package/examples/box2d/gameObjects.js +96 -92
- package/examples/box2d/index.html +2 -7
- package/examples/box2d/scenes.js +82 -92
- package/examples/breakout/game.js +62 -30
- package/examples/breakout/gameObjects.js +45 -47
- package/examples/breakout/index.html +1 -5
- package/examples/breakoutTutorial/game.js +36 -29
- package/examples/breakoutTutorial/index.html +1 -3
- package/examples/empty/game.js +5 -2
- package/examples/empty/index.html +1 -3
- package/examples/htmlMenu/game.js +25 -19
- package/examples/htmlMenu/index.html +5 -7
- package/examples/index.html +2 -3
- package/examples/module/game.js +32 -34
- package/examples/module/index.html +1 -1
- package/examples/particles/index.html +27 -22
- package/examples/platformer/game.js +71 -48
- package/examples/platformer/gameCharacter.js +42 -34
- package/examples/platformer/gameEffects.js +82 -75
- package/examples/platformer/gameLevel.js +67 -38
- package/examples/platformer/{gameLevelData.js → gameLevelData.json} +1 -11
- package/examples/platformer/gameObjects.js +70 -64
- package/examples/platformer/gamePlayer.js +12 -7
- package/examples/platformer/index.html +1 -9
- package/examples/puzzle/game.js +58 -42
- package/examples/puzzle/index.html +1 -3
- package/examples/shorts/base.html +2 -2
- package/examples/shorts/particles.js +1 -1
- package/examples/shorts/platformer.js +1 -1
- package/examples/shorts/tileLayer.js +5 -6
- package/examples/shorts/tiles.png +0 -0
- package/examples/starter/build.js +4 -4
- package/examples/starter/game.js +9 -12
- package/examples/starter/index.html +13 -13
- package/examples/stress/index.html +44 -43
- package/examples/typescript/build.js +17 -18
- package/examples/typescript/game.js +32 -34
- package/examples/typescript/game.ts +32 -34
- package/examples/typescript/index.html +1 -1
- package/examples/uiSystem/game.js +33 -36
- package/examples/uiSystem/index.html +1 -5
- package/package.json +3 -3
- package/plugins/box2d.js +1556 -640
- package/plugins/{Box2D_v2.3.1_min.wasm.js → box2d.wasm.js} +1 -1
- package/plugins/newgrounds.js +7 -8
- package/plugins/pluginExport.js +50 -0
- package/plugins/postProcess.js +94 -93
- package/plugins/uiSystem.js +145 -161
- package/plugins/zzfxm.js +163 -0
- package/reference.md +29 -27
- package/src/engine.js +15 -20
- package/src/engineAudio.js +74 -204
- package/src/engineBuild.js +29 -4
- package/src/engineDebug.js +105 -9
- package/src/engineDraw.js +27 -14
- package/src/engineExport.js +12 -8
- package/src/engineInput.js +3 -1
- package/src/engineObject.js +18 -14
- package/src/engineParticles.js +6 -1
- package/src/engineRelease.js +6 -1
- package/src/engineSettings.js +8 -8
- package/src/engineTileLayer.js +179 -96
- package/src/engineUtilities.js +5 -11
- package/src/engineWebGL.js +19 -7
- package/examples/starter/build/index.html +0 -2
- package/examples/starter/build/index.js +0 -1
- package/examples/starter/build/tiles.png +0 -0
- package/examples/starter/game.zip +0 -0
- package/examples/typescript/build/dist/littlejs.esm.js +0 -4834
- package/examples/typescript/build/examples/typescript/build.js +0 -24
- package/examples/typescript/build/examples/typescript/game.js +0 -102
- /package/plugins/{Box2D_v2.3.1_min.wasm.wasm → box2d.wasm.wasm} +0 -0
|
@@ -8,7 +8,13 @@
|
|
|
8
8
|
|
|
9
9
|
'use strict';
|
|
10
10
|
|
|
11
|
-
|
|
11
|
+
// import LittleJS module
|
|
12
|
+
import * as LJS from '../../dist/littlejs.esm.js';
|
|
13
|
+
import * as GameEffects from './gameEffects.js';
|
|
14
|
+
import * as Game from './game.js';
|
|
15
|
+
const {vec2, hsl, rgb, Timer} = LJS;
|
|
16
|
+
|
|
17
|
+
export class GameObject extends LJS.EngineObject
|
|
12
18
|
{
|
|
13
19
|
constructor(pos, size, tileInfo, angle)
|
|
14
20
|
{
|
|
@@ -25,7 +31,7 @@ class GameObject extends EngineObject
|
|
|
25
31
|
// flash white when damaged
|
|
26
32
|
let brightness = 0;
|
|
27
33
|
if (!this.isDead() && this.damageTimer.isSet())
|
|
28
|
-
brightness = .5*percent(this.damageTimer, .15, 0);
|
|
34
|
+
brightness = .5*LJS.percent(this.damageTimer, .15, 0);
|
|
29
35
|
this.additiveColor = hsl(0,0,brightness,0);
|
|
30
36
|
|
|
31
37
|
// kill if below level
|
|
@@ -35,7 +41,7 @@ class GameObject extends EngineObject
|
|
|
35
41
|
|
|
36
42
|
damage(damage, damagingObject)
|
|
37
43
|
{
|
|
38
|
-
ASSERT(damage >= 0);
|
|
44
|
+
LJS.ASSERT(damage >= 0);
|
|
39
45
|
if (this.isDead())
|
|
40
46
|
return 0;
|
|
41
47
|
|
|
@@ -45,7 +51,7 @@ class GameObject extends EngineObject
|
|
|
45
51
|
child.damageTimer && child.damageTimer.set();
|
|
46
52
|
|
|
47
53
|
// apply damage and kill if necessary
|
|
48
|
-
const newHealth = max(this.health - damage, 0);
|
|
54
|
+
const newHealth = LJS.max(this.health - damage, 0);
|
|
49
55
|
if (!newHealth)
|
|
50
56
|
this.kill(damagingObject);
|
|
51
57
|
|
|
@@ -59,13 +65,13 @@ class GameObject extends EngineObject
|
|
|
59
65
|
|
|
60
66
|
///////////////////////////////////////////////////////////////////////////////
|
|
61
67
|
|
|
62
|
-
class Crate extends GameObject
|
|
68
|
+
export class Crate extends GameObject
|
|
63
69
|
{
|
|
64
70
|
constructor(pos)
|
|
65
71
|
{
|
|
66
|
-
super(pos, vec2(.999), spriteAtlas.crate, (randInt(4))*PI/2);
|
|
72
|
+
super(pos, vec2(.999), Game.spriteAtlas.crate, (LJS.randInt(4))*LJS.PI/2);
|
|
67
73
|
|
|
68
|
-
this.color = hsl(rand(),1,.8);
|
|
74
|
+
this.color = hsl(LJS.rand(),1,.8);
|
|
69
75
|
this.health = 5;
|
|
70
76
|
|
|
71
77
|
// make it a solid object for collision
|
|
@@ -77,59 +83,59 @@ class Crate extends GameObject
|
|
|
77
83
|
if (this.destroyed)
|
|
78
84
|
return;
|
|
79
85
|
|
|
80
|
-
sound_destroyObject.play(this.pos);
|
|
81
|
-
makeDebris(this.pos, this.color, 30);
|
|
86
|
+
GameEffects.sound_destroyObject.play(this.pos);
|
|
87
|
+
GameEffects.makeDebris(this.pos, this.color, 30);
|
|
82
88
|
this.destroy();
|
|
83
89
|
}
|
|
84
90
|
}
|
|
85
91
|
|
|
86
92
|
///////////////////////////////////////////////////////////////////////////////
|
|
87
93
|
|
|
88
|
-
class Coin extends EngineObject
|
|
94
|
+
export class Coin extends LJS.EngineObject
|
|
89
95
|
{
|
|
90
96
|
constructor(pos)
|
|
91
97
|
{
|
|
92
|
-
super(pos, vec2(1), spriteAtlas.coin);
|
|
98
|
+
super(pos, vec2(1), Game.spriteAtlas.coin);
|
|
93
99
|
this.color = hsl(.15,1,.5);
|
|
94
100
|
}
|
|
95
101
|
|
|
96
102
|
render()
|
|
97
103
|
{
|
|
98
104
|
// make it appear to spin
|
|
99
|
-
const t = time+this.pos.x/4+this.pos.y/4;
|
|
100
|
-
drawTile(this.pos, vec2(.1, .6), 0, this.color); // edge of coin
|
|
101
|
-
drawTile(this.pos, vec2(.5+.5*Math.sin(t*2*PI), 1), this.tileInfo, this.color);
|
|
105
|
+
const t = LJS.time+this.pos.x/4+this.pos.y/4;
|
|
106
|
+
LJS.drawTile(this.pos, vec2(.1, .6), 0, this.color); // edge of coin
|
|
107
|
+
LJS.drawTile(this.pos, vec2(.5+.5*Math.sin(t*2*LJS.PI), 1), this.tileInfo, this.color);
|
|
102
108
|
}
|
|
103
109
|
|
|
104
110
|
update()
|
|
105
111
|
{
|
|
106
|
-
if (!player)
|
|
112
|
+
if (!Game.player)
|
|
107
113
|
return;
|
|
108
114
|
|
|
109
115
|
// check if player in range
|
|
110
|
-
const d = this.pos.distanceSquared(player.pos);
|
|
116
|
+
const d = this.pos.distanceSquared(Game.player.pos);
|
|
111
117
|
if (d > .5)
|
|
112
118
|
return;
|
|
113
119
|
|
|
114
120
|
// award points and destroy
|
|
115
|
-
|
|
116
|
-
sound_score.play(this.pos);
|
|
121
|
+
Game.addToScore();
|
|
122
|
+
GameEffects.sound_score.play(this.pos);
|
|
117
123
|
this.destroy();
|
|
118
124
|
}
|
|
119
125
|
}
|
|
120
126
|
|
|
121
127
|
///////////////////////////////////////////////////////////////////////////////
|
|
122
128
|
|
|
123
|
-
class Enemy extends GameObject
|
|
129
|
+
export class Enemy extends GameObject
|
|
124
130
|
{
|
|
125
131
|
constructor(pos)
|
|
126
132
|
{
|
|
127
|
-
super(pos, vec2(.9,.9), spriteAtlas.enemy);
|
|
133
|
+
super(pos, vec2(.9,.9), Game.spriteAtlas.enemy);
|
|
128
134
|
|
|
129
135
|
this.drawSize = vec2(1);
|
|
130
|
-
this.color = hsl(rand(), 1, .7);
|
|
136
|
+
this.color = hsl(LJS.rand(), 1, .7);
|
|
131
137
|
this.health = 5;
|
|
132
|
-
this.bounceTime = new Timer(rand(1e3));
|
|
138
|
+
this.bounceTime = new Timer(LJS.rand(1e3));
|
|
133
139
|
this.setCollision(true, false);
|
|
134
140
|
}
|
|
135
141
|
|
|
@@ -137,16 +143,16 @@ class Enemy extends GameObject
|
|
|
137
143
|
{
|
|
138
144
|
super.update();
|
|
139
145
|
|
|
140
|
-
if (!player)
|
|
146
|
+
if (!Game.player)
|
|
141
147
|
return;
|
|
142
148
|
|
|
143
149
|
// jump around randomly
|
|
144
|
-
if (this.groundObject && rand() < .01 && this.pos.distance(player.pos) < 20)
|
|
145
|
-
this.velocity = vec2(rand(.1,-.1), rand(.4,.2));
|
|
150
|
+
if (this.groundObject && LJS.rand() < .01 && this.pos.distance(Game.player.pos) < 20)
|
|
151
|
+
this.velocity = vec2(LJS.rand(.1,-.1), LJS.rand(.4,.2));
|
|
146
152
|
|
|
147
153
|
// damage player if touching
|
|
148
|
-
if (isOverlapping(this.pos, this.size, player.pos, player.size))
|
|
149
|
-
player.damage(1, this);
|
|
154
|
+
if (LJS.isOverlapping(this.pos, this.size, Game.player.pos, Game.player.size))
|
|
155
|
+
Game.player.damage(1, this);
|
|
150
156
|
}
|
|
151
157
|
|
|
152
158
|
kill()
|
|
@@ -154,9 +160,9 @@ class Enemy extends GameObject
|
|
|
154
160
|
if (this.destroyed)
|
|
155
161
|
return;
|
|
156
162
|
|
|
157
|
-
|
|
158
|
-
sound_score.play(this.pos);
|
|
159
|
-
makeDebris(this.pos, this.color);
|
|
163
|
+
Game.addToScore();
|
|
164
|
+
GameEffects.sound_score.play(this.pos);
|
|
165
|
+
GameEffects.makeDebris(this.pos, this.color);
|
|
160
166
|
this.destroy();
|
|
161
167
|
}
|
|
162
168
|
|
|
@@ -169,17 +175,17 @@ class Enemy extends GameObject
|
|
|
169
175
|
// make bottom flush
|
|
170
176
|
let bodyPos = this.pos;
|
|
171
177
|
bodyPos = bodyPos.add(vec2(0,(this.drawSize.y-this.size.y)/2));
|
|
172
|
-
drawTile(bodyPos, this.drawSize, this.tileInfo, this.color, this.angle, this.mirror, this.additiveColor);
|
|
178
|
+
LJS.drawTile(bodyPos, this.drawSize, this.tileInfo, this.color, this.angle, this.mirror, this.additiveColor);
|
|
173
179
|
}
|
|
174
180
|
}
|
|
175
181
|
|
|
176
182
|
///////////////////////////////////////////////////////////////////////////////
|
|
177
183
|
|
|
178
|
-
class Grenade extends GameObject
|
|
184
|
+
export class Grenade extends GameObject
|
|
179
185
|
{
|
|
180
186
|
constructor(pos)
|
|
181
187
|
{
|
|
182
|
-
super(pos, vec2(.2), spriteAtlas.grenade);
|
|
188
|
+
super(pos, vec2(.2), Game.spriteAtlas.grenade);
|
|
183
189
|
|
|
184
190
|
this.beepTimer = new Timer(1);
|
|
185
191
|
this.elasticity = .3;
|
|
@@ -195,35 +201,35 @@ class Grenade extends GameObject
|
|
|
195
201
|
|
|
196
202
|
if (this.getAliveTime() > 3)
|
|
197
203
|
{
|
|
198
|
-
explosion(this.pos);
|
|
204
|
+
GameEffects.explosion(this.pos);
|
|
199
205
|
this.destroy();
|
|
200
206
|
}
|
|
201
207
|
else if (this.beepTimer.elapsed())
|
|
202
208
|
{
|
|
203
|
-
sound_grenade.play(this.pos)
|
|
209
|
+
GameEffects.sound_grenade.play(this.pos)
|
|
204
210
|
this.beepTimer.set(1);
|
|
205
211
|
}
|
|
206
212
|
}
|
|
207
213
|
|
|
208
214
|
render()
|
|
209
215
|
{
|
|
210
|
-
drawTile(this.pos, vec2(.5), this.tileInfo, this.color, this.angle);
|
|
216
|
+
LJS.drawTile(this.pos, vec2(.5), this.tileInfo, this.color, this.angle);
|
|
211
217
|
|
|
212
218
|
// draw additive flash exploding
|
|
213
|
-
setBlendMode(true);
|
|
214
|
-
const flash = Math.cos(this.getAliveTime()*2*PI);
|
|
215
|
-
drawTile(this.pos, vec2(2), spriteAtlas.circle, hsl(0,1,.5,.2-.2*flash));
|
|
216
|
-
setBlendMode(false);
|
|
219
|
+
LJS.setBlendMode(true);
|
|
220
|
+
const flash = Math.cos(this.getAliveTime()*2*LJS.PI);
|
|
221
|
+
LJS.drawTile(this.pos, vec2(2), Game.spriteAtlas.circle, hsl(0,1,.5,.2-.2*flash));
|
|
222
|
+
LJS.setBlendMode(false);
|
|
217
223
|
}
|
|
218
224
|
}
|
|
219
225
|
|
|
220
226
|
///////////////////////////////////////////////////////////////////////////////
|
|
221
227
|
|
|
222
|
-
class Weapon extends EngineObject
|
|
228
|
+
export class Weapon extends LJS.EngineObject
|
|
223
229
|
{
|
|
224
230
|
constructor(pos, parent)
|
|
225
231
|
{
|
|
226
|
-
super(pos, vec2(.6), spriteAtlas.gun);
|
|
232
|
+
super(pos, vec2(.6), Game.spriteAtlas.gun);
|
|
227
233
|
|
|
228
234
|
// weapon settings
|
|
229
235
|
this.fireRate = 8;
|
|
@@ -238,7 +244,7 @@ class Weapon extends EngineObject
|
|
|
238
244
|
parent.addChild(this, vec2(.6,0));
|
|
239
245
|
|
|
240
246
|
// shell effect
|
|
241
|
-
this.addChild(this.shellEmitter = new ParticleEmitter(
|
|
247
|
+
this.addChild(this.shellEmitter = new LJS.ParticleEmitter(
|
|
242
248
|
vec2(), 0, 0, 0, 0, .1, // pos, angle, emitSize, emitTime, emitRate, emitCone
|
|
243
249
|
0, // tileInfo
|
|
244
250
|
rgb(1,.8,.5), rgb(.9,.7,.5), // colorStartA, colorStartB
|
|
@@ -248,7 +254,7 @@ class Weapon extends EngineObject
|
|
|
248
254
|
.1, 1 // randomness, collide, additive, colorLinear, renderOrder
|
|
249
255
|
), vec2(.1,0), -.8);
|
|
250
256
|
this.shellEmitter.elasticity = .5;
|
|
251
|
-
this.shellEmitter.particleDestroyCallback = persistentParticleDestroyCallback;
|
|
257
|
+
this.shellEmitter.particleDestroyCallback = GameEffects.persistentParticleDestroyCallback;
|
|
252
258
|
}
|
|
253
259
|
|
|
254
260
|
update()
|
|
@@ -257,21 +263,21 @@ class Weapon extends EngineObject
|
|
|
257
263
|
|
|
258
264
|
// update recoil
|
|
259
265
|
if (this.recoilTimer.active())
|
|
260
|
-
this.localAngle = lerp(this.recoilTimer.getPercent(), this.localAngle, 0);
|
|
266
|
+
this.localAngle = LJS.lerp(this.recoilTimer.getPercent(), this.localAngle, 0);
|
|
261
267
|
|
|
262
268
|
this.mirror = this.parent.mirror;
|
|
263
|
-
this.fireTimeBuffer += timeDelta;
|
|
269
|
+
this.fireTimeBuffer += LJS.timeDelta;
|
|
264
270
|
if (this.triggerIsDown)
|
|
265
271
|
{
|
|
266
272
|
// try to fire
|
|
267
273
|
for (; this.fireTimeBuffer > 0; this.fireTimeBuffer -= 1/this.fireRate)
|
|
268
274
|
{
|
|
269
275
|
// create bullet
|
|
270
|
-
sound_shoot.play(this.pos);
|
|
271
|
-
this.localAngle = -rand(.2,.25);
|
|
276
|
+
GameEffects.sound_shoot.play(this.pos);
|
|
277
|
+
this.localAngle = -LJS.rand(.2,.25);
|
|
272
278
|
this.recoilTimer.set(.1);
|
|
273
279
|
const direction = vec2(this.bulletSpeed*this.getMirrorSign(), 0);
|
|
274
|
-
const velocity = direction.rotate(rand(-1,1)*this.bulletSpread);
|
|
280
|
+
const velocity = direction.rotate(LJS.rand(-1,1)*this.bulletSpread);
|
|
275
281
|
new Bullet(this.pos, this.parent, velocity, this.damage);
|
|
276
282
|
|
|
277
283
|
// spawn shell particle
|
|
@@ -279,13 +285,13 @@ class Weapon extends EngineObject
|
|
|
279
285
|
}
|
|
280
286
|
}
|
|
281
287
|
else
|
|
282
|
-
this.fireTimeBuffer = min(this.fireTimeBuffer, 0);
|
|
288
|
+
this.fireTimeBuffer = LJS.min(this.fireTimeBuffer, 0);
|
|
283
289
|
}
|
|
284
290
|
}
|
|
285
291
|
|
|
286
292
|
///////////////////////////////////////////////////////////////////////////////
|
|
287
293
|
|
|
288
|
-
class Bullet extends EngineObject
|
|
294
|
+
export class Bullet extends LJS.EngineObject
|
|
289
295
|
{
|
|
290
296
|
constructor(pos, attacker, velocity, damage)
|
|
291
297
|
{
|
|
@@ -305,7 +311,7 @@ class Bullet extends EngineObject
|
|
|
305
311
|
update()
|
|
306
312
|
{
|
|
307
313
|
// check if hit someone
|
|
308
|
-
engineObjectsCallback(this.pos, this.size, (o)=>
|
|
314
|
+
LJS.engineObjectsCallback(this.pos, this.size, (o)=>
|
|
309
315
|
{
|
|
310
316
|
if (o.isGameObject)
|
|
311
317
|
this.collideWithObject(o)
|
|
@@ -317,12 +323,12 @@ class Bullet extends EngineObject
|
|
|
317
323
|
this.range -= this.velocity.length();
|
|
318
324
|
if (this.range < 0)
|
|
319
325
|
{
|
|
320
|
-
new ParticleEmitter(
|
|
321
|
-
this.pos, 0, .2, .1, 50,
|
|
322
|
-
rgb(1,1,.1), rgb(1,1,1),
|
|
323
|
-
rgb(1,1,.1,0), rgb(1,1,1,0)
|
|
326
|
+
new LJS.ParticleEmitter(
|
|
327
|
+
this.pos, 0, .2, .1, 50, 3.14, Game.spriteAtlas.circle, // pos, emit info, tileInfo
|
|
328
|
+
rgb(1,1,.1), rgb(1,1,1), // colorStartA, colorStartB
|
|
329
|
+
rgb(1,1,.1,0), rgb(1,1,1,0), // colorEndA, colorEndB
|
|
324
330
|
.1, .5, .1, .05, 0, // particleTime, sizeStart, sizeEnd, speed, angleSpeed
|
|
325
|
-
1, 1, .5,
|
|
331
|
+
1, 1, .5, 3.14, .1, // damping, angleDamping, gravityScale, cone, fadeRate,
|
|
326
332
|
.5, 0, 1 // randomness, collide, additive, randomColorLinear
|
|
327
333
|
);
|
|
328
334
|
|
|
@@ -347,7 +353,7 @@ class Bullet extends EngineObject
|
|
|
347
353
|
if (data <= 0)
|
|
348
354
|
return false;
|
|
349
355
|
|
|
350
|
-
destroyTile(pos);
|
|
356
|
+
GameEffects.destroyTile(pos);
|
|
351
357
|
this.kill();
|
|
352
358
|
return true;
|
|
353
359
|
}
|
|
@@ -359,17 +365,17 @@ class Bullet extends EngineObject
|
|
|
359
365
|
this.destroy();
|
|
360
366
|
|
|
361
367
|
// spark effects
|
|
362
|
-
const emitter = new ParticleEmitter(
|
|
368
|
+
const emitter = new LJS.ParticleEmitter(
|
|
363
369
|
this.pos, 0, 0, .1, 100, .5, // pos, angle, emitSize, emitTime, emitRate, emitCone
|
|
364
|
-
0,
|
|
370
|
+
0, // tileInfo
|
|
365
371
|
rgb(1,1,0), rgb(1,0,0), // colorStartA, colorStartB
|
|
366
372
|
rgb(1,1,0), rgb(1,0,0), // colorEndA, colorEndB
|
|
367
|
-
.2, .2, 0, .1, .1,
|
|
368
|
-
1, 1, .5,
|
|
369
|
-
.5, 1, 1
|
|
373
|
+
.2, .2, 0, .1, .1, // time, sizeStart, sizeEnd, speed, angleSpeed
|
|
374
|
+
1, 1, .5, 3.14, .1, // damp, angleDamp, gravityScale, particleCone, fade,
|
|
375
|
+
.5, 1, 1 // randomness, collide, additive, colorLinear, renderOrder
|
|
370
376
|
);
|
|
371
377
|
emitter.trailScale = 1;
|
|
372
378
|
emitter.elasticity = .3;
|
|
373
|
-
emitter.angle = this.velocity.angle() + PI;
|
|
379
|
+
emitter.angle = this.velocity.angle() + LJS.PI;
|
|
374
380
|
}
|
|
375
381
|
}
|
|
@@ -9,22 +9,27 @@
|
|
|
9
9
|
|
|
10
10
|
'use strict';
|
|
11
11
|
|
|
12
|
-
|
|
12
|
+
// import LittleJS module
|
|
13
|
+
import * as LJS from '../../dist/littlejs.esm.js';
|
|
14
|
+
import * as GameCharacter from './gameCharacter.js';
|
|
15
|
+
import * as Game from './game.js';
|
|
16
|
+
|
|
17
|
+
export class Player extends GameCharacter.Character
|
|
13
18
|
{
|
|
14
19
|
update()
|
|
15
20
|
{
|
|
16
21
|
// movement control
|
|
17
|
-
this.moveInput = isUsingGamepad ? gamepadStick(0) : keyDirection();
|
|
18
|
-
this.holdingJump = keyIsDown('ArrowUp') || gamepadIsDown(0);
|
|
19
|
-
this.holdingShoot = !isUsingGamepad && mouseIsDown(0) || keyIsDown('KeyZ') || gamepadIsDown(2);
|
|
20
|
-
this.pressingThrow = keyIsDown('KeyC') || mouseIsDown(1) || gamepadIsDown(1);
|
|
21
|
-
this.pressedDodge = keyIsDown('KeyX') || mouseIsDown(2) || gamepadIsDown(3);
|
|
22
|
+
this.moveInput = LJS.isUsingGamepad ? LJS.gamepadStick(0) : LJS.keyDirection();
|
|
23
|
+
this.holdingJump = LJS.keyIsDown('ArrowUp') || LJS.gamepadIsDown(0);
|
|
24
|
+
this.holdingShoot = !LJS.isUsingGamepad && LJS.mouseIsDown(0) || LJS.keyIsDown('KeyZ') || LJS.gamepadIsDown(2);
|
|
25
|
+
this.pressingThrow = LJS.keyIsDown('KeyC') || LJS.mouseIsDown(1) || LJS.gamepadIsDown(1);
|
|
26
|
+
this.pressedDodge = LJS.keyIsDown('KeyX') || LJS.mouseIsDown(2) || LJS.gamepadIsDown(3);
|
|
22
27
|
super.update();
|
|
23
28
|
}
|
|
24
29
|
|
|
25
30
|
kill()
|
|
26
31
|
{
|
|
27
|
-
|
|
32
|
+
Game.addToDeaths();
|
|
28
33
|
super.kill();
|
|
29
34
|
}
|
|
30
35
|
}
|
|
@@ -6,12 +6,4 @@
|
|
|
6
6
|
<meta name=mobile-web-app-capable content=yes>
|
|
7
7
|
<link rel=icon type=image/png href=../favicon.png>
|
|
8
8
|
</head><body>
|
|
9
|
-
|
|
10
|
-
<script src=../../dist/littlejs.js?1117></script>
|
|
11
|
-
<script src=gameObjects.js?1117></script>
|
|
12
|
-
<script src=gameCharacter.js?1117></script>
|
|
13
|
-
<script src=gamePlayer.js?1117></script>
|
|
14
|
-
<script src=gameEffects.js?1117></script>
|
|
15
|
-
<script src=gameLevel.js?1117></script>
|
|
16
|
-
<script src=gameLevelData.js?1117></script>
|
|
17
|
-
<script src=game.js?1117></script>
|
|
9
|
+
<script src=game.js type=module></script>
|
package/examples/puzzle/game.js
CHANGED
|
@@ -8,12 +8,14 @@
|
|
|
8
8
|
|
|
9
9
|
'use strict';
|
|
10
10
|
|
|
11
|
-
//
|
|
12
|
-
|
|
11
|
+
// import LittleJS module
|
|
12
|
+
import * as LJS from '../../dist/littlejs.esm.js';
|
|
13
|
+
const {vec2, rgb, hsl, tile} = LJS;
|
|
13
14
|
|
|
15
|
+
///////////////////////////////////////////////////////////////////////////////
|
|
14
16
|
// do not use pixelated rendering
|
|
15
|
-
setCanvasPixelated(false);
|
|
16
|
-
setTilesPixelated(false);
|
|
17
|
+
LJS.setCanvasPixelated(false);
|
|
18
|
+
LJS.setTilesPixelated(false);
|
|
17
19
|
|
|
18
20
|
const fallTime = .2;
|
|
19
21
|
const cameraOffset = vec2(0,-.5);
|
|
@@ -22,9 +24,9 @@ const minMatchCount = 3;
|
|
|
22
24
|
const highScoreKey = 'puzzleBestScore';
|
|
23
25
|
|
|
24
26
|
// sound effects
|
|
25
|
-
const sound_goodMove = new Sound([.4,.2,250,.04,,.04,,,1,,,,,3]);
|
|
26
|
-
const sound_badMove
|
|
27
|
-
const sound_fall
|
|
27
|
+
const sound_goodMove = new LJS.Sound([.4,.2,250,.04,,.04,,,1,,,,,3]);
|
|
28
|
+
const sound_badMove = new LJS.Sound([,,700,,,.07,,,,3.7,,,,3,,,.1]);
|
|
29
|
+
const sound_fall = new LJS.Sound([.2,,1900,,,.01,,1.4,,91,,,,,,,,,,.7]);
|
|
28
30
|
|
|
29
31
|
let level, levelSize, levelFall, fallTimer, dragStartPos, comboCount, score, bestScore;
|
|
30
32
|
|
|
@@ -46,29 +48,40 @@ const getTile = (pos) => level[pos.x + pos.y * levelSize.x];
|
|
|
46
48
|
const setTile = (pos, data) => level[pos.x + pos.y * levelSize.x] = data;
|
|
47
49
|
|
|
48
50
|
///////////////////////////////////////////////////////////////////////////////
|
|
49
|
-
function
|
|
51
|
+
function gameReset()
|
|
50
52
|
{
|
|
51
|
-
//
|
|
52
|
-
|
|
53
|
-
mainCanvas.style.background = backgroundColor;
|
|
54
|
-
|
|
55
|
-
// load high score
|
|
56
|
-
bestScore = localStorage[highScoreKey] || 0;
|
|
53
|
+
// reset game objects
|
|
54
|
+
LJS.engineObjectsDestroy();
|
|
57
55
|
|
|
58
56
|
// randomize level
|
|
59
57
|
level = [];
|
|
60
|
-
levelSize = vec2(12,6);
|
|
61
58
|
const pos = vec2();
|
|
62
59
|
for (pos.x = levelSize.x; pos.x--;)
|
|
63
60
|
for (pos.y = levelSize.y; pos.y--;)
|
|
64
|
-
setTile(pos, randInt(tileTypeCount));
|
|
61
|
+
setTile(pos, LJS.randInt(tileTypeCount));
|
|
65
62
|
|
|
66
|
-
// setup game
|
|
67
|
-
cameraPos = levelSize.scale(.5).add(cameraOffset);
|
|
68
|
-
cameraScale = 900/levelSize.y;
|
|
69
|
-
gravity = -.004;
|
|
70
|
-
fallTimer = new Timer;
|
|
71
63
|
comboCount = score = 0;
|
|
64
|
+
fallTimer = new LJS.Timer;
|
|
65
|
+
}
|
|
66
|
+
|
|
67
|
+
///////////////////////////////////////////////////////////////////////////////
|
|
68
|
+
function gameInit()
|
|
69
|
+
{
|
|
70
|
+
// setup canvas
|
|
71
|
+
LJS.setCanvasFixedSize(vec2(1920, 1080)); // 1080p
|
|
72
|
+
LJS.mainCanvas.style.background = backgroundColor;
|
|
73
|
+
|
|
74
|
+
// load high score
|
|
75
|
+
bestScore = localStorage[highScoreKey] || 0;
|
|
76
|
+
|
|
77
|
+
// setup game
|
|
78
|
+
levelSize = vec2(12,6);
|
|
79
|
+
LJS.setCameraPos(levelSize.scale(.5).add(cameraOffset));
|
|
80
|
+
LJS.setCameraScale(900/levelSize.y);
|
|
81
|
+
LJS.setGravity(vec2(0,-.004));
|
|
82
|
+
|
|
83
|
+
// start a new game
|
|
84
|
+
gameReset();
|
|
72
85
|
}
|
|
73
86
|
|
|
74
87
|
///////////////////////////////////////////////////////////////////////////////
|
|
@@ -81,7 +94,7 @@ function gameUpdate()
|
|
|
81
94
|
{
|
|
82
95
|
// add more blocks in the top
|
|
83
96
|
for (let x = 0; x < levelSize.x; ++x)
|
|
84
|
-
setTile(vec2(x,levelSize.y),randInt(tileTypeCount));
|
|
97
|
+
setTile(vec2(x,levelSize.y), LJS.randInt(tileTypeCount));
|
|
85
98
|
}
|
|
86
99
|
|
|
87
100
|
// allow blocks to fall
|
|
@@ -107,7 +120,7 @@ function gameUpdate()
|
|
|
107
120
|
|
|
108
121
|
if (keepFalling)
|
|
109
122
|
{
|
|
110
|
-
const p = percent(comboCount, 9, 0);
|
|
123
|
+
const p = LJS.percent(comboCount, 9, 0);
|
|
111
124
|
fallTimer.set(fallTime*p);
|
|
112
125
|
sound_fall.play();
|
|
113
126
|
}
|
|
@@ -122,22 +135,22 @@ function gameUpdate()
|
|
|
122
135
|
if (!fallTimer.isSet())
|
|
123
136
|
{
|
|
124
137
|
// mouse/touch control
|
|
125
|
-
const mouseTilePos = mousePos.floor();
|
|
126
|
-
if (!mousePos.arrayCheck(levelSize))
|
|
138
|
+
const mouseTilePos = LJS.mousePos.floor();
|
|
139
|
+
if (!LJS.mousePos.arrayCheck(levelSize))
|
|
127
140
|
{
|
|
128
141
|
// cancel drag if mouse is not in the level bounds
|
|
129
142
|
dragStartPos = 0;
|
|
130
143
|
}
|
|
131
|
-
else if (mouseWasPressed(0) && !dragStartPos)
|
|
144
|
+
else if (LJS.mouseWasPressed(0) && !dragStartPos)
|
|
132
145
|
{
|
|
133
146
|
// start drag
|
|
134
147
|
dragStartPos = mouseTilePos.copy();
|
|
135
148
|
}
|
|
136
|
-
else if (mouseIsDown(0) && dragStartPos)
|
|
149
|
+
else if (LJS.mouseIsDown(0) && dragStartPos)
|
|
137
150
|
{
|
|
138
151
|
// if dragging to a neighbor tile
|
|
139
|
-
const dx = abs(dragStartPos.x - mouseTilePos.x);
|
|
140
|
-
const dy = abs(dragStartPos.y - mouseTilePos.y);
|
|
152
|
+
const dx = LJS.abs(dragStartPos.x - mouseTilePos.x);
|
|
153
|
+
const dy = LJS.abs(dragStartPos.y - mouseTilePos.y);
|
|
141
154
|
if (dx == 1 && dy == 0 || dx == 0 && dy == 1)
|
|
142
155
|
{
|
|
143
156
|
const startTile = getTile(dragStartPos);
|
|
@@ -175,6 +188,9 @@ function gameUpdate()
|
|
|
175
188
|
bestScore = score;
|
|
176
189
|
localStorage[highScoreKey] = bestScore;
|
|
177
190
|
}
|
|
191
|
+
|
|
192
|
+
if (LJS.keyWasPressed('KeyR'))
|
|
193
|
+
gameReset();
|
|
178
194
|
}
|
|
179
195
|
|
|
180
196
|
///////////////////////////////////////////////////////////////////////////////
|
|
@@ -187,7 +203,7 @@ function gameUpdatePost()
|
|
|
187
203
|
function gameRender()
|
|
188
204
|
{
|
|
189
205
|
// draw a black square for the background
|
|
190
|
-
drawRect(cameraPos.subtract(cameraOffset), levelSize, hsl(0,0,0));
|
|
206
|
+
LJS.drawRect(LJS.cameraPos.subtract(cameraOffset), levelSize, hsl(0,0,0));
|
|
191
207
|
|
|
192
208
|
// draw the blocks
|
|
193
209
|
const pos = vec2();
|
|
@@ -201,7 +217,7 @@ function gameRender()
|
|
|
201
217
|
// highlight drag start
|
|
202
218
|
const drawPos = pos.add(vec2(.5));
|
|
203
219
|
if (dragStartPos && pos.x == dragStartPos.x && pos.y == dragStartPos.y)
|
|
204
|
-
drawRect(drawPos, vec2(1.05));
|
|
220
|
+
LJS.drawRect(drawPos, vec2(1.05));
|
|
205
221
|
|
|
206
222
|
// make pieces fall gradually
|
|
207
223
|
if (fallTimer.active() && levelFall[pos.x + pos.y*levelSize.x])
|
|
@@ -209,28 +225,28 @@ function gameRender()
|
|
|
209
225
|
|
|
210
226
|
// draw background
|
|
211
227
|
const color = tileColors[data];
|
|
212
|
-
drawRect(drawPos, vec2(.95), color);
|
|
228
|
+
LJS.drawRect(drawPos, vec2(.95), color);
|
|
213
229
|
|
|
214
230
|
// use darker color for icon
|
|
215
231
|
const color2 = color.scale(.8, 1);
|
|
216
|
-
drawTile(drawPos, vec2(.5), tile(data, 64), color2);
|
|
232
|
+
LJS.drawTile(drawPos, vec2(.5), tile(data, 64), color2);
|
|
217
233
|
}
|
|
218
234
|
|
|
219
235
|
// draw a grey square at top to cover up incoming tiles
|
|
220
|
-
drawRect(cameraPos.subtract(cameraOffset).add(vec2(0,levelSize.y)), levelSize, backgroundColor);
|
|
236
|
+
LJS.drawRect(LJS.cameraPos.subtract(cameraOffset).add(vec2(0,levelSize.y)), levelSize, backgroundColor);
|
|
221
237
|
}
|
|
222
238
|
|
|
223
239
|
///////////////////////////////////////////////////////////////////////////////
|
|
224
240
|
function gameRenderPost()
|
|
225
241
|
{
|
|
226
242
|
// draw text on top of everything
|
|
227
|
-
drawTextOverlay('Score: ' + score, cameraPos.add(vec2(-3,-3.1)), .9, hsl(), .1);
|
|
228
|
-
drawTextOverlay('Best: ' + bestScore, cameraPos.add(vec2( 3,-3.1)), .9, hsl(), .1);
|
|
243
|
+
LJS.drawTextOverlay('Score: ' + score, LJS.cameraPos.add(vec2(-3,-3.1)), .9, hsl(), .1);
|
|
244
|
+
LJS.drawTextOverlay('Best: ' + bestScore, LJS.cameraPos.add(vec2( 3,-3.1)), .9, hsl(), .1);
|
|
229
245
|
}
|
|
230
246
|
|
|
231
247
|
///////////////////////////////////////////////////////////////////////////////
|
|
232
248
|
// Startup LittleJS Engine
|
|
233
|
-
engineInit(gameInit, gameUpdate, gameUpdatePost, gameRender, gameRenderPost, ['tiles.png']);
|
|
249
|
+
LJS.engineInit(gameInit, gameUpdate, gameUpdatePost, gameRender, gameRenderPost, ['tiles.png']);
|
|
234
250
|
|
|
235
251
|
///////////////////////////////////////////////////////////////////////////////
|
|
236
252
|
// find and remove all runs of 3 or higher
|
|
@@ -292,14 +308,14 @@ function clearMatches()
|
|
|
292
308
|
// spawn particles
|
|
293
309
|
const color1 = tileColors[data];
|
|
294
310
|
const color2 = color1.lerp(hsl(), .5);
|
|
295
|
-
new ParticleEmitter(
|
|
296
|
-
pos.add(vec2(.5)), 0,
|
|
297
|
-
.5, .1, 200,
|
|
298
|
-
0,
|
|
311
|
+
new LJS.ParticleEmitter(
|
|
312
|
+
pos.add(vec2(.5)), 0, // pos, angle
|
|
313
|
+
.5, .1, 200, 3.14, // emitSize, emitTime, emitRate, emitCone
|
|
314
|
+
0, // tileInfo
|
|
299
315
|
color1, color2, // colorStartA, colorStartB
|
|
300
316
|
color1.scale(1,0), color2.scale(1,0),// colorEndA, colorEndB
|
|
301
317
|
.5, .3, .2, .05, .05, // particleTime, sizeStart, sizeEnd, speed, angleSpeed
|
|
302
|
-
.99, 1, 1,
|
|
318
|
+
.99, 1, 1, 3.14, .05, // damp, angleDamp, gravityScale, particleCone, fadeRate
|
|
303
319
|
.5, 0, 1 // randomness, collide, additive, colorLinear, renderOrder
|
|
304
320
|
);
|
|
305
321
|
}
|
|
@@ -1,5 +1,5 @@
|
|
|
1
1
|
<!DOCTYPE html><meta charset=utf-8><body>
|
|
2
|
-
<script src=../../dist/littlejs.js?
|
|
2
|
+
<script src=../../dist/littlejs.js?1120></script>
|
|
3
3
|
<script>
|
|
4
4
|
|
|
5
5
|
'use strict';
|
|
@@ -23,4 +23,4 @@ function gameUpdatePost() {}
|
|
|
23
23
|
function gameRender() {}
|
|
24
24
|
function gameRenderPost() {}
|
|
25
25
|
|
|
26
|
-
</script>
|
|
26
|
+
</script>
|