https://github.com/dy/app-audio
Get audio for application, demo or tests.
https://github.com/dy/app-audio
audio web-audio
Last synced: 9 months ago
JSON representation
Get audio for application, demo or tests.
- Host: GitHub
- URL: https://github.com/dy/app-audio
- Owner: dy
- Created: 2016-08-17T00:26:38.000Z (almost 10 years ago)
- Default Branch: master
- Last Pushed: 2017-04-14T16:42:28.000Z (about 9 years ago)
- Last Synced: 2024-12-29T00:21:16.439Z (over 1 year ago)
- Topics: audio, web-audio
- Language: JavaScript
- Homepage: https://a-vis.github.io/app-audio
- Size: 166 KB
- Stars: 5
- Watchers: 3
- Forks: 0
- Open Issues: 14
-
Metadata Files:
- Readme: readme.md
Awesome Lists containing this project
README
# app-audio [](http://github.com/badges/stability-badges)
Get audio for your application, demo or tests.
It will create a component with every possible audio source for Web Audio API - an audio file, url, soundcloud, microphone or primitive signal. Also it tackles play/stop/reset controls, drag-n-drop, recent tracks, soundcloud tracklists, queuing multiple tracks, saving to session storage, progress bar, looping etc.
[](http://audio-lab.github.io/app-audio/)
## Usage
[](https://npmjs.org/package/app-audio/)
```js
const createAudio = require('app-audio');
let audioSrc = createAudio({
source: './my-audio.mp3'
}).on('ready', (node, url) => {
node.connect(myAnalyzer);
});
```
## API
**`const createAudio = require('app-audio');`**
Get app-audio constructor. It can also serve as a class.
**`let appAudio = createAudio(options);`**
Create app-audio instance based off options:
```js
//initial source
source: null,
//container to place UI
container: document.body,
//audio context to use
context: require('audio-context'),
//Enable file select
file: true,
//Enable url input
url: true,
//Enable soundcloud input
soundcloud: true,
//Enable primitive signal input
signal: true,
//Enable mic input
mic: true,
//Show play/payse buttons
play: true,
//Start playing whenever source is selected
autoplay: true,
//Repeat track list after end
loop: true,
//Show progress indicator at the top of container
progress: true,
//Save/load tracks to sessionStorage
save: true,
//Show list of recent tracks
recent: true,
//Enable drag and drop files
dragAndDrop: true,
//Default color
color: 'black'
```
**`appAudio.on(event, callback);`**
Bind event callback. Available events:
```js
//called whenever new source is set and loaded, like mic, file, signal etc.
//source audioNode is passed as a first argument, so do connection routine here
appAudio.on('load', (audioNode, sourceUrl) => {
audioNode.connect(myAnalyzer);
});
//whenever play is pressed or called
appAudio.on('play', (audioNode) => {});
//whenever pause is pressed or called
appAudio.on('pause', (audioNode) => {});
//whenever reset is called
appAudio.on('reset', () => {});
```
**`appAudio.set(source);`**
Set source to play. Source can be whether `File`, `FileList`, URL, soundcloud URL, list of URLs, `MediaStream` etc.
**`appAudio.play();`**
Play selected source. Other playback methods:
```js
//pause current source, for mic - mute output
appAudio.pause();
//reset current source, stop playback
appAudio.reset();
//play next track, if there are multiple tracks
appAudio.playNext();
```
**`appAudio.show();`**
Open menu. To hide menu, call `appAudio.hide()`
**`appAudio.update(options?);`**
Update view or options, if required. Possible options are all the same as in the constructor.
## In the wild
> [gl-waveform](https://dfcreative.github.io/gl-waveform)
> [gl-spectrogram](https://dfcreative.github.io/gl-spectrogram)
> [gl-spectrum](https://audio-lab.github.io/gl-spectrum)
## Credits
**[@mattdesl](https://github.com/mattdesl)** for [web-audio-player](https://github.com/jam3/web-audio-player) covering gotchas of playing web-audio.
Beautiful myself, who spent like a week on that, and another week before on [start-app](https://github.com/dfcreative/start-app).