lobby now conforms to the new API, slight API updates (mainly convention)

cardshifter.js

@@ -9,5 +9,6 @@ CardshifterApp.config(function($routeProvider) {
         .when("/lobby", {
             controller: "LobbyController",
             templateUrl: "lobby/lobby.html",
+            css: "lobby/lobby.css"
         })
 });

lobby/lobby_controller.js

@@ -1,6 +1,7 @@
 CardshifterApp.controller("LobbyController", function($scope, $timeout) {
     var CHAT_FEED_LIMIT = 10;
     var ENTER_KEY = 13;
+    var MESSAGE_DELAY = 3000;
 
     $scope.users = [];
     $scope.chatMessages = [];
@@ -17,7 +18,8 @@ CardshifterApp.controller("LobbyController", function($scope, $timeout) {
         "userstatus": updateUserList,
         "chat": addChatMessage,
         "inviteRequest": displayInvite,
-        "availableMods": displayMods
+        "availableMods": displayMods,
+        "newgame": enterNewGame
     };
 
     var getUsers = new CardshifterServerAPI.messageTypes.ServerQueryMessage("USERS", "");
@@ -26,7 +28,7 @@ CardshifterApp.controller("LobbyController", function($scope, $timeout) {
     CardshifterServerAPI.setMessageListener(function(message) {
         commandMap[message.command](message);
         $scope.$apply(); // needs to manually updated since this is an event
-    }, ["userstatus", "chat", "inviteRequest", "availableMods"]);
+    }, ["userstatus", "chat", "inviteRequest", "availableMods", "newgame"]);
 
     $scope.sendMessage = function(e) {
         if(e && e.keyCode !== ENTER_KEY) { // user may hit "enter" key
@@ -44,14 +46,18 @@ CardshifterApp.controller("LobbyController", function($scope, $timeout) {
     }
     $scope.startGame = function() {
         if($scope.selected_mod && $scope.selected_opponent) {
-            console.log("start");
+            var startGame = new CardshifterServerAPI.messageTypes.StartGameRequest($scope.selected_opponent,
+                                                                                   $scope.selected_mod);
+            CardshifterServerAPI.sendMessage(startGame);
         } else {
             // user needs to choose an opponent and/or a mod
             console.log("need to choose mod and/or opponent");
         }
     }
     $scope.acceptInvite = function(accept) {
-        console.log("accept");
+        var accept = new CardshifterServerAPI.messageTypes.InviteResponse($scope.invite.id, accept);
+        CardshifterServerAPI.sendMessage(accept);
+        $scope.gotInvite = false;
     }
 
 
@@ -106,4 +112,13 @@ CardshifterApp.controller("LobbyController", function($scope, $timeout) {
     function displayMods(message) {
         $scope.mods = message.mods;
     }
+    /**
+    * Stores the game ID in currentUser for other controllers
+    * to use and navigates to the deck-builder page for the
+    * user to select a deck.
+    */
+    function enterNewGame(message) {
+        currentUser.currentGameId = message.gameId;
+        console.log("change to game");
+    }
 });

login/login_controller.js

@@ -23,6 +23,7 @@ CardshifterApp.controller("LoginController", function($scope, $location, $rootSc
                     } else {
                         console.log("server messsage: " + welcome.message);
                         $scope.loggedIn = false;
+                        $scope.$apply();
                     }
                 }, ["loginresponse"]);
                 CardshifterServerAPI.sendMessage(login);
@@ -31,11 +32,13 @@ CardshifterApp.controller("LoginController", function($scope, $location, $rootSc
                 // notify the user that there was an issue logging in (loginmessage issue)
                 console.log("LoginMessage error(error 2): " + e);
                 $scope.loggedIn = false;
+                $scope.$apply();
             }
         }, function() {
             // notify the user that there was an issue logging in (websocket issue)
             console.log("Websocket error(error 1)");
             $scope.loggedIn = false;
+            $scope.$apply();
         });
     }
 });

server_interface/server_interface.js

@@ -3,6 +3,8 @@
     var wsProtocolFinder = /ws(s)*:\/\//;
     var SOCKET_OPEN = 1;
 
+    var eventTypes = [];
+
     function Message(command) {
         this.command = command;
     }
@@ -36,34 +38,33 @@
 
     window.CardshifterServerAPI = {
         socket: null,
-        eventTypes: [],
         messageTypes: {
-                    /**
-                    * Incoming login message.
-                    * <p>
-                    * A login message from a client to add a user to the available users on the server.
-                    * This login message is required before any other action or message can be performed between a client and a server.
-                    * @constructor
-                    * @param username  the incoming user name passed from client to server, not null
-                    * @example Message: <code>{ "command":"login","username":"JohnDoe" }</code>
-                    */
+            /**
+            * Incoming login message.
+            * <p>
+            * A login message from a client to add a user to the available users on the server.
+            * This login message is required before any other action or message can be performed between a client and a server.
+            * @constructor
+            * @param username  the incoming user name passed from client to server, not null
+            * @example Message: <code>{ "command":"login","username":"JohnDoe" }</code>
+            */
             LoginMessage: function(username) {
                 this.username = username;
             },
 
-                    /**
-                    * Request available targets for a specific action to be performed by an entity.
-                    * <p>
-                    * These in-game messages request a list of al available targets for a given action and entity.
-                    * The client uses this request in order to point out targets (hopefully with a visual aid such as highlighting targets)
-                    * that an entity (such as a creature card, or a player) can perform an action on (for example attack or enchant a card.
-                    * @constructor
-                    * @param gameId  The Id of this game currently being played
-                    * @param id  The Id of this entity which requests to perform an action
-                    * @param action  The name of this action requested to be performed
-                    */
+            /**
+            * Request available targets for a specific action to be performed by an entity.
+            * <p>
+            * These in-game messages request a list of al available targets for a given action and entity.
+            * The client uses this request in order to point out targets (hopefully with a visual aid such as highlighting targets)
+            * that an entity (such as a creature card, or a player) can perform an action on (for example attack or enchant a card.
+            * @constructor
+            * @param gameId  The Id of this game currently being played
+            * @param id  The Id of this entity which requests to perform an action
+            * @param action  The name of this action requested to be performed
+            */
             RequestTargetsMessage: function(gameId, id, action) {
-                this.gamdId = gameId;
+                this.gameId = gameId;
                 this.id = id;
                 this.action = action;
             },
@@ -246,6 +247,13 @@
             this.socket = socket;
         },
 
+        /**
+        * Sends a message to the server
+        *
+        * @param message:Message -- The message to send
+        * @error SocketNotReadyException -- The socket is not ready to be used
+        * @error NotInitializedException -- The API has not yet been initialized
+        */
         sendMessage: function(message) {
             var socket = this.socket;
             var self = this;
@@ -266,23 +274,23 @@
         *
         * @param listener:Function -- The function to fire when a message of types is received
         * @param types:[string] (OPTIONAL) -- Only fire the listener when the message type is in this array
+        * @param timeout:Object (OPTIONAL) -- The function(.ontimeout) to call after MS(.ms) of no reply
         *
         * TODO: Maybe a timeout will be needed? Pass in a function and a MS count.
         */
         setMessageListener: function(listener, types) {
-            this.eventTypes = types;
+            eventTypes = types;
+
             this.socket.onmessage = function(message) {
                 var data = JSON.parse(message.data);
-                if(this.eventTypes) {
-                    if(this.eventTypes.indexOf(data.command) !== -1) { // if contains
+                if(eventTypes) {
+                    if(eventTypes.indexOf(data.command) !== -1) { // if contains
                         listener(data);
                     }
                 } else {
                     listener(data);
                 }
             }
-            this.eventTypes = types;
-            console.log(this.eventTypes);
         },
 
         /**
@@ -291,8 +299,7 @@
         * @param types:[string] -- The types to add
         */
         addEventTypes: function(types) {
-            this.eventTypes = this.eventTypes.concat(types);
-            console.log(this.eventTypes);
+            eventTypes = eventTypes.concat(types);
         },
 
         /**