hello,

i still try to find a way to send and receive variables with emscripten ofelia for using webmidi.

in the meantime i tried the same with enzien heavy which uses emscripten too - it actually works (although i only managed to send/ receive one variable per send / receive @hv_param, but there seems to be a way to also use lists with __hv_notein / __hv_noteout for example - at least for midi values).

i initially thought naivly that i just need to connect ofxmidi to webmidi somehow, but perhaps the way heavy enzien sends / receives values is the way to go for emscripten ofelia too?
here are some methods for interacting with emscripten code: https://emscripten.org/docs/porting/connecting_cpp_and_javascript/Interacting-with-code.html

i think it would be really nice to get it working because then we perhaps would have something like js enzien heavy with all vanilla objects plus open frameworks graphics...

does anybody know how to port this code to jave script? that could improve the midi performane...
https://github.com/enzienaudio/hvcc/blob/master/docs/09.midi.md

Edit: I dont think that I need that code at all, because webmidi already uses numbers for midi data. Still, the __hv_notein etc. objects could be useful. But until now they only output the first value and not the whole list in my example.

VstInt32 HeavyVst2_sine::processEvents(VstEvents* events) {
  for (int i = 0; i < events->numEvents; ++i) {
    VstEvent *vste = events->events[i];
    switch (vste->type) {
      case kVstMidiType: {
        VstMidiEvent *vstme = (VstMidiEvent *) vste;

        const unsigned char command = vstme->midiData[0] & 0xF0;
        const unsigned char channel = vstme->midiData[0] & 0x0F;
        const unsigned char data0   = vstme->midiData[1] & 0x7F;
        const unsigned char data1   = vstme->midiData[2] & 0x7F;

        hv_uint32_t receiverHash = 0;
        switch (command) {
          case 0x80:   // note off
          case 0x90: { // note on
            receiverHash = 0x67E37CA3; // __hv_notein
            break;
          }
          case 0xB0: { // control change
            receiverHash = 0x41BE0F9C; // __hv_ctlin
            break;
          }
          default: continue;
        }

        _context->sendMessageToReceiverV(receiverHash, 1000.0*vste->deltaFrames/sampleRate, "fffff",
            (float) data1,
            (float) data0,
            (float) channel,
            (float) command,
            0.0f // port
        );
        break;
      }
      case kVstSysExType: {
        // not handling this case at the moment, VstMidiSysexEvent *vstmse;
        break;
      }
      default: break;
    }
  }
  return 1;
}

a strange thing regarding midi in / out timing, it works much better in this example: https://webmidi.handmadeproductions.de/
what i did not expect, because I thought the video processing needs more ressources than the audio processing ( at least in these examples)...
perhaps because midi is send from and to the heavy file while in the webmidi examples everything happens in java script? It is basically the same web MIDI method...

edit: here is a nice timing example, but i do not understand it yet...
http://webaudiodemos.appspot.com/metronome/index.html

I made a web synth with heavy (it is basically the synth example from the pure data doc and a little sequencer).
And I combined it with web MIDI. Sadly the MIDI timing (clock) over the internet is not very precise (perhaps there is something wrong with my code). But at least for controlling parameters web MIDI is nice. The timing inside the website is good.

https://libpd3.handmadeproductions.de/

For me it was much easier to create something with Pure Data / Heavy compared to creating sound with webAudio.
Still it is just a small subset of Pure Data vanilla.

@jancsica It would be really great if it is possible to create something like the heavy java script compiler (but more complete) with purr data. I am not sure if i understand your idea with the web assembly binary right...

i tried to run the examples: https://github.com/enzienaudio/examples/tree/master/javascript

http://libpd.handmadeproductions.de/
http://libpd2.handmadeproductions.de/

the chip example works fine, but the sampleplayer gives me this error message when i start to play the sample:

warning: a problem occurred in builtin C++ name demangling; build with  -s DEMANGLE_SUPPORT=1  to link in libcxxabi demangling
42samplePlayerLib.min.js:24639 Uncaught abort() at Error
    at jsStackTrace (http://libpd2.handmadeproductions.de/js/samplePlayerLib.min.js:1351:13)
    at stackTrace (http://libpd2.handmadeproductions.de/js/samplePlayerLib.min.js:1368:22)
    at Object.abort (http://libpd2.handmadeproductions.de/js/samplePlayerLib.min.js:24633:44)
    at _abort (http://libpd2.handmadeproductions.de/js/samplePlayerLib.min.js:1923:22)
    at _malloc (http://libpd2.handmadeproductions.de/js/samplePlayerLib.min.js:19069:9)
    at __ZL26mq_getOrCreateNodeFromPoolP14HvMessageQueue [mq_getOrCreateNodeFromPool(HvMessageQueue?*)] (http://libpd2.handmadeproductions.de/js/samplePlayerLib.min.js:13201:10)
    at _mq_addMessageByTimestamp (http://libpd2.handmadeproductions.de/js/samplePlayerLib.min.js:12830:8)
    at Array.__ZN18Heavy_samplePlayer26scheduleMessageForReceiverEjP9HvMessage [Heavy_samplePlayer::scheduleMessageForReceiver(unsigned int, HvMessage?*)] (http://libpd2.handmadeproductions.de/js/samplePlayerLib.min.js:6949:4)
    at Array.__ZN18Heavy_samplePlayer7processEPPfS1_i [Heavy_samplePlayer::process?S(float**)] (http://libpd2.handmadeproductions.de/js/samplePlayerLib.min.js:7425:33)
    at Array.__ZN18Heavy_samplePlayer13processInlineEPfS0_i [Heavy_samplePlayer::processInline?S(float*)] (http://libpd2.handmadeproductions.de/js/samplePlayerLib.min.js:7877:41)

Was it possible for anybody to run the second example or knows how to fix the error?

did any body use this nodejs wrapper for libpd?
https://github.com/ircam-jstools/node-libpd

somehow i can not run the example, but it looks very interesting.
would it be possible to run pure data patches on a website with that?

Hi,
initially I wanted to understand how webMIDI works, but then I tried different web things like web Audio, webGL and some audio visualizer. I also implemented Butterchurn (ButterChurn is a WebGL implementation of the Winamp Milkdrop 2 visualizer).
The website listens to MIDI and plays gm MIDI wavetable sounds (I did not implement the best soundfont yet...).
Really nice possibilities with web Audio and MIDI.

http://webmidi.handmadeproductions.de/
WebAudioMidi.zip

https://webmidi.handmadeproductions.de/
WebMIDIFont.zip

I implemented WebAudioFont. It plays an Instrument on MIDI channel 1 and a drums on MIDI channel 10.
https://surikov.github.io/webaudiofont/
It uses the Pure Data note on / off method with velocity 0.

I still like the Emscripten MIDI Idea, but I just dont know how to solve it yet...

hello.
i use -nogui if I use the pd~ subprocess. i think it makes also sense if you run a patch on an arduino or something like that,
it is a little more efficient depending on the gui.
also the ofelia standalone application runs pd without gui.
and everything that uses libpd runs pure data without gui.

I wonder If it is possible to access MIDI ports in Emscripten compiled Pure Data / Ofelia patches.
At least the browser needs to access MIDI for that.
For that I adapted a web midi java script from this synth: https://webaudiodemos.appspot.com/midi-synth/index.html
so that you can choose MIDI in and out ports in the browser (only Chrome at the moment).

https://webmidi.handmadeproductions.de/
webMIDI.zip

It is my first java script, so I am sure it can be improved.

If it is not possible to use it with Ofelia / Emscripten it is perhaps useful for something else.

Here I found a project that uses C++ compiled with Emscripten and the parameters are controllable with web MIDI:
https://ccrma.stanford.edu/~jatin/220a/fp.html