Socket.io integration for message broadcasting

Here is the code that will perform the RethinkDB changefeed operation and event broadcasting:

var rethinkdb = require('rethinkdb'); 
var db = require('./db'); 
var pollObject = new db(); 
module.exports = function(socket) { 
  pollObject.connectToDb(function(err,connection) { 
  if(err) { 
    return callback(true,"Error connecting to database"); 
  } 
  // Look over this line carefully. 
  // we are invoking changes() function on poll table. 
  // On every change it will give us data. 
  rethinkdb.table('poll').changes().run(connection,function(err,cursor) { 
    if(err) { 
      console.log(err); 
    } 
    // We are scrolling over the cursor data and broadcasting the changes using socket. 
    cursor.each(function(err,row) { 
      console.log(JSON.stringify(row)); 
      if(Object.keys(row).length > 0) { 
        socket.broadcast.emit("changeFeed",{"id" : row.new_val.id,"polls" : row.new_val.polls}); 
      } 
    }); 
  }); 
  }); 
}; 

In the preceding code, we are writing a function that can be used as many times a user wishes to invoke it. Here we are first connecting to the database using our existing function, which we wrote in an earlier section, and then attaching a changefeed to it.

Once any change occurs, we are looping through the stream and if some data exists, then we broadcast it using the socket function. Simple, isn't it?

Let's invoke it as soon as our app starts, add this line of code in app.js:

var io = require('socket.io')(http); 
var feed; 
// On connection to the socket, just invoking the function. 
io.on('connection',function(socket) { 
  feed = require('./models/feeds')(socket); 
}); 

This will invoke the new feed as soon as at least one client is connected to the server. This sums up the backend. All we need now is to listen for this event in our Angular code.

To make sure Angular listen for this change, we need to first initialize the Socket in our Angular app. Socket is available as factory in AngularJS. Here is the code to do so:

app.factory('socket',function(){ 
  // This is where our app running. 
  var socket = io.connect('http://localhost:3000'); 
  return socket; 
}); 

This will return the socket object after connecting to our server. Make sure the URL is correct. Once you get the socket object, all you need to do is listen for the events and if any change is happening, update the $scope.pollData variable.

Here is the socket listener:

  // This is the event we are emitting from Server. 
  socket.on('changeFeed',function(data) { 
    // $scope.apply will make the change in HTML screen. 
    for(var pollCounter = 0 ;pollCounter < $scope.pollData.length; pollCounter++) { 
      if($scope.pollData[pollCounter].id === data.id) { 
        $scope.pollData[pollCounter].polls = data.polls; 
        $scope.$apply(); 
      } 
    } 

I believe the code is quite simple; we are looping over the data coming from the backend, and if any poll ID matches the poll already present then it updates the poll count. This will make sure that the vote count is updated as soon as people vote.

You can always download the code from the source code provided to you and run it and have fun. Try to do this using multiple browsers to see the real working scenario.

..................Content has been hidden....................

You can't read the all page of ebook, please click here login for view all page.
Reset
18.189.170.134