Happy Camper is a full-featured chatroom client for 37Signals’ Campfire. It was developed as a Chrome extension and can be used to send and receive messages, join and leave rooms, receive desktop notification of new messages, and perform full-text searches.

Here are some screenshots of Happy Camper:

Happy Camper was built on the Campfire API, a REST interface to the persistent chatroom site. The major challenge of building a chat app on an old-fashioned REST protocol was how to receive constant updates without JSONP, long-polling, or WebSockets support. Campfire does support a persistent TCP connection but as evidenced by their use of curl in the examples, it caters exclusively to desktop apps which support native sockets.

I ended up going with a simple 10-second polling approach. As long as the user doesn’t receive a whole bunch of messages on each refresh, there wouldn’t be many packets going through the pipeline.

Another challenge I faced was how to get basic authentication working with jQuery $.ajax. A tidbit I didn’t know about was using the following syntax to pass username/password combinations along to a REST API, like so:

$.ajax({
    url: "http://username:password@sample.campfirenow.com/room/2.json"
    // other properties
});

This allowed me to use the typical jQuery AJAX approach to GET and POST to all endpoints in Campfire. The fact that the requests were cross-domain wasn’t a big deal as Chrome Extensions don’t have that limitation.

The next portion of development was just being able to account for all the cases were the code had to wait for multiple async requests to come back. This had to be done because messages had user_id attached but not the entire user object with name and email properties. I ended up using a very inelegant scheme of checking periodically to see if any data still needed to be populated by an in-flight request before generating the UI.

There are now better ways of doing this. jQuery 1.5′s deferred object can be used with $.ajax to wait on multiple responses to return before performing a function. Eric Hynds has an excellent tutorial on using Deferreds. I’ll be exploring ways to refactor the Happy Camper code to use Deferred in later versions.

Otherwise, the rest of Happy Camper wasn’t anything especially new. I used jQuery templating very heavily for everything related to rooms, messages, users, files, and search results. As Campfire JSON results contained plenty of foreign-key relations (user_id, room_id), I had to use jLinq very heavily to do filtering, mappings, and joins on array data. For more on jLinq, check my previous post.

Download from Chrome Extensions
Current version: 1.0.1

Get the source code from GitHub