Archive for the 'javascript' Category

heartbeatjs

The heartbeat repository has been moved from bitbucket to github.

The heartbeat site has been updated as well, but I still have to write a lot of documentation.

Please don’t hesitate to send me an email if you have any questions.

Jazz plugin replaces Java applet

Deprecated, please use Chris Wilson’s WebMIDIAPI Shim

The MIDIBridge code has been rewritten as a wrapper for the Jazz plugin by Sema. It is called JazzMIDIBridge now and you can find the code and documentation on Github: https://github.com/abudaan/JazzMIDIBridge https://github.com/abudaan/JazzMIDIBridge/wiki

This is the first step in phasing out the Java applet in favor of the Jazz plugin. Currently not all functionality of the Java version has been ported over, for instance playing back and recording MIDI files is not yet implemented. I am thinking of using jsmidi for recording and jasmid for playing back MIDI files. Also in this version it is not possible to setup multiple connections, or to daisy chain devices. The Jazz plugin requires a separate instance per connection (see comment of Sema below) and I still have to write the wrapper code for that. Please let me know if you have any problems, suggestions or feature requests!

Beta version of Jazz plugin supports MIDI in

Deprecated, please use Chris Wilson’s WebMIDIAPI Shim

The Jazz plugin is a MIDI plugin that works in all major browsers. Until now, it supported MIDI out only, but today a new version with MIDI in support was released for testing. Currently this beta version is for Windows only. All major browsers are supported. I made an example that shows you how to setup MIDI connections with the Jazz plugin, see: http://abumarkub.net/jazz/

New API in MIDIBridge

Deprecated, please use Chris Wilson’s WebMIDIAPI Shim The new API is an implementation in Java and Javascript of the W3C proposal for MIDI support in browsers by

Jussi Kalliokoski. You can read the proposal here. Besides the API that Jussi proposes, I have also added some extra functionality, notably a Sequencer. The documentation still is very scarce, I will add it bit by bit the coming weeks. Meanwhile the code examples provide useful information on using the new API. All code is available at Github and you can test the code examples online as well: 1. A basic example. code | launch 2. Connects your your computer keyboard to a MIDI output. code | launch 3. Example that lets you select a MIDI input and a MIDI output. code | launch 4. Same example as above, but the MIDI output gets connected directly in Java which results in better playback performance. If your application does a lot of graphical updates on incoming MIDI events, you should use this method. code | launch 5. Select a MIDI file on your local hard drive and play it back on a MIDI output. You can change the instrument as well. code | launch 6. Same example as above, but the MIDI output gets connected directly in Java which results in better playback performance. code | launch 7. Example of how you can send MIDI events generated in Javascript to a MIDI output. code | launch If you come across bugs or issues, or if you have feature requests or other questions, file an

issue on Github, or email me at daniel@abumarkub.net

MIDI browser plugin

Deprecated, please use Chris Wilson’s WebMIDIAPI Shim I made a NPAPI browser plugin that gives you access to the MIDI devices connected to your computer directly from within your browser. The plugin is built with the

JUCE library. You can download the plugin from Github or directly from here. In the zip you find the plugin file and a simple test page. The comments in main.js explain how to use the plugin and its API. In the README file you’ll find instructions on how to install the plugin in various browsers. Currently on OSX Chrome and Safari are supported, and on Windows Chrome is supported. Continue reading ‘MIDI browser plugin’

Quick experiment with audiolib.js

Via a comment of Ned on this blog, i came to know the impressive library audiolib.js of Jussi Kalliokoski.

I made a quick example of how you can connect the midibridge with an Oscillator, see:

http://abumarkub.net/midibridge/examples/audiolib/

This is just a very basic example, you can do a lot more with audiolib.js, check GitHub for code and documentation.

Midibridge using base64 soundfonts, a proof of concept

Deprecated, please use Chris Wilson’s WebMIDIAPI Shim

Michael Deal made a brilliant music theory learning app for Google Chrome using base64 soundfonts. In fact he is not really using the soundfonts itself, but rendered .ogg files that are loaded as base64 files into the html5

Playback of midi files added to the midibridge (preview)

Deprecated, please use Chris Wilson’s WebMIDIAPI Shim I made a test version of the midibridge that allows you to playback midi files. This version uses the File API for loading the midi file and a html5 slider for controlling the song position, so it currently only runs in Chrome:

http://abumarkub.net/midibridge/examples/base64.html You can simply drag and drop a midi file (.mid extension) onto the dropbox and the file gets loaded into the applet as a base64 string. Continue reading ‘Playback of midi files added to the midibridge (preview)’

Using the midibridge made easy

Deprecated, please use Chris Wilson’s WebMIDIAPI Shim The newest version of the midibridge allows you to add midi functionality to your website with just one line of code:

midiBridge.init(function(midiEvent) { yourCoolFunction(midiEvent); });

Also, you only have to add one single minified javascript file of less then 5K to your html page:


Only native Javascript is used, so you can use it conflict-free together with any Javascript framework. Code is available at GitHub and a minified production version can be downloaded from Google Code Check the quickstart guide!

Midibridge supports multiple midi connections

Deprecated, please use Chris Wilson’s WebMIDIAPI Shim

Jonathan El-Bizri gave me the brilliant idea to add support for multiple midi connections to the midibridge. I made a very basic implementation of this functionality, see overhere: http://abumarkub.net/midibridge/js3/ The code will be available on GitHub in the coming few days. Open the midi configuration and click ‘add midi connection’. You can add as many midi connections as you like (only limited by the amount of RAM on your computer). Once created, you can change the in- and/or outport of a midi connection. If you create 2 identical midi connections, only the one you created first will be effective. Identical midi connections are connections that have the same midi in- and outport. You can also filter types of midi events per connection. Currently i have only added ‘control change’, ‘program change’ and ‘pitch bend’, but all types can be filtered out: it is just a matter of adding more checkboxes. If a checkbox is checked, the related type of midi event will not be sent to the midi outport. Continue reading ‘Midibridge supports multiple midi connections’