ig.

Tutorial

new Tutorial()

Visual tutorial to help players learn what to do in game.
- this entity spawns a ig.Demo entity to show what to do IMPORTANT: this is an abstract entity that should be extended.

Author:
  • Collin Hover - collinhover.com
Source:
Example
// creating a tutorial is easy
// setup a demo class with a size and animation to show player what to do
var demoClass = ig.Demo.extend({
    size: {x: 64, y: 64},
    animSheet: new ig.AnimationSheet( 'media/demo.png', 64, 64 ),
		animSettings: {
			idleX: {
				sequence: [0],
				frameTime: 1
			}
		}
});
// create a new tutorial class
var tutorialClass = ig.Tutorial.extend({
     spawningEntity: demoClass,
     // if the tutorial should complete when player does a specific action
     actions: [ 'tap' ],
     // or the tutorial can also check the player for a truthy property
     properties: [ 'jumping' ]
     // and tutorials should probably also tell the player what to do
     // because your visual demo might not make sense to everyone
     textSettings: {
         text: 'do something!'
     },
     // optionally, you might also want an overlay to dim or block view of the game world
     // this can help a player focus on the tutorial and not feel overwhelmed
     overlayEntity: ig.UIOverlay
     // by default, tutorials will isolate the player and any other isolate by name entities
     // this just means these entities are moved to a new layer
     // they won't collide or interact with anything on their original layer
     // until the tutorial is completed or the player moves out of the tutorial area
     // but it is easy to stop this default behavior
     layerNameIsolation: ''
});
// then add the new tutorialClass to your level
// and it will trigger when the player collides with it

actions :Array

List of input actions, that tell tutorial it has been completed.

Source:

autoComplete

Default Value:
  • false
Source:

autoToggle

Tutorials should automatically toggle back to default state.
- this is useful for if player moves out of tutorial the tutorial will stop but be able to be restarted

Default Value:
  • true
Source:

delay

Tutorials should be delayed slightly to allow players that already know how to do tutorial to skip naturally.

Default Value:
  • 1
Source:

duration

Tutorials have infinite respawns until completed.

Source:

<readonly> entity :ig.EntityExtended

Spawned entity used to help player focus and/or give instructions to player.
- created on activation

Source:

isolate :Object

Map of entity names to isolate when tutorial is active.
- use this together with ig.Tutorial#layerNameIsolation and ig.Tutorial#overlayEntity

Source:
Example
// sometimes, it is useful to isolate the player for a tutorial
// this may help them focus on what they need to do
// and the player has the 'player' name by default, so this is easy to do
tutorial.isolate.1 = 'player';

layerNameIsolation :String

Name of layer to isolate entities to. IMPORTANT: this property controls whether or not entities are isolated.

Default Value:
  • overlay
Source:
Example
// tutorial will isolate entities to overlay layer
tutorial.layerNameIsolation = 'overlay';
// tutorial won't isolate entities
tutorial.layerNameIsolation = '';

<readonly> learned :Boolean

Whether player has completed tutorial and learned activity.

Default Value:
  • false
Source:

loops :Number

Times to loop tutorial.

Default Value:
  • // a tutorial can be looped infinitely tutorial.loops = -1; // or just a few times tutorial.loops = 2;
Source:

overlayEntity :ig.UIOverlay

Overlay entity class to use to help player focus during tutorial.
- this will overlay behind isolated entities but over anything else

Default Value:
  • null
Source:

overlaySettings :ig.UIOverlay

Settings object that is based directly on ig.UIOverlay settings.
- this will overlay behind isolated entities but over anything else

Default Value:
  • null
Source:

properties :Array

List of player properties to check for truthy that tell tutorial it has been completed.

Source:

propertiesTarget :Array

List of spawn target properties to check for truthy that tell tutorial it has been completed.

Source:

respawnDelay :Number

Duration in seconds to delay looping of tutorial.

Default Value:
  • 1
Source:

spawnAndMoveTo

Tutorial demos should move to each target in ig.EntityTrigger#target.

Default Value:
  • true
Source:

spawnAndMoveToSettings

Properties:
Name Type Description
tween Boolean true
Source:

spawnAtFirstTarget

Tutorial demos should usually spawn at first target in ig.EntityTrigger#target, then move to rest in sequence.

Default Value:
  • true
Source:

spawnAtRandomPosition

Tutorial demos should not spawn at a random position.

Default Value:
  • false
Source:

spawnedDieWith

Anything tutorial spawns should die when tutorial dies.

Default Value:
  • true
Source:

spawnSettings

Properties:
Name Type Description
layerName String overlay
Source:

suicidal

Tutorials don't die until learned.

Default Value:
  • false
Source:

teardownWhenComplete

Tutorials don't teardown until learned.

Default Value:
  • false
Source:

textEntity :ig.UIText

Text entity class to use to help player focus during tutorial. IMPORTANT: do not use this when using an overlay as overlay already handles text!

Default Value:
  • null
Source:

textSettings :Object

Settings object that is based directly on ig.UIText settings. IMPORTANT: this property controls whether or not text is displayed during tutorial.

Default Value:
  • null
Source:

triggerable

Tutorials should trigger through collision.

Default Value:
  • true
Source:

triggerAfterDelay

Tutorials should not trigger after delay.

Default Value:
  • false
Source:

learn()

Finishes tutorial.

Source:

resetExtras()

Source:

setup(entity)

Setup tutorial.
- overlay is added
- isolates all isolate entities
- starts loop

Parameters:
Name Type Argument Description
entity ig.EntityExtended <optional>
entity to base loop on.
Source:

teardown()

Teardown tutorial.
- overlay is removed
- all isolate entities are returned to their original layers

Source:

unspawn()

Tutorial will automatically complete if not looping.

Source:

update()

Updates tutorial.
- checks if complete via ig.Tutorial#actions ig.Tutorial#properties
- checks if should loop

Source:
See:
  • ig.Spawner.