@callmehiphop/ticker

ticker

Simple event based game loop based on the Game Programming Patterns Game Loop chapter.

Install

$ npm install --save @callmehiphop/ticker

Usage

const Ticker = require('@callmehiphop/ticker');
const ticker = new Ticker();

ticker.on('update', (dt) => {
  // update all the things!
});

ticker.on('render', () => {
  // render all the things!
});

// stop the ticker
ticker.stop();

// resume the ticker
ticker.resume();

API

new Ticker(el, [fps])

el

Type: canvas

HTML element to be passed into requestAnimationFrame - presumably canvas.

fps

Type: number
Default: 60

Desired frames per second, this will alter how often the update event is fired.

const canvas = document.getElementById('my-canvas');
const ticker = new Ticker(canvas, 30);

ticker.on('update', handler)

Indicates models should be updated with provided delta time.

handler(dt)

Type: function

ticker.on('update', (dt) => {
  // Update all your models.
});

ticker.on('render', handler)

Indicates that you should draw the current state of your models.

handler(frameStep)

frameStep is how far into the current frame we are.

Type: function

ticker.on('render', (frameStep) => {
  // Render all your models.
});

ticker.stop()

Stops the ticker.

ticker.stop();

ticker.resume()

Resumes the ticker.

ticker.resume();

License

MIT