diff --git a/index.html b/index.html index f785e1f..fdd30a4 100644 --- a/index.html +++ b/index.html @@ -2429,7 +2429,8 @@ function webMidiStarted(){ //let myInput = WebMidi.getInputByName("MPK mini Play mk3"); // on Quest 2 let myInput = WebMidi.getInputByName("MPK mini Play mk3:MPK mini Play mk3"); // on desktop WebMidi.inputs.forEach(input => console.log(input.manufacturer, input.name)); - myInput.addListener("noteon", e => { + const keyboard = myInput.channels[1] + keyboard.addListener("noteon", e => { let identifierNoOctave = e.note.identifier.slice(0,-1) let pos = ""+ (Object.getOwnPropertyNames(notes).indexOf(identifierNoOctave)/40+e.note.octave/3.3-1.1)+ " 1.5 -.1" let b = addBlockCodeExample(identifierNoOctave, pos) @@ -2441,9 +2442,19 @@ function webMidiStarted(){ }); // for now assuming an arbitrary duration but should rely on notesPlaying myInput.addListener("noteoff", e => { notesPlaying[e.note.identifier] = false; console.log(e.note); }); // could be used for note duration setInterval( _=> pushBackClass("musicalnote", .001), 10) + + const pads = myInput.channels[10] + + pads.addListener("noteon", e => { + let identifierNoOctave = e.note.identifier.slice(0,-1) + let audio = new Audio(drumkitBaseURL+drumKit[identifierNoOctave]) + audio.play() + }) } const notes = {"C": "#7af500", "C#": "#00f500", "D": "#00f57a", "D#": "#00f5f5", "E": "#007af5", "F": "#0000f5", "F#": "#7a00f5", "G": "#f500f5", "G#": "#f5007a", "A":"#f50000", "A#": "#f57a00", "B": "#f5f500", }; +const drumKit = { "C": "bass.wav", "C#": "clap.wav", "D": "cymbal.wav", "D#": "hi hat.wav", "E": "bass.wav", "F": "clap.wav", "F#": "cymbal.wav", "G": "hi hat.wav" } +const drumkitBaseURL = "https://fabien.benetou.fr/pub/home/future_of_text_demo/content/Roland808DrumKit/"