[ ] show origin
[ ] show hitbox
mouse: 0 x , 0 yconst e = createEngine(gameCanvas, width, height);Example:
const e = createEngine(gameCanvas, 300, 300);
gameCanvas
is automatically injected into your game script.
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
obj.x obj.y obj.vx obj.vy obj.width obj.height obj.scale obj.secondsBetweenUpdates obj.hasTag("tag-name")object.props
// 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
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.
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
// 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