start-app

Create demo page for an audio component.

Usage

var createDemo = require('audio-demo');

var app = createDemo({
	//container to use as a start-app demo
	container: el,

	//audio context (by default audio-context module)
	context: audioContext,

	//default source url to play, if undefined open file dialog will be shown
	source: null,

	//API token for soundcloud
	token: 'xxxxx...',

	//allow dropping files to browser
	dragAndDrop: true,

	//WIP open last user settings from last session: song, time
	saveSession: true,

	//enable open file dialog
	file: true,

	//enable load url input
	url: true,

	//enable microphone input
	mic: false,

	//default color for all elements
	color: 'black',

	//set of icons to use for source input component (svg components)
	icons: {open, record, mic, error, soundcloud, loading, error, url},

	//show fps stats
	fps: true,

	//start song as only as ready
	autoplay: true,

	//repeat played track or stop at the end
	loop: true,

	//show progress bar at the top of the page
	progress: true,

	//show play/pause buttons
	playPause: true,

	//show stop button
	stop: true,

	//show title of track/current source
	title: true,

	//show status icon
	icon: true,

	//github link
	github: 'dfcreative/start-app',

	//reflect params in navigation history
	history: true,

	//enable settings menu, optionally with the passed fields
	params: [
		{
			name: 'logarithmic',
			type: 'checkbox',
			value: true
		},
		{
			name: 'colormap',
			label: 'Color map',
			type: 'select',
			values: {
				cdom: 'cdom',
				inferno: 'inferno',
				plasma: 'plasma'
			},
			value: 'cdom',
			change: function (value) {}
		},
		{
			name: 'text-param',
			label: 'Text Param',
			type: 'text',
			placeholder: 'some value',
			value:'',
		}
	]
});

//called when new source is set, inc. microphone.
app.on('source', (audioNode, url) => {
	//do any sort of connection here
	audioNode.connect(app.context.destination);
});

//set a new audio source
app.setSource(url, cb(audioNode, url)?);

//control playback & menu - play/pause/stop
app.play();
app.pause();
app.reset();

//called when track is played/paused/stopped
app.on('play', (audioNode) => {});
app.on('pause', (audioNode) => {});
app.on('stop', (audioNode) => {});


//call to update options
app.update(opts);

//set color of fonts, icons, fps etc. Better than calling update.
app.setColor(color);


//called when any of settings changed
app.on('change', (name, value, state) => {});

//creating parameters
app.addParams(list|object);
app.addParam('my-param', {
	type: 'range',
	value: 0,
	min: 0,
	max: 100,
	step: 1
}, function onchange (value) {});
app.getParamValue('my-param');

Inspired by

• tap-to-start
• soundcloud-badge

Used by

• gl-spectrum
• gl-spectrogram
• gl-waveform