Class: Recorder
@geenee/armature.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
constructor
• new Recorder(renderer, type?, mirror?, sizeMode?, sizeMax?, bitRate?)
Constructor
Parameters
| Name | Type | Default value | Description |
|---|---|---|---|
renderer | CanvasRenderer<> | undefined | Renderer to record video from |
type | string | "video/webm" | Media/video type |
mirror | boolean | false | Mirror captured images |
sizeMode | "video" | "max" | "min" | "video" | Video size mode |
sizeMax? | number | undefined | Maximum video size |
bitRate? | number | undefined | Video stream bit rate |
Properties
bitRate
• Protected Optional bitRate: number
Video stream bit rate
canvas
• Protected canvas: HTMLCanvasElement
Canvas to capture video
context
• Protected context: null | CanvasRenderingContext2D = null
Drawing context of capturing canvas
mirror
• Protected mirror: boolean = false
Mirror captured images
recorder
• Protected Optional recorder: MediaRecorder
Video recorder
records
• Protected records: Blob[] = []
Record chunks
renderer
• Protected renderer: CanvasRenderer<>
Renderer to record video from
sizeMax
• Protected Optional sizeMax: number
Maximum video size
sizeMode
• Protected sizeMode: "video" | "max" | "min" = "video"
Video size mode
stream
• Protected Optional stream: MediaStream
Video stream
type
• Protected type: string = "video/webm"
Media/video type
Methods
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
void
frame
▸ Protected frame(): void
Renderer update callback
On every update Recorder draws all layers onto recording canvas and requests video track to capture a new frame.
Returns
void
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
boolean
True if recording started, False otherwise
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
Promise<undefined | Blob>
Promise resolved to Blob containing encoded video