Socket.io for clicks

app.js

/**
 * Module dependencies.
 */

var express = require('express')
  , routes = require('./routes')
  , http = require('http');

var app = express();

app.configure(function(){
  app.set('port', process.env.PORT || 3000);
  app.set('views', __dirname + '/views');
  app.set('view engine', 'jade');
  app.use(express.favicon());
  app.use(express.logger('dev'));
  app.use(express.bodyParser());
  app.use(express.methodOverride());
  app.use(app.router);
  app.use(express.static(__dirname + '/public'));
});

app.configure('development', function(){
  app.use(express.errorHandler());
});

//Declaramos una variable con el número de clicks.
var clicks = 0;

app.get('/', routes.index);

//Asignamos a server la creación del servidor http.
var server = http.createServer(app).listen(app.get('port'), function(){
  console.log("Express server listening on port " + app.get('port'));
});

//Importamos socket.io utilizando el servidor creado anteriormente.
var io = require('socket.io').listen(server);

//Iniciamos la conexión.
io.sockets.on('connection', function(socket){
  //Emitimos nuestro evento connected
  socket.emit('connected');

  //Permanecemos a la escucha del evento click
  socket.on('click', function(){
    //Sumamos el click
    clicks++;

    //Emitimos el evento que dirá al cliente que hemos recibido el click
    //y el número de clicks que llevamos
    socket.emit('otherClick', clicks);
  });
});

index.jade

extends layout

block content
  h1= title
  #disconected
    p Desconectado!
  #connected.hide
    p Conectado!
  h2 Has pulsado 0 veces!
  input(type='button', value='Enviar pulsación')#button

  script
    //#1 Declaramos el objeto socket que se conectará en este caso a localhost
    var socket = io.connect('http://localhost');

    //#2 Función que muestra un mensaje u otro, dependiendo de la conexión.
    function toggle(){
      $("#disconected").toggleClass("hide");
      $("#connected").toggleClass("hide");
    }

    //#3 Si estamos conectados, muestra el log y cambia el mensaje
    socket.on('connected', function () {
      console.log('Conectado!');
      toggle();
    });

    //#4 Si pulsas el botón, envía el evento click
    $('#button').click(function(){
      socket.emit('click');
      });

    //#5 El servidor nos responde al click con este evento y nos da el número de clicks en el callback.
    socket.on('otherClick', function(clicks){
      console.log('Clicks: '+clicks);
      $('h2').replaceWith('<h2>Has pulsado '+clicks+' veces!');
      });

    //#6 Si nos desconectamos, muestra el log y cambia el mensaje.
    socket.on('disconnect', function () {
      console.log('Desconectado!');
      toggle();
      });