littlejsengine 1.9.2 → 1.9.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.
Files changed (37) hide show
  1. package/README.md +4 -2
  2. package/dist/littlejs.d.ts +31 -26
  3. package/dist/littlejs.esm.js +145 -122
  4. package/dist/littlejs.esm.min.js +1 -1
  5. package/dist/littlejs.js +145 -122
  6. package/dist/littlejs.min.js +1 -1
  7. package/dist/littlejs.release.js +140 -121
  8. package/examples/logo.png +0 -0
  9. package/examples/module/game.js +1 -1
  10. package/examples/platformer/data/{gameTileData.tmx → gameLevelData.tmx} +3 -3
  11. package/examples/platformer/game.js +31 -10
  12. package/examples/platformer/gameCharacter.js +7 -6
  13. package/examples/platformer/gameEffects.js +77 -68
  14. package/examples/platformer/gameLevel.js +33 -17
  15. package/examples/platformer/{gameTileData.js → gameLevelData.js} +3 -3
  16. package/examples/platformer/gameObjects.js +14 -14
  17. package/examples/platformer/index.html +1 -1
  18. package/examples/platformer/tiles.png +0 -0
  19. package/examples/screenshot.jpg +0 -0
  20. package/examples/stress/index.html +1 -1
  21. package/examples/typescript/game.js +1 -1
  22. package/examples/typescript/game.ts +1 -1
  23. package/package.json +1 -1
  24. package/reference.md +409 -0
  25. package/src/engine.js +47 -42
  26. package/src/engineAudio.js +19 -10
  27. package/src/engineDebug.js +5 -1
  28. package/src/engineDraw.js +19 -23
  29. package/src/engineInput.js +31 -17
  30. package/src/engineMedals.js +1 -1
  31. package/src/engineObject.js +2 -2
  32. package/src/engineParticles.js +11 -10
  33. package/src/engineSettings.js +3 -3
  34. package/src/engineTileLayer.js +2 -2
  35. package/src/engineUtilities.js +4 -4
  36. package/src/engineWebGL.js +1 -7
  37. /package/examples/platformer/data/{gameTileData.tsx → gameLevelData.tsx} +0 -0
package/README.md CHANGED
@@ -15,7 +15,7 @@
15
15
  ## 🚂 All aboard!
16
16
 
17
17
  LittleJS is a fast lightweight open source HTML5 game engine for modern web development.
18
- It's small footprint is packed with a comprehensive feature set including hybrid rendering, physics, particles, sound effects, music, and input handling.
18
+ Its small footprint is packed with a comprehensive feature set including hybrid rendering, physics, particles, sound effects, music, and input handling.
19
19
  The code is very clean and well documented with some fun examples to get you started. Choo-Choo!
20
20
 
21
21
  ### 🚀 Join the First Ever LittleJS Game Jam
@@ -24,7 +24,7 @@ The code is very clean and well documented with some fun examples to get you sta
24
24
 
25
25
  <div align="center">
26
26
 
27
- ## [Demo](https://killedbyapixel.github.io/LittleJS/examples/starter/) | [Docs](https://killedbyapixel.github.io/LittleJS/docs) | [Trailer](https://youtu.be/chuBzGjv7Ms) | [Discord](https://discord.gg/zb7hcGkyZe) | [Tutorial](https://github.com/KilledByAPixel/LittleJS/blob/main/examples/breakoutTutorial/README.md)
27
+ ## [Demo](https://killedbyapixel.github.io/LittleJS/examples/starter/) | [Docs](https://killedbyapixel.github.io/LittleJS/docs) | [Trailer](https://youtu.be/chuBzGjv7Ms) | [Discord](https://discord.gg/zb7hcGkyZe) | [Tutorial](https://github.com/KilledByAPixel/LittleJS/blob/main/examples/breakoutTutorial/README.md) | [Quick Reference](https://github.com/KilledByAPixel/LittleJS/blob/main/reference.md)
28
28
 
29
29
  </div>
30
30
 
@@ -80,6 +80,8 @@ To get started download the latest LittleJS package from GitHub or install via n
80
80
 
81
81
  Learn how to make a simple game from scratch with [The Breakout Tutorial.](https://github.com/KilledByAPixel/LittleJS/tree/main/examples/breakoutTutorial)
82
82
 
83
+ [LittleJS Engine Quick Reference Sheet](https://github.com/KilledByAPixel/LittleJS/blob/main/reference.md) - This cheat sheet can help you get started.
84
+
83
85
  [Watch this GitNation talk](https://youtu.be/_dXKU0WgAj8?si=ZDXLYAFDWp54hrGT) to hear more about LittleJS works and get some tips on how to use it.
84
86
 
85
87
  Join our vibrant community on [Discord](https://discord.gg/zb7hcGkyZe) to get help, share your projects, and collaborate with others!
@@ -1,6 +1,6 @@
1
1
  declare module "littlejs.esm" {
2
2
  /**
3
- * LittleJS - The Tiny JavaScript Game Engine That Can!
3
+ * LittleJS - The Tiny Fast JavaScript Game Engine
4
4
  * MIT License - Copyright 2021 Frank Force
5
5
  *
6
6
  * Engine Features
@@ -28,7 +28,7 @@ declare module "littlejs.esm" {
28
28
  * @default
29
29
  * @memberof Engine */
30
30
  export const engineVersion: string;
31
- /** Frames per second to update objects
31
+ /** Frames per second to update
32
32
  * @type {Number}
33
33
  * @default
34
34
  * @memberof Engine */
@@ -46,7 +46,7 @@ declare module "littlejs.esm" {
46
46
  * @type {Number}
47
47
  * @memberof Engine */
48
48
  export let frame: number;
49
- /** Current engine time since start in seconds, derived from frame
49
+ /** Current engine time since start in seconds
50
50
  * @type {Number}
51
51
  * @memberof Engine */
52
52
  export let time: number;
@@ -63,12 +63,12 @@ declare module "littlejs.esm" {
63
63
  * @param {Boolean} isPaused
64
64
  * @memberof Engine */
65
65
  export function setPaused(isPaused: boolean): void;
66
- /** Start up LittleJS engine with your callback functions
67
- * @param {Function} gameInit - Called once after the engine starts up, setup the game
68
- * @param {Function} gameUpdate - Called every frame at 60 frames per second, handle input and update the game state
69
- * @param {Function} gameUpdatePost - Called after physics and objects are updated, setup camera and prepare for render
70
- * @param {Function} gameRender - Called before objects are rendered, draw any background effects that appear behind objects
71
- * @param {Function} gameRenderPost - Called after objects are rendered, draw effects or hud that appear above all objects
66
+ /** Startup LittleJS engine with your callback functions
67
+ * @param {Function} gameInit - Called once after the engine starts up, setup the game
68
+ * @param {Function} gameUpdate - Called every frame at 60 frames per second, handle input and update the game state
69
+ * @param {Function} gameUpdatePost - Called after physics and objects are updated, setup camera and prepare for render
70
+ * @param {Function} gameRender - Called before objects are rendered, draw any background effects that appear behind objects
71
+ * @param {Function} gameRenderPost - Called after objects are rendered, draw effects or hud that appear above all objects
72
72
  * @param {Array} [imageSources=['tiles.png']] - Image to load
73
73
  * @memberof Engine */
74
74
  export function engineInit(gameInit: Function, gameUpdate: Function, gameUpdatePost: Function, gameRender: Function, gameRenderPost: Function, imageSources?: any[]): void;
@@ -109,7 +109,7 @@ declare module "littlejs.esm" {
109
109
  * @default
110
110
  * @memberof Debug */
111
111
  export let showWatermark: boolean;
112
- /** Asserts if the experssion is false, does not do anything in release builds
112
+ /** Asserts if the expression is false, does not do anything in release builds
113
113
  * @param {Boolean} assert
114
114
  * @param {Object} [output]
115
115
  * @memberof Debug */
@@ -229,7 +229,7 @@ declare module "littlejs.esm" {
229
229
  * @default
230
230
  * @memberof Settings */
231
231
  export let enablePhysicsSolver: boolean;
232
- /** Default object mass for collison calcuations (how heavy objects are)
232
+ /** Default object mass for collision calcuations (how heavy objects are)
233
233
  * @type {Number}
234
234
  * @default
235
235
  * @memberof Settings */
@@ -306,7 +306,7 @@ declare module "littlejs.esm" {
306
306
  * @default
307
307
  * @memberof Settings */
308
308
  export let touchGamepadAnalog: boolean;
309
- /** Size of virutal gamepad for touch devices in pixels
309
+ /** Size of virtual gamepad for touch devices in pixels
310
310
  * @type {Number}
311
311
  * @default
312
312
  * @memberof Settings */
@@ -548,7 +548,7 @@ declare module "littlejs.esm" {
548
548
  * @return {Number}
549
549
  * @memberof Utilities */
550
550
  export function max(valueA: number, valueB: number): number;
551
- /** Returns the sign of value passed in (also returns 1 if 0)
551
+ /** Returns the sign of value passed in
552
552
  * @param {Number} value
553
553
  * @return {Number}
554
554
  * @memberof Utilities */
@@ -580,7 +580,7 @@ declare module "littlejs.esm" {
580
580
  * @returns {Number}
581
581
  * @memberof Utilities */
582
582
  export function distanceWrap(valueA: number, valueB: number, wrapSize?: number): number;
583
- /** Linearly interpolates between values passed in with wrappping
583
+ /** Linearly interpolates between values passed in with wrapping
584
584
  * @param {Number} percent
585
585
  * @param {Number} valueA
586
586
  * @param {Number} valueB
@@ -594,7 +594,7 @@ declare module "littlejs.esm" {
594
594
  * @returns {Number}
595
595
  * @memberof Utilities */
596
596
  export function distanceAngle(angleA: number, angleB: number): number;
597
- /** Linearly interpolates between the angles passed in with wrappping
597
+ /** Linearly interpolates between the angles passed in with wrapping
598
598
  * @param {Number} percent
599
599
  * @param {Number} angleA
600
600
  * @param {Number} angleB
@@ -882,7 +882,7 @@ declare module "littlejs.esm" {
882
882
  setHSLA(h?: number, s?: number, l?: number, a?: number): Color;
883
883
  /** Returns this color expressed in hsla format
884
884
  * @return {Array} */
885
- getHSLA(): any[];
885
+ HSLA(): any[];
886
886
  /** Returns a new color that has each component randomly adjusted
887
887
  * @param {Number} [amount]
888
888
  * @param {Number} [alphaAmount]
@@ -1011,11 +1011,16 @@ declare module "littlejs.esm" {
1011
1011
  size: Vector2;
1012
1012
  /** @property {Number} - Texture index to use */
1013
1013
  textureIndex: number;
1014
- /** Returns an offset copy of this tile, useful for animation
1014
+ /** Returns a copy of this tile offset by a vector
1015
1015
  * @param {Vector2} offset - Offset to apply in pixels
1016
1016
  * @return {TileInfo}
1017
1017
  */
1018
1018
  offset(offset: Vector2): TileInfo;
1019
+ /** Returns a copy of this tile offset by a number of animation frames
1020
+ * @param {Number} frame - Offset to apply in animation frames
1021
+ * @return {TileInfo}
1022
+ */
1023
+ frame(frame: number): TileInfo;
1019
1024
  /** Returns the texture info for this tile
1020
1025
  * @return {TextureInfo}
1021
1026
  */
@@ -1378,7 +1383,7 @@ declare module "littlejs.esm" {
1378
1383
  * @namespace Audio
1379
1384
  */
1380
1385
  /**
1381
- * Sound Object - Stores a zzfx sound for later use and can be played positionally
1386
+ * Sound Object - Stores a sound for later use and can be played positionally
1382
1387
  *
1383
1388
  * <a href=https://killedbyapixel.github.io/ZzFX/>Create sounds using the ZzFX Sound Designer.</a>
1384
1389
  * @example
@@ -1392,7 +1397,7 @@ declare module "littlejs.esm" {
1392
1397
  /** Create a sound object and cache the zzfx samples for later use
1393
1398
  * @param {Array} zzfxSound - Array of zzfx parameters, ex. [.5,.5]
1394
1399
  * @param {Number} [range=soundDefaultRange] - World space max range of sound, will not play if camera is farther away
1395
- * @param {Number} [taper=soundDefaultTaper] - At what percentage of range should it start tapering off
1400
+ * @param {Number} [taper=soundDefaultTaper] - At what percentage of range should it start tapering
1396
1401
  */
1397
1402
  constructor(zzfxSound: any[], range?: number, taper?: number);
1398
1403
  /** @property {Number} - World space max range of sound, will not play if camera is farther away */
@@ -1473,7 +1478,7 @@ declare module "littlejs.esm" {
1473
1478
  * 1, 0, 9, 1 // channel notes
1474
1479
  * ],
1475
1480
  * [ // channel 1
1476
- * 0, 1, // instrument 1, right speaker
1481
+ * 0, 1, // instrument 0, right speaker
1477
1482
  * 0, 12, 17, -1 // channel notes
1478
1483
  * ]
1479
1484
  * ],
@@ -1493,18 +1498,18 @@ declare module "littlejs.esm" {
1493
1498
  sampleChannels: any[];
1494
1499
  /** Play the music
1495
1500
  * @param {Number} [volume=1] - How much to scale volume by
1496
- * @param {Boolean} [loop=1] - True if the music should loop
1501
+ * @param {Boolean} [loop] - True if the music should loop
1497
1502
  * @return {AudioBufferSourceNode} - The audio source node
1498
1503
  */
1499
1504
  playMusic(volume?: number, loop?: boolean): AudioBufferSourceNode;
1500
1505
  }
1501
1506
  /** Play an mp3, ogg, or wav audio from a local file or url
1502
- * @param {String} url - Location of sound file to play
1507
+ * @param {String} filename - Location of sound file to play
1503
1508
  * @param {Number} [volume] - How much to scale volume by
1504
1509
  * @param {Boolean} [loop] - True if the music should loop
1505
1510
  * @return {HTMLAudioElement} - The audio element for this sound
1506
1511
  * @memberof Audio */
1507
- export function playAudioFile(url: string, volume?: number, loop?: boolean): HTMLAudioElement;
1512
+ export function playAudioFile(filename: string, volume?: number, loop?: boolean): HTMLAudioElement;
1508
1513
  /** Speak text with passed in settings
1509
1514
  * @param {String} text - The text to speak
1510
1515
  * @param {String} [language] - The language/accent to use (examples: en, it, ru, ja, zh)
@@ -1553,7 +1558,7 @@ declare module "littlejs.esm" {
1553
1558
  * - Automatically adds self to object list
1554
1559
  * - Will be updated and rendered each frame
1555
1560
  * - Renders as a sprite from a tilesheet by default
1556
- * - Can have color and addtive color applied
1561
+ * - Can have color and additive color applied
1557
1562
  * - 2D Physics and collision system
1558
1563
  * - Sorted by renderOrder
1559
1564
  * - Objects can have children attached
@@ -1687,7 +1692,7 @@ declare module "littlejs.esm" {
1687
1692
  /**
1688
1693
  * LittleJS Tile Layer System
1689
1694
  * - Caches arrays of tiles to off screen canvas for fast rendering
1690
- * - Unlimted numbers of layers, allocates canvases as needed
1695
+ * - Unlimited numbers of layers, allocates canvases as needed
1691
1696
  * - Interfaces with EngineObject for collision
1692
1697
  * - Collision layer is separate from visible layers
1693
1698
  * - It is recommended to have a visible layer that matches the collision
@@ -1719,7 +1724,7 @@ declare module "littlejs.esm" {
1719
1724
  export function getTileCollisionData(pos: Vector2): number;
1720
1725
  /** Check if collision with another object should occur
1721
1726
  * @param {Vector2} pos
1722
- * @param {Vector2} [size=(1,1)]
1727
+ * @param {Vector2} [size=(0,0)]
1723
1728
  * @param {EngineObject} [object]
1724
1729
  * @return {Boolean}
1725
1730
  * @memberof TileCollision */