Added global chatroom, improved chat.

app/client/app.css

@@ -739,7 +739,7 @@ footer .fa {
     font-weight: 300;
 }
 
-#chat-input {
+#chat-input, #global-chat-input {
     -webkit-appearance: none;
     -moz-appearance: none;
     appearance: none;
@@ -1217,7 +1217,7 @@ nav form input[type="image"]{
     font-size: 20px;
     color: white;
 }
-#chat-ul {
+#chat-ul, #global-chat-ul {
     overflow-y: hidden;
     margin: 0;
     padding: 0 15px 0 15px;
@@ -1231,18 +1231,18 @@ nav form input[type="image"]{
 .chat-message:nth-child(odd) {
     color: darkblue;
 }
-#submit {
+#submit, #global-submit {
     margin-bottom: 10px;
     cursor: pointer;
 }
-#submit button{
+#submit button, #global-submit button{
     width: 100%;
     font-size: 1.5em;
 }
-#submit i{
+#submit i, #global-submit i{
     margin-left: 10px;
 }
-#chat-input-div {
+#chat-input-div, #global-chat-input-div {
     width: 100%;
     padding-left: 15px;
     padding-right: 15px;
@@ -1266,7 +1266,7 @@ nav form input[type="image"]{
 .sidebar-content {
     height: calc(100% - 42px);
 }
-#chat {
+#chat, #global-chat {
     height:100%;
     overflow: auto;
 }
@@ -1475,7 +1475,7 @@ input[type="checkbox"]:checked + #two-label:after {
 /*adding some colors for fun*/
 #two+label:before, #two+label:after {color: hsl(180, 45%, 40%);}
 
-#chat-tab {
+#chat-tab, #global-chat-tab {
     -webkit-transition: background-color 500ms linear;
     -moz-transition: background-color 500ms linear;
     -ms-transition: background-color 500ms linear;
@@ -1486,3 +1486,9 @@ input[type="checkbox"]:checked + #two-label:after {
 .unread-messages {
     background-color: orange;
 }
+
+.disabled {
+    cursor: not-allowed;
+    opacity: 1;
+    background-color: rgba(235, 235, 228, 0.5) !important;
+}

app/client/client.js

@@ -460,25 +460,62 @@ function executeCommand(command, params){
 
 function sendMessage() {
     var message = $("#chat-input").val();
-    if (message.length > 0 && message[0] !== " ") {
-        if (message[0] === "/") {
-            message = message.split("");
-            message.shift();
-            message = message.join("");
-            var params = message.split(" ");
-            var command = params.shift();
-            command = command.replace(/\r?\n|\r/g, "");
-            if (executeCommand(command, params)) {
-                $("#chat-input").val("");
+    if (!$("#chat-input").hasClass("disabled")) {
+        if (message.length > 0 && message[0] !== " ") {
+            if (message[0] === "/") {
+                message = message.split("");
+                message.shift();
+                message = message.join("");
+                var params = message.split(" ");
+                var command = params.shift();
+                command = command.replace(/\r?\n|\r/g, "");
+                if (executeCommand(command, params)) {
+                    $("#chat-input").val("");
+                } else {
+                    $("#chat-input").val("");
+                }
             } else {
-                $("#chat-input").val("");
+                $("#chat-input").addClass("disabled");
+                $("#chat-input").attr("disabled", "");
+                Meteor.call("sendMessage", Session.get("type"), message, function (err, res) {
+                    if (res) {
+                        $("#chat-input").val("");
+                    }
+                    $("#chat-input").removeAttr("disabled");
+                    $("#chat-input").removeClass("disabled");
+                });
             }
-        } else {
-            Meteor.call("sendMessage", Session.get("type"), message, function (err, res) {
-                if (res) {
-                    $("#chat-input").val("");
+        }
+    }
+}
+
+function sendMessageGlobal() {
+    var message = $("#global-chat-input").val();
+    if (!$("#global-chat-input").hasClass("disabled")) {
+        if (message.length > 0 && message[0] !== " ") {
+            if (message[0] === "/") {
+                message = message.split("");
+                message.shift();
+                message = message.join("");
+                var params = message.split(" ");
+                var command = params.shift();
+                command = command.replace(/\r?\n|\r/g, "");
+                if (executeCommand(command, params)) {
+                    $("#global-chat-input").val("");
+                } else {
+                    $("#global-chat-input").val("");
                 }
-            });
+            } else {
+                $("#global-chat-input").addClass("disabled");
+                $("#global-chat-input").attr("disabled", "");
+                Meteor.call("sendMessage", "global", message, function (err, res) {
+                    if (res) {
+                        $("#global-chat-input").val("");
+                    }
+                    $("#global-chat-input").removeClass("disabled");
+                    $("#global-chat-input").removeAttr("disabled");
+                });
+            }
         }
     }
 }
@@ -487,6 +524,9 @@ Template.room.events({
     "click #chat-tab": function() {
         $("#chat-tab").removeClass("unread-messages");
     },
+    "click #global-chat-tab": function() {
+        $("#global-chat-tab").removeClass("unread-messages");
+    },
     "click #sync": function() {
         if (Session.get("currentSong") !== undefined) {
             var room = Rooms.findOne({type: Session.get("type")});
@@ -510,13 +550,18 @@ Template.room.events({
     },
     "click #side-panel": function(e) {
         Meteor.setTimeout(function() {
-        var elem = document.getElementById('chat');
-        elem.scrollTop = elem.scrollHeight;
+            var elem = document.getElementById('chat');
+            var elem1 = document.getElementById('global-chat');
+            elem.scrollTop = elem.scrollHeight;
+            elem1.scrollTop = elem1.scrollHeight;
         }, 1);
     },
     "click #submit": function() {
         sendMessage();
     },
+    "click #global-submit": function() {
+        sendMessageGlobal();
+    },
     "keyup #chat-input": function(e) {
         if (e.type === "keyup" && e.which === 13) {
             e.preventDefault();
@@ -525,6 +570,19 @@ Template.room.events({
             }
         }
     },
+    "keyup #global-chat-input": function(e) {
+        console.log("Tesr!");
+        console.log(e.which);
+        console.log(typeof e.which);
+        console.log(e.type);
+        console.log(typeof e.type);
+        if (e.type === "keyup" && e.which === 13) {
+            e.preventDefault();
+            if (!$('#global-chat-input').data('dropdownshown')) {
+                sendMessageGlobal();
+            }
+        }
+    },
     "click #like": function(e) {
         $("#like").blur();
         Meteor.call("likeSong", Session.get("currentSong").mid);
@@ -851,6 +909,15 @@ Template.room.helpers({
         }, 100);
         return Chat.find({type: Session.get("type")}, {sort: {time: -1}, limit: 50 }).fetch().reverse();
     },
+    globalChat: function() {
+        Meteor.setTimeout(function() {
+            var elem = document.getElementById('global-chat');
+            if (elem !== undefined && elem !== null) {
+                elem.scrollTop = elem.scrollHeight;
+            }
+        }, 100);
+        return Chat.find({type: "global"}, {sort: {time: -1}, limit: 50 }).fetch().reverse();
+    },
     likes: function() {
         var playlist = Playlists.findOne({type: Session.get("type")});
         var likes = 0;
@@ -1666,9 +1733,15 @@ Template.playlist.events({
 Meteor.subscribe("rooms");
 
 Template.room.onCreated(function () {
-    Chat.after.find(function() {
-        if (!$("#chat-tab").hasClass("active")) {
-            $("#chat-tab").addClass("unread-messages");
+    Chat.after.find(function(userId, selector) {
+        if (selector.type === "global") {
+            if (!$("#global-chat-tab").hasClass("active")) {
+                $("#global-chat-tab").addClass("unread-messages");
+            }
+        } else if(selector.type === Session.get("type")) {
+            if (!$("#chat-tab").hasClass("active")) {
+                $("#chat-tab").addClass("unread-messages");
+            }
         }
     });
     Session.set("reportSong", false);

app/client/templates/room.html

@@ -108,7 +108,8 @@
                 <div class="col-md-3" id="side-panel">
                     <ul class="nav nav-tabs nav-justified" data-tabs="tabs">
                         <li role="presentation" class="active"><a data-toggle="tab" href="#playlist">Playlist</a></li>
-                        <li role="presentation" id="chat-tab"><a data-toggle="tab" href="#chat">Chat</a></li>
+                        <li role="presentation" id="chat-tab"><a data-toggle="tab" href="#chat">{{type}} Chat</a></li>
+                        <li role="presentation" id="global-chat-tab"><a data-toggle="tab" href="#global-chat">Global Chat</a></li>
                     </ul>
                     <div id='content' class="tab-content sidebar-content">
                         <div class="tab-pane active" id="playlist">
@@ -132,6 +133,24 @@
                                 <div id="submit"><button class="btn btn-primary btn-block">Submit<i id="submit-message" class="fa fa-paper-plane-o"></i></button></div>
                             </div>
                         </div>
+                        <div class="tab-pane" id="global-chat">
+                            <ul id="global-chat-ul">
+                                {{#each globalChat}}
+                                    {{#emojione}}
+                                        <li class="chat-message"><small class="rank-{{this.rawrank}}">{{this.rank}}</small> <a style="text-decoration: none" href="/u/{{this.username}}" target="_blank"><b class="bold">{{this.username}}</b></a> <span title="{{time}}" style="float: right;">{{rtime time}}</span> <br/>{{this.message}}</li>
+                                    {{/emojione}}
+                                    <hr>
+                                {{/each}}
+                            </ul>
+                            <div id="global-chat-input-div">
+                                {{#if currentUser}}
+                                    <textarea id="global-chat-input" placeholder="Type a message..."></textarea>
+                                {{else}}
+                                    <input id="global-chat-input" placeholder="Please register and login to chat." disabled>
+                                {{/if}}
+                                <div id="global-submit"><button class="btn btn-primary btn-block">Submit<i id="global-submit-message" class="fa fa-paper-plane-o"></i></button></div>
+                            </div>
+                        </div>
                     </div>
                 </div>
             </div>

app/server/server.js

@@ -44,7 +44,7 @@ function checkUsersPR() {
     var connections = Meteor.server.stream_server.open_sockets;
     _.each(connections,function(connection){
         // named subscriptions
-        if (connection._meteorSession !== undefined) {
+        if (connection._meteorSession !== undefined && connection._meteorSession !== null) {
             var subs = connection._meteorSession._namedSubs;
             //var ip = connection.remoteAddress;
             var used_subs = [];