fc

fc

AKA: fullscreen canvas

Install

npm install fc or use the fc.min.js file.

Use

 
var ctx = fc(function(deltaTime) {
  
  // render stuff into ctx
  // `this` is also ctx for ease of use
 
});
 
// put the canvas into a "render only when dirty" mode
 
ctx.stop();
 
// to schedule a new frame
 
ctx.dirty();
 
// subsequent calls to dirty in the same tick will have no effect
 
ctx.dirty();
 
// to restart the auto-render mode
 
ctx.start();
 
// to fill the entire canvas with a color
 
ctx.clear('red');
 
// last but not least, to access the canvas
 
ctx.canvas
 
// only render when dirtied
 
var ctx = fc(function(deltaTime) {}, false);
 
// get the current 3x3 transformation matrix (2d only)
 
var ctx = fc(function() {
    ctx.translate(10, 100)
    console.log(ctx.getTransform())
})
 
// transform a point from screen to world space
 
var ctx = fc(function() {
    ctx.translate(10, 100)
    var incoming = [10, 10] // could be a the mouse pos or similar
    var result = [0, 0]
    ctx.pointToWorld(result, incoming) // project the point into the world
    console.log(result)
})
 

note: fc will render one time even if autorun is set false. During this initial render deltaTime will be 0

License

MIT (see license.txt)