CanvasToVideo (master) doxdox documentation

An experiment in converting Canvas animations to video.

# CanvasToVideo(url, canvas)

Creates a new CanvasToVideo object. var ctv = new CanvasToVideo('capture.php', document.querySelector('canvas'));

Parameters

Name Types Description
url String The URL for all PUT requests.
canvas Object The canvas to capture frames from.

Returns

Object

New CanvasToVideo object.

# CanvasToVideo.capture()

Method called after canvas drawing has occured to capture frame and either send to server or store in local temporary cache. function draw () { // draw objects to canvas ctv.capture(); requestAnimationFrame(draw); } requestAnimationFrame(draw);

Returns

void

# CanvasToVideo.flush()

Called once animation is complete to send all cached images to the server through the specified URL. ctv.flush();

Returns

void

# CanvasToVideo.setCacheEnabled(enabled)

Sets if caching is enabled or not. ctv.setCacheEnabled(true); // Caching enabled. ctv.setCacheEnabled(false); // Caching disabled.

Parameters

Name Types Description
enabled Boolean Boolean flag for enabling cache.

Returns

void

# CanvasToVideo.setCanvas(canvas)

Sets a new canvas tag once the CanvasToVideo object has already been created. ctv.setCanvas(document.querySelector('.stage'));

Parameters

Name Types Description
canvas Object The canvas to capture frames from.

Returns

void

# CanvasToVideo.setEndpoint(url)

Sets a new URL for sending all PUT requests. ctv.setEndpoint('different_capture_url.php');

Parameters

Name Types Description
url String The new URL for all PUT requests.

Returns

void

# CanvasToVideo.setImageQuality(type)

Sets the image quality saved from the canvas. Must be an integer between 0 and 100. ctv.setImageQuality(60);

Parameters

Name Types Description
type Integer Number between 0 and 100 specifying the quality.

Returns

void

# CanvasToVideo.setImageType(type)

Sets the image type saved from the canvas. Can be either image/png or image/jpeg. ctv.setImageType('image/png'); ctv.setImageType('image/jpeg');

Parameters

Name Types Description
type String The type of image to be captured from the canvas.

Returns

void

# putRequest(url, data, callback)

private method

Sends a PUT request to a URL with the specified data and fires a callback upon completion. putRequest('capture.php', [], function() { alert('Done!'); });

Parameters

Name Types Description
url String The URL for the PUT request.
data Object The data to send.
callback Function The callback function to call once the request has completed.

Returns

void