littlejsengine 1.4.9 → 1.5.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/README.md +81 -0
- package/build.bat +4 -6
- package/engine/engine.all.js +27 -12
- package/engine/engine.all.min.js +1 -1
- package/engine/engine.all.module.js +27 -12
- package/engine/engine.all.module.min.js +1 -1
- package/engine/engine.all.release.js +23 -8
- package/engine/engine.js +1 -1
- package/engine/engineAudio.js +14 -1
- package/engine/engineBuild.bat +8 -8
- package/engine/engineDebug.js +4 -4
- package/engine/engineDraw.js +1 -1
- package/engine/engineInput.js +1 -1
- package/engine/engineObject.js +5 -3
- package/engine/engineParticles.js +1 -1
- package/engine/index.d.ts +1588 -1673
- package/examples/breakout/index.html +1 -1
- package/examples/empty/index.html +1 -4
- package/examples/module/game.js +1 -4
- package/examples/module/index.html +1 -1
- package/examples/particles/index.html +1 -1
- package/examples/platformer/index.html +1 -1
- package/examples/puzzle/index.html +1 -1
- package/examples/stress/index.html +1 -1
- package/examples/typescript/build.bat +14 -0
- package/examples/typescript/game.js +89 -0
- package/examples/typescript/game.ts +117 -0
- package/examples/typescript/index.html +9 -0
- package/examples/typescript/tiles.png +0 -0
- package/examples/typescript/tsconfig.json +8 -0
- package/index.html +1 -1
- package/package.json +1 -1
|
@@ -1,7 +1,4 @@
|
|
|
1
|
-
<html><head
|
|
2
|
-
<meta name=viewport content=width=device-width,height=device-height,initial-scale=1,maximum-scale=1>
|
|
3
|
-
<meta name=apple-mobile-web-app-capable content=yes>
|
|
4
|
-
<meta name=mobile-web-app-capable content=yes>
|
|
1
|
+
<html><head>
|
|
5
2
|
<link rel=icon type=image/png href=../../favicon.png>
|
|
6
3
|
</head><body>
|
|
7
4
|
|
package/examples/module/game.js
CHANGED
|
@@ -6,10 +6,7 @@
|
|
|
6
6
|
|
|
7
7
|
// import module
|
|
8
8
|
import * as LittleJS from '../../engine/engine.all.module.js';
|
|
9
|
-
const Vector2 = LittleJS
|
|
10
|
-
const Color = LittleJS.Color;
|
|
11
|
-
const Timer = LittleJS.Timer;
|
|
12
|
-
const vec2 = LittleJS.vec2;
|
|
9
|
+
const {Vector2, Color, Timer, vec2} = LittleJS;
|
|
13
10
|
|
|
14
11
|
// sound effects
|
|
15
12
|
const sound_click = new LittleJS.Sound([1,.5]);
|
|
@@ -0,0 +1,14 @@
|
|
|
1
|
+
rem TypeScript build script for LittleJS by Frank Force
|
|
2
|
+
|
|
3
|
+
set BUILD_FOLDER=build
|
|
4
|
+
|
|
5
|
+
call npx tsc
|
|
6
|
+
if %ERRORLEVEL% NEQ 0 (
|
|
7
|
+
pause
|
|
8
|
+
exit /b %ERRORLEVEL%
|
|
9
|
+
)
|
|
10
|
+
|
|
11
|
+
rem copy output js file and remove build folder
|
|
12
|
+
|
|
13
|
+
copy %BUILD_FOLDER%\examples\typescript\game.js game.js
|
|
14
|
+
rmdir /s /q %BUILD_FOLDER%
|
|
@@ -0,0 +1,89 @@
|
|
|
1
|
+
/*
|
|
2
|
+
LittleJS Hello World Starter Game
|
|
3
|
+
*/
|
|
4
|
+
'use strict';
|
|
5
|
+
// import module
|
|
6
|
+
import * as LittleJS from '../../engine/engine.all.module.js';
|
|
7
|
+
const { Vector2, Color, Timer, vec2 } = LittleJS;
|
|
8
|
+
// sound effects
|
|
9
|
+
const sound_click = new LittleJS.Sound([1, .5]);
|
|
10
|
+
// medals
|
|
11
|
+
const medal_example = new LittleJS.Medal(0, 'Example Medal', 'Welcome to LittleJS!');
|
|
12
|
+
LittleJS.medalsInit('Hello World');
|
|
13
|
+
// game variables
|
|
14
|
+
let particleEmiter;
|
|
15
|
+
///////////////////////////////////////////////////////////////////////////////
|
|
16
|
+
function gameInit() {
|
|
17
|
+
// create tile collision and visible tile layer
|
|
18
|
+
LittleJS.initTileCollision(vec2(32, 16));
|
|
19
|
+
const pos = vec2();
|
|
20
|
+
const tileLayer = new LittleJS.TileLayer(pos, LittleJS.tileCollisionSize);
|
|
21
|
+
// get level data from the tiles image
|
|
22
|
+
const imageLevelDataRow = 1;
|
|
23
|
+
const mainContext = LittleJS.mainContext;
|
|
24
|
+
mainContext.drawImage(LittleJS.tileImage, 0, 0);
|
|
25
|
+
for (pos.x = LittleJS.tileCollisionSize.x; pos.x--;)
|
|
26
|
+
for (pos.y = LittleJS.tileCollisionSize.y; pos.y--;) {
|
|
27
|
+
const imageData = mainContext.getImageData(pos.x, 16 * (imageLevelDataRow + 1) - pos.y - 1, 1, 1).data;
|
|
28
|
+
if (imageData[0]) {
|
|
29
|
+
const tileIndex = 1;
|
|
30
|
+
const direction = LittleJS.randInt(4);
|
|
31
|
+
const mirror = LittleJS.randInt(2) ? true : false;
|
|
32
|
+
const color = LittleJS.randColor();
|
|
33
|
+
const data = new LittleJS.TileLayerData(tileIndex, direction, mirror, color);
|
|
34
|
+
tileLayer.setData(pos, data);
|
|
35
|
+
LittleJS.setTileCollisionData(pos, 1);
|
|
36
|
+
}
|
|
37
|
+
}
|
|
38
|
+
tileLayer.redraw();
|
|
39
|
+
// move camera to center of collision
|
|
40
|
+
LittleJS.setCameraPos(LittleJS.tileCollisionSize.scale(.5));
|
|
41
|
+
// enable gravity
|
|
42
|
+
LittleJS.setGravity(-.01);
|
|
43
|
+
// create particle emitter
|
|
44
|
+
const center = LittleJS.tileCollisionSize.scale(.5).add(vec2(0, 9));
|
|
45
|
+
particleEmiter = new LittleJS.ParticleEmitter(center, 0, // emitPos, emitAngle
|
|
46
|
+
1, 0, 500, Math.PI, // emitSize, emitTime, emitRate, emiteCone
|
|
47
|
+
0, vec2(16), // tileIndex, tileSize
|
|
48
|
+
new Color(1, 1, 1), new Color(0, 0, 0), // colorStartA, colorStartB
|
|
49
|
+
new Color(1, 1, 1, 0), new Color(0, 0, 0, 0), // colorEndA, colorEndB
|
|
50
|
+
2, .2, .2, .1, .05, // time, sizeStart, sizeEnd, speed, angleSpeed
|
|
51
|
+
.99, 1, 1, Math.PI, // damping, angleDamping, gravityScale, cone
|
|
52
|
+
.05, .5, true, true // fadeRate, randomness, collide, additive
|
|
53
|
+
);
|
|
54
|
+
particleEmiter.elasticity = .3; // bounce when it collides
|
|
55
|
+
particleEmiter.trailScale = 2; // stretch in direction of motion
|
|
56
|
+
}
|
|
57
|
+
///////////////////////////////////////////////////////////////////////////////
|
|
58
|
+
function gameUpdate() {
|
|
59
|
+
if (LittleJS.mouseWasPressed(0)) {
|
|
60
|
+
// play sound when mouse is pressed
|
|
61
|
+
sound_click.play(LittleJS.mousePos);
|
|
62
|
+
// change particle color and set to fade out
|
|
63
|
+
particleEmiter.colorStartA = new Color;
|
|
64
|
+
particleEmiter.colorStartB = LittleJS.randColor();
|
|
65
|
+
particleEmiter.colorEndA = particleEmiter.colorStartA.scale(1, 0);
|
|
66
|
+
particleEmiter.colorEndB = particleEmiter.colorStartB.scale(1, 0);
|
|
67
|
+
// unlock medals
|
|
68
|
+
medal_example.unlock();
|
|
69
|
+
}
|
|
70
|
+
// move particles to mouse location if on screen
|
|
71
|
+
if (LittleJS.mousePosScreen.x)
|
|
72
|
+
particleEmiter.pos = LittleJS.mousePos;
|
|
73
|
+
}
|
|
74
|
+
///////////////////////////////////////////////////////////////////////////////
|
|
75
|
+
function gameUpdatePost() {
|
|
76
|
+
}
|
|
77
|
+
///////////////////////////////////////////////////////////////////////////////
|
|
78
|
+
function gameRender() {
|
|
79
|
+
// draw a grey square in the background without using webgl
|
|
80
|
+
LittleJS.drawRect(LittleJS.cameraPos, LittleJS.tileCollisionSize.add(vec2(5)), new Color(.2, .2, .2), 0, false);
|
|
81
|
+
}
|
|
82
|
+
///////////////////////////////////////////////////////////////////////////////
|
|
83
|
+
function gameRenderPost() {
|
|
84
|
+
// draw to overlay canvas for hud rendering
|
|
85
|
+
LittleJS.drawTextScreen('LittleJS with TypeScript', vec2(LittleJS.mainCanvasSize.x / 2, 80), 80);
|
|
86
|
+
}
|
|
87
|
+
///////////////////////////////////////////////////////////////////////////////
|
|
88
|
+
// Startup LittleJS Engine
|
|
89
|
+
LittleJS.engineInit(gameInit, gameUpdate, gameUpdatePost, gameRender, gameRenderPost, 'tiles.png');
|
|
@@ -0,0 +1,117 @@
|
|
|
1
|
+
/*
|
|
2
|
+
LittleJS Hello World Starter Game
|
|
3
|
+
*/
|
|
4
|
+
|
|
5
|
+
'use strict';
|
|
6
|
+
|
|
7
|
+
// import module
|
|
8
|
+
import * as LittleJS from '../../engine/engine.all.module.js';
|
|
9
|
+
const {Vector2, Color, Timer, vec2} = LittleJS;
|
|
10
|
+
|
|
11
|
+
// sound effects
|
|
12
|
+
const sound_click = new LittleJS.Sound([1,.5]);
|
|
13
|
+
|
|
14
|
+
// medals
|
|
15
|
+
const medal_example = new LittleJS.Medal(0, 'Example Medal', 'Welcome to LittleJS!');
|
|
16
|
+
LittleJS.medalsInit('Hello World');
|
|
17
|
+
|
|
18
|
+
// game variables
|
|
19
|
+
let particleEmiter;
|
|
20
|
+
|
|
21
|
+
///////////////////////////////////////////////////////////////////////////////
|
|
22
|
+
function gameInit()
|
|
23
|
+
{
|
|
24
|
+
// create tile collision and visible tile layer
|
|
25
|
+
LittleJS.initTileCollision(vec2(32, 16));
|
|
26
|
+
const pos = vec2();
|
|
27
|
+
const tileLayer = new LittleJS.TileLayer(pos, LittleJS.tileCollisionSize);
|
|
28
|
+
|
|
29
|
+
// get level data from the tiles image
|
|
30
|
+
const imageLevelDataRow = 1;
|
|
31
|
+
const mainContext = LittleJS.mainContext;
|
|
32
|
+
mainContext.drawImage(LittleJS.tileImage, 0, 0);
|
|
33
|
+
for (pos.x = LittleJS.tileCollisionSize.x; pos.x--;)
|
|
34
|
+
for (pos.y = LittleJS.tileCollisionSize.y; pos.y--;)
|
|
35
|
+
{
|
|
36
|
+
const imageData = mainContext.getImageData(pos.x, 16*(imageLevelDataRow+1)-pos.y-1, 1, 1).data;
|
|
37
|
+
if (imageData[0])
|
|
38
|
+
{
|
|
39
|
+
const tileIndex = 1;
|
|
40
|
+
const direction = LittleJS.randInt(4)
|
|
41
|
+
const mirror = LittleJS.randInt(2) ? true : false;
|
|
42
|
+
const color = LittleJS.randColor();
|
|
43
|
+
const data = new LittleJS.TileLayerData(tileIndex, direction, mirror, color);
|
|
44
|
+
tileLayer.setData(pos, data);
|
|
45
|
+
LittleJS.setTileCollisionData(pos, 1);
|
|
46
|
+
}
|
|
47
|
+
}
|
|
48
|
+
tileLayer.redraw();
|
|
49
|
+
|
|
50
|
+
// move camera to center of collision
|
|
51
|
+
LittleJS.setCameraPos(LittleJS.tileCollisionSize.scale(.5));
|
|
52
|
+
|
|
53
|
+
// enable gravity
|
|
54
|
+
LittleJS.setGravity(-.01);
|
|
55
|
+
|
|
56
|
+
// create particle emitter
|
|
57
|
+
const center = LittleJS.tileCollisionSize.scale(.5).add(vec2(0,9));
|
|
58
|
+
particleEmiter = new LittleJS.ParticleEmitter(
|
|
59
|
+
center, 0, // emitPos, emitAngle
|
|
60
|
+
1, 0, 500, Math.PI, // emitSize, emitTime, emitRate, emiteCone
|
|
61
|
+
0, vec2(16), // tileIndex, tileSize
|
|
62
|
+
new Color(1,1,1), new Color(0,0,0), // colorStartA, colorStartB
|
|
63
|
+
new Color(1,1,1,0), new Color(0,0,0,0), // colorEndA, colorEndB
|
|
64
|
+
2, .2, .2, .1, .05, // time, sizeStart, sizeEnd, speed, angleSpeed
|
|
65
|
+
.99, 1, 1, Math.PI, // damping, angleDamping, gravityScale, cone
|
|
66
|
+
.05, .5, true, true // fadeRate, randomness, collide, additive
|
|
67
|
+
);
|
|
68
|
+
particleEmiter.elasticity = .3; // bounce when it collides
|
|
69
|
+
particleEmiter.trailScale = 2; // stretch in direction of motion
|
|
70
|
+
}
|
|
71
|
+
|
|
72
|
+
///////////////////////////////////////////////////////////////////////////////
|
|
73
|
+
function gameUpdate()
|
|
74
|
+
{
|
|
75
|
+
if (LittleJS.mouseWasPressed(0))
|
|
76
|
+
{
|
|
77
|
+
// play sound when mouse is pressed
|
|
78
|
+
sound_click.play(LittleJS.mousePos);
|
|
79
|
+
|
|
80
|
+
// change particle color and set to fade out
|
|
81
|
+
particleEmiter.colorStartA = new Color;
|
|
82
|
+
particleEmiter.colorStartB = LittleJS.randColor();
|
|
83
|
+
particleEmiter.colorEndA = particleEmiter.colorStartA.scale(1,0);
|
|
84
|
+
particleEmiter.colorEndB = particleEmiter.colorStartB.scale(1,0);
|
|
85
|
+
|
|
86
|
+
// unlock medals
|
|
87
|
+
medal_example.unlock();
|
|
88
|
+
}
|
|
89
|
+
|
|
90
|
+
// move particles to mouse location if on screen
|
|
91
|
+
if (LittleJS.mousePosScreen.x)
|
|
92
|
+
particleEmiter.pos = LittleJS.mousePos;
|
|
93
|
+
}
|
|
94
|
+
|
|
95
|
+
///////////////////////////////////////////////////////////////////////////////
|
|
96
|
+
function gameUpdatePost()
|
|
97
|
+
{
|
|
98
|
+
|
|
99
|
+
}
|
|
100
|
+
|
|
101
|
+
///////////////////////////////////////////////////////////////////////////////
|
|
102
|
+
function gameRender()
|
|
103
|
+
{
|
|
104
|
+
// draw a grey square in the background without using webgl
|
|
105
|
+
LittleJS.drawRect(LittleJS.cameraPos, LittleJS.tileCollisionSize.add(vec2(5)), new Color(.2,.2,.2), 0, false);
|
|
106
|
+
}
|
|
107
|
+
|
|
108
|
+
///////////////////////////////////////////////////////////////////////////////
|
|
109
|
+
function gameRenderPost()
|
|
110
|
+
{
|
|
111
|
+
// draw to overlay canvas for hud rendering
|
|
112
|
+
LittleJS.drawTextScreen('LittleJS with TypeScript', vec2(LittleJS.mainCanvasSize.x/2, 80), 80);
|
|
113
|
+
}
|
|
114
|
+
|
|
115
|
+
///////////////////////////////////////////////////////////////////////////////
|
|
116
|
+
// Startup LittleJS Engine
|
|
117
|
+
LittleJS.engineInit(gameInit, gameUpdate, gameUpdatePost, gameRender, gameRenderPost, 'tiles.png');
|
|
@@ -0,0 +1,9 @@
|
|
|
1
|
+
<html><head>
|
|
2
|
+
<meta name=viewport content=width=device-width,height=device-height,initial-scale=1,maximum-scale=1>
|
|
3
|
+
<meta name=apple-mobile-web-app-capable content=yes>
|
|
4
|
+
<meta name=mobile-web-app-capable content=yes>
|
|
5
|
+
<link rel=icon type=image/png href=../../favicon.png>
|
|
6
|
+
</head><body>
|
|
7
|
+
|
|
8
|
+
<!-- Add your game scripts here -->
|
|
9
|
+
<script src=game.js?123 type=module></script>
|
|
Binary file
|
package/index.html
CHANGED