Barry M. Wong

UI Engineer + Designer

Blog

SlideParty + Socket.io

August 10, 2013 at 10:54 pm | code

I used Socket.io in my personal project SlideParty.

In case you haven’t heard, Socket.io is a framework for Node.js that deals HTML5 websockets and necessary fallbacks. It’s realtime communication between multiple browser clients.

In SlideParty, one user can give a slide presentation and simultaneously control all the slides across all the audience’s devices. In return, the audience members can hit the Like button that will increment and update on all the devices at the same time.

When the client browser loads, it sends an emit to the server:

SPTY.socket.emit('initLoad', {});

The server listens and for initLoad, does it’s thing, and emits data back to the client:

socket.on('initLoad', function(data) {
  data['slideData'] = Server.getSlideData();
  data['pollData'] = Server.data.pollData;
  data['isAdmin'] = Server.data.isAdmin;
  socket.emit('initSuccess', data);
});

The client listens for initSuccess and accepts the data then triggers the function appInit:

SPTY.socket.on('initSuccess', function(data) {
  SPTY.Events.trigger('appInit', data);
});