Simple web midi implementation

midi.js

var OP1MidiInterface = function(midi) {
  var data, cmd, channel, type, note, velocity;
  
  midi.inputs.forEach(function(input) {
    if (input.name.indexOf('OP-1') > -1) {
      document.dispatchEvent(new Event('midi-connected'));
      input.onmidimessage = onMIDIMessage;
    }
  });
  midi.onstatechange = onStateChange;
  
  function onMIDIMessage(event) {
    document.dispatchEvent(new Event('midi-activity'));
    data = event.data,
    cmd = data[0] >> 4,
    channel = data[0] & 0xf,
    type = data[0] & 0xf0, // channel agnostic
    note = data[1],
    velocity = data[2];
    switch (type) {
      case 144: // noteOn
        noteOn(note, velocity);
        break;
      case 128: // noteOff 
        noteOff(note, velocity);
        break;
    }
  }

  function onStateChange(event) {
    var port = event.port,
        state = port.state,
        name = port.name,
        type = port.type;
    // if (type == "input") console.log("name", name, "port", port, "state", state);
    if (name.indexOf('OP-1') > -1) {
      document.dispatchEvent(new Event('midi-' + state));
    }
  }

  function noteOn(midiNote, velocity) {
    document.dispatchEvent(new CustomEvent('midi-note-on', { 'detail': midiNote }));
  }

  function noteOff(midiNote, velocity) {
    document.dispatchEvent(new CustomEvent('midi-note-off', { 'detail': midiNote }));
  }
}

// Usage:

if (navigator.requestMIDIAccess) {
  navigator.requestMIDIAccess({ sysex: false }).then(function(midi) {
    new OP1MidiInterface(midi);
  }, function(){});
}