erickgnavar/app.js

## app.js
var app = angular.module('ChatApp', []);

## room.html
{% load i18n %}
{% load staticfiles %}
<!doctype html>
<html lang="en">
<head>
    <meta charset="UTF-8">
    <title>Room - {{ room.name }}</title>
</head>
<body>
    <h1>{{ room.name }}</h1>
    <a href="{% url 'chat_home' %}">{% trans 'all rooms' %}</a>
    <hr/>
    <form id="message-form">
        <input type="text" id="content"/>
        <input type="submit" value="{% trans 'send' %}"/>
    </form>
    <hr/>
    <table>
        <thead>
        <tr>
            <th>{% trans 'Content' %}</th>
            <th>{% trans 'Author' %}</th>
            <th>{% trans 'Created' %}</th>
        </tr>
        </thead>
        <tbody id="comments">
        {% for comment in comments %}
            <tr>
            <td>{{ comment.content }}</td>
            <td>{{ comment.user.get_full_name }}</td>
            <td>{{ comment.created }}</td>
            </tr>
        {% endfor %}
        </tbody>
    </table>
    <script src="//ajax.googleapis.com/ajax/libs/jquery/1.10.2/jquery.min.js"></script>
    <script src="http://localhost:9000/socket.io/socket.io.js"></script>
    <!--<script src="{% static 'chat/app.js' %}"></script>-->
    <script>
        var chat = io.connect('http://localhost:9000/chat');
        chat.emit('register room', {
            id: {{ room.id }},
            name: '{{ room.name }}'
        });
        chat.on('message', function (data) {
            var message = JSON.parse(data);
            console.log(message);
            var template = '<tr><td>#content</td><td>#author</td><td>#created</td></tr>';
            var html = template.replace('#content', message.content)
                .replace('#created', message.created)
                .replace('#author', message.author);
            $('#comments').prepend(html);
        });
        function postMessage (message, callback) {
            $.ajax({
                url: '{% url 'chat_post_message' %}',
                method: 'post',
                data: {
                    content: message,
                    roomId: {{ room.id }}
                },
                dataType: 'json',
                success: function (response) {
                    console.log(response);
                    callback();
                }
            })
        }
        $(function () {
            var $content = $('#content');
            $content.on('focus', function () {
                $content.val('');
            });
            $('#message-form').on('submit', function (e) {
                e.preventDefault();
                postMessage($content.val(), function () {
                    $content.focus();
                });
            });
        });
    </script>
</body>
</html>

## server.js
var io = require('socket.io').listen(9000, {log: false});

var redis = require("redis").createClient();

redis.subscribe('chat');
redis.subscribe('notifications');

var chat = io.of('/chat').
    on('connection', function (socket) {
    socket.on('register room', function (room) {
        socket.set('room', room);
    });
    redis.on('message', function (channel, message) {
        var messageObject = JSON.parse(message);
        if (channel === 'chat') {
            socket.get('room', function (err, room) {
                if (err === null && room !== null) {
                    if (messageObject.room.id === room.id) {
                        socket.emit('message', message);
                    }
                }
            });
        }
    });
});

var notifications = io.of('/notifications').
    on('connection', function (socket) {
    console.log(socket.id);
    socket.on('register user', function (user) {
        socket.set('user', user);
    });
    redis.on('message', function (channel, message) {
        var messageObject = JSON.parse(message);
        if (channel === 'notifications') {
            socket.get('user', function (err, user) {
                if (err === null && user !== null) {
                    if (user.id.toString() === messageObject.recipient.id.toString()) {
                        socket.emit('notification', message);
                    }
                }
            });
        }
    });
});
	{% load i18n %}
	{% load staticfiles %}
	<!doctype html>
	<html lang="en">
	<head>
	<meta charset="UTF-8">
	<title>Room - {{ room.name }}</title>
	</head>
	<body>
	<h1>{{ room.name }}</h1>
	<a href="{% url 'chat_home' %}">{% trans 'all rooms' %}</a>
	<hr/>
	<form id="message-form">
	<input type="text" id="content"/>
	<input type="submit" value="{% trans 'send' %}"/>
	</form>
	<hr/>
	<table>
	<thead>
	<tr>
	<th>{% trans 'Content' %}</th>
	<th>{% trans 'Author' %}</th>
	<th>{% trans 'Created' %}</th>
	</tr>
	</thead>
	<tbody id="comments">
	{% for comment in comments %}
	<tr>
	<td>{{ comment.content }}</td>
	<td>{{ comment.user.get_full_name }}</td>
	<td>{{ comment.created }}</td>
	</tr>
	{% endfor %}
	</tbody>
	</table>
	<script src="//ajax.googleapis.com/ajax/libs/jquery/1.10.2/jquery.min.js"></script>
	<script src="http://localhost:9000/socket.io/socket.io.js"></script>
	<!--<script src="{% static 'chat/app.js' %}"></script>-->
	<script>
	var chat = io.connect('http://localhost:9000/chat');
	chat.emit('register room', {
	id: {{ room.id }},
	name: '{{ room.name }}'
	});
	chat.on('message', function (data) {
	var message = JSON.parse(data);
	console.log(message);
	var template = '<tr><td>#content</td><td>#author</td><td>#created</td></tr>';
	var html = template.replace('#content', message.content)
	.replace('#created', message.created)
	.replace('#author', message.author);
	$('#comments').prepend(html);
	});
	function postMessage (message, callback) {
	$.ajax({
	url: '{% url 'chat_post_message' %}',
	method: 'post',
	data: {
	content: message,
	roomId: {{ room.id }}
	},
	dataType: 'json',
	success: function (response) {
	console.log(response);
	callback();
	}
	})
	}
	$(function () {
	var $content = $('#content');
	$content.on('focus', function () {
	$content.val('');
	});
	$('#message-form').on('submit', function (e) {
	e.preventDefault();
	postMessage($content.val(), function () {
	$content.focus();
	});
	});
	});
	</script>
	</body>
	</html>
	var io = require('socket.io').listen(9000, {log: false});

	var redis = require("redis").createClient();

	redis.subscribe('chat');
	redis.subscribe('notifications');

	var chat = io.of('/chat').
	on('connection', function (socket) {
	socket.on('register room', function (room) {
	socket.set('room', room);
	});
	redis.on('message', function (channel, message) {
	var messageObject = JSON.parse(message);
	if (channel === 'chat') {
	socket.get('room', function (err, room) {
	if (err === null && room !== null) {
	if (messageObject.room.id === room.id) {
	socket.emit('message', message);
	}
	}
	});
	}
	});
	});

	var notifications = io.of('/notifications').
	on('connection', function (socket) {
	console.log(socket.id);
	socket.on('register user', function (user) {
	socket.set('user', user);
	});
	redis.on('message', function (channel, message) {
	var messageObject = JSON.parse(message);
	if (channel === 'notifications') {
	socket.get('user', function (err, user) {
	if (err === null && user !== null) {
	if (user.id.toString() === messageObject.recipient.id.toString()) {
	socket.emit('notification', message);
	}
	}
	});
	}
	});
	});