The Basics

You don't need to include or instance the camera for yourself. The camera gets automatically created for you after your game gets initialized. You can use the camera via the camera property of your game. For instance, like this in your game class:

this.camera

And like this from outside your game class:

ig.game.camera

That's all, no extra code needed!

Following Entities

The camera has a method called follow which, as you might have guessed, enables the camera to follow an entity. The follow method takes three parameters.

The first one is the entity that will be followed by the camera. If your are new to Impact++, please keep in mind that all entities have to extend the ig.EntityExtended class, or else the camera and many other features won't work. The second one determines if the camera should snap to an entity, instead of transitioning. And the last one defines if the camera should center on the entity or not.

Here is a short example:

var bee = this.namedEntities["bee"];

// first parameter is the entity to follow
// second parameter is snap (instead of transition)
// third parameter is to center on entity

ig.game.camera.follow(bee, false, false);

By default the game will auto follow the player, if you don't set AUTO_FOLLOW_PLAYER to false at your config-user.js file located under lib\plusplus\ config-user.js. On auto follow the camera will center the player and snap to it.

To prevent black borders, the camera will always try to stay inside the level. You don't like that? You can disable this if you set KEEP_INSIDE_LEVEL to false at your config-user.js.

You can also change the duration of the transition when switching entities that the camera is following. Take a look at TRANSITION_DURATION in your config-user.js if you want to change that.

It's a Trap!

The camera will center the entity in the middle of the screen every time it will move by default. You can add a lerp to this behaviour. This enables the camera to move slowly behind the following entity as long as the entity is moving. Setting the LERP to 0.025 in your config-user.js looks very smooth for example. Setting the lerp to 1 will disable it.

But in many games you don't want this kind of camera behaviour. Especially in games where there is lots of running and jumping, it can feel very annoying if the player is centred all the time. In this case you should rather use a trap.

Imagine a trap as an invisible rectangle around your player. As long as the player moves inside that trap, the camera won't move. But as soon as the player steps outside that trap the camera will move again in the correspondent direction.

To set up a trap you should disable the centering behaviour of your camera first. Add this to your config-user.js file:

CAMERA: {
    KEEP_CENTERED: false
}

You can define the dimensions of your trap via an absolute value, or as a percentage of the screen size. We will use percentages in this example:

CAMERA: {
    KEEP_CENTERED: false,
    BOUNDS_TRAP_AS_PCT: true,
    BOUNDS_TRAP_PCT_MINX: -0.2,
    BOUNDS_TRAP_PCT_MINY: -0.3,
    BOUNDS_TRAP_PCT_MAXX: 0.2,
    BOUNDS_TRAP_PCT_MAXY: 0.3
}

Shake the Camera!

A really cool effect provides the camera with the shake method. It does exactly what you think it does. It shakes the camera! This is very useful for simulating explosions and earthquakes. And the usage is quite simple:

ig.game.camera.shake(2,5);

The first Parameter defines how long the shake should take, and the second how strong the shake should be. For some extra action, you can define your own shake function as third parameter.

Adding some Atmosphere

You can easily create and overlays atmosphere on top of game world. This works very well with dynamic lighting.

Just call:

ig.game.camera.addAtmosphere();

For example, you can define the fade duration, the color and the opacity of your atmosphere like this:

// An atmosphere without a "fade in" which
// is slightly red and barely visible

ig.game.camera.addAtmosphere(0,{
    r: 0.1,
    g: 0,
    b: 0,
    alpha: 0.4
});

See the lightAmplification, the lightBaseOnly and the lightsCutout properties for more useful options regarding to atmosphere.

Trigger Entities

Impact++ has also three camera trigger entities built in, that you you can use together with the Weltmeister level editor. EntityCameraAtmosphere is a trigger that changes camera atmosphere. EntityCameraFollow causes the camera to follow each target defined in the targetSequence array of the trigger. And EntityCameraShake is a trigger that causes the camera to shake and simulate an earthquake or explosion.

Learn More!

Camera Class Atmosphere Trigger
Follow Trigger
Shake Trigger
Config File