<html>
<head>
<link rel="stylesheet" type="text/css" href="style.css">
<meta charset="utf-8" />
</head>
<body>
<img id="image1" src="https://s3-us-west-2.amazonaws.com/s.cdpn.io/212131/audiokeys-mapping-rows1.jpg" width="100%">
<script src="sketch.js"></script>
</body>
</html>
html, body {
margin: 0;
padding: 0;
}
/* PDM Course: Sound Unit
Preset-AlienChorus
*/
var synth;
// create a keyboard
var keyboard = new AudioKeys();
function setup() {
synth = make_DuoSynth().instrument;
console.log(synth);
keyboard.down(note => {
// convert MIDI velocity to gain
var velToGain = map(note.velocity, 0, 127, 0, 1);
synth.triggerAttack(note.frequency, Tone.now(), velToGain);
});
keyboard.up(note => synth.triggerRelease());
}
function make_DuoSynth() {
// create synth
var instrument = new Tone.DuoSynth();
var synthJSON = {
vibratoAmount: 0.5,
vibratoRate: 10,
harmonicity: 1.3,
voice0: {
volume: -10,
portamento: 2,
oscillator: {
type: "square"
},
filterEnvelope: {
attack: 0.01,
decay: 0,
sustain: 1,
release: 0.5
},
envelope: {
attack: 0.01,
decay: 0,
sustain: 1,
release: 0.5
}
},
voice1: {
volume: -20,
portamento: 0.02,
oscillator: {
type: "sine"
},
filterEnvelope: {
attack: 0.01,
decay: 0,
sustain: 1,
release: 0.5
},
envelope: {
attack: 0.01,
decay: 0,
sustain: 1,
release: 0.5
}
}
};
instrument.set(synthJSON);
var effect1, effect2, effect3;
// make connections
instrument.connect(Tone.Destination);
// define deep dispose function
function deep_dispose() {
if (instrument != undefined && instrument != null) {
instrument.dispose();
instrument = null;
}
}
return {
instrument: instrument,
deep_dispose: deep_dispose
};
}
This Pen doesn't use any external CSS resources.