Bon Iver

app.js

@@ -1,14 +1,32 @@
+/*global io */
+
 /**
  * Module dependencies.
  */
+var express    = require('express'),
+    http       = require('http'),
+    path       = require('path'),
+    domain     = require('domain'),
+    util       = require('util'),
+    app        = express(),
+    server     = app.listen(process.env.PORT),
+    routes     = require('./routes'),
+    randomCode = require('./modules/randomCode.js').RandomCode;
+
+// Global Objects
+io = require('socket.io').listen(server);
 
-var express = require('express'),
-    routes  = require('./routes'),
-    http    = require('http'),
-    path    = require('path'),
-    app     = express(),
-    server  = app.listen(process.env.PORT),
-    io      = require('socket.io').listen(server);
+
+function hangups(req, res, next) {
+    var reqd = domain.create();
+    reqd.add(req);
+    reqd.add(res);
+    reqd.on('error', function (error) {
+        if (error.code !== 'ECONNRESET') console.error(error, req.url);
+        reqd.dispose();
+    });
+    next();
+}
 
 app.configure(function(){
   app.set('views', __dirname + '/views');
@@ -24,36 +42,50 @@ app.configure(function(){
     src: __dirname + '/public'
   }));
   app.use(express.static(path.join(__dirname, 'public')));
+  app.use(hangups);
 });
 
-// Node Fly Analytics
-require('nodefly').profile(
-  '75e62077-1aa6-4caf-90c2-fdf89d6cdb89',
-  ['Just Sing It']
-);
 
 app.configure('development', function(){
   app.use(express.errorHandler());
 });
 
+// Routes
 app.get('/', routes.index);
+app.get('/join', routes.join);
+app.post('/join_room', routes.join_room);
 
 io.configure(function () {
 	io.set("transports", ["xhr-polling"]);
 	io.set("polling duration", 10);
 });
 
 io.sockets.on('connection', function (socket) {
-	// When the client is added
-	socket.on('addUser', function(message) {
-		// Echo globally (all clients) that a person has connected
-		socket.broadcast.emit('broadcastData', message);
+	// When the host creates a room
+	socket.on('create_room', function() {
+    var roomId = randomCode.get();
+    while (typeof io.sockets.manager.rooms['/'+roomId] !== 'undefined') {
+      roomId = randomCode.get();
+    }
+    socket.join(roomId);
+    socket.emit('created roomId', roomId);
+    console.log("Checking room: " + util.inspect(io.sockets.manager.rooms, false, null));
 	});
 
+  socket.on('join_room', function(roomId) {
+    if (io.sockets.manager.rooms['/' + roomId]) {
+      socket.join(roomId);
+      console.log('Joining room: ' + roomId);
+      socket.emit('joined_room', roomId);
+    }
+  });
+
 	// When the user disconnects
 	socket.on('disconnect', function(){
 		// Echo globally that this client has left
 		// socket.broadcast.emit('updateroom', 'SERVER', socket.username + ' has disconnected');
+    // TODO: Does socket IO clean up after us?
+    //socket.leave('room');
 	});
 });
 

modules/randomCode.js

@@ -0,0 +1,20 @@
+;(function() {
+    "use strict";
+
+    var RandomCode = function(){};
+
+    RandomCode.prototype = {
+
+        LOWERCASE_CHARS : ['a', 'b', 'c', 'd', 'e', 'f', 'g', 'h', 'i', 'j', 'k', 'l', 'm', 'n', 'o', 'p', 'q', 'r', 's', 't', 'u', 'v', 'w', 'x', 'y', 'z'],
+
+        // Return a random string of 5 lowercase characters
+        get : function() {
+            var self = this;
+            return Array.apply(0, new Array(5)).map(function() {
+                return self.LOWERCASE_CHARS[Math.floor(Math.random()*self.LOWERCASE_CHARS.length)];
+            }).join('');
+        }
+    };
+
+    exports.RandomCode = new RandomCode();
+})();

public/javascripts/collections/playList.js

@@ -0,0 +1,18 @@
+/*global Backbone _ $ ENTER_KEY */
+var app = app || {};
+
+$(function () {
+    "use strict";
+
+    // PlayList Collection
+    // ----------------------
+
+    var PlayList = Backbone.Collection.extend({
+
+        model: app.Song
+
+    });
+
+    app.PlayList = new PlayList();
+
+});

public/javascripts/main.js

@@ -1,29 +1,37 @@
-/*global Backbone _ $ ENTER_KEY Hogan R Glsl io*/
+/*global Backbone _ $ ENTER_KEY Hogan R Glsl socket*/
 var app = app || {};
 
 ;(function($) {
     "use strict";
 
-    var socket = io.connect(window.location.href);
     // Connecting to server
     socket.on('connect', function(){
-        socket.emit('addUser', window.prompt("Enter your name"));
+        // socket.emit('addUser', window.prompt("Enter your name"));
     });
 
     // Updating the room
     socket.on('broadcastData', function (data) {
         window.alert(data);
     });
 
+    // If the url has a room id then join the room.
+    if (_.contains(window.location.href, '#')) {
+        var roomId = window.location.href.split('#')[1].substr(0,5);
+        socket.emit('join_room', roomId);
+    }
+
+    socket.on('joined_room', function(roomId){
+        console.log('Joined Room: ' + roomId);
+    });
+
     R.ready(function() {
         app.rdio = new app.RdioAdapter();
         app.musixMatch = new app.MusixMatchAdapter();
         app.echonest = new app.EchonestAdapter();
-
+        app.lobby = new app.LobbyView();
 
         var searchForSong = function() {
             var query = $("#searchInput").val();
-            //app.musixMatch.getTrackId(query, 50, app.rdio.search.bind(this, query, renderSuggestions));
             $.when(app.musixMatch.getTrackId(query, 50), app.rdio.search(query)).then(function(musix, rdio) {
                 console.log(musix);
                 console.log(rdio);
@@ -45,15 +53,23 @@ var app = app || {};
             var $searchResult  = $(event.target);
             window.playBackKey = $searchResult.data('key');
             window.trackId     = $searchResult.data('track-id');
+            app.PlayList.add(new app.Song(window.playBackKey, window.trackId));
+            socket.emit('create_room');
+            // BTW publish messages require underscores... Discuss convention
+            $.publish('create_room');
+        };
+
+        var fetchLyrics = function() {
             app.musixMatch.getLrcSubtitle(window.trackId, app.musixMatch.parseLrcData);
             app.echonest.getAudioSummary(window.trackId);
         };
 
-
         /***** DOM EVENTS *****/
 
         $("#goButton").on("click", searchForSong);
 
+        $.subscribe('fetch_lyrics', fetchLyrics);
+
         $("#searchInput").keypress(function(e) {
             if (e.which === 13) {
                 searchForSong();
@@ -71,7 +87,9 @@ var app = app || {};
             $('#rdioPlayer').removeClass('hidden');
         });
 
+        // refactor
         $.subscribe('show_lyrics', hideTitleScreen);
+        $.subscribe('create_room', hideTitleScreen);
 
         $('#searchInput').focus();
     });

public/javascripts/models/song.js

@@ -0,0 +1,26 @@
+/*global Backbone _ $ ENTER_KEY */
+var app = app || {};
+
+$(function () {
+    "use strict";
+
+    // Song Model
+    // ----------
+
+    app.Song = Backbone.Model.extend({
+
+        defaults : {
+          rdioPlaybackKey : null,
+          musixTrackId : null
+        },
+
+        initialize : function(rdioPlaybackKey, musixTrackId) {
+          this.set({
+            rdioPlaybackKey: rdioPlaybackKey,
+            musixTrackId: musixTrackId
+          });
+        }
+
+    });
+
+});

public/javascripts/views/lobby.js

@@ -0,0 +1,37 @@
+/*global Backbone _ $ ENTER_KEY Lobby Hogan*/
+var app = app || {};
+
+$(function () {
+    "use strict";
+
+    // Lobby View
+    // ---------
+    app.LobbyView = Backbone.View.extend({
+
+        tagName : 'div',
+
+        el      : '#lobbyContainer',
+
+        events  : {
+            'click .partyButton' : "partyOn"
+        },
+
+        initialize : function() {
+            socket.on('created roomId', this.render.bind(this));
+        },
+
+        render : function(roomId) {
+            this.$el.find("#roomId").html(roomId);
+            this.$el.removeClass("hidden");
+        },
+
+        partyOn : function() {
+            this.hide();
+            $.publish('fetch_lyrics');
+        },
+
+        hide : function() {
+            this.$el.addClass('hidden');
+        }
+    });
+});

public/javascripts/views/searchResults.js

@@ -17,6 +17,7 @@ $(function () {
 
         initialize : function() {
             $.subscribe('show_lyrics', this.hide.bind(this));
+            $.subscribe('create room', this.hide.bind(this));
             this.listenTo(app.searchResultsList, 'add_results', this.render.bind(this));
         },
 

public/stylesheets/style.less

@@ -24,11 +24,11 @@ h1 {
   font-size: 50px;
 }
 
-#searchContainer {
+#searchContainer, #joinContainer {
   text-align: center;
 }
 
-#searchInput {
+#searchInput, #joinInput {
   margin-right: 20px;
   margin-top: 10px;
   width: 400px;
@@ -130,6 +130,36 @@ h1 {
   border-radius: 4px;
 }
 
+#lobbyContainer {
+  width: 450px;
+  margin: 0 auto;
+  text-align: center;
+  background: rgba(0,0,0,0.4);
+  border-radius: 4px;
+  border: 2px solid black;
+  position: absolute;
+  margin-left: -225px;
+  margin-top: 200px;
+  left: 50%;
+  padding: 20px;
+  font-size: 22px;
+}
+
+.sync-step {
+  margin-top: 10px;
+}
+
+.sync-heading {
+  margin-top: 5px;
+  margin-bottom: 5px;
+  color: rgba(255,255,255,0.6);
+}
+
+#partyButton {
+  margin-top: 15px;
+  font-size: 22px;
+}
+
 #viewport {
   position: fixed;
   top: 0;

routes/index.js

@@ -1,15 +1,34 @@
+/*global io */
 
+"use strict";
 /*
  * GET home page.
  */
 
-exports.index = function(req, res){
-    var userAgent = req.header('user-agent');
-    var isMobile  = !!userAgent.match(/(ipad|iphone|ipod|android|webos|mobile)/i); 
-
+var util       = require('util');
+
+exports.index = function(req, res) {
+    var userAgent = req.header('user-agent'),
+        isMobile  = !!userAgent.match(/(ipad|iphone|ipod|android|webos|mobile)/i);
+
     if (isMobile) {
-	res.render('mobile', { title: 'sing along with me client' });
+	    res.render('mobile', { title: 'sing along with me client' });
     } else {
-	res.render('index', { title: 'sing along with me' });
+	    res.render('index', { title: 'sing along with me' });
     }
 };
+
+exports.join = function(req, res) {
+  res.render('join', {title: "Enter a Room"});
+};
+
+exports.join_room = function(req, res) {
+  var roomId = req.body.roomId;
+  if (io.sockets.manager.rooms['/' + roomId]) {
+    res.redirect('/#' + roomId);
+  } else {
+    // Return json instead?
+    res.write('No room for that id');
+    res.end();
+  }
+};