added comments

README.md

@@ -1,6 +1,11 @@
 TeeSpring Demo
 ==============
 
+Demo
+----
+
+`http://secure-dusk-2419.herokuapp.com/`
+
 Install
 -------
 
@@ -15,3 +20,5 @@ Install
 
 
 you can open on two machines and play against each other.
+
+

app.js

@@ -10,6 +10,7 @@ require(__dirname + '/server/config/env.js')(express, app);
 require(__dirname + '/server/routes')(app);
 
 // Start the server
+
 http.createServer(app).listen(opts.port, function () {
     console.log("Express server listening on port %d in %s mode",
                 opts.port, app.settings.env);

public/board/contoller/boardController.js → public/board/controller/boardController.js

@@ -3,6 +3,7 @@ var board = angular.module('board', ['ngResource']);
 board.controller('boardController', ['$scope','boardData', function ($scope,boardData) {
 
     $scope.addPlayer = function(x,y){
+        $scope.isloading = x +"" + y;
         var board = boardData.mark({x:x,y:y},function() {
             $scope.board = board;
         });

public/board/views/board.html

@@ -10,7 +10,7 @@
 
         <div class="btn btn-new" >New Game</div></div>
     <div class="board">
-        <div class="box" ng-click="addPlayer(0,0)">{{board.boxes[0][0]||"_"}}</div>
+        <div class="box" ng-click="addPlayer(0,0)" >{{board.boxes[0][0]||"_"}}</div>
         <div class="box" ng-click="addPlayer(0,1)">{{board.boxes[0][1]||"_"}}</div>
         <div class="box" ng-click="addPlayer(0,2)">{{board.boxes[0][2]||"_"}}</div>
 

public/css/style.css

@@ -132,4 +132,8 @@ h1 {
 
 .btn-info {
     background-color: #E9DC51
+}
+
+.btn.loading {
+    animation: fadeOut 1s;
 }

server/config/opts.js

@@ -5,4 +5,3 @@ module.exports = require('optimist')
     .describe('port', 'Port number for the Express application.')
     .default('port', process.env.PORT || 8080)
     .argv;
-

server/libs/BoardModel.js

@@ -1,3 +1,9 @@
+/**
+ * model for board data
+ *
+ * @param $dataHandler
+ * @constructor
+ */
 function BoardModel($dataHandler) {
     this.handler = $dataHandler;
 
@@ -7,7 +13,12 @@ function BoardModel($dataHandler) {
 
 
 BoardModel.prototype = {
-
+    /**
+     * marks a box
+     * @param x
+     * @param y
+     * @returns {boolean}
+     */
     markBox: function (x, y) {
         var who = this.getPlayer();
         if ((who !== 'x' ) && ( who !== 'o' )) {
@@ -24,9 +35,17 @@ BoardModel.prototype = {
         this.handler.setPlayer(who === 'x' ? 'o' : 'x');
         return true;
     },
+    /**
+     * gets all the boxes on the board
+     * @returns {*}
+     */
     getBoxes: function () {
         return this.handler.getBoxes();
     },
+    /**
+     * calculates and returns the winner or "c" if CAT else null
+     * @returns {*}
+     */
     getWinner: function () {
         return this.winner = this.checkWin();
     },
@@ -60,9 +79,16 @@ BoardModel.prototype = {
         return null;
 
     },
+    /**
+     * clears board for new game
+     */
     clear : function(){
         this.handler.clear();
     },
+    /** gets the current player that it is his/her turn
+     *
+     * @returns {*}
+     */
     getPlayer: function () {
         return this.handler.getPlayer();
     },
@@ -79,7 +105,9 @@ BoardModel.prototype = {
     }
 }
 
-
+/**
+ * this is a data abstract layer so that in memory or db can be used
+ */
 function memoryDataHandler() {
     this.board = {};
     this.clear();
@@ -111,6 +139,5 @@ memoryDataHandler.prototype = {
 
 }
 
-if ((typeof module !== 'undefined') && (module.exports)) {
+
     module.exports = {memoryDataHandler: memoryDataHandler, BoardModel: BoardModel};
-}

server/routes/index.js

@@ -8,21 +8,43 @@ module.exports = function (app) {
     app.get('/board/clear', clearBoard);
 
 };
-
+// renders the root html file
 var index = function (req, res) {
     res.render('index', { title: 'Tic Tac Toe' });
 };
 
-
+/**
+ * gets the board data including winner and current player
+ *
+ * @route board/get
+ * @param req
+ * @param res
+ */
 var getBoard = function (req, res) {
     res.setHeader('Content-Type', 'application/json');
     res.end(boardModel.toJson());
 };
+
+/**
+ * clears the board for new game
+ *
+ * @route board/clear
+ * @param req
+ * @param res
+ */
 var clearBoard = function (req, res) {
     res.setHeader('Content-Type', 'application/json');
     boardModel.clear();
     res.end(boardModel.toJson());
 };
+
+/**
+ * marks a board
+ *
+ * @route board/mark/:x/:y
+ * @param req
+ * @param res
+ */
 var markBoard = function (req, res) {
     res.setHeader('Content-Type', 'application/json');
     var x = req.params.x

server/views/index.mustache

@@ -7,9 +7,8 @@
 
         <link rel="stylesheet" type="text/css" href="css/style.css">
         <script src="app.js"></script>
-        <script src="board/contoller/boardController.js"></script>
+        <script src="board/controller/boardController.js"></script>
         <script src="board/service/board.js"></script>
-        <script src="BoardModel.js"></script>
     </head>
     <body>
     <div ng-include="'board/views/board.html'">