@filerobot/screen-capture

The screen capture records the device's screen with processing the recorded video for uploading.

Usage

From NPM

The plugin is on NPM as @filerobot/screen-capture

npm install --save @filerobot/screen-capture

then

import ScreenCapture from '@filerobot/screen-capture'
...
...
...
filerobot.use(ScreenCapture, optionsObject)

From CDN

The plugin from CDN is found inside Filerobot global object Filerobot.ScreenCapture

const ScreenCapture = window.Filerobot.ScreenCapture
...
...
...
filerobot.use(ScreenCapture, optionsObject)

Plugin's styles

import '@filerobot/core/dist/style.css'
import '@filerobot/screen-capture/dist/style.css'

or if you prefer the minified version

import '@filerobot/core/dist/style.min.css'
import '@filerobot/screen-capture/dist/style.min.css'

The plugin's css file should be imported after the Core's css file for having the styles shown correctly.

Options

id: string (optional)

default: 'ScreenCapture'

An unique identifier for the plugin to be indentified between the other plugins through it.

title: string (optional)

default: 'Screen cast'

The title shown in the topbar of the panel.

preferredVideoMimeType: string (optional)

default: null

The mime type for the recorded video to be saved with if you provided un-supported mime type then the browser's default would be used, if you left it null then if found any suitable type inside allowedFileTypes it would be used.

displayMediaConstraints: object (optional)

default:

video: {
  width: 1280,
  height: 720,
  frameRate: {
    ideal: 3,
    max: 5
  },
  cursor: 'motion',
  displaySurface: 'monitor'
}

The options being passed for getDisplayMedia method of navigator.mediaDevices. Check the available options/properties from MDN Docs Whether to show the video's recording length or not while it is in progress.

userMediaConstraints: : object (optional)

default:

{
  audio: true
}

The options being passed for getUserMedia method of navigator.mediaDevices. Check the available options/properties from MDN Docs Whether to show the video's recording length or not while it is in progress.

locale: object (optional)

default:

strings: {
  startCapturing: 'Begin screen capturing',
  stopCapturing: 'Stop screen capturing',
  submitRecordedFile: 'Submit captured video',
  streamActive: 'Stream active',
  streamPassive: 'Stream passive',
  micDisabled: 'Microphone access denied by user',
  recording: 'Recording'
}

Customizing some of the translations or the language's strings and replace the default locale.