Transcript

In this screencast, we’ll add a flash message that will let all users know when someone logs-in, logs-out, is added or deleted. So here, I’ve logged in on one browser normally and I’ll log in on another browser using icognito mode…and there’s our flash message. When I log out I see the flash message indicating the logout on the other browser. Now I’ll create a new user account and we see the corresponding flash message. Finally, I’ll delete the account and the flash message notifying us of the change is displayed..

So following our Real Time Model Events pattern from episodes 21 and 22, we’re already subscribed to the user class room and instance models. We did that on the server-side by creating a subscribe action to our user controller which does the actual room subscriptions. On the client-side within app.js we initiate the subscription by using: socket.get('/user/subscribe');which, similar to an http get, hits our subscribe action.

So now all we have to do is use the publish methods to let the socket of any browser tab know that one of our events has occurred. First, let’s look at when the user logs-in. For that we’ll go into our session controller. We’re already using publishUpdate to let the socket know that someone has logged in, now we can expand this object to pass the user.name and an action attribute with a value of ‘ has logged in.’

On the client side, I’m going to open app.js and add to our popularly named cometMessageReceivedFromServer method to include an if statement that checks whether the message.verb is not equal to destroy and if it’s not call the displayFlashActivity method. This method, plays a sound and then through jquery displays the flash message.

In order to set this up we need to do a couple of quick things. First, I created a sounds folder which not surprisingly contain sound files. And then since I want this sound available on every page I put the following tags in the layout.ejs file.

So let’s see if this works. I’ll log-in and great, we get a slightly annoying sound and our flash message.

Back in the session controller’s destroy action, I’ll add an update when the user logs out. We expand the object again to include the user.name but this time an action attribute with the value of ‘ has logged out.’

Next, let’s open the User Controller’s create action and we’re already using publishCreate(user) to update our User Administration page. So here I’ll just add the action attribute to the user object and we’ll be good to go.

Finally, let’s look at the destroy action of the user controller. Here we’re using the publishDestroy method to let our User Administration page know that a user was destroyed. The publishDestroy method only passes the id of the destroyed model, so I’m going to also use the publishUpdate method to pass the user.name and user.action to our client.

Now let’s see if this all works.

I have our two browsers open one in regular one in incognito mode. I’ve logged into one side and now I’ll log into the other…there’s our flash message. When I log out we see the flash message. When I add a user we get the appropriate flash message. Finally, when I delete the user account, we’re notified of the event.

Although this all works, I’d really prefer that you have to be logged in order to receive the flash messages. I’d also like the flexibility of making the activities persistent, that is saved to a database. So in the next screencast we’ll refactor this code to do just that.

Thanks for watching.