more lobby stuff

client/js/client.js

@@ -843,7 +843,10 @@ let Lobby = Backbone.View.extend({
   initialize: function(options){
     this.user = options.user;
     this.app = options.app;
-    this.listenTo(this.app.user, "change", this.render);
+
+    this.app.receive("update:playerOnline", this.renderStatus.bind(this));
+
+    this.listenTo(this.app.user, "change:serverOffline", this.render);
     $(".gwent-battle").html(this.el);
     this.render();
   },
@@ -863,6 +866,7 @@ let Lobby = Backbone.View.extend({
     return this;
   },
   startMatchmaking: function(){
+    this.$el.find(".image-gif-loader").show();
     this.app.trigger("startMatchmaking");
   },
   joinRoom: function(){
@@ -876,6 +880,9 @@ let Lobby = Backbone.View.extend({
   changeName: function(e){
     let name = $(e.target).val();
     this.app.trigger("setName", name);
+  },
+  renderStatus: function(n) {
+    this.$el.find(".nr-player-online").html(n);
   }
 });
 

client/templates/lobby.handlebars

@@ -4,12 +4,12 @@
       {{#if serverOffline}}
         <span class="pull-right">Server Status: <span class="label label-danger">Offline</span></span>
       {{else}}
-        <span class="pull-right">Server Status: <span class="label label-success">Online</span></span>
+        <span class="pull-right">Player online: <span class="nr-player-online">0</span> | Server Status: <span class="label label-success">Online</span></span>
       {{/if}}
     </div>
     <div class="panel-body">
       <div class="row">
-        <div class="col-xs-12">
+          <div class="col-xs-12">
           <input type="text" class="name-input" value="{{name}}">
           <select id="deckChoice">
             <option value="random">Deck: Random</option>
@@ -25,9 +25,9 @@
         <div class="col-xs-12">
           <button type="button" class="btn btn-primary startMatchmaking"{{#if inMatchmakerQueue}} disabled{{/if}}>
             Search Opponent
-            {{#if inMatchmakerQueue}}
+            {{!#if inMatchmakerQueue}}
-              <i class="image-gif-loader pull-right"></i>
+              <i class="image-gif-loader pull-right" style="display: none"></i>
-            {{/if}}
+            {{!/if}}
           </button>
           <!--<button type="button" class="btn btn-success note">debug note</button>-->
         </div>

server/Connections.js

@@ -19,13 +19,16 @@ var Connections = (function(){
 
   r._connections = null;
   r.roomCollection = null;
+  r._length = 0;
 
   r.add = function(user) {
     this._connections[user.getID()] = user;
+    this._length++;
   }
 
   r.remove = function(user) {
     delete this._connections[user.getID()];
+    this._length--;
   }
 
   r.get = function() {
@@ -36,6 +39,10 @@ var Connections = (function(){
     return !!this._connections[user.getID()];
   }
 
+  r.length = function() {
+    return this._length;
+  }
+
 
   return Connections;
 })();

server/Socket.js

@@ -1,91 +0,0 @@
-/*var app = require('http').createServer();
-global.io = require("socket.io")(app);*/
-/*var User = require("./User");
-var Connections = require("./Connections");
-var Room = require("./Room");*/
-
-
-var Socket = (function(){
-  var Socket = function(){
-    if(!(this instanceof Socket)){
-      return (new Socket());
-    }
-    /**
-     * constructor here
-     */
-    this.connections = Connections();
-    this.roomCollection = {};
-    app.listen(this.port);
-    this.io = io;
-    this._events();
-  };
-  var r = Socket.prototype;
-  /**
-   * methods && properties here
-   * r.property = null;
-   * r.getProperty = function() {...}
-   */
-  r.io = null;
-  r.port = 16918;
-  r.connections = null;
-  r.roomCollection = null;
-  /*
-    r.matchmaker = null;
-  */
-
-  r._events = function(){
-    var self = this;
-    this.io.on("connection", function(socket){
-      var user = User(socket);
-      self.connections.add(user);
-      console.log("new user ", user.getName());
-
-      socket.on("request:name", function(data){
-        if(data && data.name){
-          user.setName(data.name);
-        }
-        socket.emit("response:name", {name: user.getName()});
-      })
-
-      socket.on("request:createRoom", function(){
-        var room = Room();
-        self.roomCollection[room.getID()] = room;
-        room.join(user);
-        console.log("room %s created by %s", room.getID(), user.getName());
-        user.send("response:createRoom", room.getID());
-      })
-
-      socket.on("request:joinRoom", function(){
-        console.log("joinroom");
-        var interval = setInterval(function(){
-          for(var key in self.roomCollection) {
-            var room = self.roomCollection[key];
-            if(!room.isOpen()) continue;
-            room.join(user);
-            clearInterval(interval);
-            console.log("user %s joined room %s", user.getName(), room.getID());
-            user.send("response:joinRoom", room.getID());
-          }
-        }, 1000);
-      })
-
-      socket.on("request:roomData", function(){
-        var room = user.getRoom();
-        var players = room.getPlayers();
-        user.send("response:roomData", {players: players});
-      })
-
-      socket.on("disconnect", function(){
-        self.connections.remove(user);
-        user.disconnect();
-      })
-
-      socket.on("request:gameLoaded", function(data){
-        self.roomCollection[data._roomID].setReady(user);
-      })
-    });
-  }
-  return Socket;
-})();
-
-module.exports = Socket;

server/User.js

@@ -64,7 +64,7 @@ var User = (function(){
   }
 
   r.setDeck = function(deck) {
-    console.log("set deck: ", deck);
+    //console.log("set deck: ", deck);
     this._deck = deck;
   }
 
@@ -96,7 +96,7 @@ var User = (function(){
     this._rooms.forEach(function(room) {
       room.leave(self);
       if(!room.hasUser()) {
-        console.log("Remove room: ", room.getID());
+        //console.log("Remove room: ", room.getID());
         room = null;
       }
     })
@@ -121,12 +121,12 @@ var User = (function(){
     });
 
     socket.on("request:gameLoaded", function(data){
-      console.log(data);
+      //console.log(data);
       connections.roomCollection[data._roomID].setReady(self);
     })
 
     socket.on("set:deck", function(data) {
-      console.log(data);
+      //console.log(data);
       if(data && data.deck){
         self.setDeck(data.deck);
       }

server/server.js

@@ -39,6 +39,9 @@ io.on("connection", function(socket) { //global connection
     user.disconnect();
     console.log("user ", user.getName(), " disconnected");
     user = null;
+    //io.emit("update:playerOnline", connections.length());
   })
 
+
+  io.emit("update:playerOnline", connections.length());
 })