Tag Archives: javascript

Introducing Quick Group Chat

I’ve been working on a litte side project the last few weeks called Quick Group Chat. The site/service came from some IM conversations I was having with friends. I was talking to one friend on Gtalk and the other was on AIM and we were trying to plan a trip. There was no way for us to get in to a ‘quick group chat’ that let us ad hoc talk with each other.

I’d been looking for an excuse to play with nodejs and jquery, so I forked the node_chat example app. Since I started with the node_chat demo, I had a good structure to get started with. The app is basically built out of four files: server.js, client.js, style.css and index.html. To start off I added in a layer called ‘rooms’ in to the server that encapsulated a session, which represents a user. When a user joins, if they aren’t trying to join a room or if the server can’t find a room they were trying to join, a new room is created and an ID is given to it. The user’s session is assigned to that room and the chat buffer is kept for that room. The ID is passed back to the client, and the client updates the location.hash with the room’s ID.

From then anybody who has the URL with the location.hash can join the room. When the user navigates to that URL, the client passes the room ID to the server, and the server joins the user to the room. Since the chat buffer is kept for the room, every time a user joins the room they get to see the prior chat log. When the last user leaves a room, the room is destroyed along with all the data. Hence, quick group chat. Once you’re in the room, the URL is they to invite other people in.  It’s all pretty simple.

I also added in some styling to make it little more fun and easier to read. Each user is assigned their own color based on a color wheel. The formula is kind of fun and easy. For each user’s nickname the code goes over the nick and sums up the ASCII code for each letter in the name, then mod’s it against the total number of colors in the color wheel then assigns a CSS class for that color to the message. That way every time “Aditya” logs in, the user’s color is the same. There’s one exception, and that’s the “me” user. Your typing always looks the same always; thus, the way other people see “Aditya” is always consistent and they see a consistent color for you. I may change that later but it makes other people’s chat pop and your own words a bit more subdued.

Lastly, I hosted it on duostack. This was one of the coolest parts. Once I set up some SSH keys, I added duostack as a remote to my git. Every time I do a “git push duostack”, their remote repository is updated and the app recycles. It’s crazy easy to deploy to their service and it runs really well there. I’ve been amazed at how easy it is and really happy with the service.

Check it out, use it yourself, or fork it and let me know how it goes!