I used WebSockets with a Reveal.js presentation.

Apologies that may find me diverting from the normal topics of this blog (which I've failed horribly at keeping up) but I had a interesting solution and thought I'd share how I over came it.

We're still working out some of the logistics within our new headquarters at work and one of those items to overcome is no VGA input to the LCD in the conference room.  Typically if we want to share content on a laptop we have to boot up a GoToMeeting to get it to the screen.

My presentation had a lot of code examples which I knew from previous experience that small text and a putting it up on the big screen via a remote session doesn't always work well.  I also wanted the presentation in front of me so I could actually project to my audience.  Finally I wanted to give Reveal.js a try.  Reveal.js is a javascript framework for building slide decks using HTML.  If you'd like to give it a try, here is the demo page.

I've done a lot of research lately in regards to Peer to Peer protocols and actually created what I think is a pretty sophisticated set of classes using Flash and Adobe's RTMFP protocol.  The idea hit me as I was preparing this presentation that it would have been really cool if I could use those classes to sync the screen between browsers who have that presentation opened.  But since reveal.js as a lot of cool mobile support built in it would be event COOLER if I could use this to present from a tablet.

I did some research to see if I was just missing the HTML5 equivalent of RTMFP and it turns out I have been.  A new spec for PeerConnections is coming to HTML5 and is already in the latest builds of Chrome/Firefox/Opera but there's no great getting started guide on it.  Any thing I found kept mentioning websockets which is great but websockets are built more for client / server environments, not peer to peer.

Alright, I do know websockets and it would make what I want to do so easy but I don't want to do a lot of work to get a websocket server up and running.

What has been my go to solution lately? Adobe AIR.

Started to research building a quick websocket server using AIR and I found Wouter Verweirder's AIRServer.  Its a great set of Actionscript classes that combines several protocols that behave similiar to websockets.  So I grabbed it, copied the example and quickly the little bit of code.  All I wanted was the server to receive a message and spit it back out.

So from there I could compile it into an AIR app, run it, find my IP, open my computer's firewall if I needed to and be set with a server!

Next, I wanted to hook up the presentation.  First I added a hidden slide below the title that would allow me to make myself the presenter.

Finally adding a splash of javascript to hook up the presentation to the server.

Note on line 6 to update the IP to the IP from my websocket server.

Boom.  Now I can control and see my presentation from a mobile device.