added the ability to hide the chat and the time needed to correctly guess the song...

diff --git a/package.json b/package.json
index 81b6a5e3ae47cd3a6bbdd706711cf58a8f95bd5e..cf61c4450732001d3a730e5a42eb717d44902bc8 100644 (file)
--- a/package.json
+++ b/package.json
@@ -14,5 +14,5 @@
   "engines": {
     "node": "0.6.x"
   },
-  "version": "0.2.0-7"
+  "version": "0.2.0-9"
 }
\ No newline at end of file

diff --git a/public/static/css/style.css b/public/static/css/style.css
index bbf1bc572c7cede88888aa50132b0c948a10f2d2..435573f61f915f91281e38c229599f1021834e01 100644 (file)
--- a/public/static/css/style.css
+++ b/public/static/css/style.css
@@ -314,7 +314,7 @@ input {
 #users .you {
        cursor: auto;
 }
-#users .points {
+#users .points, #users .round-points {
        margin-right: 10px;
 }
 .round-rank {
@@ -335,6 +335,49 @@ input {
        display:inline-block;
        vertical-align: middle;
 }
+#users .guess-time {
+       font-size: 11px;
+}
+#toggle-chat {
+       position: absolute;
+       top: -17px;
+       left: 805px;
+       color: #BFBFBF;
+       height: 16px;
+       line-height: 16px;
+       font-size: 11px;
+       border: 1px solid #DDDDDD;
+       -moz-border-radius: 4px 4px 0 0;
+       -webkit-border-radius: 4px 4px 0 0;
+       border-radius: 4px 4px 0 0;
+       cursor: pointer;
+       padding: 0 10px;
+       text-decoration: none;
+}
+#toggle-chat:hover {
+       border-color: #CCCCCC;
+       background-color: #f5f5f5;
+       color: #333333;
+       background-image: -moz-linear-gradient(top, #ffffff, #e6e6e6);
+       background-image: -ms-linear-gradient(top, #ffffff, #e6e6e6);
+       background-image: -webkit-gradient(linear, 0 0, 0 100%, from(#ffffff), to(#e6e6e6));
+       background-image: -webkit-linear-gradient(top, #ffffff, #e6e6e6);
+       background-image: -o-linear-gradient(top, #ffffff, #e6e6e6);
+       background-image: linear-gradient(top, #ffffff, #e6e6e6);
+       filter:progid:DXImageTransform.Microsoft.gradient(startColorstr='#ffffff', endColorstr='#e6e6e6', GradientType=0);
+       -webkit-box-shadow: inset 0 1px 0 rgba(255, 255, 255, 0.2),0 1px 2px rgba(0, 0, 0, 0.05);
+       -moz-box-shadow: inset 0 1px 0 rgba(255, 255, 255, 0.2),0 1px 2px rgba(0, 0, 0, 0.05);
+       box-shadow: inset 0 1px 0 rgba(255, 255, 255, 0.2),0 1px 2px rgba(0, 0, 0, 0.05);
+}
+#toggle-chat:active {
+       background-image: none;
+       -webkit-box-shadow: inset 0 2px 4px rgba(0, 0, 0, 0.15),0 1px 2px rgba(0, 0, 0, 0.05);
+       -moz-box-shadow: inset 0 2px 4px rgba(0, 0, 0, 0.15),0 1px 2px rgba(0, 0, 0, 0.05);
+       box-shadow: inset 0 2px 4px rgba(0, 0, 0, 0.15),0 1px 2px rgba(0, 0, 0, 0.05);
+       background-color: #e6e6e6;
+       background-color: #d9d9d9 \9;
+       outline: 0;
+}
 #chat-wrapper {
        margin-bottom: 4px;
        height: 160px;

diff --git a/public/static/js/room.js b/public/static/js/room.js
index 7ca671aaa8cc2b985a92363a5ff219b3736221ee..906d19a84fd07e7bbbcdfb01f90975b2722f121b 100644 (file)
--- a/public/static/js/room.js
+++ b/public/static/js/room.js
@@ -189,7 +189,8 @@
                        var points = $('<span class="points">('+user.points+')</span>');
                        var roundrank = $('<span></span>');
                        var roundpointsel = $('<span class="round-points"></span>');
-                       li.append(pvt, username, points, roundrank, roundpointsel);
+                       var guesstime = $('<span class="guess-time"></span>');
+                       li.append(pvt, username, points, roundrank, roundpointsel, guesstime);
                        DOM.users.append(li);
                        if (pvtmsgto === user.nickname) {
                                pvt.show();
@@ -216,6 +217,8 @@
                                        if (user.roundpoints > 3) {
                                                var stand = 7 - user.roundpoints;
                                                roundrank.addClass("round-rank stand"+stand);
+                                               var gtime = (user.guesstime / 1000).toFixed(1);
+                                               guesstime.text(gtime+" s");
                                        }
                                        username.addClass("correct");
                                }
@@ -443,6 +446,22 @@
                DOM.chat[0].scrollTop = DOM.chat[0].scrollHeight;
        };
 
+       var hideChat = function() {
+               DOM.togglechat.text("Show chat").unbind('click');
+               DOM.chatwrapper.toggle(300);
+               DOM.tracks.animate({maxHeight:"434px"}, 300);
+               DOM.togglechat.click(showChat);
+       };
+
+       var showChat = function() {
+               DOM.togglechat.text("Hide chat").unbind('click');
+               DOM.chatwrapper.toggle(300);
+               DOM.tracks.animate({maxHeight:"240px"}, 300, function() {
+                       DOM.chat[0].scrollTop = DOM.chat[0].scrollHeight;
+               });
+               DOM.togglechat.click(hideChat);
+       };
+
        var addFeedback = function(txt, style) {
                if (typeof style === 'string') {
                        var fbspan = $('<span class="'+style+'"></span>');
@@ -617,6 +636,8 @@
                DOM.countdown = $('#countdown');
                DOM.chat = $('#chat');
                DOM.feedback = $('#feedback');
+               DOM.togglechat = $('#toggle-chat');
+               DOM.chatwrapper = $('#chat-outer-wrapper');
        };
 
        // Set up the room.
@@ -625,6 +646,7 @@
                $('#app-name small').text(motto);
                setVariables();
                DOM.modal.modal({keyboard:false,show:false,backdrop:"static"});
+               DOM.togglechat.click(hideChat);
                if ($.browser.mozilla) {
                        // Block ESC button in firefox (it breaks all socket connection).
                        $(document).keypress(function(event) {

diff --git a/server.js b/server.js
index 98cd841afb16bdc2afc63501210ca8412bcb6ed2..95a91aaf83d942e8702a968d6556cf16c31fa66c 100644 (file)
--- a/server.js
+++ b/server.js
@@ -213,7 +213,8 @@ function Room(name) {
                        nickname: socket.nickname,
                        points: 0,
                        roundpoints: 0,
-                       matched: null
+                       matched: null,
+                       guesstime: null
                };
                totusers = totusers + 1;
                io.sockets.in('home').emit('update', {room:roomname,players:totusers});
@@ -247,7 +248,7 @@ function Room(name) {
        // A user is submitting a name
        this.setNickName = function(socket, data) {
                var feedback = null;
-               if (data.nickname.length > 18) {
+               if (data.nickname.length > 15) {
                        feedback = '<span class="label label-important">That name is too long.</span>';
                }
                else if (data.nickname === "Binb") {
@@ -302,16 +303,19 @@ function Room(name) {
                switch (finishline) {
                        case 1:
                                finishline++;
+                               usersData[socket.nickname].guesstime = 30000 - songtimeleft;
                                usersData[socket.nickname].roundpoints = 6;
                                usersData[socket.nickname].points += (allinone) ? 6 : 5;
                                break;
                        case 2:
                                finishline++;
+                               usersData[socket.nickname].guesstime = 30000 - songtimeleft;
                                usersData[socket.nickname].roundpoints = 5;
                                usersData[socket.nickname].points += (allinone) ? 5 : 4;
                                break;
                        case 3:
                                finishline++;
+                               usersData[socket.nickname].guesstime = 30000 - songtimeleft;
                                usersData[socket.nickname].roundpoints = 4;
                                usersData[socket.nickname].points += (allinone) ? 4 : 3;
                                break;
@@ -385,6 +389,7 @@ function Room(name) {
                        }
                        usersData[key].roundpoints = 0;
                        usersData[key].matched = null;
+                       usersData[key].guesstime = null;
                }
        };
 

diff --git a/views/room.jade b/views/room.jade
index 9be3f8300895b58ccabff9f2b86d79b700377a88..68cdd00c75ed3624efffc51477e0c93237008081 100644 (file)
--- a/views/room.jade
+++ b/views/room.jade
@@ -67,13 +67,15 @@ include header
                                        .span5.offset2
                                                ul#users.unstyled
                                        .span8
-                                               #chat-wrapper.bordered.relative
-                                                       #chat-top
-                                                       #chat-bottom
-                                                       ul#chat.unstyled
-                                               #message-wrapper
-                                                       span#recipient
-                                                       input#message.span8(type="text")
+                                               a#toggle-chat Hide chat
+                                               #chat-outer-wrapper
+                                                       #chat-wrapper.bordered.relative
+                                                               #chat-top
+                                                               #chat-bottom
+                                                               ul#chat.unstyled
+                                                       #message-wrapper
+                                                               span#recipient
+                                                               input#message.span8(type="text")
                                                ul#tracks.unstyled
                                #disclaimer
                                        div I do not own any right on the songs that are played here.