LittleJS 1.28.0

ParticleEffects

LittleJS Particle Effects Plugin

  • Ready made particle effects in one line, particleEffect('fire', pos), and particleEffect3D for 3D
  • Every built-in effect is tuned around a one unit emitter; options.scale grows it to fit, options.hue and options.saturation recolor it
  • Effects are plain data, {name, settings, behaviors}, the format the particle designer saves: load a library the designer saved with particleEffectsLoad and play its effects by name
  • The built-in effects draw with a sheet of shapes the plugin draws itself, so they need no image

Functions

Constants

Functions

particleEffect(nameOrEffect, pos, options) → ParticleEmitter|undefinedparticleEffects.js:550

Play an effect: a 2D emitter set to it, placed, scaled and recolored

  • A continuous effect (fire, a torch) goes until destroyed or given an emitTime, a one-shot ends itself
  • Any setting in the options replaces the effect's own for this play: {emitTime: .5} for a burst of a continuous effect, {emitTime: 0, emitRate: 30} to keep a one-shot going, or speed, particleTime and the rest
  • Attach it to an object with addChild to follow it
nameOrEffect string|Object

A built-in or added effect's name, or an effect

pos Vector2 optional
options Object optional

What to change for this play, each left out when not wanted: scale grows the whole effect, the built-ins fit a one unit object at 1; hue turns its colors around the color wheel, 1 is all the way; saturation multiplies its saturation, 0 is gray; angle is its direction, 0 is up, the effect's own angle when not given; tileInfo, a TileInfo or a TextureInfo, is the game's own art to draw with in place of the effect's shape, tinted by its colors, a whole texture drawn as one tile; and any effect setting by its name, emitTime, emitRate, speed and the rest, replaces the effect's own

Returns
  • undefined when there is no such effect
particleEffect3D(nameOrEffect, pos3D, options) → ParticleEmitter3D|undefinedparticleEffects.js:670

Play an effect in 3D: a ParticleEmitter3D set to it, placed, scaled and recolored

  • The same effect data as particleEffect, so the look carries across: a circle spawn area becomes a sphere and a rectangle a box as deep as it is wide, both flat across the way it emits with options.flatten, a disc or a sheet; a trail becomes a streak of the same length, and the settings the 3D emitter lacks (particleConeAngle, randomColorLinear, velocityInheritance, localSpace) are left out; the stick behavior becomes the emitter's stick, its grip where a particle lands
nameOrEffect string|Object

A built-in or added effect's name, or an effect

pos3D Vector3 optional
options Object optional

scale, hue, saturation, angle, tileInfo and any setting as particleEffect; angle turns it about z, so 0 is up; flatten makes the spawn area flat across the way it emits

Returns
  • undefined when there is no such effect
particleEffectApply(emitter, effect)particleEffects.js:461

Set a 2D emitter to an effect, live, so a running one keeps its particles

emitter ParticleEmitter
effect Object
particleEffectApply3D(emitter, effect)particleEffects.js:630

Set a 3D emitter to an effect, live, so a running one keeps its particles; its place, scale and flatten stay

emitter ParticleEmitter3D
effect Object
particleEffectFromEmitter(emitter, name) → ObjectparticleEffects.js:574

An effect with a 2D emitter's settings, to save, build again, or build in 3D with particleEffect3D; its tile is left out, since a hand made emitter's tile is its own texture and not one an effect can name, and so are its scale, which an effect does not keep: pass it again with options.scale, and its renderOrder, which an effect takes from additive; a finished emitter's emit time is the time it emitted for

emitter ParticleEmitter
name string optional, default Effect
particleEffectRecolor(effect, hue, saturation) → ObjectparticleEffects.js:221

A copy of an effect with its four colors turned around the color wheel and their saturation scaled; lightness and alpha stay, and gray and white have no hue to turn

effect Object
hue number optional, default 0

How far around the wheel, 1 is all the way

saturation number optional, default 1

Multiplies the saturation, 0 is gray, clamped to 1

particleEffectsAdd(effects)particleEffects.js:243

Add effects to play by name, sanitized; one with the name of an effect already there replaces it

effects Array<Object>|Object
particleEffectsAddBehavior(name, update, update3D, min, max, value, description)particleEffects.js:423

Add a behavior effects can use by name, or replace one

name string
update function

Pushes a 2D particle, given the strength

update3D function optional

The same for a 3D particle, none leaves 3D alone

min number optional

Strength range the designer offers, and the range a strength is clamped to

max number optional, default 2
value number optional, default 1

Strength when first added

description string optional
particleEffectSanitize(raw) → ObjectparticleEffects.js:159

Any input into a whole effect: missing fields take their defaults, bad ones are dropped or clamped

raw Object optional

{name, settings, behaviors}, from a library file, the designer or code

particleEffectsGet(name) → Object|undefinedparticleEffects.js:256

The effect with a name, any case, undefined if there is none

name string
particleEffectShapeTile(name) → TileInfo|undefinedparticleEffects.js:300

The tile of a built-in shape, on a sheet the plugin draws once; undefined headless, without a canvas or without WebGL, where an effect draws untextured squares

name string

One of particleEffectShapes

particleEffectsLoad(url) → Promise<Array<Object>>asyncparticleEffects.js:283

Load a library file the particle designer saved and add its effects

url string
Returns
  • The effects it had
particleEffectsParse(text) → Array<Object>particleEffects.js:262

A library file, or one effect, into sanitized effects; throws on bad input

text string
particleEffectsText(effects) → stringparticleEffects.js:277

The text of a library file with these effects, what particleEffectsLoad and the designer read

effects Array<Object>

Constants

particleEffectBehaviors : Array<{name:string, update: (function()|undefined), update3D: (function()|undefined), min:number, max:number, value:number, description:string}>particleEffects.js:126

The behaviors an effect can use, each a push applied to every particle every update, with a 2D and a 3D version

particleEffectGroups : Array<string>particleEffects.js:20

The groups the settings are in, in order

particleEffectsBuiltIn : Array<string>particleEffects.js:692

The names of the built-in effects, in the order a gallery shows them

particleEffectSettings : Array<{group:string, name:string, kind:string, value:any, min:number, max:number, step:number, description:string, hardMin:number, hardMax:number, extra:boolean}>particleEffects.js:28

Every setting an effect has: its name, kind (number, checkbox, color or shape), default, the range the designer's slider covers (min, max, step), the hard limits a typed value is clamped to, and whether it is set after the emitter is made rather than passed to its constructor (extra)

particleEffectShapes : Array<string>particleEffects.js:141

Names of the shapes the plugin draws, for an effect's shape setting