saveFrames()

Captures a sequence of frames from the canvas that can be saved as images.

saveFrames() creates an array of frame objects. Each frame is stored as an object with its file type, file name, and image data as a string. For example, the first saved frame might have the following properties:

{ ext: 'png', filenmame: 'frame0', imageData: 'data:image/octet-stream;base64, abc123' }.

The first parameter, filename, sets the prefix for the file names. For example, setting the prefix to 'frame' would generate the image files frame0.png, frame1.png, and so on.

The second parameter, extension, sets the file type to either 'png' or 'jpg'.

The third parameter, duration, sets the duration to record in seconds. The maximum duration is 15 seconds.

The fourth parameter, framerate, sets the number of frames to record per second. The maximum frame rate value is 22. Limits are placed on duration and framerate to avoid using too much memory. Recording large canvases can easily crash sketches or even web browsers.

The fifth parameter, callback, is optional. If a function is passed, image files won't be saved by default. The callback function can be used to process an array containing the data for each captured frame. The array of image data contains a sequence of objects with three properties for each frame: imageData, filename, and extension.

Note: Frames are downloaded as individual image files by default.