canvas animation using requestAnimationFrame
- Initialize 2d canvas and animate using requestAnimationFrame.
- Create a gameloop that emits update and draw events.
- Emit pause and resume events.
npm install crtrdg-gameloop
- Fork this repository.
- Create a branch for you changes.
- Include tests if applicable.
- Add/edit documentation for any changes.
- Submit a pull request.
Create the game
Parameters
options
Objectoptions.canvas
[Object] – id or dom node of canvas tagoptions.fps
[Number]
Examples
var createGame = require('crtrdg-gameloop')
var game = createGame({ canvas: 'game' })
Draw to the canvas
Parameters
renderer
Objectcontext
delta
Number – time elapsed since last update
End the game. Emits the end
event/
Examples
game.end()
Resume the game. Emits the resume
event.
Examples
game.resume()
Pause or start game depending on game state. Emits either the pause
or resume
event.
Examples
game.toggle()
Update the game state. Emits the update
event. You'll likely never call this method, but you may need to override it. Make sure to always emit the update event with the delta
time.
Parameters
delta
Number – time elapsed since last update
Draw event.
Parameters
renderer
Objectdelta
Number
Examples
game.on('draw', function (renderer, dt) {
console.log(dt)
})
End event. Fired when game.end()
is called.
Examples
game.on('end', function () {})
Pause event. Fired when game.pause()
is called.
Examples
game.on('pause', function () {})
Resume event. Fired when game.resume()
is called.
Examples
game.on('resume', function () {})
Start event. Fired when game.start()
is called.
Examples
game.on('start', function () {})
Update event.
Parameters
delta
Number
Examples
game.on('update', function (dt) {
console.log(dt)
})
MIT