VoiceRecorderWavebarComponent

The VoiceRecorderWavebarComponent displays the amplitudes of the recording while the recording is in progress

Voice recorder wavebar

The component doesn't have any inputs, instead it uses the AudioRecorderService and the AmplitudeRecorderService to gather all necessary data.

Usage

<stream-voice-recorder-wavebar
  *ngIf="isRecording$ | async"
></stream-voice-recorder-wavebar>
isRecording$: Observable<boolean>;

constructor(public readonly recorder: AudioRecorderService) {
    this.isRecording$ = this.recorder.recordingState$.pipe(map(s => s === MediaRecordingState.RECORDING || s === MediaRecordingState.PAUSED));
}

Customization

Inputs and outputs