<commit_before># JustAddMusic

JustAddMusic (aka JAM) makes it simple to add music and music visualization to your web experiences.

* load audio files, or drag and drop from local file system
* keyboard control for volume, seeking, play/pause
* simple UI to display load status and playback time
* audio analysis for music visualization
* enable with a single line of code
* api for custom UI / controls
* only 3kb over the wire

Tested in recent versions of Chrome, Edge, Safari, and FireFox.


## Simple Example

This example will load the specified audio file and play it, display load / playback status, enable keyboard control
and allow the user to drag their own audio file onto the window to play them.

```javascript
var jam = new JustAddMusic("myMusic.mp3");
```

## Music Visualization Example

This example will play the music, and react to its averaged volume by changing the background color of the document.

```javascript
new JustAddMusic({
	src: "myMusic.mp3",
	ontick: function(o) {
		var l = Math.round(o.avg * 100);
		document.body.style.background = "hsl(90,100,"+l+")";
	}
});
```

You can view a live example of this on [https://codepen.io/gskinner/pen/EmgQyO](CodePen).


## Constructor

```javascript
new JustAddMusic(config);
```

The optional config parameter can be either a string URI pointing to an audio file, or an object with any of the following
initialization properties:

* `src`: uri of audio file to load initially
* `dropTarget=window`: query selector or HTMLElement to use as a drag & drop target
* `mode=0`: one of JustAddMusic.PEAK / RMS / AVERAGE
* `deltaT=50`: time in ms used to calculate the delta value
* `avgT=150`: time in ms used to calculate the avg value

The config object can also include any of the properties listed below.


## Properties

These properties can be set using the config param, or directly on a JAM instance.

* `gain=1`: boosts volume for the analyser only (not playback volume)
* `onstart`: called when audio starts playing
* `ontick`: called each time the analyser ticks with the latest audio data
* `onprogress`: called with a single param indicating file load progress as 0-1
* `label`: text or html to inject before other content in the UI
* `paused=false`: play / pause audio
* `keyControl=true`: enable key control (see below)
* `tickInterval=16`: interval in ms to tick analyser on or 0 to tick manually via `tick()`
* `volume=1`: playback volume, does affect analyser
* `ui=true`: show / hide simple ui (true)
* `audioData`: Read-only. Object with latest audio data: vol, avg, delta, avgDelta, and t (timecode).


## Methods

* `loadAudio(src)`: loads specified audio file and plays it if `paused` is false
* `abort()`: aborts an active load
* `play()`: resumes playback
* `pause()`: pauses playback
* `stop()`: pauses playback, resets playback to start, and aborts active load
* `skip(time)`: skips forward or back by the specified time in seconds
* `tick()`: runs the analyser and returns the latest audio data. Called automatically if tickInterval > 0.


## Keyboard Control

If `keyControl` is enabled, the following keys can be used to control playback:

* space - play / pause
* enter - play from start
* up / down arrow - volume
* left / right arrow - skip 5s (15s if shift is held, 60s if alt, 180s if both)


## Styles

The UI div is styled via the `.jam-ui` class. Its default styles are injected in a style block at the top of the head.

When the user drags a file over the `dropTarget`, the `.jam-drop` class is added to it to allow easy styling.

## License

JustAddMusic.js is copyright [gskinner.com](http://gskinner.com). Licensed under the MIT license.

Music by [bensound.com](http://www.bensound.com).<commit_msg>Fix demo link in README.<commit_after># JustAddMusic

JustAddMusic (aka JAM) makes it simple to add music and music visualization to your web experiences.

* load audio files, or drag and drop from local file system
* keyboard control for volume, seeking, play/pause
* simple UI to display load status and playback time
* audio analysis for music visualization
* enable with a single line of code
* api for custom UI / controls
* only 3kb over the wire

Tested in recent versions of Chrome, Edge, Safari, and FireFox.


## Simple Example

This example will load the specified audio file and play it, display load / playback status, enable keyboard control
and allow the user to drag their own audio file onto the window to play them.

```javascript
var jam = new JustAddMusic("myMusic.mp3");
```

## Music Visualization Example

This example will play the music, and react to its averaged volume by changing the background color of the document.

```javascript
new JustAddMusic({
	src: "myMusic.mp3",
	ontick: function(o) {
		var l = Math.round(o.avg * 100);
		document.body.style.background = "hsl(90,100,"+l+")";
	}
});
```

You can view a live example of this on [CodePen](https://codepen.io/gskinner/pen/EmgQyO).


## Constructor

```javascript
new JustAddMusic(config);
```

The optional config parameter can be either a string URI pointing to an audio file, or an object with any of the following
initialization properties:

* `src`: uri of audio file to load initially
* `dropTarget=window`: query selector or HTMLElement to use as a drag & drop target
* `mode=0`: one of JustAddMusic.PEAK / RMS / AVERAGE
* `deltaT=50`: time in ms used to calculate the delta value
* `avgT=150`: time in ms used to calculate the avg value

The config object can also include any of the properties listed below.


## Properties

These properties can be set using the config param, or directly on a JAM instance.

* `gain=1`: boosts volume for the analyser only (not playback volume)
* `onstart`: called when audio starts playing
* `ontick`: called each time the analyser ticks with the latest audio data
* `onprogress`: called with a single param indicating file load progress as 0-1
* `label`: text or html to inject before other content in the UI
* `paused=false`: play / pause audio
* `keyControl=true`: enable key control (see below)
* `tickInterval=16`: interval in ms to tick analyser on or 0 to tick manually via `tick()`
* `volume=1`: playback volume, does affect analyser
* `ui=true`: show / hide simple ui (true)
* `audioData`: Read-only. Object with latest audio data: vol, avg, delta, avgDelta, and t (timecode).


## Methods

* `loadAudio(src)`: loads specified audio file and plays it if `paused` is false
* `abort()`: aborts an active load
* `play()`: resumes playback
* `pause()`: pauses playback
* `stop()`: pauses playback, resets playback to start, and aborts active load
* `skip(time)`: skips forward or back by the specified time in seconds
* `tick()`: runs the analyser and returns the latest audio data. Called automatically if tickInterval > 0.


## Keyboard Control

If `keyControl` is enabled, the following keys can be used to control playback:

* space - play / pause
* enter - play from start
* up / down arrow - volume
* left / right arrow - skip 5s (15s if shift is held, 60s if alt, 180s if both)


## Styles

The UI div is styled via the `.jam-ui` class. Its default styles are injected in a style block at the top of the head.

When the user drags a file over the `dropTarget`, the `.jam-drop` class is added to it to allow easy styling.

## License

JustAddMusic.js is copyright [gskinner.com](http://gskinner.com). Licensed under the MIT license.

Music by [bensound.com](http://www.bensound.com).
{'fraction_non_alphanumeric': 0.08997982515131137, 'fraction_numerical': 0.008876933422999328, 'mean_word_length': 4.296296296296297, 'pattern_counts': {'":': 0, '<': 3, '<?xml version=': 0, '>': 5, 'https://': 2, 'lorem ipsum': 0, 'www.': 2, 'xml': 0}, 'pii_count': 0, 'substrings_counts': 0, 'word_list_counts': {'cursed_substrings.json': 4, 'profanity_word_list.json': 0, 'sexual_word_list.json': 0, 'zh_pornsignals.json': 0}}
{'dir': 'git-commits-cleaned', 'id': '3034014', 'n_tokens_mistral': 2242, 'n_tokens_neox': 2081, 'n_words': 1063}