Initial stab at autoupdateing statuses

public/js/script.js

@@ -0,0 +1,13 @@
+var socket = io.connect('http://localhost:3003');
+
+function update_or_append_status(username, status) {
+    $('.status-container[rel='+username+']').each(function (i,el) {el.innerHTML = status.status; console.log(el)});
+}
+
+socket.on('status_update', function (data) {
+    var to_update = document.getElementsByClassName("status-container");
+    for (var k in data) {
+        var status = data[k];
+        update_or_append_status(status.username, status.status)
+    }
+});

routes/index.js

@@ -66,6 +66,16 @@ function bootstrap() {
 
 bootstrap();
 
+// Sockets
+
+io.sockets.on('connection', function (socket) {
+    var statuses = get_statuses();
+    socket.emit('status_update', statuses);
+    console.log('new connection opened');
+});
+
+// Views
+
 exports.index = function(req, res){
   res.render('index', {
     locals: {

views/layout.mustache

@@ -56,6 +56,8 @@
   <script>window.jQuery || document.write('<script src="js/libs/jquery-1.7.1.min.js"><\/script>')</script>
 
   <!-- scripts concatenated and minified via build script -->
+  <script src="http://localhost:3003/socket.io/socket.io.js"></script>
+  <script src="/js/script.js"></script>
   <!-- end scripts -->
 
   <!-- Asynchronous Google Analytics snippet. Change UA-XXXXX-X to be your site's ID.

views/status_listings.mustache

@@ -1,4 +1,4 @@
 <h1>Current status of all system users</h1>
 {{#statuses}}
-   <p><a href="/status/{{username}}">{{username}}</a>: {{status.status}}</p>
+   <p><a href="/status/{{username}}">{{username}}</a>: <span class="status-container" rel="{{username}}">{{status.status}}</span></p>
 {{/statuses}}