NexusUI 2.0

Web Audio Interfaces


NexusUI is a collection of HTML5 interfaces and Javascript helper functions to assist with building web audio instruments in the browser.

In addition to interfaces, it offers a few helper methods for tuning and timing. It does not provide any sound-making capabilities –– for that, check out the Web Audio API or web audio libraries such as Tone.js, WebPD, or Gibber.lib.

Documentation View on Github

A note on this update

Version 2 is a from-scratch rewrite of NexusUI. This version features a new & more conventional Javascript API, a pared-down collection of interfaces, and SVG graphics instead of canvas graphics. We hope that this version will prove to be more user-friendly and more sustainable over time.

Small Demo



HTML
<div> id="power"><div>
<div> id="echo"><div>


JS
// Create interfaces
var power = new Nexus.Toggle("#power");
var delay = new Nexus.Slider("#echo");

// Create a sound source using Tone.js
var synth = new Tone.Oscillator(0,"triangle").start();
var volume = new Tone.Volume(-Infinity);
var delayGen = new Tone.FeedbackDelay(0.2,0.7);
synth.chain( delayGen, volume, Tone.Master );

// Customize interface &
// Add event listeners
delay.min = 0;
delay.max = 0.7;
delay.on('change',function(value) {
	delayGen.wet.value = value;
})
delay.value = 0.4;

power.on('change',function(v) {
	volume.volume.cancelScheduledValues();
	var level = v ? -20 : -Infinity;
	volume.volume.rampTo(level,3)
})

// Create a sequence of note values
var sequence = new Nexus.Sequence([2,4,6,8,9,11,13]);

// Create a repeating pulse
// Change notes on each beat
var beat = new Nexus.Interval(100,function(e) {
	synth.frequency.value = Nexus.note( sequence.next(), -1 );
});

beat.start();


CSS
#power {
	width:40px;
	height:17px;
	margin:15px 0px;
}

#echo {
	width:200px;
	height:20px;
	margin:5px 3px;
}
©
experimental music & digital media @ louisiana state univeristy 2013-2016
ben taylor 2017