@jaak.ai/video-camera v1.3.1

video-camera Component

This component provides an interface for accessing the user's webcam and displaying the video stream in a <video> element. It also allows pausing, resuming, and stopping the video stream, as well as accessing the video stream object and camera object.

Properties

Events

• streamStatus: Fired when the video stream status changes.
• componentError: Fired when an error occurs in the component.

Methods

• pauseStream(): Pauses the video stream.
• resumeStream(): Resumes the video stream.
• stopStream(): Stops the video stream.
• getVideoStream(): Returns the video element if camera access permission has been granted.
• getStream(): Returns the video stream.

Usage Example

<video-camera
  config={{
    width: '640px',
    height: '480px',
    enableMicrophone: true,
    showMessages: true,
    messageDetail: 'Error accessing the camera',
  }}
  onStreamStatus={(event) => handleStreamStatus(event.detail)}
  onComponentError={(event) => handleComponentError(event.detail)}
></video-camera>

video-camera-recorder Component

This component extends the functionality of the video-camera component by adding recording capabilities. It allows users to start, stop, and pause video recording, as well as capture snapshots from the video stream.

Properties

VideoCameraConfig

Events

• streamStatus: Fired when the video stream status changes.
• componentError: Fired when an error occurs in the component.

Methods

• startRecording(): Promise -> Starts recording the video stream.
• stopRecording(): Promise -> Stops recording the video stream and returns the recorded video as a Base64 string.
• startTimedRecording(seconds: number): Promise -> Starts recording the video stream for a specified duration in seconds and returns the recorded video as a Base64 string.
• resumeStream(): Resumes the video stream playback.
• pauseStream(): Pauses the video stream playback.
• stopStream(): Stops the video stream playback.
• takeSnapshot(): Promise -> Captures a snapshot from the video stream and returns it as a Base64-encoded image.

Example Usage

<video-camera-recorder
  config={{
    width: '640px',
    height: '480px',
    enableMicrophone: true,
    showMessages: true,
    messageDetail: 'Error accessing the camera',
  }}
  onStreamStatus={(event) => handleStreamStatus(event.detail)}
  onComponentError={(event) => handleComponentError(event.detail)}
></video-camera-recorder>

Services

The component provides tools to complement its use in different needs.

Spoofing Detector Service

When you instantiate this class SpoofingDetectorService as a service, it allows you to access methods to control and manage the camera authentication system.

Methods

• authenticateVideoStream(stream: MediaStream): Determines the veracity and validity of the camera
• getVideoDevices(): Returns the list of available video devices
• getStreamDeviceInfo(stream: MediaStream): Returns device information(MediaDeviceInfo) from the played video stream
• checkCamerasInWhiteList(device: MediaDeviceInfo): Returns whether a device is whitelisted.

• checkCamerasInBlackList(device: MediaDeviceInfo): Returns whether a device is blacklisted.

• addCameraToWhiteList(deviceName: string, type: 'desktop' | 'mobile'): Add an item to the whitelist of supported devices

• addCameraToBlackList(deviceName: string): Add an item to the blacklist of supported devices

• removeCameraFromWhiteList(element: string, type: 'desktop' | 'mobile'): Removes a device name from the whitelist of supported devices

• removeCameraFromBlackList(element: string): Removes a device name from the blacklist of supported devices

Error interface

When the component fails, it throws an error with next interface details:

interface webComponentError {
  label: string;
  code?: string;
  details?: any;
}

This component is owned by JAAK and is their intellectual property. Visit more details in https://jaak.ai