Updating the gamecontroller

Nim/Adaptors/JsonHelper.cs

@@ -0,0 +1,21 @@
+using System;
+using System.Collections.Generic;
+using System.Linq;
+using System.Web;
+using Newtonsoft.Json;
+
+namespace Nim.Adaptors
+{
+    public class JsonHelper
+    {
+        public static object SerializeObject<T>(T game)
+        {
+            return JsonConvert.DeserializeObject(
+                    JsonConvert.SerializeObject(game, Formatting.Indented, new JsonSerializerSettings()
+                    {
+                        ReferenceLoopHandling = ReferenceLoopHandling.Ignore
+                    })
+                );
+        }
+    }
+}

Nim/Content/Scripts/Nim/App.js

@@ -25,22 +25,38 @@ define(["$", "Underscore", "Backbone", "Marionette", "SignalR"], function ($, _,
 
     app.vent.on("game:idle", function () {
         require(["Nim/Views/IdleView", "Nim/Factories/UserFactory"], function (IdleView, UserFactory) {
+            var userDTO,
+                idleView;
+
+            //#region UI
+
+            //Create a idleView
+            idleView = new IdleView();
+
+            //Display the idle view
             app.content.show(new IdleView());
 
-            //            app.vent.trigger("game:start", {
-            //                GameId: 323,
-            //                Lines: 10,
-            //                CurrentTurn: ""
-            //            });
+            //#endregion
+
+            //#region server
 
-            app.gameHub.server.requestGame(UserFactory.createDTO(app.user));
+            //Create a DTO of user
+            userDTO = UserFactory.createDTO(app.user)
+
+            //Start a request for a game
+            app.gameHub.server.requestGame(userDTO);
+
+            //#endregion
         })
     });
 
     app.vent.on("game:start", function (game) {
-        require(["Nim/Controllers/GameController"], function (GameController) {
-            app.gameController = GameController.start(game, app.gameHub);
+        require(["Nim/Controllers/GameController.v2"], function (gameController) {
+            //Add a reference to the controller from the app
+            app.gameController = gameController;
 
+            //Start the game
+            app.gameController.start(game, app.gameHub);
         });
     });
 
@@ -60,11 +76,16 @@ define(["$", "Underscore", "Backbone", "Marionette", "SignalR"], function ($, _,
         };
 
         app.gameHub.client.responseCrossOut = function (sum, game) {
-            app.gameController.crossOut(sum, game);
+            app.gameController.trigger("server:crossOut", sum, game);
         };
 
         app.gameHub.client.responseGameEnd = function (loser, game) {
-            app.gameController.finish(loser, game);
+            app.gameController.trigger("server:finish", loser, game);
+        };
+
+        app.gameHub.client.playerDisconnected = function (player) {
+            app.gameController.trigger("server:player:disconnect", player);
+            console.log("Disconnect: ", player);
         };
 
         $.connection.hub.start().done(function () {

Nim/Content/Scripts/Nim/Controllers/GameController.js

@@ -34,7 +34,7 @@ define(["$", "Underscore", "Backbone", "Marionette", "Nim/App", "Nim/Views/GameL
             });
 
             this.layout.canvas.show(this.canvasView);
-            
+
             return this;
         },
         turnManager: function (currentTurn) {
@@ -75,6 +75,9 @@ define(["$", "Underscore", "Backbone", "Marionette", "Nim/App", "Nim/Views/GameL
         },
         playAgain: function () {
             this.hub.server.requestSpecificGame(this.game.GameId, app.user.get("playerId"));
+        },
+        playerLeaved: function () {
+
         }
     };
 

Nim/Content/Scripts/Nim/Controllers/GameController.v2.js

@@ -0,0 +1,142 @@
+/// <reference path="../docs.js" />
+
+define(["$", "Underscore", "Backbone", "Marionette", "Nim/App", "Nim/Views/GameLayout"], function ($, _, Backbone, Marionette, app, GameLayout) {
+    var CanvasViewModel = Backbone.Model.extend({
+    });
+
+    var gameController, GameController = Backbone.Marionette.Controller.extend({
+        //Properties
+        game: null,
+        layout: null,
+
+        //Constructor
+        initialize: function () {
+            this.layout = new GameLayout();
+        },
+
+        //Methods
+        start: function (game) {
+            var gameController = this;
+
+            //Main starting point for a game
+            this.sync(game);
+
+            //Display the layout
+            app.content.show(this.layout);
+
+            //Display the canvas
+            require(["Nim/Views/CanvasView"], function (CanvasView) {
+                gameController.layout.canvas.show(new CanvasView({
+                    numberOfLines: gameController.game.ActiveGame.NumberOfLines,
+                    controller: gameController,
+                    model: new CanvasViewModel({
+                        lines: createLinesArray(gameController.game.ActiveGame.NumberOfLines)
+                    })
+                }));
+            });
+
+            this.switchTurn();
+        },
+        sync: function (game) {
+            //Should be call every time a callback from the server comes
+
+            this.game = game;
+        },
+        crossOut: function (sum) {
+            // Send a message to the server about the sum of lines to cross out
+            app.gameHub.server.requestCrossOut(this.game.GameId, sum);
+        },
+        playAgain: function () { //When a user want to play again with the opponets
+            // Tell the server that this player wants to play again
+
+            //TODO: Use the factory
+            app.gameHub.server.requestSpecificGame(this.game.GameId, app.user.get("playerId"));
+        },
+        finish: function (winner) {
+            var gameController = this;
+
+            require(["Nim/Models/FinishModel", "Nim/Views/FinishView"], function (FinishModel, FinishView) {
+                //Create a finish view
+                var finishView = new FinishView({
+                    model: new FinishModel({
+                        you: (winner === app.user.get("playerId")) //TODO: BETTER
+                    }),
+                    controller: gameController
+                });
+
+                //Display the finish view as a modal
+                gameController.layout.modal.show(finishView);
+
+            });
+        },
+        playerDisconnected: function () {
+            var gameController = this;
+            require(["Nim/Models/FinishModel", "Nim/Views/FinishView"], function (FinishModel, FinishView) {
+
+                //Create a finish view
+                var finishView = new FinishView({
+                    model: new FinishModel({
+                        you: true //TODO: BETTER
+                    }),
+                    controller: gameController
+                });
+
+                //Display the finish view as a modal
+                gameController.layout.modal.show(finishView);
+
+            });
+        },
+        switchTurn: function () {
+            var gameController = this;
+
+            if (this.game.CurrentTurn.PlayerId === app.user.get("playerId")) {
+                require(["Nim/Views/CommandView"], function (CommandView) {
+                    var commandView = new CommandView({
+                        controller: gameController
+                    });
+
+                    gameController.layout.command.show(commandView);
+                });
+            } else {
+                require(["Nim/Views/IdleView"], function (IdleView) {
+                    gameController.layout.command.show(new IdleView());
+                });
+            }
+        }
+    });
+
+    gameController = new GameController();
+
+    gameController.listenTo(gameController, "server:crossOut", function (sum, game) {
+        this.sync(game);
+
+        //Trigger switch turn
+        this.switchTurn();
+    });
+
+    gameController.listenTo(gameController, "server:finish", function (winner, game) {
+        this.sync(game);
+
+        //Trigger finish
+        this.finish(winner);
+    });
+
+    gameController.listenTo(gameController, "server:player:disconnect", function (player, game) {
+        this.sync(game);
+
+        //Listen to server finish
+        this.playerDisconnected();
+    });
+
+    function createLinesArray(linesCount) {
+        var lines = [];
+
+        for (var i = 0; i < linesCount; i += 1) {
+            lines.push({});
+        }
+
+        return lines;
+    }
+
+    return gameController;
+});

Nim/Content/Scripts/Nim/Views/CanvasView.js

@@ -73,8 +73,13 @@ define(["PhoneAPI", "$", "Underscore", "Backbone", "Marionette", "Nim/App", "tex
                 options = options || {}; //Make sure there is a options object
 
                 var view = this;
+
+                //Listen to callback from the server
+                options.controller.listenTo(options.controller, "server:crossOut", function (sum, game) {
+                    view.crossOut(sum);
+                });
 
-                this.LINES_LENGTH = options.LINES_LENGTH || 10;
+                this.LINES_LENGTH = options.numberOfLines || 10;
 
                 app.vent.on("window:resize", function () {
                     view.resize.call(view, options);

Nim/Content/Scripts/Nim/Views/CommandView.js

@@ -15,7 +15,7 @@ define(["$", "Underscore", "Backbone", "Marionette", "Nim/App", "text!Templates/
         crossOut: function (e) {
             var target = $(e.currentTarget);
 
-            this.controller.requestCrossOut(target.data("sum"));
+            this.controller.crossOut(target.data("sum"));
         }
     });
 

Nim/Content/Scripts/Nim/Views/FinishView.js

@@ -4,6 +4,10 @@ define(["$", "Underscore", "Backbone", "Marionette", "Nim/App", "text!Templates/
 
     var View = Backbone.Marionette.ItemView.extend({
         template: viewTemplate,
+        attributes: {
+            "data-backdrop": "static"
+        },
+        className: "modal hide fade",
         initialize: function (options) {
             options = options || {};
 
@@ -14,8 +18,7 @@ define(["$", "Underscore", "Backbone", "Marionette", "Nim/App", "text!Templates/
         },
         restart: function () {
             this.controller.playAgain();
-        },
-        className: "modal"
+        }
     });
 
     return View;

Nim/Content/Scripts/Nim/Views/GameLayout.js

@@ -6,19 +6,22 @@ define(["$", "Underscore", "Backbone", "Marionette", "Nim/App", "text!Templates/
         constructor: function () {
             _.bindAll(this);
             Backbone.Marionette.Region.prototype.constructor.apply(this, arguments);
-            this.on("view:show", this.showModal, this);
+            this.on("show", this.showModal, this);
         },
+
         getEl: function (selector) {
             var $el = $(selector);
             $el.on("hidden", this.close);
             return $el;
         },
+
         showModal: function (view) {
             view.on("close", this.hideModal, this);
-            this.$el.modal('show');
+            view.$el.modal('show');
         },
+
         hideModal: function () {
-            this.$el.modal('hide');
+            view.$el.modal('hide');
         }
     }),
         Layout = Backbone.Marionette.Layout.extend({