Skip to content

HTTPS clone URL

Subversion checkout URL

You can clone with HTTPS or Subversion.

Download ZIP

Comparing changes

Choose two branches to see what's changed or to start a new pull request. If you need to, you can also compare across forks.

Open a pull request

Create a new pull request by comparing changes across two branches. If you need to, you can also compare across forks.
base fork: jsanz/socketio-playground
base: e6ee88cc45
...
head fork: jsanz/socketio-playground
compare: f5d4d929ff
Checking mergeability… Don't worry, you can still create the pull request.
  • 3 commits
  • 5 files changed
  • 0 commit comments
  • 1 contributor
Showing with 119 additions and 1 deletion.
  1. +1 −1  .gitignore
  2. +1 −0  Procfile
  3. +58 −0 index.html
  4. +11 −0 package.json
  5. +48 −0 web.js
View
2  .gitignore
@@ -12,4 +12,4 @@ logs
results
node_modules
-npm-debug.log
+npm-debug.log
View
1  Procfile
@@ -0,0 +1 @@
+web: node web.js
View
58 index.html
@@ -0,0 +1,58 @@
+<html>
+<head>
+ <script src="/socket.io/socket.io.js"></script>
+ <script src="https://ajax.googleapis.com/ajax/libs/jquery/1.6.4/jquery.min.js"></script>
+ <script>
+ var socket = io.connect('/');
+
+ // on connection to server, ask for user's name with an anonymous callback
+ socket.on('connect', function(){
+ // call the server-side function 'adduser' and send one parameter (value of prompt)
+ socket.emit('adduser', prompt("What's your name?"));
+ });
+
+ // listener, whenever the server emits 'updatechat', this updates the chat body
+ socket.on('updatechat', function (username, data) {
+ $('#conversation').append('<b>'+username + ':</b> ' + data + '<br>');
+ });
+
+ // listener, whenever the server emits 'updateusers', this updates the username list
+ socket.on('updateusers', function(data) {
+ $('#users').empty();
+ $.each(data, function(key, value) {
+ $('#users').append('<div>' + key + '</div>');
+ });
+ });
+
+ // on load of page
+ $(function(){
+ // when the client clicks SEND
+ $('#datasend').click( function() {
+ var message = $('#data').val();
+ $('#data').val('');
+ // tell server to execute 'sendchat' and send along one parameter
+ socket.emit('sendchat', message);
+ });
+
+ // when the client hits ENTER on their keyboard
+ $('#data').keypress(function(e) {
+ if(e.which == 13) {
+ $(this).blur();
+ $('#datasend').focus().click();
+ }
+ });
+ });
+
+</script>
+</head>
+<body>
+ <div style="float:left;width:100px;border-right:1px solid black;height:300px;padding:10px;overflow:scroll-y;"> <b>USERS</b>
+ <div id="users"></div>
+ </div>
+ <div style="float:left;width:300px;height:250px;overflow:scroll-y;padding:10px;">
+ <div id="conversation"></div>
+ <input id="data" style="width:200px;" />
+ <input type="button" id="datasend" value="send" />
+ </div>
+</body>
+</html>
View
11 package.json
@@ -0,0 +1,11 @@
+{
+ "name": "heroku-test",
+ "version": "0.0.1",
+ "dependencies": {
+ "express": "2.5.x",
+ "socket.io" : ""
+ },
+ "engines": {
+ "node": "0.6.x"
+ }
+}
View
48 web.js
@@ -0,0 +1,48 @@
+var app = require('express').createServer();
+var io = require('socket.io').listen(app);
+
+var port = process.env.PORT || 5000;
+app.listen(port, function () {
+ console.log("Listening on " + port);
+});
+
+// routing
+app.get('/', function (req, res) {
+ res.sendfile(__dirname + '/index.html');
+});
+
+// usernames which are currently connected to the chat
+var usernames = {};
+
+io.sockets.on('connection', function (socket) {
+
+ // when the client emits 'sendchat', this listens and executes
+ socket.on('sendchat', function (data) {
+ // we tell the client to execute 'updatechat' with 2 parameters
+ io.sockets.emit('updatechat', socket.username, data);
+ });
+
+ // when the client emits 'adduser', this listens and executes
+ socket.on('adduser', function (username) {
+ // we store the username in the socket session for this client
+ socket.username = username;
+ // add the client's username to the global list
+ usernames[username] = username;
+ // echo to client they've connected
+ socket.emit('updatechat', 'SERVER', 'you have connected');
+ // echo globally (all clients) that a person has connected
+ socket.broadcast.emit('updatechat', 'SERVER', username + ' has connected');
+ // update the list of users in chat, client-side
+ io.sockets.emit('updateusers', usernames);
+ });
+
+ // when the user disconnects.. perform this
+ socket.on('disconnect', function () {
+ // remove the username from global usernames list
+ delete usernames[socket.username];
+ // update list of users in chat, client-side
+ io.sockets.emit('updateusers', usernames);
+ // echo globally that this client has left
+ socket.broadcast.emit('updatechat', 'SERVER', socket.username + ' has disconnected');
+ });
+});

No commit comments for this range

Something went wrong with that request. Please try again.