import {Record} from 'videojs-record/js/videojs.record.js'

public class | source

Record

Extends:

Plugin → Record

Record audio/video/images using the Video.js player.

Constructor Summary

Public Constructor
public	constructor(player: videojs.Player \| Object, options: Object) The constructor function for the class.

Member Summary

Public Members
public	animationFrameRate: *
public	animationQuality: *
public	audioBitRate: *
public	audioBufferSize: *
public	audioBufferUpdate: *
public	audioChannels: *
public	audioEngine: *
public	audioMimeType: *
public	audioRecorderType: *
public	audioSampleRate: *
public	audioWebAssemblyURL: *
public	audioWorkerURL: *
public	autoMuteDevice: *
public	convertAuto: *
public	convertEngine: *
public	convertOptions: *
public	convertWorkerURL: *
public	converter: *
public	countDown: *
public	debug: *
public	deviceErrorCallback: *
public	deviceReadyCallback: *
public	devices: *[]
public	displayMilliseconds: *
public	engine: *
public	engineStopCallback: *
public	imageOutputFormat: *
public	imageOutputQuality: *
public	imageOutputType: *
public	maxFileSize: *
public	maxLength: *
public	mediaElement: *
public	mediaType: {"audio": , "video": }
public	onEnterPiPHandler: *
public	onLeavePiPHandler: *
public	pauseTime: *
public	paused: boolean
public	pausedTime: *
public	pictureInPicture: boolean
public	pluginLibraryOptions: *
public	recordAnimation: *
public	recordAudio: *
public	recordImage: *
public	recordScreen: *
public	recordTimeSlice: *
public	recordVideo: *
public	startTime: *
public	stream: *
public	streamCurrentTime: *
public	streamDuration: *
public	streamVisibleCallback: *
public	surfer: *
public	videoBitRate: *
public	videoEngine: *
public	videoFrameHeight: *
public	videoFrameRate: *
public	videoFrameWidth: *
public	videoMimeType: *
public	videoRecorderType: *
public	videoWebAssemblyURL: *
public	videoWorkerURL: *

Private Members
private	_deviceActive: boolean
private	_formatTime: *
private	_processing: boolean
private	_recording: boolean

Method Summary

Public Methods
public	convert() Start converter.
public	destroy() Destroy plugin and players and cleanup resources.
public	dispose() Destroy plugin only.
public	enumerateDevices() Collects information about the media input and output devices available on the system.
public	exportImage(format: string, quality: number): Promise Export image data of waveform (audio-only) or current video frame.
public	getCurrentTime(): float Get the current time of the recorded stream during playback.
public	getDevice() Open the browser's recording device selection dialog and start the device.
public	getDuration(): float Get the length of the recorded stream in seconds.
public	getRecordType(): string Get recorder type.
public	isDestroyed(): boolean Indicates whether the plugin is destroyed or not.
public	isProcessing(): boolean Indicates whether the plugin is currently processing recorded data or not.
public	isRecording(): boolean Indicates whether the plugin is currently recording or not.
public	load(url: string \| blob \| file) Start loading data.
public	loadOptions(newOptions: Object) Setup plugin options.
public	muteTracks(mute: boolean) Mute LocalMediaStream audio and video tracks.
public	pause() Pause recording.
public	reset() Reset the plugin.
public	resume() Resume recording.
public	saveAs(name: Object, type: String): void Show save as dialog in browser so the user can store the recorded or converted media locally.
public	setAudioInput(deviceId: string) Change the audio input device.
public	setAudioOutput(deviceId: string) Change the audio output device.
public	setFormatTime(customImplementation: function) Replaces the default `formatTime` implementation with a custom implementation.
public	setVideoInput(deviceId: string) Change the video input device.
public	start() Start recording.
public	stop() Stop recording.
public	stopDevice() Stop device(s) and recording if active.
public	stopStream() Stop stream and device.

Private Methods
private	captureFrame(): void Capture frame from camera and copy data to canvas.
private	createSnapshot() Create and display snapshot image.
private	displaySnapshot() Display snapshot image.
private	displayVolumeControl(display: boolean) Show or hide the volume menu.
private	drawCanvas(canvas: HTMLCanvasElement, element: HTMLElement, width: Number, height: Number, x: Number, y: Number) Draw image frame on canvas element.
private	hideAnimation() Hide animated GIF.
private	onCountDown() Invoked during recording and displays the remaining time.
private	onDeviceError(code: string \| number) Invoked when an device error occurred.
private	onDeviceReady(stream: LocalMediaStream) Invoked when the device is ready.
private	onEnterPiP(event: object) Invoked when entering picture-in-picture mode.
private	onLeavePiP(event: object) Invoked when leaving picture-in-picture mode.
private	onRecordComplete() Invoked when recording completed and the resulting stream is available.
private	onStreamVisible(event: Event) Invoked when the video device is ready and stream is visible.
private	playbackTimeUpdate() Update time during playback.
private	removeRecording() Removes recorded `Blob` from cache.
private	resetState() Reset the plugin recorder state.
private	retrySnapshot() Reset UI for retrying a snapshot image.
private	setCurrentTime(currentTime: number, duration: number) Updates the player's element displaying the current time.
private	setDuration(duration: number) Updates the player's element displaying the duration time.
private	setupUI() Player UI is ready.
private	showAnimation() Show animated GIF.
private	startRecording() Start recording.
private	startVideoPreview() Start preview of video stream.

Public Constructors

public constructor(player: videojs.Player | Object, options: Object) source

The constructor function for the class.

Params:

Name	Type	Attribute	Description
player	videojs.Player \| Object		video.js Player object.
options	Object		Player options.

Public Members

public animationFrameRate: * source

public animationQuality: * source

public audioBitRate: * source

public audioBufferSize: * source

public audioBufferUpdate: * source

public audioChannels: * source

public audioEngine: * source

public audioMimeType: * source

public audioRecorderType: * source

public audioSampleRate: * source

public audioWebAssemblyURL: * source

public audioWorkerURL: * source

public autoMuteDevice: * source

public convertAuto: * source

public convertEngine: * source

public convertOptions: * source

public convertWorkerURL: * source

public converter: * source

public countDown: * source

public debug: * source

public deviceErrorCallback: * source

public deviceReadyCallback: * source

public devices: *[] source

public displayMilliseconds: * source

public engine: * source

public engineStopCallback: * source

public imageOutputFormat: * source

public imageOutputQuality: * source

public imageOutputType: * source

public maxFileSize: * source

public maxLength: * source

public mediaElement: * source

public mediaType: {"audio": , "video": } source

public onEnterPiPHandler: * source

public onLeavePiPHandler: * source

public pauseTime: * source

public paused: boolean source

public pausedTime: * source

public pictureInPicture: boolean source

public pluginLibraryOptions: * source

public recordAnimation: * source

public recordAudio: * source

public recordImage: * source

public recordScreen: * source

public recordTimeSlice: * source

public recordVideo: * source

public startTime: * source

public stream: * source

public streamCurrentTime: * source

public streamDuration: * source

public streamVisibleCallback: * source

public surfer: * source

public videoBitRate: * source

public videoEngine: * source

public videoFrameHeight: * source

public videoFrameRate: * source

public videoFrameWidth: * source

public videoMimeType: * source

public videoRecorderType: * source

public videoWebAssemblyURL: * source

public videoWorkerURL: * source

Private Members

private _deviceActive: boolean source

private _formatTime: * source

private _processing: boolean source

private _recording: boolean source

Public Methods

public convert() source

Start converter.

public destroy() source

Destroy plugin and players and cleanup resources.

public dispose() source

Destroy plugin only.

Use [destroy]Record#destroy to remove the plugin and the player as well.

public enumerateDevices() source

Collects information about the media input and output devices available on the system.

public exportImage(format: string, quality: number): Promise source

Export image data of waveform (audio-only) or current video frame.

The default format is 'image/png'. Other supported types are 'image/jpeg' and 'image/webp'.

Params:

Name	Type	Attribute	Description
format	string	default: 'image/png'	A string indicating the image format. The default format type is `'image/png'`.
quality	number	default: 1	A number between 0 and 1 indicating the image quality to use for image formats that use lossy compression such as 'image/jpeg'` and `'image/webp'`.

Return:

Promise

Returns a Promise resolving with an array of Blob instances.

public getCurrentTime(): float source

Get the current time of the recorded stream during playback.

Returns 0 if no recording is available (yet).

Return:

float

Current time of the recorded stream.

public getDevice() source

Open the browser's recording device selection dialog and start the device.

public getDuration(): float source

Get the length of the recorded stream in seconds.

Returns 0 if no recording is available (yet).

Return:

float

Duration of the recorded stream.

public getRecordType(): string source

Get recorder type.

Return:

string

Recorder type constant.

Example:

console.log(player.record().getRecordType()); // 'audio_video'

public isDestroyed(): boolean source

Indicates whether the plugin is destroyed or not.

Return:

boolean

Plugin destroyed or not.

public isProcessing(): boolean source

Indicates whether the plugin is currently processing recorded data or not.

Return:

boolean

Plugin processing or not.

public isRecording(): boolean source

Indicates whether the plugin is currently recording or not.

Return:

boolean

Plugin currently recording or not.

public load(url: string | blob | file) source

Start loading data.

Params:

Name	Type	Attribute	Description
url	string \| blob \| file		Either the URL of the media file, a Blob, a File object or MediaStream.

public loadOptions(newOptions: Object) source

Setup plugin options.

Params:

Name	Type	Attribute	Description
newOptions	Object		Optional new player options.

public muteTracks(mute: boolean) source

Mute LocalMediaStream audio and video tracks.

Params:

Name	Type	Attribute	Description
mute	boolean		Whether or not the mute the track(s).

public pause() source

Pause recording.

public reset() source

Reset the plugin.

public resume() source

Resume recording.

public saveAs(name: Object, type: String): void source

Show save as dialog in browser so the user can store the recorded or converted media locally.

Params:

Name	Type	Attribute	Description
name	Object		Object with names for the particular blob(s) you want to save. File extensions are added automatically. For example: {'video': 'name-of-video-file'}. Supported keys are 'audio', 'video' and 'gif'.
type	String		Type of media to save. Legal values are 'record' (default) and 'convert'.

Return:

void

Example:

// save recorded video file as 'foo.webm'
player.record().saveAs({'video': 'foo'});

// save converted video file as 'bar.mp4'
player.record().saveAs({'video': 'bar'}, 'convert');

public setAudioInput(deviceId: string) source

Change the audio input device.

Params:

Name	Type	Attribute	Description
deviceId	string		Id of the audio input device.

public setAudioOutput(deviceId: string) source

Change the audio output device.

Params:

Name	Type	Attribute	Description
deviceId	string		Id of audio output device.

public setFormatTime(customImplementation: function) source

Replaces the default formatTime implementation with a custom implementation.

Params:

Name	Type	Attribute	Description
customImplementation	function		A function which will be used in place of the default `formatTime` implementation. Will receive the current time in seconds and the guide (in seconds) as arguments.

public setVideoInput(deviceId: string) source

Change the video input device.

Params:

Name	Type	Attribute	Description
deviceId	string		Id of the video input device.

public start() source

Start recording.

public stop() source

Stop recording.

public stopDevice() source

Stop device(s) and recording if active.

public stopStream() source

Stop stream and device.

Private Methods

private captureFrame(): void source

Capture frame from camera and copy data to canvas.

Return:

void

private createSnapshot() source

Create and display snapshot image.

private displaySnapshot() source

Display snapshot image.

private displayVolumeControl(display: boolean) source

Show or hide the volume menu.

Params:

Name	Type	Attribute	Description
display	boolean		Hide/show volume control.

private drawCanvas(canvas: HTMLCanvasElement, element: HTMLElement, width: Number, height: Number, x: Number, y: Number) source

Draw image frame on canvas element.

Params:

Name	Type	Attribute	Description
canvas	HTMLCanvasElement		Canvas to draw on.
element	HTMLElement		Element to draw onto the canvas.
width	Number		Width of drawing on canvas.
height	Number		Height of drawing on canvas.
x	Number		X position on canvas where drawing starts.
y	Number		Y position on canvas where drawing starts.

private hideAnimation() source

Hide animated GIF.

private onCountDown() source

Invoked during recording and displays the remaining time.

private onDeviceError(code: string | number) source

Invoked when an device error occurred.

Params:

Name	Type	Attribute	Description
code	string \| number		Error code/description.

private onDeviceReady(stream: LocalMediaStream) source

Invoked when the device is ready.

Params:

Name	Type	Attribute	Description
stream	LocalMediaStream		Local media stream from device.

private onEnterPiP(event: object) source

Invoked when entering picture-in-picture mode.

Params:

Name	Type	Attribute	Description
event	object		Event data.

private onLeavePiP(event: object) source

Invoked when leaving picture-in-picture mode.

Params:

Name	Type	Attribute	Description
event	object		Event data.

private onRecordComplete() source

Invoked when recording completed and the resulting stream is available.

private onStreamVisible(event: Event) source

Invoked when the video device is ready and stream is visible.

Params:

Name	Type	Attribute	Description
event	Event		`playing` event

private playbackTimeUpdate() source

Update time during playback.

private removeRecording() source

Removes recorded Blob from cache.

private resetState() source

Reset the plugin recorder state.

private retrySnapshot() source

Reset UI for retrying a snapshot image.

private setCurrentTime(currentTime: number, duration: number) source

Updates the player's element displaying the current time.

Params:

Name	Type	Attribute	Description
currentTime	number	optional default: 0	Current position of the playhead (in seconds).
duration	number	optional default: 0	Duration in seconds.

private setDuration(duration: number) source

Updates the player's element displaying the duration time.

Params:

Name	Type	Attribute	Description
duration	number	optional default: 0	Duration in seconds.

private setupUI() source

Player UI is ready.

private showAnimation() source

Show animated GIF.

private startRecording() source

Start recording.

private startVideoPreview() source

Start preview of video stream.

Record

Extends:

Constructor Summary

Member Summary

Method Summary

Public Constructors

public constructor(player: videojs.Player | Object, options: Object) source

Params:

Public Members

public animationFrameRate: * source

public animationQuality: * source

public audioBitRate: * source

public audioBufferSize: * source

public audioBufferUpdate: * source

public audioChannels: * source

public audioEngine: * source

public audioMimeType: * source

public audioRecorderType: * source

public audioSampleRate: * source

public audioWebAssemblyURL: * source

public audioWorkerURL: * source

public autoMuteDevice: * source

public convertAuto: * source

public convertEngine: * source

public convertOptions: * source

public convertWorkerURL: * source

public converter: * source

public countDown: * source

public debug: * source

public deviceErrorCallback: * source

public deviceReadyCallback: * source

public devices: *[] source

public displayMilliseconds: * source

public engine: * source

public engineStopCallback: * source

public imageOutputFormat: * source

public imageOutputQuality: * source

public imageOutputType: * source

public maxFileSize: * source

public maxLength: * source

public mediaElement: * source

public mediaType: {"audio": *, "video": *} source

public onEnterPiPHandler: * source

public onLeavePiPHandler: * source

public pauseTime: * source

public paused: boolean source

public pausedTime: * source

public pictureInPicture: boolean source

public pluginLibraryOptions: * source

public recordAnimation: * source

public recordAudio: * source

public recordImage: * source

public recordScreen: * source

public recordTimeSlice: * source

public recordVideo: * source

public startTime: * source

public stream: * source

public streamCurrentTime: * source

public streamDuration: * source

public streamVisibleCallback: * source

public surfer: * source

public videoBitRate: * source

public videoEngine: * source

public videoFrameHeight: * source

public videoFrameRate: * source

public videoFrameWidth: * source

public videoMimeType: * source

public videoRecorderType: * source

public videoWebAssemblyURL: * source

public videoWorkerURL: * source

Private Members

private _deviceActive: boolean source

private _formatTime: * source

private _processing: boolean source

private _recording: boolean source

Public Methods

public convert() source

public destroy() source

public dispose() source

public enumerateDevices() source

public mediaType: {"audio": , "video": } source