(function() {
var onDOMContentLoaded = function() {
if (!navigator.requestMIDIAccess) {
window.alert('Cannot use Web MIDI API.');
return;
}
var displayProperties = function(node, tableid, caption) {
var html = '<caption>' + caption + '</caption>';
html += '<thead>';
html += '<tr>';
html += '<th scope="col">Property</th>';
html += '<th scope="col">Value</th>';
html += '<th scope="col">hasOwnProperty</th>';
html += '</tr>';
html += '</thead>';
html += '<tbody>';
for (var key in node) {
html += '<tr>';
html += '<td>' + key + '</td>';
html += '<td>' + node[key] + '</td>';
html += '<td>' + node.hasOwnProperty(key) + '</td>';
html += '</tr>';
}
html += '</tbody>';
document.getElementById(tableid).innerHTML = html;
document.getElementById(tableid).parentNode.previousElementSibling.style.display = 'block';
};
/**
* @param {MIDIAccess} midiAccess
*/
var successCallback = function(midiAccess) {
/** @type {Array.<:MIDIInput>} */
var inputs = [];
/** @type {Array.<MIDIOutput>} */
var outputs = [];
if (Object.prototype.toString.call(midiAccess) === '[object Function]') {
// Legacy Chrome
inputs = midiAccess.inputs();
outputs = midiAccess.outputs();
} else {
// Chrome 39 and later
var inputIterator = midiAccess.inputs.values();
var outputIterator = midiAccess.outputs.values();
for (var i = inputIterator.next(); !i.done; i = inputIterator.next()) {
inputs.push(i.value);
}
for (var o = outputIterator.next(); !o.done; o = outputIterator.next()) {
outputs.push(o.value);
}
}
displayProperties(midiAccess, 'midiaccess-properties', 'MIDIAccess');
displayProperties(midiAccess.inputs, 'midiinputmap-properties', 'MIDIInputMap');
displayProperties(midiAccess.outputs, 'midioutputmap-properties', 'MIDIOutputMap');
if (inputs.length > 0) {
displayProperties(inputs[0], 'midiinput-properties', 'MIDIInput');
}
if (outputs.length > 0) {
displayProperties(outputs[0], 'midioutput-properties', 'MIDIOutput');
}
};
/**
* @param {DOMException} error
*/
var errorCallback = function(error) {
displayProperties(error, 'domexception-properties', 'DOMException');
};
navigator.requestMIDIAccess({sysex : true}).then(successCallback, errorCallback);
};
if ((document.readyState === 'interactive') || (document.readyState === 'complete')) {
onDOMContentLoaded();
} else {
document.addEventListener('DOMContentLoaded', onDOMContentLoaded, true);
}
})();