VoiceRecorderWavebarComponent

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

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

VoiceRecorderComponent

VoiceRecordingComponent