Fork me on GitHub

Embed instant messaging into your Web App!

ChatJS is a full-featured, lightweight, Facebook style jQuery plugin for instant messaging. ChatJS also comes with a server side implementation for ASP.NET/SignalR out of the box.

Download Join public demo chat

... or visit the project at GitHub.

How it works:

The client part is divided in two JavaScript files. The file jquery.chatjs.js contains the main jQuery plugin. This file is completely independent of the server implementation. In order to implement the interface between jquery.chatjs.js and the server, you need and adapter. ChatJS comes with two adapter implementations. The first one, jquery.chatjs.signalradapter.js, is meant to be used with ASP.NET and SignalR. This is the preferable way for working with ASP.NET. The second one is jquery.chatjs.longpollingadapter.js which is the generic client-side implementation. This adapter can work with whatever server-side implementation you use, like PHP, Java or NodeJS, as long as the proper end-points are implemented.

Once the server is set up, the client code is quite simple. These are all the options:

$.chat({
    // your user information
    user: {
        Id: 3,
        Name: 'John Silver',
        ProfilePictureUrl: 'http://www.foo.com/avatar/123'
    },
    // text displayed when the other user is typing
    typingText: ' is typing...',
    // the title for the user's list window
    titleText: 'ChatJS demo chat',
    // text displayed when there's no other users in the room
    emptyRoomText: "There's no one around here.",
    // the adapter you are using. There are 2 implementations out of the box:
    // SignalRAdapter and LongPollingAdapter (server independent).
    adapter: new SignalRAdapter()
});

Features:

  • Real time message sharing.
  • Automatically parses URLs and emoticons .
  • Automatically remembers opened windows across diferent requests (through cookies).
  • Triggers a sound notification when the user receives a message.
  • Indicates when the other user is typing.
  • Supports user online and offline status.
  • Supports multiple chat rooms. If you have a multi-tenancy app you can create a room for each tenancy, for instance.
  • Supports multiple browser windows opened with the same session. They all get properly sinchronized.
  • Customizable texts. You can easily translate it to your language.
  • ChatJS comes with a sample server implementation for ASP.NET that supports both the SignalR and the long-polling adapter.

License:

ChatJS v1.1 is free under the MIT license.

How to get ChatJS up and running in your environment

The first thing to do is to determine which adapter you want to use. The adapter is the piece of code that will determine how the client will communicate to the server. ChatJS comes with two adapters and an ASP.NET sample that supports both. If you are working with ASP.NET, it's highly recommended that you use SignalR. ASP.NET SignalR is a new library for ASP.NET developers that makes it incredibly simple to add real-time web functionality to your applications. Basically you have a "permanent" client-server connection that allows you to call client JavaScript funtions from the server. If you are not using ASP.NET or you can't use SignalR for some reason, long polling is the way to go. With long polling, the client requests information from the server in a way similar to a normal polling; however, if the server does not have any information available for the client, then instead of sending an empty response, the server holds the request and waits for information to become available (or for a suitable timeout event), after which a complete response is finally sent to the client. Long polling allows you to send data from the server to the client almost in real time.

To get up and running, chose your adapter and continue reading the documentation:

About the author

Hello everyone, my name is André Pena. I'm a .NET developer from Brazil. I hope you will enjoy ChatJS as much as I enjoy developing it. If you have any problems, you can post a GitHub issue. if you have a suggestion for ChatJS, or if you want to hire me to help integrating ChatJS into your application, contact me at andrerpena@gmail.com.

License:

ChatJS v1.1 is free under the MIT license.

Third Party:

ChatJS uses emoticons freely provided by Aha at www.softicons.com. Emoticons license: Creative Commons Attribution 3.0 . You can easily replace the emiticons by those which better fits your needs. ChatJS also uses the jQuery Autosize plugin by Jack Moore.