Make games with Superpowers — The extensible, collaborative HTML5 2D+3D game maker

Scripted behaviors

Reusable behaviors can be defined so that you can put them on multiple actors.
This is how a behavior definition might look like:

class MyBehavior extends Sup.Behavior {
  // Declare properties here

  awake() {
    // Put initialization logic here
    // thisactor represents the actor the behavior is attached to

  update() {
    // Put logic that should be executed 60x per second here

// Don't forget to register your behavior class

Inside the behavior's methods (awake, update and others you might define yourself), you can reference the current behavior component with this and the actor it is attached to with

Let's add a behavior to our main character from the previous chapter.

Go back to your Game script and add the following code at the bottom:

class CharacterBehavior extends Sup.Behavior {

  update() {
    if (Sup.Input.isKeyDown("LEFT")) {
      // Move the current behavior's actor by a small negative offset on the X axis, 0, 0);

    if (Sup.Input.isKeyDown("RIGHT")) {
      // Same but positive to go to the right, 0, 0);


// Once the behavior class is defined,
// we need to attach it to our character

Sup.Input.isKeyDown(...) returns true only when the specified key is pressed.

There are many other functions available to read input from the player and react to it.
They are all listed in the TypeScript API browser available from within Superpowers.