littlejsengine 1.2.9 → 1.3.5
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 +1 -1
- package/build.bat +6 -6
- package/buildSetup.bat +10 -0
- package/engine/engine.all.js +78 -39
- package/engine/engine.all.min.js +1 -1
- package/engine/engine.all.release.js +77 -38
- package/engine/engine.js +1 -1
- package/engine/engineAudio.js +5 -7
- package/engine/engineBuild.bat +3 -4
- package/engine/engineDebug.js +1 -1
- package/engine/engineDraw.js +5 -4
- package/engine/engineInput.js +5 -1
- package/engine/engineMedals.js +1 -1
- package/engine/engineObject.js +22 -19
- package/engine/engineParticles.js +1 -1
- package/engine/engineSettings.js +5 -0
- package/engine/engineUtilities.js +31 -3
- package/engine/engineWebGL.js +1 -1
- package/engine/index.d.ts +18 -6
- 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 +1 -8
package/engine/index.d.ts
CHANGED
|
@@ -240,7 +240,7 @@ declare const enableAsserts: 1;
|
|
|
240
240
|
* @default
|
|
241
241
|
* @memberof Debug */
|
|
242
242
|
declare const debugPointSize: 0.5;
|
|
243
|
-
/** True if watermark with FPS should be down
|
|
243
|
+
/** True if watermark with FPS should be down, false in release builds
|
|
244
244
|
* @default
|
|
245
245
|
* @memberof Debug */
|
|
246
246
|
declare let showWatermark: number;
|
|
@@ -643,6 +643,9 @@ declare class Color {
|
|
|
643
643
|
/** Returns this color expressed as a hex code
|
|
644
644
|
* @return {String} */
|
|
645
645
|
hex(): string;
|
|
646
|
+
/** Returns this color expressed in hsla format
|
|
647
|
+
* @return {Array} */
|
|
648
|
+
getHSLA(): any[];
|
|
646
649
|
/** Set this color from a hex code
|
|
647
650
|
* @param {String} hex - html hex code
|
|
648
651
|
* @return {Color} */
|
|
@@ -719,6 +722,10 @@ declare let tileFixBleedScale: number;
|
|
|
719
722
|
* @default
|
|
720
723
|
* @memberof Settings */
|
|
721
724
|
declare let objectDefaultSize: Vector2;
|
|
725
|
+
/** Enable physics solver for collisions between objects
|
|
726
|
+
* @default
|
|
727
|
+
* @memberof Settings */
|
|
728
|
+
declare let enablePhysicsSolver: number;
|
|
722
729
|
/** Default object mass for collison calcuations (how heavy objects are)
|
|
723
730
|
* @default
|
|
724
731
|
* @memberof Settings */
|
|
@@ -867,7 +874,7 @@ declare class EngineObject {
|
|
|
867
874
|
/** Create an engine object and adds it to the list of objects
|
|
868
875
|
* @param {Vector2} [position=new Vector2()] - World space position of the object
|
|
869
876
|
* @param {Vector2} [size=objectDefaultSize] - World space size of the object
|
|
870
|
-
* @param {Number} [tileIndex=-1] - Tile to use to render object
|
|
877
|
+
* @param {Number} [tileIndex=-1] - Tile to use to render object (-1 is untextured)
|
|
871
878
|
* @param {Vector2} [tileSize=tileSizeDefault] - Size of tile in source pixels
|
|
872
879
|
* @param {Number} [angle=0] - Angle the object is rotated by
|
|
873
880
|
* @param {Color} [color] - Color to apply to tile when rendered
|
|
@@ -878,7 +885,7 @@ declare class EngineObject {
|
|
|
878
885
|
pos: Vector2;
|
|
879
886
|
/** @property {Vector2} - World space width and height of the object */
|
|
880
887
|
size: Vector2;
|
|
881
|
-
/** @property {Number} - Tile to use to render object
|
|
888
|
+
/** @property {Number} - Tile to use to render object (-1 is untextured) */
|
|
882
889
|
tileIndex: number;
|
|
883
890
|
/** @property {Vector2} - Size of tile in source pixels */
|
|
884
891
|
tileSize: Vector2;
|
|
@@ -886,7 +893,7 @@ declare class EngineObject {
|
|
|
886
893
|
angle: number;
|
|
887
894
|
/** @property {Color} - Color to apply when rendered */
|
|
888
895
|
color: Color;
|
|
889
|
-
/** @property {Number} [mass=objectDefaultMass] - How heavy the object is */
|
|
896
|
+
/** @property {Number} [mass=objectDefaultMass] - How heavy the object is, static if 0 */
|
|
890
897
|
mass: number;
|
|
891
898
|
/** @property {Number} [damping=objectDefaultDamping] - How much to slow down velocity each frame (0-1) */
|
|
892
899
|
damping: number;
|
|
@@ -1092,6 +1099,9 @@ declare let mouseWheel: number;
|
|
|
1092
1099
|
/** Returns true if user is using gamepad (has more recently pressed a gamepad button)
|
|
1093
1100
|
* @memberof Input */
|
|
1094
1101
|
declare let isUsingGamepad: number;
|
|
1102
|
+
/** Prevents input continuing to the default browser handling (false by default)
|
|
1103
|
+
* @memberof Input */
|
|
1104
|
+
declare let preventDefaultInput: number;
|
|
1095
1105
|
/** Returns true if gamepad button is down
|
|
1096
1106
|
* @param {Number} button
|
|
1097
1107
|
* @param {Number} [gamepad=0]
|
|
@@ -1428,7 +1438,7 @@ declare class ParticleEmitter extends EngineObject {
|
|
|
1428
1438
|
randomColorLinear: boolean;
|
|
1429
1439
|
/** @property {Number} - How long particles live */
|
|
1430
1440
|
particleTime: number;
|
|
1431
|
-
/** @property {Number} -
|
|
1441
|
+
/** @property {Number} - How big are particles at start */
|
|
1432
1442
|
sizeStart: number;
|
|
1433
1443
|
/** @property {Number} - How big are particles at end */
|
|
1434
1444
|
sizeEnd: number;
|
|
@@ -1442,6 +1452,8 @@ declare class ParticleEmitter extends EngineObject {
|
|
|
1442
1452
|
fadeRate: number;
|
|
1443
1453
|
/** @property {Number} - Apply extra randomness percent */
|
|
1444
1454
|
randomness: number;
|
|
1455
|
+
/** @property {Number} - Do particles collide against tiles */
|
|
1456
|
+
collideTiles: boolean;
|
|
1445
1457
|
/** @property {Number} - Should particles use addtive blend */
|
|
1446
1458
|
additive: boolean;
|
|
1447
1459
|
/** @property {Number} - If set the partile is drawn as a trail, stretched in the drection of velocity */
|
|
@@ -1615,7 +1627,7 @@ declare const gl_VERTEX_BYTE_STRIDE: number;
|
|
|
1615
1627
|
/** Name of engine */
|
|
1616
1628
|
declare const engineName: "LittleJS";
|
|
1617
1629
|
/** Version of engine */
|
|
1618
|
-
declare const engineVersion: "1.
|
|
1630
|
+
declare const engineVersion: "1.3.5";
|
|
1619
1631
|
/** Frames per second to update objects
|
|
1620
1632
|
* @default */
|
|
1621
1633
|
declare const frameRate: 60;
|
|
@@ -5,6 +5,6 @@
|
|
|
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=game.js?
|
|
10
|
-
<script src=gameObjects.js?
|
|
8
|
+
<script src=../../engine/engine.all.js?109></script>
|
|
9
|
+
<script src=game.js?109></script>
|
|
10
|
+
<script src=gameObjects.js?109></script>
|
|
@@ -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?109></script>
|
|
19
|
+
<script src=../../engine/engineUtilities.js?109></script>
|
|
20
|
+
<script src=../../engine/engineSettings.js?109></script>
|
|
21
|
+
<script src=../../engine/engineObject.js?109></script>
|
|
22
|
+
<script src=../../engine/engineDraw.js?109></script>
|
|
23
|
+
<script src=../../engine/engineInput.js?109></script>
|
|
24
|
+
<script src=../../engine/engineAudio.js?109></script>
|
|
25
|
+
<script src=../../engine/engineTileLayer.js?109></script>
|
|
26
|
+
<script src=../../engine/engineParticles.js?109></script>
|
|
27
|
+
<script src=../../engine/engineMedals.js?109></script>
|
|
28
|
+
<script src=../../engine/engineWebGL.js?109></script>
|
|
29
|
+
<script src=../../engine/engine.js?109></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.hex();
|
|
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.hex();
|
|
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?109></script>
|
|
9
|
+
<script src=gameObjects.js?109></script>
|
|
10
|
+
<script src=gamePlayer.js?109></script>
|
|
11
|
+
<script src=gameEffects.js?109></script>
|
|
12
|
+
<script src=gameLevel.js?109></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?109></script>
|
|
10
|
+
<script src=engine/engineUtilities.js?109></script>
|
|
11
|
+
<script src=engine/engineSettings.js?109></script>
|
|
12
|
+
<script src=engine/engineObject.js?109></script>
|
|
13
|
+
<script src=engine/engineDraw.js?109></script>
|
|
14
|
+
<script src=engine/engineInput.js?109></script>
|
|
15
|
+
<script src=engine/engineAudio.js?109></script>
|
|
16
|
+
<script src=engine/engineTileLayer.js?109></script>
|
|
17
|
+
<script src=engine/engineParticles.js?109></script>
|
|
18
|
+
<script src=engine/engineMedals.js?109></script>
|
|
19
|
+
<script src=engine/engineWebGL.js?109></script>
|
|
20
|
+
<script src=engine/engine.js?109></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?109></script>
|
package/package.json
CHANGED
|
@@ -1,19 +1,12 @@
|
|
|
1
1
|
{
|
|
2
2
|
"name": "littlejsengine",
|
|
3
|
-
"version": "1.
|
|
3
|
+
"version": "1.3.5",
|
|
4
4
|
"description": "LittleJS - Tiny and Fast HTML5 Game Engine",
|
|
5
5
|
"main": "engine/engine.all.js",
|
|
6
6
|
"repository": {
|
|
7
7
|
"type": "git",
|
|
8
8
|
"url": "git+https://github.com/KilledByAPixel/LittleJS.git"
|
|
9
9
|
},
|
|
10
|
-
"dependencies": {
|
|
11
|
-
"google-closure-compiler": "^20220502.0.0",
|
|
12
|
-
"uglify-js": "^3.15.5",
|
|
13
|
-
"roadroller": "^2.1.0",
|
|
14
|
-
"ect-bin": "^1.4.1",
|
|
15
|
-
"typescript": "^4.7.2"
|
|
16
|
-
},
|
|
17
10
|
"keywords": [
|
|
18
11
|
"HTML5",
|
|
19
12
|
"JavaScript",
|