Skip to content

tdhooper/web-frames-capture

Folders and files

NameName
Last commit message
Last commit date

Latest commit

 

History

8 Commits
 
 
 
 
 
 
 
 
 
 

Repository files navigation

Web Frames Capture

Usage

  1. In your project:
$ npm install --save web-frames-capture
const WebCaptureClient = require('web-frames-capture');

var captureSetup = function(config, done) {
    // Configure your scene with config.width and config.height,
    // you'll probably want to stop animation and reset your timer
    // to 0
    done();
};

var captureTeardown = function() {
    // Restore your scene as it was before captureSetup
};

var captureRender = function(milliseconds, quad, done) {
    // Draw your scene at the given time
    // If quads is enabled, quad counts from 0 to 3 for each frame,
    // otherwise it's undefined
    done();
};

// Default config used by the UI
var captureConfig = {
  fps: 30,
  seconds: 2, // (duration)
  width: 1200,
  height: 1200,
  quad: true // optional, render each frame 4 times, for splitting a screen into quads
};

var webCapture = new WebCaptureClient(
  canvas, // The canvas element you're drawing to
  captureSetup,
  captureTeardown,
  captureRender,
  captureConfig
);
  1. Open the UI and enter the url where your project is running

About

Capture canvas animations as a PNG sequence

Resources

License

Stars

Watchers

Forks

Releases

No releases published

Packages

No packages published