littlejsengine 1.17.1 → 1.17.10

package/dist/littlejs.d.ts

@@ -27,6 +27,10 @@ declare module "littlejsengine" {
      * - Function called when a sound ends
      */
     export type AudioEndedCallback = (source: AudioBufferSourceNode) => any;
+    /**
+     * - Function to handle a tile collision test
+     */
+    export type TileCollisionCallback = (tileData: number, pos: Vector2) => any;
     /**
      * - Function that processes a medal
      */
@@ -34,7 +38,11 @@ declare module "littlejsengine" {
     /**
      * - Function that processes a particle
      */
-    export type ParticleCallbackFunction = (particle: Particle) => any;
+    export type ParticleCallback = (particle: Particle) => any;
+    /**
+     * - Collide callback for particles
+     */
+    export type ParticleCollideCallback = (particle: Particle, tileData: number, pos: Vector2) => any;
     /**
      * LittleJS - The Tiny Fast JavaScript Game Engine
      * MIT License - Copyright 2021 Frank Force
@@ -123,11 +131,11 @@ declare module "littlejsengine" {
      *  @example
      *  // Basic engine startup
      *  engineInit(
-     *    () => { LOG('Game initialized!'); },  // gameInit
-     *    () => { updateGameLogic(); },         // gameUpdate
-     *    () => { updateUI(); },                // gameUpdatePost
-     *    () => { drawBackground(); },          // gameRender
-     *    () => { drawHUD(); },                 // gameRenderPost
+     *    ()=> { LOG('Game initialized!'); },  // gameInit
+     *    ()=> { updateGameLogic(); },         // gameUpdate
+     *    ()=> { updateUI(); },                // gameUpdatePost
+     *    ()=> { drawBackground(); },          // gameRender
+     *    ()=> { drawHUD(); },                 // gameRenderPost
      *    ['tiles.png', 'tilesLevel.png']       // images to load
      *  );
      *  @memberof Engine */
@@ -137,8 +145,11 @@ declare module "littlejsengine" {
      *  @memberof Engine */
     export function engineObjectsUpdate(): void;
     /** Destroy and remove all objects
+     *  - This can be used to clear out all objects when restarting a level
+     *  - Objects can override their destroy function to do cleanup or stick around
+     *  @param {boolean} [immediate] - should attached effects be allowed to die off?
      *  @memberof Engine */
-    export function engineObjectsDestroy(): void;
+    export function engineObjectsDestroy(immediate?: boolean): void;
     /** Collects all object within a given area
      *  @param {Vector2} [pos] - Center of test area, or undefined for all objects
      *  @param {Vector2|number} [size] - Radius of circle if float, rectangle size if Vector2
@@ -203,13 +214,13 @@ declare module "littlejsengine" {
     /** Asserts if the expression is false, does nothing in release builds
      *  Halts execution if the assert fails and throws an error
      *  @param {boolean} assert
-     *  @param {...Object} [output] - error message output
+     *  @param {...Object} output - error message output
      *  @memberof Debug */
-    export function ASSERT(assert: boolean, ...output?: any[]): void;
+    export function ASSERT(assert: boolean, ...output: any[]): void;
     /** Log to console if debug is enabled, does nothing in release builds
-     *  @param {...Object} [output] - message output
+     *  @param {...Object} output - message output
      *  @memberof Debug */
-    export function LOG(...output?: any[]): void;
+    export function LOG(...output: any[]): void;
     /** Draw a debug rectangle in world space
      *  @param {Vector2} pos
      *  @param {Vector2} [size=vec2(0)]
@@ -734,22 +745,22 @@ declare module "littlejsengine" {
      *  @memberof Math */
     export const PI: number;
     /** Returns absolute value of value passed in
-     *  @param {number} value
+     *  @param {number} x
      *  @return {number}
      *  @memberof Math */
     export const abs: (x: number) => number;
     /** Returns floored value of value passed in
-     *  @param {number} value
+     *  @param {number} x
      *  @return {number}
      *  @memberof Math */
     export const floor: (x: number) => number;
     /** Returns ceiled value of value passed in
-     *  @param {number} value
+     *  @param {number} x
      *  @return {number}
      *  @memberof Math */
     export const ceil: (x: number) => number;
     /** Returns rounded value passed in
-     *  @param {number} value
+     *  @param {number} x
      *  @return {number}
      *  @memberof Math */
     export const round: (x: number) => number;
@@ -764,7 +775,7 @@ declare module "littlejsengine" {
      *  @memberof Math */
     export const max: (...values: number[]) => number;
     /** Returns the sign of value passed in
-     *  @param {number} value
+     *  @param {number} x
      *  @return {number}
      *  @memberof Math */
     export const sign: (x: number) => number;
@@ -774,22 +785,22 @@ declare module "littlejsengine" {
      *  @memberof Math */
     export const hypot: (...values: number[]) => number;
     /** Returns log2 of value passed in
-     *  @param {number} value
+     *  @param {number} x
      *  @return {number}
      *  @memberof Math */
     export const log2: (x: number) => number;
     /** Returns sin of value passed in
-     *  @param {number} value
+     *  @param {number} x
      *  @return {number}
      *  @memberof Math */
     export const sin: (x: number) => number;
     /** Returns cos of value passed in
-     *  @param {number} value
+     *  @param {number} x
      *  @return {number}
      *  @memberof Math */
     export const cos: (x: number) => number;
     /** Returns tan of value passed in
-     *  @param {number} value
+     *  @param {number} x
      *  @return {number}
      *  @memberof Math */
     export const tan: (x: number) => number;
@@ -889,12 +900,6 @@ declare module "littlejsengine" {
      *  @return {number}            - Value waving between 0 and amplitude
      *  @memberof Math */
     export function wave(frequency?: number, amplitude?: number, t?: number, offset?: number): number;
-    /**
-     * LittleJS Utility Classes and Functions
-     * - General purpose utilities
-     * - Timer - tracks time automatically
-     * @namespace Utilities
-     */
     /** Formats seconds to mm:ss style for display purposes
      *  @param {number} t - time in seconds
      *  @return {string}
@@ -929,6 +934,17 @@ declare module "littlejsengine" {
      *  @param {Function} [callback] - Called when share is complete
      *  @memberof Utilities */
     export function shareURL(title: string, url: string, callback?: Function): void;
+    /** Read save data from local storage
+     *  @param {string} saveName - unique name for the game/save
+     *  @param {Object} [defaultSaveData] - default values for save
+     *  @return {Object}
+     *  @memberof Utilities */
+    export function readSaveData(saveName: string, defaultSaveData?: any): any;
+    /** Write save data to local storage
+     *  @param {string} saveName - unique name for the game/save
+     *  @param {Object} saveData - object containing data to be saved
+     *  @memberof Utilities */
+    export function writeSaveData(saveName: string, saveData: any): void;
     /** Random global functions
      *  @namespace Random */
     /** Returns a random value between the two values passed in
@@ -1265,6 +1281,12 @@ declare module "littlejsengine" {
          * @return {boolean} */
         isValid(): boolean;
     }
+    /**
+     * LittleJS Utility Classes and Functions
+     * - General purpose utilities
+     * - Timer - tracks time automatically
+     * @namespace Utilities
+     */
     /**
      * Timer object tracks how long has passed since it was set
      * @memberof Engine
@@ -1488,7 +1510,7 @@ declare module "littlejsengine" {
          */
         setFullImage(textureInfo?: TextureInfo): TileInfo;
         /**
-         * Returns a tile info for an index using this tile as refrence
+         * Returns a tile info for an index using this tile as reference
          * @param {Vector2|number} [index=0]
          * @return {TileInfo}
          */
@@ -1778,7 +1800,7 @@ declare module "littlejsengine" {
      */
     export class FontImage {
         /** Create an image font
-         *  @param {TileInfo} tileInfo - Tile info of first characeter in font
+         *  @param {TileInfo} tileInfo - Tile info of first character in font
          */
         constructor(tileInfo: TileInfo);
         /** @property {TileInfo} - Tile info for the font */
@@ -2132,24 +2154,38 @@ declare module "littlejsengine" {
      *  @memberof Audio */
     export const audioDefaultSampleRate: 44100;
     /**
-     * Sound Object - Stores a sound for later use and can be played positionally
+     * Sound Object - Stores a sound for later
+     * - this can be used to load and play wave, mp3, and ogg files
+     * - it can also create sounds using the ZzFX sound generator
+     * - can attenuate and apply stereo panning to sounds
+     * - sound instance control with pause/resume capability
      *
      * <a href=https://killedbyapixel.github.io/ZzFX/>Create sounds using the ZzFX Sound Designer.</a>
      * @memberof Audio
      * @example
-     * // create a sound
+     * // load an audio asset file
+     * const sound_example = new Sound('sound.mp3');
+     *
+     * // create a zzfx sound
      * const sound_example = new Sound([.5,.5]);
      *
-     * // play the sound
+     * // play a sound
      * sound_example.play();
      */
     export class Sound {
-        /** Create a sound object and cache the zzfx samples for later use
-         *  @param {Array}  zzfxSound - Array of zzfx parameters, ex. [.5,.5]
+        /**
+         * @callback SoundLoadCallback - Function called when sound is loaded
+         * @param {Sound} sound
+         * @memberof Audio
+         */
+        /** Create a sound object and cache the audio for later use
+         *  @param {string|Array} [asset] - Filename of audio file or zzfx array
+         *  @param {number} [randomness] - How much to randomize frequency each time sound plays, for zzfx sounds the zzfx default is used if undefined
          *  @param {number} [range=soundDefaultRange] - World space max range of sound
          *  @param {number} [taper=soundDefaultTaper] - At what percentage of range should it start tapering
+         *  @param {SoundLoadCallback} [onloadCallback] - callback function to call when sound is loaded
          */
-        constructor(zzfxSound: any[], range?: number, taper?: number);
+        constructor(asset?: string | any[], randomness?: number, range?: number, taper?: number, onloadCallback?: (sound: Sound) => Sound);
         /** @property {number} - World space max range of sound */
         range: number;
         /** @property {number} - At what percentage of range should it start tapering */
@@ -2160,6 +2196,8 @@ declare module "littlejsengine" {
         sampleRate: number;
         /** @property {number} - Percentage of this sound currently loaded */
         loadedPercent: number;
+        /** @property {SoundLoadCallback} - function to call when sound is loaded */
+        onloadCallback: (sound: Sound) => Sound;
         sampleChannels: any[][];
         /** Play the sound
          *  Sounds may not play until a user interaction occurs
@@ -2176,7 +2214,7 @@ declare module "littlejsengine" {
          *  @param {number} [volume] - Volume to play the music at
          *  @param {boolean} [loop] - Should the music loop?
          *  @param {boolean} [paused] - Should the music start paused
-         *  @return {SoundInstance} - The audio source node
+         *  @return {SoundInstance} - The sound instance
          */
         playMusic(volume?: number, loop?: boolean, paused?: boolean): SoundInstance;
         /** Play the sound as a musical note with a semitone offset
@@ -2184,7 +2222,7 @@ declare module "littlejsengine" {
          *  @param {number}  [semitoneOffset=0] - How many semitones to offset pitch
          *  @param {Vector2} [pos] - World space position to play the sound if any
          *  @param {number}  [volume=1] - How much to scale volume by
-         *  @return {SoundInstance} - The audio source node
+         *  @return {SoundInstance} - The sound instance
          */
         playNote(semitoneOffset?: number, pos?: Vector2, volume?: number): SoundInstance;
         /** Get how long this sound is in seconds
@@ -2195,36 +2233,7 @@ declare module "littlejsengine" {
          *  @return {boolean} - True if sound is loaded and ready to play
          */
         isLoaded(): boolean;
-    }
-    /**
-     * Sound Wave Object - Loads and stores an audio file for later use
-     * - this can be used to load and play wave, mp3, and ogg files
-     * @extends Sound
-     * @memberof Audio
-     * @example
-     * // load an audio asset file
-     * const sound_example = new SoundWave('sound.mp3');
-     *
-     * // play the sound
-     * sound_example.play();
-     */
-    export class SoundWave extends Sound {
-        /**
-         * @callback SoundLoadCallback - Function called when sound is loaded
-         * @param {SoundWave} sound
-         * @memberof Audio
-         */
-        /** Create a sound object and cache the wave file for later use
-         *  @param {string} filename - Filename of audio file to load
-         *  @param {number} [randomness] - How much to randomize frequency each time sound plays
-         *  @param {number} [range=soundDefaultRange] - World space max range of sound
-         *  @param {number} [taper=soundDefaultTaper] - At what percentage of range should it start tapering
-         *  @param {SoundLoadCallback} [onloadCallback] - callback function to call when sound is loaded
-         */
-        constructor(filename: string, randomness?: number, range?: number, taper?: number, onloadCallback?: (sound: SoundWave) => SoundWave);
-        /** @property {SoundLoadCallback} - callback function to call when sound is loaded */
-        onloadCallback: (sound: SoundWave) => SoundWave;
-        /** Loads a sound from a URL and decodes it into sample data. Must be used with await!
+        /** Loads a sound from a URL and decodes it into sample data.
         *  @param {string} filename
         *  @return {Promise<void>} */
         loadSound(filename: string): Promise<void>;
@@ -2429,15 +2438,17 @@ declare module "littlejsengine" {
         additiveColor: any;
         /** @property {boolean} - Should it flip along y axis when rendered */
         mirror: boolean;
-        /** @property {number} [mass=objectDefaultMass] - How heavy the object is, static if 0 */
+        /** @property {boolean} - Has object been destroyed? */
+        destroyed: boolean;
+        /** @property {number} - How heavy the object is, static if 0 */
         mass: number;
-        /** @property {number} [damping=objectDefaultDamping] - How much to slow down velocity each frame (0-1) */
+        /** @property {number} - How much to slow down velocity each frame (0-1) */
         damping: number;
-        /** @property {number} [angleDamping=objectDefaultAngleDamping] - How much to slow down rotation each frame (0-1) */
+        /** @property {number} - How much to slow down rotation each frame (0-1) */
         angleDamping: number;
-        /** @property {number} [restitution=objectDefaultRestitution] - How bouncy the object is when colliding (0-1) */
+        /** @property {number} - How bouncy the object is when colliding (0-1) */
         restitution: number;
-        /** @property {number} [friction=objectDefaultFriction] - How much friction to apply when sliding (0-1) */
+        /** @property {number} - How much friction to apply when sliding (0-1) */
         friction: number;
         /** @property {number} - How much to scale gravity by for this object */
         gravityScale: number;
@@ -2477,9 +2488,9 @@ declare module "littlejsengine" {
         update(): void;
         /** Render the object, draws a tile by default, automatically called each frame, sorted by renderOrder */
         render(): void;
-        /** Destroy this object, destroy its children, detach its parent, and mark it for removal */
-        destroy(): void;
-        destroyed: number;
+        /** Destroy this object, destroy its children, detach its parent, and mark it for removal
+         *  @param {boolean} [immediate] - should attached effects be allowed to die off? */
+        destroy(immediate?: boolean): void;
         /** Convert from local space to world space
          *  @param {Vector2} pos - local space point */
         localToWorld(pos: Vector2): Vector2;
@@ -2538,7 +2549,7 @@ declare module "littlejsengine" {
          *  @param {EngineObject} child */
         removeChild(child: EngineObject): void;
         /** Check if overlapping another engine object
-         *  Collisions are resoloved to prevent overlaps
+         *  Collisions are resolved to prevent overlaps
          *  @param {EngineObject} object
          *  @return {boolean} */
         isOverlappingObject(object: EngineObject): boolean;
@@ -2573,27 +2584,34 @@ declare module "littlejsengine" {
     export const tileCollisionLayers: Array<TileCollisionLayer>;
     /** Get tile collision data for a given cell in the grid
     *  @param {Vector2} pos
+    *  @param {boolean} [solidOnly] - Only check solid layers?
     *  @return {number}
     *  @memberof TileLayers */
-    export function tileCollisionGetData(pos: Vector2): number;
+    export function tileCollisionGetData(pos: Vector2, solidOnly?: boolean): number;
     /** Check if a tile layer collides with another object
-     *  @param {Vector2}      pos
-     *  @param {Vector2}      [size=vec2()]
-     *  @param {EngineObject} [object] - An object or undefined for generic test
-     *  @param {boolean}      [solidOnly] - Only check solid layers if true
+     *  @param {Vector2} pos
+     *  @param {Vector2} [size=vec2()]
+     *  @param {EngineObject|TileCollisionCallback} [callbackObject] - Callback, engine object, or undefined
+     *  @param {boolean} [solidOnly] - Only check solid layers?
      *  @return {TileCollisionLayer}
      *  @memberof TileLayers */
-    export function tileCollisionTest(pos: Vector2, size?: Vector2, object?: EngineObject, solidOnly?: boolean): TileCollisionLayer;
+    export function tileCollisionTest(pos: Vector2, size?: Vector2, callbackObject?: EngineObject | TileCollisionCallback, solidOnly?: boolean): TileCollisionLayer;
+    /**
+     *  @callback TileCollisionCallback - Function to handle a tile collision test
+     *  @param {number} tileData - the value of the tile at the position
+     *  @param {Vector2} pos - world space position of tile where the collision occurred
+     *  @memberof TileLayers
+     */
     /** Return the exact position of the boundary of first tile hit, undefined if nothing was hit.
-     *  The point will be inside the colliding tile if it hits (may have a tiny shift)
-     *  @param {Vector2}      posStart
-     *  @param {Vector2}      posEnd
-     *  @param {EngineObject} [object] - An object or undefined for generic test
-     *  @param {Vector2}      [normal] - Optional normal of the surface hit
-     *  @param {boolean}      [solidOnly=true] - Only check solid layers if true
+     *  The point will be inside the colliding tile if it hits
+     *  @param {Vector2} posStart
+     *  @param {Vector2} posEnd
+     *  @param {EngineObject|TileCollisionCallback} [callbackObject] - Callback, engine object, or undefined
+     *  @param {Vector2} [normal] - Optional normal of the surface hit
+     *  @param {boolean} [solidOnly=true] - Only check solid layers?
      *  @return {Vector2|undefined} - position of the center of the tile hit or undefined if no hit
      *  @memberof TileLayers */
-    export function tileCollisionRaycast(posStart: Vector2, posEnd: Vector2, object?: EngineObject, normal?: Vector2, solidOnly?: boolean): Vector2 | undefined;
+    export function tileCollisionRaycast(posStart: Vector2, posEnd: Vector2, callbackObject?: EngineObject | TileCollisionCallback, normal?: Vector2, solidOnly?: boolean): Vector2 | undefined;
     /**
      * Load tile layers from exported data
      *  @param {Object}   tileMapData - Level data from exported data
@@ -2644,20 +2662,22 @@ declare module "littlejsengine" {
      */
     export class CanvasLayer extends EngineObject {
         /** Create a canvas layer object
-         *  @param {Vector2}  [position] - World space position of the layer
+         *  @param {Vector2}  [pos] - World space position of the layer
          *  @param {Vector2}  [size] - World space size of the layer
          *  @param {number}   [angle] - Angle the layer is rotated by
          *  @param {number}   [renderOrder] - Objects sorted by renderOrder
          *  @param {Vector2}  [canvasSize] - Default size of canvas, can be changed later
          *  @param {boolean}  [useWebGL] - Should this layer use WebGL for rendering
         */
-        constructor(position?: Vector2, size?: Vector2, angle?: number, renderOrder?: number, canvasSize?: Vector2, useWebGL?: boolean);
+        constructor(pos?: Vector2, size?: Vector2, angle?: number, renderOrder?: number, canvasSize?: Vector2, useWebGL?: boolean);
         /** @property {HTMLCanvasElement} - The canvas used by this layer */
         canvas: OffscreenCanvas;
         /** @property {OffscreenCanvasRenderingContext2D} - The 2D canvas context used by this layer */
         context: OffscreenCanvasRenderingContext2D;
         /** @property {TextureInfo} - Texture info to use for this object rendering */
         textureInfo: TextureInfo;
+        /** Destroy this canvas layer */
+        destroy(): void;
         /** Draw this canvas layer centered in world space, with color applied if using WebGL
         *  @param {Vector2} pos - Center in world space
         *  @param {Vector2} [size] - Size in world space
@@ -2703,12 +2723,13 @@ declare module "littlejsengine" {
      */
     export class TileLayer extends CanvasLayer {
         /** Create a tile layer object
-        *  @param {Vector2}  position - World space position
+        *  @param {Vector2}  pos - World space position
         *  @param {Vector2}  size - World space size
         *  @param {TileInfo} [tileInfo] - Default tile info for layer (used for size and texture)
         *  @param {number}   [renderOrder] - Objects are sorted by renderOrder
+        *  @param {boolean}  [useWebGL] - Should this layer use WebGL for rendering
         */
-        constructor(position: Vector2, size: Vector2, tileInfo?: TileInfo, renderOrder?: number);
+        constructor(pos: Vector2, size: Vector2, tileInfo?: TileInfo, renderOrder?: number, useWebGL?: boolean);
         /** @property {Array<TileLayerData>} - Default tile info for layer */
         data: TileLayerData[];
         /** @property {boolean} - Is this layer using a webgl texture? */
@@ -2722,14 +2743,14 @@ declare module "littlejsengine" {
         redrawStart(clear?: boolean): void;
         /** Call to end the redraw process */
         redrawEnd(): void;
-        /** Draw the tile at a given position in the tile grid
+        /** Draw the tile at a given position in the tile layer
          *  This can be used to clear out tiles when they are destroyed
          *  Tiles can also be redrawn if inside a redrawStart/End block
          *  @param {Vector2} layerPos
          *  @param {boolean} [clear] - should the old tile be cleared out
          */
         drawTileData(layerPos: Vector2, clear?: boolean): void;
-        /** Draw the tile at a given position in the tile grid
+        /** Draw the tile at a given position in the tile layer
          *  This can be used to clear tiles when they are destroyed
          *  For better performance use drawTileData inside a redrawStart/End block
          *  @param {Vector2} layerPos
@@ -2762,6 +2783,10 @@ declare module "littlejsengine" {
          *  @param {TileLayerData} data - Data to set
          *  @param {boolean}       [redraw] - Force the tile to redraw if true */
         setData(layerPos: Vector2, data: TileLayerData, redraw?: boolean): void;
+        /** Clear data at a given position in the array
+         *  @param {Vector2} layerPos - Local position in array
+         *  @param {boolean} [redraw] - Force the tile to redraw if true */
+        clearData(layerPos: Vector2, redraw?: boolean): void;
         /** Get data at a given position in the array
          *  @param {Vector2} layerPos - Local position in array
          *  @return {TileLayerData} */
@@ -2784,41 +2809,55 @@ declare module "littlejsengine" {
         /** Clear and initialize tile collision to new size
         *  @param {Vector2} size - width and height of tile collision 2d grid */
         initCollision(size: Vector2): void;
-        /** Set tile collision data for a given cell in the grid
-        *  @param {Vector2} gridPos
+        /** Set tile collision data for a given cell in the layer
+        *  @param {Vector2} layerPos
         *  @param {number}  [data] */
-        setCollisionData(gridPos: Vector2, data?: number): void;
-        /** Get tile collision data for a given cell in the grid
-        *  @param {Vector2} gridPos
+        setCollisionData(layerPos: Vector2, data?: number): void;
+        /** Clear tile collision data for a given cell in the layer
+        *  @param {Vector2} layerPos */
+        clearCollisionData(layerPos: Vector2): void;
+        /** Get tile collision data for a given cell in the layer
+        *  @param {Vector2} layerPos
         *  @return {number} */
-        getCollisionData(gridPos: Vector2): number;
+        getCollisionData(layerPos: Vector2): number;
         /** Check if collision with another object should occur
         *  @param {Vector2}      pos
         *  @param {Vector2}      [size=vec2()]
-        *  @param {EngineObject} [object]
+        *  @param {EngineObject|TileCollisionCallback} [callbackObject] - Callback, engine object, or undefined
         *  @return {boolean} */
-        collisionTest(pos: Vector2, size?: Vector2, object?: EngineObject): boolean;
+        collisionTest(pos: Vector2, size?: Vector2, callbackObject?: EngineObject | TileCollisionCallback): boolean;
         /** Return the exact position of the boundary of first tile hit, undefined if nothing was hit.
         *  The point will be inside the colliding tile if it hits (may have a tiny shift)
-        *  @param {Vector2}      posStart
-        *  @param {Vector2}      posEnd
-        *  @param {EngineObject} [object] - An object or undefined for generic test
-        *  @param {Vector2}      [normal] - Optional normal of the surface hit
+        *  @param {Vector2} posStart
+        *  @param {Vector2} posEnd
+        *  @param {EngineObject|TileCollisionCallback} [callbackObject] - Callback, engine object, or undefined
+        *  @param {Vector2} [normal] - Optional normal of the surface hit
         *  @return {Vector2|undefined} */
-        collisionRaycast(posStart: Vector2, posEnd: Vector2, object?: EngineObject, normal?: Vector2): Vector2 | undefined;
+        collisionRaycast(posStart: Vector2, posEnd: Vector2, callbackObject?: EngineObject | TileCollisionCallback, normal?: Vector2): Vector2 | undefined;
     }
     /**
      * LittleJS Particle System
+     * - A simple but fast and flexible particle system
+     * - Lightweight Particles are created and managed by ParticleEmitters
+     * - The particle design tool can be used to help create emitters
+     * @namespace Particles
      */
     /**
-     *  @callback ParticleCallbackFunction - Function that processes a particle
+     *  @callback ParticleCallback - Function that processes a particle
      *  @param {Particle} particle
-     *  @memberof Engine
+     *  @memberof Particles
+     */
+    /**
+     *  @callback ParticleCollideCallback - Collide callback for particles
+     *  @param {Particle} particle
+     *  @param {number} tileData
+     *  @param {Vector2} pos
+     *  @memberof Particles
      */
     /**
      * Particle Emitter - Spawns particles with the given settings
      * @extends EngineObject
-     * @memberof Engine
+     * @memberof Particles
      * @example
      * // create a particle emitter
      * let pos = vec2(2,3);
@@ -2835,7 +2874,7 @@ declare module "littlejsengine" {
      */
     export class ParticleEmitter extends EngineObject {
         /** Create a particle system with the given settings
-         *  @param {Vector2} position - World space position of the emitter
+         *  @param {Vector2} pos - World space position of the emitter
          *  @param {number} [angle] - Angle to emit the particles
          *  @param {number|Vector2}  [emitSize] - World space size of the emitter (float for circle diameter, vec2 for rect)
          *  @param {number} [emitTime] - How long to stay alive (0 is forever)
@@ -2863,9 +2902,11 @@ declare module "littlejsengine" {
          *  @param {number} [renderOrder] - Render order for particles (additive is above other stuff by default)
          *  @param {boolean}  [localSpace] - Should it be in local space of emitter (world space is default)
          */
-        constructor(position: Vector2, angle?: number, emitSize?: number | Vector2, emitTime?: number, emitRate?: number, emitConeAngle?: number, tileInfo?: TileInfo, colorStartA?: Color, colorStartB?: Color, colorEndA?: Color, colorEndB?: Color, particleTime?: number, sizeStart?: number, sizeEnd?: number, speed?: number, angleSpeed?: number, damping?: number, angleDamping?: number, gravityScale?: number, particleConeAngle?: number, fadeRate?: number, randomness?: number, collideTiles?: boolean, additive?: boolean, randomColorLinear?: boolean, renderOrder?: number, localSpace?: boolean);
+        constructor(pos: Vector2, angle?: number, emitSize?: number | Vector2, emitTime?: number, emitRate?: number, emitConeAngle?: number, tileInfo?: TileInfo, colorStartA?: Color, colorStartB?: Color, colorEndA?: Color, colorEndB?: Color, particleTime?: number, sizeStart?: number, sizeEnd?: number, speed?: number, angleSpeed?: number, damping?: number, angleDamping?: number, gravityScale?: number, particleConeAngle?: number, fadeRate?: number, randomness?: number, collideTiles?: boolean, additive?: boolean, randomColorLinear?: boolean, renderOrder?: number, localSpace?: boolean);
+        /** @property {boolean} - Should particles be emitted in a circle */
+        emitCircle: boolean;
         /** @property {number|Vector2} - World space size of the emitter (float for circle diameter, vec2 for rect) */
-        emitSize: number | Vector2;
+        emitSize: Vector2;
         /** @property {number} - How long to stay alive (0 is forever) */
         emitTime: number;
         /** @property {number} - How many particles per second to spawn, does not emit if 0 */
@@ -2904,64 +2945,86 @@ declare module "littlejsengine" {
         localSpace: boolean;
         /** @property {number} - If non zero the particle is drawn as a trail, stretched in the direction of velocity */
         trailScale: number;
-        /** @property {ParticleCallbackFunction} - Callback when particle is destroyed */
-        particleDestroyCallback: any;
-        /** @property {ParticleCallbackFunction} - Callback when particle is created */
+        /** @property {ParticleCallback} - Callback when particle is created */
         particleCreateCallback: any;
-        /** @property {number} - Track particle emit time */
-        emitTimeBuffer: number;
+        /** @property {ParticleCallback} - Callback when particle is destroyed */
+        particleDestroyCallback: any;
+        /** @property {ParticleCollideCallback} - Callback when particle collides */
+        particleCollideCallback: any;
         /** @property {number} - Percentage of velocity to pass to particles (0-1) */
         velocityInheritance: number;
+        /** @property {number} - Track particle emit time */
+        emitTimeBuffer: number;
+        /** @property {Array<Particle>} - Array of particles for this emitter */
+        particles: any[];
         previousAngle: number;
         previousPos: Vector2;
         /** Spawn one particle
          *  @return {Particle} */
         emitParticle(): Particle;
+        /** is emitter actively spawning */
+        isActive(): boolean;
     }
     /**
      * Particle Object - Created automatically by Particle Emitters
-     * @extends EngineObject
-     * @memberof Engine
+     * @memberof Particles
      */
-    export class Particle extends EngineObject {
+    export class Particle {
         /**
          * Create a particle with the passed in settings
          * Typically this is created automatically by a ParticleEmitter
-         * @param {Vector2}  position   - World space position of the particle
-         * @param {TileInfo} tileInfo   - Tile info to render particles
-         * @param {number}   angle      - Angle to rotate the particle
-         * @param {Color}    colorStart - Color at start of life
-         * @param {Color}    colorEnd   - Color at end of life
-         * @param {number}   lifeTime   - How long to live for
-         * @param {number}   sizeStart  - Size at start of life
-         * @param {number}   sizeEnd    - Size at end of life
-         * @param {number}   fadeRate   - How quick to fade in/out
-         * @param {boolean}  additive   - Does it use additive blend mode
-         * @param {number}   trailScale - If a trail, how long to make it
-         * @param {ParticleEmitter} [localSpaceEmitter] - Parent emitter if local space
-         * @param {ParticleCallbackFunction} [destroyCallback] - Callback when particle dies
+         * @param {ParticleEmitter} emitter - The emitter that created this particle
+         * @param {Vector2} pos             - World or local space position
+         * @param {number}  angle           - Angle of the particle
+         * @param {Color}   colorStart      - Color at start of life
+         * @param {Color}   colorEnd        - Color at end of life
+         * @param {number}  lifeTime        - How long to live for
+         * @param {number}  sizeStart       - Size at start of life
+         * @param {number}  sizeEnd         - Size at end of life
+         * @param {Vector2} [velocity]      - Velocity of the particle
+         * @param {number}  [angleVelocity] - Angular speed of the particle
          */
-        constructor(position: Vector2, tileInfo: TileInfo, angle: number, colorStart: Color, colorEnd: Color, lifeTime: number, sizeStart: number, sizeEnd: number, fadeRate: number, additive: boolean, trailScale: number, localSpaceEmitter?: ParticleEmitter, destroyCallback?: ParticleCallbackFunction);
-        /** @property {Color} - Color at start of life */
+        constructor(emitter: ParticleEmitter, pos: Vector2, angle: number, colorStart: Color, colorEnd: Color, lifeTime: number, sizeStart: number, sizeEnd: number, velocity?: Vector2, angleVelocity?: number);
+        /** @property {ParticleEmitter} */
+        emitter: ParticleEmitter;
+        /** @property {Vector2} */
+        pos: Vector2;
+        /** @property {number} */
+        angle: number;
+        /** @property {Vector2} */
+        size: Vector2;
+        /** @property {Color} */
+        color: Color;
+        /** @property {Color} */
         colorStart: Color;
-        /** @property {Color} - Color at end of life */
+        /** @property {Color} */
         colorEnd: Color;
-        /** @property {number} - How long to live for */
+        /** @property {number} */
         lifeTime: number;
-        /** @property {number} - Size at start of life */
+        /** @property {number} */
         sizeStart: number;
-        /** @property {number} - Size at end of life */
+        /** @property {number} */
         sizeEnd: number;
-        /** @property {number} - How quick to fade in/out */
-        fadeRate: number;
-        /** @property {boolean} - Is it additive */
-        additive: boolean;
-        /** @property {number} - If a trail, how long to make it */
-        trailScale: number;
-        /** @property {ParticleEmitter} - Parent emitter if local space */
-        localSpaceEmitter: ParticleEmitter;
-        /** @property {ParticleCallbackFunction} - Called when particle dies */
-        destroyCallback: ParticleCallbackFunction;
+        /** @property {Vector2} */
+        velocity: Vector2;
+        /** @property {number} */
+        angleVelocity: number;
+        /** @property {number} */
+        spawnTime: number;
+        /** @property {boolean} */
+        mirror: boolean;
+        /** @property {EngineObject} */
+        groundObject: TileCollisionLayer;
+        /** @property {boolean} */
+        destroyed: boolean;
+        /** @property {TileInfo} */
+        tileInfo: TileInfo;
+        /** Update the particle */
+        update(): void;
+        /** Destroy this particle */
+        destroy(): void;
+        /** Render the particle, automatically called each frame */
+        render(): void;
     }
     /**
      * LittleJS Medal System
@@ -3117,7 +3180,7 @@ declare module "littlejsengine" {
     export class PostProcessPlugin {
         /** Create global post processing shader
         *  @param {string} shaderCode
-        *  @param {boolean} [includeMainCanvas] - combine mainCanvs onto glCanvas
+        *  @param {boolean} [includeMainCanvas] - combine mainCanvas onto glCanvas
         *  @param {boolean} [feedbackTexture] - use glCanvas from previous frame as the texture
         *  @example
         *  // create the post process plugin object
@@ -3176,9 +3239,9 @@ declare module "littlejsengine" {
         /** Play the music that loops by default
          *  @param {number}  [volume] - Volume to play the music at
          *  @param {boolean} [loop] - Should the music loop?
-         *  @return {AudioBufferSourceNode} - The audio source node
+         *  @return {SoundInstance} - The sound instance
          */
-        playMusic(volume?: number, loop?: boolean): AudioBufferSourceNode;
+        playMusic(volume?: number, loop?: boolean): SoundInstance;
     }
     /**
      * LittleJS User Interface Plugin
@@ -3205,9 +3268,9 @@ declare module "littlejsengine" {
     export let uiDebug: number;
     /** Enable UI system debug drawing
      *  0=off, 1=normal, 2=show invisible
-     *  @param {number|boolean} enable
+     *  @param {number|boolean} debugMode
      *  @memberof UISystem */
-    export function uiSetDebug(debugMode: any): void;
+    export function uiSetDebug(debugMode: number | boolean): void;
     /**
      * UI System Global Object
      * @memberof UISystem
@@ -3260,7 +3323,7 @@ declare module "littlejsengine" {
         nativeHeight: number;
         /** @property {UIObject} - Object currently selected by navigation (gamepad or keyboard) */
         navigationObject: any;
-        /** @property {Timer} - Cooldown timer for navigation inputs */
+        /** @property {Timer} - Cool down timer for navigation inputs */
         navigationTimer: Timer;
         /** @property {number} - Time between navigation inputs in seconds */
         navigationDelay: number;
@@ -3404,7 +3467,7 @@ declare module "littlejsengine" {
         lineWidth: number;
         /** @property {number} - Corner radius for rounded rects */
         cornerRadius: number;
-        /** @property {string} - Font for this objecct */
+        /** @property {string} - Font for this object */
         font: string;
         /** @property {string} - Font style for this object or undefined */
         fontStyle: any;
@@ -3596,6 +3659,8 @@ declare module "littlejsengine" {
         value: number;
         /** @property {Color} - Color for the handle part of the scrollbar */
         handleColor: Color;
+        /** @property {boolean} - Should it fill up like a progress bar? */
+        fillMode: boolean;
         text: string;
     }
     /**
@@ -3603,20 +3668,20 @@ declare module "littlejsengine" {
      * @extends UIObject
      * @example
      * // Create a video player UI object
-     * const video = new VideoPlayerUIObject(vec2(400, 300), vec2(320, 240), 'cutscene.mp4', true);
+     * const video = new VideoPlayerUIObject(vec2(400, 300), vec2(320, 240), 'video.mp4', true);
      * video.play();
      * @memberof UISystem
      */
     export class UIVideo extends UIObject {
         /** Create a video player UI object
-         *  @param {Vector2} [pos]
-         *  @param {Vector2} [size]
+         *  @param {Vector2} pos
+         *  @param {Vector2} size
          *  @param {string} src - Video file path or URL
          *  @param {boolean} [autoplay=false] - Start playing immediately?
          *  @param {boolean} [loop=false] - Loop the video?
          *  @param {number} [volume=1] - Volume percent scaled by global volume (0-1)
          */
-        constructor(pos?: Vector2, size?: Vector2, src: string, autoplay?: boolean, loop?: boolean, volume?: number);
+        constructor(pos: Vector2, size: Vector2, src: string, autoplay?: boolean, loop?: boolean, volume?: number);
         /** @property {number} - The video volume */
         volume: number;
         /** @property {HTMLVideoElement} - The video player */
@@ -3670,6 +3735,7 @@ declare module "littlejsengine" {
      * - Contact begin and end callbacks
      * - Wraps b2Vec2 type to/from Vector2
      * - Raycasting and querying
+     * - Box2dTileLayer for grid based collision
      * - Every type of joint
      * - Debug physics drawing
      * @namespace Box2D
@@ -3702,8 +3768,11 @@ declare module "littlejsengine" {
         /** Create the global UI system object
          *  @param {Object} instance */
         constructor(instance: any);
+        /** @property {Object} - The Box2d instance */
         instance: any;
+        /** @property {Object} - The Box2d world */
         world: any;
+        /** @property {Array<Box2dObject>} - List of all Box2d objects */
         objects: any[];
         /** @property {number} - Velocity iterations per update*/
         velocityIterations: number;
@@ -3753,13 +3822,14 @@ declare module "littlejsengine" {
          *  @param {Color} [color]
          *  @param {Color} [lineColor]
          *  @param {number} [lineWidth]
+         *  @param {boolean} [useWebGL=glEnable]
          *  @param {CanvasRenderingContext2D} [context] */
-        drawFixture(fixture: any, pos: Vector2, angle: number, color?: Color, lineColor?: Color, lineWidth?: number, context?: CanvasRenderingContext2D): void;
+        drawFixture(fixture: any, pos: Vector2, angle: number, color?: Color, lineColor?: Color, lineWidth?: number, useWebgl: any, context?: CanvasRenderingContext2D): void;
         /** converts a box2d vec2 to a Vector2
          *  @param {Object} v */
         vec2From(v: any): Vector2;
         /** converts a box2d vec2 pointer to a Vector2
-         *  @param {Object} v */
+         *  @param {Object} vp */
         vec2FromPointer(vp: any): Vector2;
         /** converts a Vector2 to a box2 vec2
          *  @param {Vector2} v */
@@ -3789,16 +3859,23 @@ declare module "littlejsengine" {
          *  @param {number}   [bodyType]
          *  @param {number}   [renderOrder] */
         constructor(pos?: Vector2, size?: Vector2, tileInfo?: TileInfo, angle?: number, color?: Color, bodyType?: number, renderOrder?: number);
+        /** @property {Object} - The Box2d body */
         body: any;
+        /** @property {Color} - Line color used for default box2d drawing */
         lineColor: Color;
+        /** @property {Array<Object>} - List of all edges for default box2d drawing */
         edgeLists: any[];
+        /** @property {Array<Object>} - List of all edge loops for default box2d drawing */
         edgeLoops: any[];
+        /** Destroy this object and its physics body */
+        destroy(): void;
         /** Draws all this object's fixtures
-         *  @param {Color}  [color]
-         *  @param {Color}  [lineColor]
-         *  @param {number} [lineWidth]
+         *  @param {Color}   [color]
+         *  @param {Color}   [lineColor]
+         *  @param {number}  [lineWidth]
+         *  @param {boolean} [useWebGL=glEnable]
          *  @param {CanvasRenderingContext2D} [context] */
-        drawFixtures(color?: Color, lineColor?: Color, lineWidth?: number, context?: CanvasRenderingContext2D): void;
+        drawFixtures(color?: Color, lineColor?: Color, lineWidth?: number, useWebGL?: boolean, context?: CanvasRenderingContext2D): void;
         /** Called when a contact begins
          *  @param {Box2dObject} otherObject */
         beginContact(otherObject: Box2dObject): void;
@@ -3873,6 +3950,11 @@ declare module "littlejsengine" {
          *  @param {number}  [restitution]
          *  @param {boolean} [isSensor] */
         addEdgeLoop(points: Array<Vector2>, density?: number, friction?: number, restitution?: number, isSensor?: boolean): any[];
+        /** Destroy a fixture from the body
+         *  @param {Object} [fixture] */
+        destroyFixture(fixture?: any): void;
+        /** Destroy all fixture from the body */
+        destroyAllFixtures(): void;
         /** Gets the center of mass
          *  @return {Vector2} */
         getCenterOfMass(): Vector2;
@@ -3998,11 +4080,11 @@ declare module "littlejsengine" {
         constructor(pos?: Vector2, size?: Vector2, tileInfo?: TileInfo, angle?: number, color?: Color, renderOrder?: number);
     }
     /**
-     * Box2D Kiematic Object - Box2d with a kinematic physics body
+     * Box2D Kinematic Object - Box2d with a kinematic physics body
      * @extends Box2dObject
      * @memberof Box2D
      */
-    export class Box2dKiematicObject extends Box2dObject {
+    export class Box2dKinematicObject extends Box2dObject {
         /** Create a LittleJS object with Box2d physics
          *  @param {Vector2}  [pos]
          *  @param {Vector2}  [size]
@@ -4045,6 +4127,7 @@ declare module "littlejsengine" {
         /** Create a box2d joint, the base class is not intended to be used directly
          *  @param {Object} jointDef */
         constructor(jointDef: any);
+        /** @property {Object} - The Box2d joint */
         box2dJoint: any;
         /** Destroy this joint */
         destroy(): void;
@@ -4275,8 +4358,8 @@ declare module "littlejsengine" {
          *  @param {Box2dObject} objectB
          *  @param {Box2dJoint} joint1
          *  @param {Box2dJoint} joint2
-         *  @param {ratio} [ratio] */
-        constructor(objectA: Box2dObject, objectB: Box2dObject, joint1: Box2dJoint, joint2: Box2dJoint, ratio?: ratio);
+         *  @param {number} [ratio] */
+        constructor(objectA: Box2dObject, objectB: Box2dObject, joint1: Box2dJoint, joint2: Box2dJoint, ratio?: number);
         joint1: Box2dJoint;
         joint2: Box2dJoint;
         /** Get the first joint