Web Export and MIDI
I'm just starting to poke at this. I exported an example ("Phase Aligned Formant Synthesis") to web, and used the "RNBO Webpage Example" template to serve it to a browser. I was unsure what to expect with MIDI connections, though. The template creates some space for Inputs and Outports, has a "MIDI Keyboard".
However, it doesn't actually seem to implement any WebMIDI connections in the Chrome browser.
Before I start digging into this and adopting the template so it has automagic MIDI I/O with WebMIDI, I want to make sure that I'm not re-inventing the wheel.
Has anyone played around with this? Is my experience expected?
Hi Peter,
the webpage example has a bit of code that, if a MIDI port is detected, creates an on-screen keyboard to generate and send MIDI events into the RNBO device. As of now there is no glue code or magic integration with WebMIDI in the example in order to keep it relatively simple and easy to follow as it serves as a starting point for using RNBO in a web browser.
In theory it should be relatively straightforward to hook up WebMIDI with RNBO. I'll also make a note for us to consider making an example focused on the interplay of WebMIDI and RNBO.
However, if you find the time to set something up that's worth sharing with others - please do! If you encounter any obstacles I'm also happy to help.
Thanks
Florian
Good to know. I just wanted to make sure I hadn't missed something. I hope to carve out some time to get some MIDI I/O going in the basic template so it can provide a similarly convenience as the onscreen MIDI keyboard.
I got something working, adding a few lines to app.js, a line to index.html, and an additional js document with some midi in/out functions ("webmidi-io.js"). I tried to make it so it's not very invasive to the original. I'm certainly not a Node pro (I believe those people are called "ninjas"), so I'm not really sure if I did this the best way. But it works.
This uses the https://webmidijs.org/ library. Another option, requiring different code of course, would be the JAZZ midi library https://jazz-soft.net/doc/JZZ/.
Here is a version of the template in case anyone needs some hints on doing this. I don't know if this is worth a pull request on GitHub or not - let me know if that is appealing.
Awesome. Glad to hear it worked and I'm sure it's useful for others searching the forums for an example.
It's likely that we'll add an article with an example to the RNBO documentation that walks through how to set up WebMIDI with RNBO. Whether we add auto MIDI controller exploration to the template - not sure at this point but we'll consider it or point towards your code.
Thanks again
Florian
Happy to guest write the article :) I first used WebMIDI many years ago to implement the Livid controller editors.
Hi @peter and @florian thanks for the thread -- i have stumbled across bc im looking to do just that which you were desc -- export a rnbo patch to web and then expose it as a webpage, where users are able to use their keyboard as a midi input. I will try the file u posted and see if it works!
Hi Peter, I was looking to add Web MIDI integration for my RNBO project and I came across the solution above, your code works nicely, I've credited you, hope it's fine with you :)
https://github.com/maceq687/FaceArp
Great to hear! That’s why I put it up here, so I’m glad it is getting used.
I'm probably doing something wrong, but I just get empty dropdown menus for my MIDI devices
The Web MIDI RNBO solution is wonderful - thank you so much for this. I have a question - I pasted a screenshot of a simple test that generates random MIDI messages to which can be routed to Ableton, or whatever, from within Max, and it works fine running within Max, but exported as a webpage to the WebMIDI RNBO, I get no MIDI output, even though the MIDI out dropdown shows up and is routed as it should be (I think!) - any thoughts on this would be greatly appreciated! thank you again!
