@pathfindr.dev/recorder

recorder

This is the pathfindr recorderSDK that you can use to make recordings of the screen, camera or both.

Documentation

You can find the full documentation for the recorder and our other products here https://pathfindr.dev/docs.

Quickstart

Install it using npm

npm install '@pathfindr.dev/recorder'

Create a HTMLElement

<div id="recorder-container" />

Initialize the recorder

import Recorder from '@pathfindr.dev/recorder';
import '@pathfindr.dev/recorder/large.css'; // or small.css

const element = document.getElementById('recorder-container');
const recorder = new Recorder({
  target: element,
  props: {
    type: 'camera', // camera, screen, screencamera
    accessToken: '81cca05e-0ebe-4819-9b13-5e92271ade59',
    externalUserId: 'user-id-512',
    language: 'da', // en, da, de
    showProgress: true,
  }
});

// Progress when uploading
recorder.$on('progress', (event) => {
  const progress = event.detail;
  console.log(progress);
});

// Recording ready to be uploaded or not. 
// Default is false
recorder.$on('recordingchange', (event) => {
  const recordingReady = event.detail;
  console.log(recordingReady);
});

// Recording state changed (inactive, recording, paused)
recorder.$on('statechange', (event) => {
  const state = event.detail;
  console.log(state);
});

// Removes the component from the DOM and stops the media streams.
// This should always be called if you intend to initialize a new recorder on the same page or in a SPA.
recorder.$destroy();

// When you are ready to upload the recording. The result will contain the name and uuid of your recording.
const result = await recorder.upload();