Dynamic Lighting/ Shadow Casting

Features

• dynamic light sources for multiple entities
• pulsating shine (torch style)
• configurable colors including radial gradients
• configurable light source offset
• separate drawing methods for darkening layer and light layer

Discussion
There is a discussion thread on: http://impactjs.com/forums/code/lighting-shadow-casting-class

Notes
in v.0.30 the shadowGradient doesn't take any effect

Example

To use the example, copy and overwrite the example files into an existing Jump'n'Run Demo directory
I provided only the Jump'n'Run Demo JS files without the media files or the impact framework.

A working example is available at: http://coldspace.henklein.com/plugin_demo/

Installation

1. copy the plugins folder into your lib folder
2. register the plugin in your main.js:

.requires(
	'plugins.lights'
)

3. register a LightManager instance in your main.js:

MyGame = ig.Game.extend({
	lightManager: '',
	init: function() {
	this.lightManager = new ig.LightManager();
}

4. add the light manager to the update cycle (in your main.js):

update: function() {
	this.parent();
	this.lightManager.update();
}

5. add the Lighting Draw calls to the impact.js lib/impact/game.js around the entitydrawing ( or somewhere else )

draw: function() {
	...
	this.lightManager.drawLightMap();
	this.drawEntities();
 	this.lightManager.drawShadowMap();
}

Usage

The Lighting Engine is Entity driven. That means, you're attaching a light source to an entity.
Lets add a light to our Player:

1. in your init function, you add the light source:

init: function(x,y,settings) {
...
	this.light = ig.game.lightManager.addLight(this, {
			angle: 5,	
			angleSpread: 125,	
			radius: 80,			
			color:'rgba(255,255,255,0.1)',	// there is an extra shadowColor option
			useGradients: true,	// false will use color/ shadowColor
			shadowGradientStart: 'rgba(0,0,0,0.1)',			// 2-stop radial gradient at 0.0 and 1.0
			shadowGradientStop: 'rgba(0,0,0,0.1)',
			lightGradientStart: 'rgba(255,255,100,0.1)',	// 2-stop radial gradient at 0.0 and 1.0
			lightGradientStop: 'rgba(0,0,0,0.6)',
			pulseFactor: 5,
			lightOffset: {x:0,y:0}		// lightsource offset from the middle of the entity
		});
 
}

2. to kill a light, you can use the

ig.game.lightManager.removeLight(light)

ig.game.lightManager.removeLightByIndex(index)

update: function() {
	...
	if (this.flip) {
		this.light.angle = 185;
	} else {
		this.light.angle = 5;
	}
}

Changelog

v0.30
* rewrite of the canvas drawing method - no globalCompositeOperation anymore ( https://github.com/fourty2/ShadowImpact/issues/1 )
* rewrite of the raycasting "engine" - it's much more accurate

v0.20
* improved canvas drawing
* added gradients
* provided example within the repo

v0.11
* added removeLight method

v0.10
* initial commit