├── README.md
├── chat.html
├── chat.js
└── styles.css
/README.md:
--------------------------------------------------------------------------------
1 | # A Real Time Chat Built on Node-js and Socket.io
2 |
3 | ------------------------------------------------------------------
4 |
5 | ## Setup your Chat Room
6 |
7 | ------------------------------------------------------------------
8 |
9 | To Install node-js just follow this guide https://github.com/joyent/node/wiki/Installation.
10 |
11 | Then you need to Install the Node Pacakge Manager (NPM). Read this guide https://github.com/isaacs/npm.
12 |
13 | ------------------------------------------------------------------
14 |
15 | Get socket.io via NPM by running:
16 |
17 | ```bash
18 | ~$ npm install socket.io
19 | ```
20 |
21 | ------------------------------------------------------------------
22 |
23 | Start the node-js server. Just type:
24 |
25 | ```bash
26 | ~$ node chat.js
27 | ```
28 |
29 | ------------------------------------------------------------------
30 |
31 | Open the chat.html file in your favourite browser and enjoy!
32 |
--------------------------------------------------------------------------------
/chat.html:
--------------------------------------------------------------------------------
1 |
2 |
3 |
4 |
5 |
6 |
40 |
41 |
42 |
43 |
Real Time Chat
44 |
45 |
46 |
51 |
52 |
53 |
54 |
55 |
--------------------------------------------------------------------------------
/chat.js:
--------------------------------------------------------------------------------
1 | var DEBUG = true
2 | var PORT = 3000
3 | var INIT_MESSAGES = 5
4 |
5 | var http = require('http')
6 |
7 | var server = http.createServer()
8 | server.listen(PORT)
9 |
10 | var io = require('socket.io').listen(server)
11 | io.set ('transports', ['xhr-polling', 'jsonp-polling'])
12 |
13 | var messages = new Array()
14 |
15 | Array.prototype.inject = function(element) {
16 |
17 | if (this.length >= INIT_MESSAGES) {
18 | this.shift()
19 | }
20 | this.push(element)
21 | }
22 |
23 | io.sockets.on('connection', function(client) {
24 |
25 | if (DEBUG)
26 | console.log("New Connection: ", client.id)
27 |
28 | client.emit("init", JSON.stringify(messages))
29 |
30 | client.on('msg', function(msg) {
31 |
32 | if (DEBUG)
33 | console.log("Message: " + msg)
34 |
35 | var message = JSON.parse(msg)
36 | messages.inject(message)
37 |
38 | client.broadcast.emit('msg', msg)
39 | })
40 |
41 | client.on('disconnect', function() {
42 |
43 | if (DEBUG)
44 | console.log("Disconnected: ", client.id)
45 | })
46 | })
47 |
--------------------------------------------------------------------------------
/styles.css:
--------------------------------------------------------------------------------
1 | #msgs {
2 | height: 300px;
3 | background: #f3f3ff;
4 | font-family: monospace, sans;
5 | overflow:auto;
6 | }
7 |
8 | .chat-title {
9 | color: white;
10 | background: #a2a2ee;
11 | font-weight: bold;
12 | font-size: 20px;
13 | height: 24px;
14 | padding: 2px;
15 | }
16 |
--------------------------------------------------------------------------------