littlejsengine 1.3.0 → 1.3.8
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/README.md +7 -4
- package/build.bat +1 -1
- package/buildSetup.bat +4 -1
- package/engine/engine.all.js +128 -77
- package/engine/engine.all.min.js +1 -1
- package/engine/engine.all.release.js +129 -78
- package/engine/engine.js +30 -27
- package/engine/engineAudio.js +5 -7
- package/engine/engineBuild.bat +0 -1
- package/engine/engineDebug.js +1 -1
- package/engine/engineDraw.js +15 -6
- package/engine/engineInput.js +6 -2
- package/engine/engineMedals.js +1 -1
- package/engine/engineObject.js +22 -19
- package/engine/engineParticles.js +1 -1
- package/engine/engineRelease.js +2 -2
- package/engine/engineSettings.js +7 -1
- package/engine/engineUtilities.js +39 -11
- package/engine/engineWebGL.js +1 -1
- package/engine/index.d.ts +23 -10
- package/examples/breakout/index.html +3 -3
- package/examples/particles/index.html +151 -103
- package/examples/platformer/index.html +5 -5
- package/examples/puzzle/game.js +3 -1
- package/examples/puzzle/index.html +2 -2
- package/examples/stress/index.html +1 -1
- package/game.js +10 -21
- package/index.html +13 -13
- package/package.json +9 -2
|
@@ -15,24 +15,24 @@ button
|
|
|
15
15
|
</style>
|
|
16
16
|
</head><body>
|
|
17
17
|
|
|
18
|
-
<script src=../../engine/engineDebug.js?
|
|
19
|
-
<script src=../../engine/engineUtilities.js?
|
|
20
|
-
<script src=../../engine/engineSettings.js?
|
|
21
|
-
<script src=../../engine/engineObject.js?
|
|
22
|
-
<script src=../../engine/engineDraw.js?
|
|
23
|
-
<script src=../../engine/engineInput.js?
|
|
24
|
-
<script src=../../engine/engineAudio.js?
|
|
25
|
-
<script src=../../engine/engineTileLayer.js?
|
|
26
|
-
<script src=../../engine/engineParticles.js?
|
|
27
|
-
<script src=../../engine/engineMedals.js?
|
|
28
|
-
<script src=../../engine/engineWebGL.js?
|
|
29
|
-
<script src=../../engine/engine.js?
|
|
18
|
+
<script src=../../engine/engineDebug.js?111></script>
|
|
19
|
+
<script src=../../engine/engineUtilities.js?111></script>
|
|
20
|
+
<script src=../../engine/engineSettings.js?111></script>
|
|
21
|
+
<script src=../../engine/engineObject.js?111></script>
|
|
22
|
+
<script src=../../engine/engineDraw.js?111></script>
|
|
23
|
+
<script src=../../engine/engineInput.js?111></script>
|
|
24
|
+
<script src=../../engine/engineAudio.js?111></script>
|
|
25
|
+
<script src=../../engine/engineTileLayer.js?111></script>
|
|
26
|
+
<script src=../../engine/engineParticles.js?111></script>
|
|
27
|
+
<script src=../../engine/engineMedals.js?111></script>
|
|
28
|
+
<script src=../../engine/engineWebGL.js?111></script>
|
|
29
|
+
<script src=../../engine/engine.js?111></script>
|
|
30
30
|
<script>
|
|
31
31
|
|
|
32
32
|
'use strict';
|
|
33
33
|
|
|
34
34
|
let particleEditor = 0, particleSystem, particleSystemDiv, particleSystemCode;
|
|
35
|
-
let
|
|
35
|
+
let inputExpand;
|
|
36
36
|
let restartTimer = new Timer();
|
|
37
37
|
const storagePrefix = 'particles_';
|
|
38
38
|
|
|
@@ -42,41 +42,41 @@ function addSetting(name, type, min, max, step, description)
|
|
|
42
42
|
particleSettings.push({name, type:type||'number', min, max, step, description});
|
|
43
43
|
}
|
|
44
44
|
|
|
45
|
-
addSetting('emitSize', '', 0, 1e9, .1);
|
|
46
|
-
addSetting('emitTime', '', 0, 1e9, .1);
|
|
47
|
-
addSetting('emitRate', '', 0, 1e9, 1);
|
|
48
|
-
addSetting('emitConeAngle', '', 0, 1e9, .01);
|
|
49
|
-
addSetting('tileIndex', '', -1, 1e9, 1);
|
|
50
|
-
addSetting('tileSizeX', '', 0, 1e9, 1);
|
|
51
|
-
addSetting('tileSizeY', '', 0, 1e9, 1);
|
|
52
|
-
addSetting('colorStartA', 'color');
|
|
53
|
-
addSetting('
|
|
54
|
-
addSetting('
|
|
55
|
-
addSetting('
|
|
56
|
-
addSetting('
|
|
57
|
-
addSetting('
|
|
58
|
-
addSetting('
|
|
59
|
-
addSetting('
|
|
60
|
-
addSetting('particleTime', '', 0, 1e9, .1);
|
|
61
|
-
addSetting('sizeStart', '', 0, 1e9, .01);
|
|
62
|
-
addSetting('sizeEnd', '', 0, 1e9, .01);
|
|
63
|
-
addSetting('speed', '', 0, 1e9, .01);
|
|
64
|
-
addSetting('angleSpeed', '', 0, 1e9, .01);
|
|
65
|
-
addSetting('damping', '', 0, 1, .01);
|
|
66
|
-
addSetting('angleDamping', '', 0, 1, .01);
|
|
67
|
-
addSetting('gravityScale', '', -1e9, 1e9, .1);
|
|
68
|
-
addSetting('particleConeAngle','', 0, 1e9, .1);
|
|
69
|
-
addSetting('fadeRate', '', 0, 1, .01);
|
|
70
|
-
addSetting('randomness', '', 0, 1, .01);
|
|
71
|
-
addSetting('collideTiles', 'checkbox');
|
|
72
|
-
addSetting('additive', 'checkbox');
|
|
73
|
-
addSetting('randomColorLinear','checkbox');
|
|
45
|
+
addSetting('emitSize', '', 0, 1e9, .1, 'World space size of the emitter');
|
|
46
|
+
addSetting('emitTime', '', 0, 1e9, .1, 'How long to stay alive (0 is forever)');
|
|
47
|
+
addSetting('emitRate', '', 0, 1e9, 1, 'How many particles per second to spawn, does not emit if 0');
|
|
48
|
+
addSetting('emitConeAngle', '', 0, 1e9, .01,'Local angle to apply velocity to particles from emitter');
|
|
49
|
+
addSetting('tileIndex', '', -1, 1e9, 1, 'Tile to use to render object (-1 is untextured)');
|
|
50
|
+
addSetting('tileSizeX', '', 0, 1e9, 1, 'X Size of texture tile in source pixelss');
|
|
51
|
+
addSetting('tileSizeY', '', 0, 1e9, 1, 'Y Size of texture tile in source pixelss');
|
|
52
|
+
addSetting('colorStartA', 'color',0,0,0, 'Color at start of life 1');
|
|
53
|
+
addSetting('colorStartA_alpha', 'alpha', 0, 1, .01, 'Alpha at start of life 1');
|
|
54
|
+
addSetting('colorStartB', 'color',0,0,0, 'Color at start of life 2');
|
|
55
|
+
addSetting('colorStartB_alpha', 'alpha', 0, 1, .01, 'Alpha at start of life 2');
|
|
56
|
+
addSetting('colorEndA', 'color',0,0,0, 'Color at end of life 1');
|
|
57
|
+
addSetting('colorEndA_alpha', 'alpha', 0, 1, .01, 'Alpha at end of life 1');
|
|
58
|
+
addSetting('colorEndB', 'color',0,0,0, 'Color at end of life 2');
|
|
59
|
+
addSetting('colorEndB_alpha', 'alpha', 0, 1, .01, 'Alpha at end of life 2');
|
|
60
|
+
addSetting('particleTime', '', 0, 1e9, .1, 'How long particles live');
|
|
61
|
+
addSetting('sizeStart', '', 0, 1e9, .01,'How big are particles at start');
|
|
62
|
+
addSetting('sizeEnd', '', 0, 1e9, .01,'How big are particles at end');
|
|
63
|
+
addSetting('speed', '', 0, 1e9, .01,'How fast are particles when spawned');
|
|
64
|
+
addSetting('angleSpeed', '', 0, 1e9, .01,'How fast are particles rotating');
|
|
65
|
+
addSetting('damping', '', 0, 1, .01,'How much to dampen particle speed');
|
|
66
|
+
addSetting('angleDamping', '', 0, 1, .01,'How much to dampen particle angular speed');
|
|
67
|
+
addSetting('gravityScale', '', -1e9, 1e9, .1, 'How much does gravity effect particles');
|
|
68
|
+
addSetting('particleConeAngle','', 0, 1e9, .1, 'Cone for start particle angle');
|
|
69
|
+
addSetting('fadeRate', '', 0, 1, .01,'How quickly particles fade in percent of life');
|
|
70
|
+
addSetting('randomness', '', 0, 1, .01,'Apply extra randomness percent');
|
|
71
|
+
addSetting('collideTiles', 'checkbox',0,0,0, 'Do particles collide against tiles?');
|
|
72
|
+
addSetting('additive', 'checkbox',0,0,0, 'Should particles use addtive blend?');
|
|
73
|
+
addSetting('randomColorLinear','checkbox',0,0,0, 'Should color be randomized linearly?');
|
|
74
74
|
|
|
75
75
|
function makeEmitter()
|
|
76
76
|
{
|
|
77
77
|
particleSystem = new ParticleEmitter(cameraPos);
|
|
78
78
|
particleSystem.emitConeAngle =
|
|
79
|
-
|
|
79
|
+
particleSystem.particleConeAngle = 3.14;
|
|
80
80
|
}
|
|
81
81
|
|
|
82
82
|
///////////////////////////////////////////////////////////////////////////////
|
|
@@ -93,10 +93,47 @@ function gameInit()
|
|
|
93
93
|
|
|
94
94
|
for (const setting of particleSettings)
|
|
95
95
|
{
|
|
96
|
+
// get default value
|
|
97
|
+
// todo: clean this up
|
|
98
|
+
let defaultValue = '';
|
|
99
|
+
{
|
|
100
|
+
const name = setting.name;
|
|
101
|
+
const type = setting.type;
|
|
102
|
+
|
|
103
|
+
if (type == 'color')
|
|
104
|
+
{
|
|
105
|
+
const color = particleSystem[name];
|
|
106
|
+
defaultValue = color.getHex();
|
|
107
|
+
}
|
|
108
|
+
else if (type == 'alpha')
|
|
109
|
+
{
|
|
110
|
+
if (name == 'colorStartA_alpha')
|
|
111
|
+
defaultValue = particleSystem.colorStartA.a;
|
|
112
|
+
else if (name == 'colorStartB_alpha')
|
|
113
|
+
defaultValue = particleSystem.colorStartB.a;
|
|
114
|
+
else if (name == 'colorEndA_alpha')
|
|
115
|
+
defaultValue = particleSystem.colorEndA.a;
|
|
116
|
+
else if (name == 'colorEndB_alpha')
|
|
117
|
+
defaultValue = particleSystem.colorEndB.a;
|
|
118
|
+
}
|
|
119
|
+
else if (name == 'tileSizeX')
|
|
120
|
+
defaultValue = particleSystem.tileSize.x;
|
|
121
|
+
else if (name == 'tileSizeY')
|
|
122
|
+
defaultValue = particleSystem.tileSize.y;
|
|
123
|
+
else if (type == 'checkbox')
|
|
124
|
+
defaultValue = particleSystem[name];
|
|
125
|
+
else
|
|
126
|
+
defaultValue = particleSystem[name] || '0';
|
|
127
|
+
}
|
|
128
|
+
|
|
129
|
+
div.appendChild(document.createElement('br'));
|
|
130
|
+
|
|
96
131
|
const input = setting.input = document.createElement('input');
|
|
97
132
|
const name = setting.name;
|
|
98
|
-
input.oninput = (e)=> updateParticles();
|
|
99
133
|
input.type = setting.type == 'alpha' ? 'number' : setting.type;
|
|
134
|
+
input.title = setting.description;
|
|
135
|
+
input.oninput = (e)=> updateParticles(setting.type == 'checkbox');
|
|
136
|
+
input.onblur = (e)=> updateParticles(1);
|
|
100
137
|
if (setting.min !== undefined)
|
|
101
138
|
input.min = setting.min;
|
|
102
139
|
if (setting.max !== undefined)
|
|
@@ -105,8 +142,18 @@ function gameInit()
|
|
|
105
142
|
input.step = setting.step;
|
|
106
143
|
if (name == 'emitConeAngle' || name == 'particleConeAngle')
|
|
107
144
|
particleSystem[name] = 3.14; // simplify pi
|
|
145
|
+
|
|
146
|
+
const inputReset = document.createElement('button');
|
|
147
|
+
inputReset.innerText = '♻️';
|
|
148
|
+
inputReset.onclick = (e)=>
|
|
149
|
+
{
|
|
150
|
+
setting.type == 'checkbox'?
|
|
151
|
+
setting.input.checked = defaultValue :
|
|
152
|
+
setting.input.value = defaultValue;
|
|
153
|
+
updateParticles(1);
|
|
154
|
+
}
|
|
155
|
+
div.appendChild(inputReset);
|
|
108
156
|
|
|
109
|
-
div.appendChild(document.createElement('br'));
|
|
110
157
|
div.appendChild(input);
|
|
111
158
|
div.appendChild(document.createTextNode(' ' + name));
|
|
112
159
|
}
|
|
@@ -135,13 +182,12 @@ function gameInit()
|
|
|
135
182
|
}
|
|
136
183
|
}
|
|
137
184
|
{
|
|
138
|
-
|
|
139
|
-
div.appendChild(
|
|
140
|
-
|
|
141
|
-
|
|
142
|
-
|
|
143
|
-
|
|
144
|
-
div.appendChild(document.createTextNode(' Condense'));
|
|
185
|
+
inputExpand = document.createElement('input');
|
|
186
|
+
div.appendChild(inputExpand);
|
|
187
|
+
inputExpand.type = 'checkbox';
|
|
188
|
+
inputExpand.style.width = 'initial';
|
|
189
|
+
inputExpand.oninput = (e)=> updateParticles(1);
|
|
190
|
+
div.appendChild(document.createTextNode(' Expand'));
|
|
145
191
|
}
|
|
146
192
|
|
|
147
193
|
//div.appendChild(document.createTextNode('JavaScript Code... '));
|
|
@@ -171,7 +217,7 @@ function gameInit()
|
|
|
171
217
|
updateParticles();
|
|
172
218
|
}
|
|
173
219
|
|
|
174
|
-
function updateParticles()
|
|
220
|
+
function updateParticles(shouldUpdateInput)
|
|
175
221
|
{
|
|
176
222
|
for (const setting of particleSettings)
|
|
177
223
|
{
|
|
@@ -188,13 +234,13 @@ function updateParticles()
|
|
|
188
234
|
}
|
|
189
235
|
else if (type == 'alpha')
|
|
190
236
|
{
|
|
191
|
-
if (name == '
|
|
237
|
+
if (name == 'colorStartA_alpha')
|
|
192
238
|
particleSystem.colorStartA.a = clamp(inputFloat);
|
|
193
|
-
else if (name == '
|
|
239
|
+
else if (name == 'colorStartB_alpha')
|
|
194
240
|
particleSystem.colorStartB.a = clamp(inputFloat);
|
|
195
|
-
else if (name == '
|
|
241
|
+
else if (name == 'colorEndA_alpha')
|
|
196
242
|
particleSystem.colorEndA.a = clamp(inputFloat);
|
|
197
|
-
else if (name == '
|
|
243
|
+
else if (name == 'colorEndB_alpha')
|
|
198
244
|
particleSystem.colorEndB.a = clamp(inputFloat);
|
|
199
245
|
}
|
|
200
246
|
else if (name == 'tileSizeX')
|
|
@@ -212,55 +258,58 @@ function updateParticles()
|
|
|
212
258
|
else
|
|
213
259
|
particleSystem[name] = clamp(inputFloat, setting.min, setting.max);
|
|
214
260
|
}
|
|
215
|
-
updateInputs()
|
|
261
|
+
shouldUpdateInput && updateInputs()
|
|
216
262
|
}
|
|
217
263
|
|
|
218
264
|
function updateInputs(save=1)
|
|
219
265
|
{
|
|
220
266
|
for (const setting of particleSettings)
|
|
267
|
+
updateSetting(setting, save);
|
|
268
|
+
particleSystemCode.value = getCode();
|
|
269
|
+
}
|
|
270
|
+
|
|
271
|
+
function updateSetting(setting, save=1)
|
|
272
|
+
{
|
|
273
|
+
const input = setting.input;
|
|
274
|
+
const name = setting.name;
|
|
275
|
+
const type = setting.type;
|
|
276
|
+
|
|
277
|
+
if (type == 'color')
|
|
221
278
|
{
|
|
222
|
-
const
|
|
223
|
-
|
|
224
|
-
|
|
225
|
-
|
|
226
|
-
|
|
227
|
-
|
|
228
|
-
|
|
229
|
-
|
|
230
|
-
|
|
231
|
-
else if (
|
|
232
|
-
|
|
233
|
-
|
|
234
|
-
|
|
235
|
-
|
|
236
|
-
|
|
237
|
-
|
|
238
|
-
|
|
239
|
-
|
|
240
|
-
|
|
241
|
-
|
|
242
|
-
|
|
243
|
-
|
|
244
|
-
else if (name == 'tileSizeY')
|
|
245
|
-
input.value = particleSystem.tileSize.y;
|
|
246
|
-
else if (type == 'checkbox')
|
|
247
|
-
input.checked = particleSystem[name];
|
|
248
|
-
else
|
|
249
|
-
input.value = particleSystem[name] || '0';
|
|
279
|
+
const color = particleSystem[name];
|
|
280
|
+
input.value = color.getHex();
|
|
281
|
+
}
|
|
282
|
+
else if (type == 'alpha')
|
|
283
|
+
{
|
|
284
|
+
if (name == 'colorStartA_alpha')
|
|
285
|
+
input.value = particleSystem.colorStartA.a;
|
|
286
|
+
else if (name == 'colorStartB_alpha')
|
|
287
|
+
input.value = particleSystem.colorStartB.a;
|
|
288
|
+
else if (name == 'colorEndA_alpha')
|
|
289
|
+
input.value = particleSystem.colorEndA.a;
|
|
290
|
+
else if (name == 'colorEndB_alpha')
|
|
291
|
+
input.value = particleSystem.colorEndB.a;
|
|
292
|
+
}
|
|
293
|
+
else if (name == 'tileSizeX')
|
|
294
|
+
input.value = particleSystem.tileSize.x;
|
|
295
|
+
else if (name == 'tileSizeY')
|
|
296
|
+
input.value = particleSystem.tileSize.y;
|
|
297
|
+
else if (type == 'checkbox')
|
|
298
|
+
input.checked = particleSystem[name];
|
|
299
|
+
else
|
|
300
|
+
input.value = particleSystem[name] || '0';
|
|
250
301
|
|
|
251
|
-
|
|
252
|
-
|
|
253
|
-
|
|
254
|
-
|
|
255
|
-
|
|
256
|
-
}
|
|
302
|
+
if (save)
|
|
303
|
+
{
|
|
304
|
+
const storageName = storagePrefix + setting.name;
|
|
305
|
+
localStorage[storageName] = type == 'checkbox' ?
|
|
306
|
+
input.checked : input.value;
|
|
257
307
|
}
|
|
258
|
-
particleSystemCode.value = getCode();
|
|
259
308
|
}
|
|
260
309
|
|
|
261
310
|
function getCode()
|
|
262
311
|
{
|
|
263
|
-
const
|
|
312
|
+
const expand = inputExpand.checked;
|
|
264
313
|
let code = '';
|
|
265
314
|
|
|
266
315
|
// https://www.codingem.com/javascript-how-to-limit-decimal-places/
|
|
@@ -270,10 +319,10 @@ function getCode()
|
|
|
270
319
|
}
|
|
271
320
|
|
|
272
321
|
code = 'new ParticleEmitter(';
|
|
273
|
-
if (
|
|
274
|
-
code += 'vec2(), 0, ';
|
|
275
|
-
else
|
|
322
|
+
if (expand)
|
|
276
323
|
code += '\n vec2(), 0,\t//position, angle\n';
|
|
324
|
+
else
|
|
325
|
+
code += 'vec2(), 0, ';
|
|
277
326
|
|
|
278
327
|
let count = 0;
|
|
279
328
|
for (const setting of particleSettings)
|
|
@@ -296,12 +345,12 @@ function getCode()
|
|
|
296
345
|
value = particleSystem[name] ? 1 : 0;
|
|
297
346
|
else
|
|
298
347
|
value = particleSystem[name].round(3);
|
|
299
|
-
if (
|
|
348
|
+
if (expand)
|
|
300
349
|
code += ' ';
|
|
301
350
|
code += value;
|
|
302
351
|
|
|
303
352
|
const isEnd = name == 'randomColorLinear';
|
|
304
|
-
if (
|
|
353
|
+
if (expand)
|
|
305
354
|
{
|
|
306
355
|
code += ',\t// ' + name;
|
|
307
356
|
if (!isEnd)
|
|
@@ -311,11 +360,10 @@ function getCode()
|
|
|
311
360
|
code += ', ';
|
|
312
361
|
}
|
|
313
362
|
|
|
314
|
-
|
|
315
|
-
if (condense)
|
|
316
|
-
code += ');';
|
|
317
|
-
else
|
|
363
|
+
if (expand)
|
|
318
364
|
code += '\n); // particle emitter';
|
|
365
|
+
else
|
|
366
|
+
code += ');';
|
|
319
367
|
|
|
320
368
|
return code;
|
|
321
369
|
}
|
|
@@ -5,9 +5,9 @@
|
|
|
5
5
|
<link rel=icon type=image/png href=../../favicon.png>
|
|
6
6
|
</head><body>
|
|
7
7
|
|
|
8
|
-
<script src=../../engine/engine.all.js?
|
|
9
|
-
<script src=gameObjects.js?
|
|
10
|
-
<script src=gamePlayer.js?
|
|
11
|
-
<script src=gameEffects.js?
|
|
12
|
-
<script src=gameLevel.js?
|
|
8
|
+
<script src=../../engine/engine.all.js?111></script>
|
|
9
|
+
<script src=gameObjects.js?111></script>
|
|
10
|
+
<script src=gamePlayer.js?111></script>
|
|
11
|
+
<script src=gameEffects.js?111></script>
|
|
12
|
+
<script src=gameLevel.js?111></script>
|
|
13
13
|
<script src=game.js?103></script>
|
package/examples/puzzle/game.js
CHANGED
|
@@ -129,7 +129,9 @@ function gameUpdate()
|
|
|
129
129
|
else if (mouseIsDown(0) && dragStartPos)
|
|
130
130
|
{
|
|
131
131
|
// if dragging to a neighbor tile
|
|
132
|
-
|
|
132
|
+
const dx = abs(dragStartPos.x - mouseTilePos.x);
|
|
133
|
+
const dy = abs(dragStartPos.y - mouseTilePos.y);
|
|
134
|
+
if (dx == 1 && dy == 0 || dx == 0 && dy == 1)
|
|
133
135
|
{
|
|
134
136
|
const startTile = getTile(dragStartPos);
|
|
135
137
|
const endTile = getTile(mouseTilePos);
|
package/game.js
CHANGED
|
@@ -5,30 +5,29 @@
|
|
|
5
5
|
'use strict';
|
|
6
6
|
|
|
7
7
|
// popup errors if there are any (help diagnose issues on mobile devices)
|
|
8
|
-
|
|
9
|
-
onerror = (...parameters)=> alert(parameters);
|
|
8
|
+
//onerror = (...parameters)=> alert(parameters);
|
|
10
9
|
|
|
11
10
|
// game variables
|
|
12
|
-
let particleEmiter
|
|
11
|
+
let particleEmiter;
|
|
13
12
|
|
|
14
13
|
// sound effects
|
|
15
14
|
const sound_click = new Sound([.5,.5]);
|
|
16
15
|
|
|
17
16
|
// medals
|
|
18
|
-
const medal_example
|
|
17
|
+
const medal_example = new Medal(0, 'Example Medal', 'Medal description goes here.');
|
|
19
18
|
medalsInit('Hello World');
|
|
20
19
|
|
|
21
20
|
///////////////////////////////////////////////////////////////////////////////
|
|
22
21
|
function gameInit()
|
|
23
22
|
{
|
|
24
23
|
// create tile collision and visible tile layer
|
|
25
|
-
initTileCollision(vec2(32,16));
|
|
24
|
+
initTileCollision(vec2(32, 16));
|
|
26
25
|
const tileLayer = new TileLayer(vec2(), tileCollisionSize);
|
|
27
26
|
const pos = vec2();
|
|
28
27
|
|
|
29
28
|
// get level data from the tiles image
|
|
30
29
|
const imageLevelDataRow = 1;
|
|
31
|
-
mainContext.drawImage(tileImage,0,0);
|
|
30
|
+
mainContext.drawImage(tileImage, 0, 0);
|
|
32
31
|
for (pos.x = tileCollisionSize.x; pos.x--;)
|
|
33
32
|
for (pos.y = tileCollisionSize.y; pos.y--;)
|
|
34
33
|
{
|
|
@@ -65,8 +64,8 @@ function gameInit()
|
|
|
65
64
|
.99, 1, 1, PI, .05, // damping, angleDamping, gravityScale, particleCone, fadeRate,
|
|
66
65
|
.5, 1, 1 // randomness, collide, additive, randomColorLinear, renderOrder
|
|
67
66
|
);
|
|
68
|
-
particleEmiter.elasticity = .3;
|
|
69
|
-
particleEmiter.trailScale = 2;
|
|
67
|
+
particleEmiter.elasticity = .3; // bounce when it collides
|
|
68
|
+
particleEmiter.trailScale = 2; // stretch in direction of motion
|
|
70
69
|
}
|
|
71
70
|
|
|
72
71
|
///////////////////////////////////////////////////////////////////////////////
|
|
@@ -77,7 +76,7 @@ function gameUpdate()
|
|
|
77
76
|
// play sound when mouse is pressed
|
|
78
77
|
sound_click.play(mousePos);
|
|
79
78
|
|
|
80
|
-
// change particle color
|
|
79
|
+
// change particle color and set to fade out
|
|
81
80
|
particleEmiter.colorStartA = new Color;
|
|
82
81
|
particleEmiter.colorStartB = randColor();
|
|
83
82
|
particleEmiter.colorEndA = particleEmiter.colorStartA.scale(1,0);
|
|
@@ -88,7 +87,7 @@ function gameUpdate()
|
|
|
88
87
|
}
|
|
89
88
|
|
|
90
89
|
// move particles to mouse location if on screen
|
|
91
|
-
if (mousePosScreen.x
|
|
90
|
+
if (mousePosScreen.x)
|
|
92
91
|
particleEmiter.pos = mousePos;
|
|
93
92
|
}
|
|
94
93
|
|
|
@@ -109,17 +108,7 @@ function gameRender()
|
|
|
109
108
|
function gameRenderPost()
|
|
110
109
|
{
|
|
111
110
|
// draw to overlay canvas for hud rendering
|
|
112
|
-
|
|
113
|
-
{
|
|
114
|
-
overlayContext.textAlign = 'center';
|
|
115
|
-
overlayContext.textBaseline = 'top';
|
|
116
|
-
overlayContext.font = size + 'px arial';
|
|
117
|
-
overlayContext.fillStyle = '#fff';
|
|
118
|
-
overlayContext.lineWidth = 3;
|
|
119
|
-
overlayContext.strokeText(text, x, y);
|
|
120
|
-
overlayContext.fillText(text, x, y);
|
|
121
|
-
}
|
|
122
|
-
drawText('Hello World', overlayCanvas.width/2, 40);
|
|
111
|
+
drawTextScreen('Hello World', vec2(overlayCanvas.width/2, 80), 80, new Color, 9);
|
|
123
112
|
}
|
|
124
113
|
|
|
125
114
|
///////////////////////////////////////////////////////////////////////////////
|
package/index.html
CHANGED
|
@@ -6,21 +6,21 @@
|
|
|
6
6
|
</head><body>
|
|
7
7
|
|
|
8
8
|
<!-- LittleJS engine scripts -->
|
|
9
|
-
<script src=engine/engineDebug.js?
|
|
10
|
-
<script src=engine/engineUtilities.js?
|
|
11
|
-
<script src=engine/engineSettings.js?
|
|
12
|
-
<script src=engine/engineObject.js?
|
|
13
|
-
<script src=engine/engineDraw.js?
|
|
14
|
-
<script src=engine/engineInput.js?
|
|
15
|
-
<script src=engine/engineAudio.js?
|
|
16
|
-
<script src=engine/engineTileLayer.js?
|
|
17
|
-
<script src=engine/engineParticles.js?
|
|
18
|
-
<script src=engine/engineMedals.js?
|
|
19
|
-
<script src=engine/engineWebGL.js?
|
|
20
|
-
<script src=engine/engine.js?
|
|
9
|
+
<script src=engine/engineDebug.js?111></script>
|
|
10
|
+
<script src=engine/engineUtilities.js?111></script>
|
|
11
|
+
<script src=engine/engineSettings.js?111></script>
|
|
12
|
+
<script src=engine/engineObject.js?111></script>
|
|
13
|
+
<script src=engine/engineDraw.js?111></script>
|
|
14
|
+
<script src=engine/engineInput.js?111></script>
|
|
15
|
+
<script src=engine/engineAudio.js?111></script>
|
|
16
|
+
<script src=engine/engineTileLayer.js?111></script>
|
|
17
|
+
<script src=engine/engineParticles.js?111></script>
|
|
18
|
+
<script src=engine/engineMedals.js?111></script>
|
|
19
|
+
<script src=engine/engineWebGL.js?111></script>
|
|
20
|
+
<script src=engine/engine.js?111></script>
|
|
21
21
|
|
|
22
22
|
<!-- You can also include all engine scripts like this... -->
|
|
23
23
|
<!-- <script src=engine/engine.all.js></script> -->
|
|
24
24
|
|
|
25
25
|
<!-- Add your game scripts here -->
|
|
26
|
-
<script src=game.js?
|
|
26
|
+
<script src=game.js?111></script>
|
package/package.json
CHANGED
|
@@ -1,6 +1,6 @@
|
|
|
1
1
|
{
|
|
2
2
|
"name": "littlejsengine",
|
|
3
|
-
"version": "1.3.
|
|
3
|
+
"version": "1.3.8",
|
|
4
4
|
"description": "LittleJS - Tiny and Fast HTML5 Game Engine",
|
|
5
5
|
"main": "engine/engine.all.js",
|
|
6
6
|
"repository": {
|
|
@@ -21,5 +21,12 @@
|
|
|
21
21
|
"bugs": {
|
|
22
22
|
"url": "https://github.com/KilledByAPixel/LittleJS/issues"
|
|
23
23
|
},
|
|
24
|
-
"homepage": "https://github.com/KilledByAPixel/LittleJS"
|
|
24
|
+
"homepage": "https://github.com/KilledByAPixel/LittleJS",
|
|
25
|
+
"dependencies": {
|
|
26
|
+
"ect-bin": "^1.4.1",
|
|
27
|
+
"google-closure-compiler": "^20220803.0.0",
|
|
28
|
+
"roadroller": "^2.1.0",
|
|
29
|
+
"typescript": "^4.7.4",
|
|
30
|
+
"uglify-js": "^3.16.3"
|
|
31
|
+
}
|
|
25
32
|
}
|