powered by 
gamelab  

[ ] show origin

[ ] show hitbox

mouse: 0 x , 0 y

Notifications:

Documentation

Create Engine
const e = createEngine(gameCanvas, width, height);
Example:
const e = createEngine(gameCanvas, 300, 300);
gameCanvas is automatically injected into your game script.

Start Engine
e.start()
End Engine
e.end()
Add Object
e.add({
  tags: ["name"],
  x: number, // the x position
  y: number, // the y position
  vx: number, // the x velocity
  vy: number, // the y velocity
  solid: false, // or true, makes the object collide with other solid objects
  sprite: sprite_name,
  scale: number,
  rotate: number,
  bounce: number, // how much velocity is lost on collisions
  origin: [0, 0], // 0 - 1
  collides: (me, them) => {

  },
  update: (me) => { // runs every frame

  }
})
Add Text
e.addText(
  "string",  
  x, 
  y, 
  { // optional parameters
    color: "string", 
    size: number,
    rotate: number,
  }
)
  
Example of adding text:
const greetingText = e.addText("hello world", 150, 150);
Example of updating text:
greetingText.text = "new greeting";
Example of removing text:
greetingText.remove();
Remove Object
e.remove(obj)
or
e.remove("tag-name")
Key Inputs
e.pressedKey(keyCode)
e.heldKey(keyCode)
Object Properties

On each object you can access:
obj.x
obj.y
obj.vx
obj.vy
obj.width
obj.height
obj.scale
obj.secondsBetweenUpdates
obj.hasTag("tag-name")
    
object.props

Object.props is a handy place to store things you need for your game. Gamelab doesn't do anything to it aside from keep track of it for you.

object.scale

obj.sprite specifies how much bigger to make the sprite.
// make the sprite twice as large
sprite.scale = 2;

// make the sprite twice as tall, but the same width
sprite.scale = [1, 2];

// mirror the sprite over the X axis
sprite.scale = [-1, 1];
    
object.secondsBetweenUpdates

Specifies how often your object's update function should be called.

object.distanceTo(otherObject)

Returns the Euclidean distance between each object.

object.zIndex

Objects with higher zIndexes are rendered on top of objects with lower zIndexes.

object.teleport
obj.x = 100
obj.y = 100
/* vs */
obj.teleport(100, 100)
    
If you simply assign to x and y, collision detection will still be triggered which might stop them from getting there if something is in the way.

Instead, you can use obj.teleport. This will move them to the specified location without triggering collision detection, so that they are guaranteed to get there.

Playing Tunes

To play a tune once:
playTune(tune_asset_name);

// or play multiple tunes

playTune(tune_0, tune_1, tune_2);
    
To play a tune on repeat:
loopTune(tune_asset_name);

// or loop multiple tunes

loopTune(tune_0, tune_1, tune_2);
    
To stop a tune on repeat:
const tuneToStop = loopTune(tune_asset_name);
tuneToStop.end();
    
Idioms

One useful pattern is using maps to functions.
// create our engine
const e = createEngine(gameCanvas, 300, 300);

// here are the behavior maps
const playerHeldKeys = {
  "w": me => me.y -= 2,
  "s": me => me.y += 2,
  "a": me => me.x -= 2,
  "d": me => me.x += 2,
}

const playerPressedKeys = {
  " ": me => {
    console.log("pressed space");
  },
}

const playerCollisions = {
  "floor": (me, them) => {
    console.log("collided with floor");
  }
}

// define the player object
const player = {
  sprite: sprite_player,
  x: 10,
  y: 20,
  scale: 2,
  collides: (me, them) => {
    collidesMap(me, them, playerCollisions)
  },
  update: me => {
    heldKeyMap(me, playerHeldKeys)
    pressedKeyMap(me, playerPressedKeys)
  }
}

// use the player object
e.add(player);

// define the floor object
const floor = {
  tags: ["floor"],
  sprite: sprite_floor,
  scale: [18, 2],
  y: 221
}

// use the floor object
e.add(floor);

// start the engine
e.start();

// here are some helper functions to map inputs to events
function pressedKeyMap(me, map) {
  for (let k in map) {
    if (e.pressedKey(k)) map[k](me);
  }
}

function heldKeyMap(me, map) {
  for (let k in map) {
    if (e.heldKey(k)) map[k](me);
  }
}

function collidesMap(me, them, map) {
  for (let k in map) {
    if (them.hasTag(k)) map[k](me, them);
  }
}
    
Examples

Examples can be found in the GitHub repository README, check out the "Tiny Games".