A component for plotting (and getting!) X-Y input values
npm install openmusic-xycontroller
.
You need to load the module and then register it--it is not automatically registered!
require('openmusic-xycontroller').register('openmusic-xycontroller');
But you could even register it with other name, for example:
require('openmusic-xycontroller').register('mega-xycontroller');
Up to you.
Have a look at demo/main.js
for an example that uses this component to control the volume and pitch of an oscillator in order to build a very simple theremin-like instrument.
Both x
and y
go from -1
to 1
. Values from outside this range won't be accepted and will be automatically clamped.
Determines the horizontal value.
Examples:
<openmusic-xycontroller x="-1"></openmusic-xycontroller> // left
<openmusic-xycontroller x="0"></openmusic-xycontroller> // center
<openmusic-xycontroller x="1"></openmusic-xycontroller> // right
Determines the vertical value.
Examples:
<openmusic-xycontroller y="-1"></openmusic-xycontroller> // bottom
<openmusic-xycontroller y="0"></openmusic-xycontroller> // center
<openmusic-xycontroller y="1"></openmusic-xycontroller> // top
This event will be dispatched as the value changes due to user input. To listen for input
events on a controller, add an event listener:
controller.addEventListener('input', function(ev) {
var detail = ev.detail;
// detail.x and detail.y contain the values you want
console.log(detail.x, detail.y);
});