Recorder
Recorder helper
Records a video of the ResponsiveCanvas backing a CanvasRenderer. ResponsiveCanvas is multi-layer. Every rendering update Recorder merges all snapshots onto the recording canvas. Then canvas’es content is grabbed and encoded by MediaRecorder. Encoded video chunks are cached to later be merged into one blob containing the final video file. There’re several modes for resolution of the recorded video: “video” - records in the same resolution as the video stream, “max”/“min” - in maximum/minimum size among layers of canvas. Additionally one can limit resolution and bitrate of a video.
Constructors
Section titled “Constructors”Constructor
Section titled “Constructor”new Recorder(
renderer,type,mirror,sizeMode,sizeMax?,bitRate?):Recorder
Constructor
Parameters
Section titled “Parameters”renderer
Section titled “renderer”Renderer to record video from
string = "video/webm"
Media/video type
mirror
Section titled “mirror”boolean = false
Mirror captured images
sizeMode
Section titled “sizeMode”Video size mode
"video" | "max" | "min"
sizeMax?
Section titled “sizeMax?”number
Maximum video size
bitRate?
Section titled “bitRate?”number
Video stream bit rate
Returns
Section titled “Returns”Recorder
Properties
Section titled “Properties”bitRate?
Section titled “bitRate?”
protectedoptionalbitRate:number
Video stream bit rate
canvas
Section titled “canvas”
protectedcanvas:HTMLCanvasElement
Canvas to capture video
context
Section titled “context”
protectedcontext:null|CanvasRenderingContext2D=null
Drawing context of capturing canvas
mirror
Section titled “mirror”
protectedmirror:boolean=false
Mirror captured images
recorder?
Section titled “recorder?”
protectedoptionalrecorder:MediaRecorder
Video recorder
records
Section titled “records”
protectedrecords:Blob[] =[]
Record chunks
renderer
Section titled “renderer”
protectedrenderer:CanvasRenderer
Renderer to record video from
sizeMax?
Section titled “sizeMax?”
protectedoptionalsizeMax:number
Maximum video size
sizeMode
Section titled “sizeMode”
protectedsizeMode:"video"|"max"|"min"="video"
Video size mode
stream?
Section titled “stream?”
protectedoptionalstream:MediaStream
Video stream
protectedtype:string="video/webm"
Media/video type
Methods
Section titled “Methods”dispose()
Section titled “dispose()”dispose():
void
Dispose recorder object
Releases resources and instances allocated by recorder. Recorder object cannot be used after calling dispose(). One needs to stop recording before disposing the object.
Returns
Section titled “Returns”void
frame()
Section titled “frame()”
protectedframe():void
Renderer update callback
On every update Recorder draws all layers onto recording canvas and requests video track to capture a new frame.
Returns
Section titled “Returns”void
start()
Section titled “start()”start():
boolean
Start video recording
On every render update Recorder draws all layers onto recording canvas. Chunks of encoded media stream are cached to later be merged into one blob on stop().
Returns
Section titled “Returns”boolean
True if recording started, False otherwise
stop()
Section titled “stop()”stop():
Promise<undefined|Blob>
Stop video recording
Renderer stops recording and then merges encoded video stream chunks into one blob returned to user.
Returns
Section titled “Returns”Promise<undefined | Blob>
Promise resolved to Blob containing encoded video