austinhutchen / wavPlay

See the waveform of your voice or song of choice, directly through your computer's microphone! This lightweight audio recorder web application displays the Fast Fourier Transform output of your device's microphone, using the Typescript webMedia API. I often use this app to record bird calls and upload them to my FireBase database.

Home Page:https://wavplay.vercel.app

Geek Repo:Geek Repo

Github PK Tool:Github PK Tool

WavPlay

https://wavplay.vercel.app/
Screenshot 2024-03-13 at 1 25 35 PM

This project was generated with [Angular CLI](https://github.com/angular/angular-cli) version 17.0.5.
I integrated it into my website Here!


  • The program uses the navigator.mediaDevices.getUserMedia method to get access to the user’s microphone.
  • It creates an AudioContext and a MediaStreamSource from the user’s microphone stream.
  • It connects the MediaStreamSource to an AnalyserNode to get audio data.
  • It uses the requestAnimationFrame method to continuously update a canvas with the audio data.
  • It uses the MediaRecorder API to record the audio from the user’s microphone.
  • When the recording is stopped, it creates a Blob from the recorded audio data, creates a URL for the Blob, and plays the audio.

About

See the waveform of your voice or song of choice, directly through your computer's microphone! This lightweight audio recorder web application displays the Fast Fourier Transform output of your device's microphone, using the Typescript webMedia API. I often use this app to record bird calls and upload them to my FireBase database.

https://wavplay.vercel.app


Languages

Language:TypeScript 85.6%Language:CSS 8.8%Language:HTML 4.7%Language:Shell 0.9%