MIDI

<html>
    <head>
        <title>MIDI Monitor</title>
        <script type="text/javascript">
            var m = null;   // MIDIAccess object
            navigator.requestMIDIAccess().then( onsuccesscallback, onerrorcallback );

            function onsuccesscallback( access ) {
                m = access;

                var inputs = m.inputs();
                var outputs = m.outputs();
                if (inputs.length > 0) {
                    inputs[0].onmidimessage = onMidiMessage;
                }

                // var o = outputs[0];
                // o.send( [ 0x90, 0x45, 0x50 ] ); // Full velocity (0x7f) note on A4 (0x45 = midi 69 = key 49) on channel zero
                // o.send( [ 0x80, 0x45, 0x40 ], window.performance.now() + 1000 );  // full velocity A4 note off in one second.
            };

            function onerrorcallback( err ) {
                console.log(err.code );
            }

            function onMidiMessage(event) {

                // event.receivedTime - seconds since the page loaded
                // event.data - [message_code, data, data]
                // message_code
                //     176 = control change
                //     144 - note on
                //     128 - note off
                var data = event.data;
                var velocity = 0;
                var noteNumber = 0;
                switch(parseInt(data[0])) {
                    case 144: // ON
                        noteNumber = data[1] - 20;
                        velocity = data[2];
                        console.log("ON " + noteNumber + " V: " + velocity);
                        break;
                    case 128: // OFF
                        noteNumber = data[1] - 20;
                        console.log("OFF " + noteNumber);
                        break;
                    default:
                        break;
                }
            }
        </script>
    </head>
    <body>
    </body>
</html>