davidedc / livecodelab

a web based livecoding environment
http://livecodelab.net/
MIT License
327 stars 63 forks source link

Novation launchpad integration #321

Open thebabush opened 4 years ago

thebabush commented 4 years ago

Hi,

I sketched my first "program" (?) with livecodelab and it turned out pretty amazing (I mean, I enjoyed the experience a lot and the result was not bad at all imho) but I feel like I could use it in a semi-livecoding way:

  1. write the sketch
  2. create some kind of improv hook (like, fixed color vs dynamic)
  3. hook a midi controller and handle it live without changing the code (without changing it too much anyway)

AFAIK Firefox is starting to implement webmidi, but chrome should be ready so API-wise it should be possible without node/electron thingies.

Can you give me a pointer on the best way to structure this? I'll delve in the code later today and try to figure it out myself, but some insider knowledge would speed up the process a lot :)

cheers

davidedc commented 4 years ago

Ciao Paolo (sono Italiano anch'io),

there is already some midi-related code and comments here: https://github.com/davidedc/livecodelab/search?q=midi&unscoped_q=midi I think the approach there was to go through... a server of some sort? I don't remember, but the code is there (I never used midi to control tempo, I don't have any MIDI devices).

Honestly I don't know much about midi, but I guess the idea is to use some special variables from inside the program, like MIDI_1 MIDI_2, etc., that you can change via MIDI? I'm guessing.

Give it a try and we'll gladly take a look!

davidedc commented 4 years ago

P.S. I forgot - the video is very cool, I watched it a couple of times with headphones and I found it to be very well made!

thebabush commented 4 years ago

Ciao :) grazie. Comunque LCL e' una figata, props.

Anyway, I made a simple launchpad PoC using launchpad-webmidi.

I'm not a web guy by any means, so I just hacked together some js. This also includes an additional dependency so probably you don't want to upstream it.

Anyway, I opened a PR just in case. Any feedback is very welcome :)

322

davidedc commented 4 years ago

thanks 🙏 ! if I had one of these and I had a consistent practice then I'd merge this and make sure it keeps working over time...

please let us know in here when you make a video and show us how it works!

thebabush commented 4 years ago

Test video

The code was pretty simple. I just added two functions:

the difference between the two is that one is stateful and the other is not. In other words, lpd gives the current value, while lps alternates between 0 and 1 at every button-down event.

I integrated it with my previous box thingie and it works nice imho :)

EDIT: using (y, x) coordinates was dumb given how LCL works, but I'll fix it.