This project demonstrates the usage of a user-defined audio recording API in a website. The implementation is based on the explained audio recording API here[insert here]. The following is a screenshot of the demo's view.
- Audio Recording.
- Stopping the Audio Recording, where the maximum recording duration is 1 hour.
- Listening to the recorded audio played back once recording has stopped.
- Canceling the Audio Recording.
- Clone the project.
- Open index.html in your favorite browser, where now you can start enjoying the demo!
To start the audio recording, the microphone icon must be clicked. Once the icon is clicked, the audio recording should get started, that is if the user grants permission and if no error has occurred.
When the recording starts, the elapsed recording time is displayed alongside two buttons that allow stopping and canceling the ongoing audio recording.
The following GIF image demonstrates starting the audio recording.
To stop the ongoing audio recording, the stop button should be clicked. Once the audio recording has successfully stopped, the audio is played back to the user.
The following GIF image demonstrates stopping the audio recording.
To cancel the ongoing audio recording, the cancel button should be clicked.
The following GIF image demonstrates stopping the audio recording.
When the user attempts to start an audio recording in a browser that does not support the audio recording API, a message box will be displayed for the user to inform him why they cannot use the audio recording feature.
The following GIF image shows the message box displayed to the user.
