Tamapolis: Javi Agenjo's personal blog

One month ago Graham offered me to collaborate with him in one of his live coding performances. He does amazing music by coding live in front of an audience (no samples, no synths) using Supercollider.
He thought I could do the visuals using one of my tools, he would send me OSC messages and I can try to visualize them. So I took my old Simplecanvas web-experiment and tune it a lot so it can work in a real environment.

I wanted to talk about it before but I was waiting to have a video to show (we recorded the session), sadly the videos will have to wait a little bit, meanwhile just a heads up about the new features in Simple Canvas 2.0.

First I cleaned up the interface, I felt it was ugly and I wanted to give it a cleaner look. Most of the interface almost dissapears when the user is coding to do not interfere with the visuals.

Graham and I worked hard to integrate OSC messages in my app. I end up creating a node.js server app that opens an OSC port and a WebSockets port so every message received to the OSC port is bounced to the websocket.

On the client side I just connect to the WebSocket and trigger and event in my app everytime a new message is received.

I also updated the CodeMirror version and added some of the addons like autocompletion or macros to code faster. CodeMirror is a fantastic library and very easy to deploy.

I also have improved a little bit my rendering library, adding new basic shapes and functions but I cant say I like the way some functions are defined, I think in the next revision I will start from scratch the drawing API to something more clear.

Live session

It worked very well when we were trying at home, but we had some problems due to the amount of traffic he was sending me, because every message created a particle and in some moments I had thousands of particles which slowed the rendering a lot, so I had to improvise.

As soon as I have a video of the session I will post it here.

Friday, May 3rd, 2013 @ 3:15 pm coding, General, graphics, HTML5, javascript, webdevelopment
RSS 2.0 Trackback