var app = angular.module('ConnectFourApp', []);

​

// Common.

var ROWS = 6;

var COLS = 7;

var EMPTY = 0;

var RED = 1;

var YELLOW = 2;

var DRAW = 3;

​

// UI.

var HUMAN = 0;

var COMPUTER = 1;

var UNDO_LIMIT = 3;

​

// Engine.

var DEFAULT_TIME_LIMIT = 3000; // 3s.

var TIME_DELTA = 2000; // +-2s.

​

// Firebase.

//FB_DB = 'dev';

FB_DB = 'prod';

​

function getOpp(player) {

  return player ? (player === RED ? YELLOW : RED) : EMPTY;

}

​

function inside(r, c) {

  return r >= 0 && c >= 0 && r < ROWS && c < COLS;

}

​

app.factory('engineService', function($q, $timeout) {

  var worker = new Worker('http://jsbin.com/acIhOwE/14');

  worker.postMessage('_anything_');

  var thinkRequestQueue = [];

  worker.addEventListener('message', function(e) {

    if (e.data.msgType && e.data.msgType === 'think') {

      if (thinkRequestQueue.length) {

        var firstCallback = thinkRequestQueue.shift();

        firstCallback(e);

      } else {

        alert('The thinkRequestQueue is empty on receiving new message from worker, something went wrong.');

      }

    }

  });

  function makePlayRequest(timeLimit, callback) {

    thinkRequestQueue.push(callback);

    worker.postMessage({

      msgType: 'think',

      timeLimit: timeLimit

    });

  }

  var engineService = {};

  engineService.init = function(board, turn) {

    worker.postMessage({

      msgType: 'init',

      board: board,

      turn: turn

    });

  };

  engineService.makeMove = function(move) {

    worker.postMessage({

      msgType: 'makeMove',

      move: move

    });

  };

  engineService.unMakeMove = function() {

    worker.postMessage({

      msgType: 'unMakeMove'

    });

  };

  engineService.think = function(timeLimit) {

    var d = $q.defer();    

    makePlayRequest(timeLimit, function(e) {

      $timeout(function() {

        d.resolve(e.data.result);

      });

    });

    return d.promise;

  };

  return engineService;

});

​

app.factory('gameService', function() {

  var gameService = {};

  function createEmptyBoard(rows, cols) {

    var board = new Array(rows);

    for (var i = 0; i < rows; i++) {

      var row = new Array(cols);

      for (var j = 0; j < cols; j++) {

        row[j] = EMPTY;

      }

      board[i] = row;

    }

    return board;

  }

  var board, turn, moves, moveCount, result;

  gameService.newGame = function() {

    board = createEmptyBoard(ROWS, COLS);

    turn = RED;

    result = 0;

    moveCount = 0;

    moves = [];

  };

  function isWinningAt(i, j) {

    function toward(i, j, di, dj) {

      var count = 0;

      while (true) {

        i += di;

        j += dj;

        if (!inside(i, j) || board[i][j] !== turn) break;

        count++;

      }

      return count;

    }

    return (toward(i, j, +1, 0) >= 3) ||

      (toward(i, j, 0, +1) + toward(i, j, 0, -1) >= 3) ||

      (toward(i, j, +1, +1) + toward(i, j, -1, -1) >= 3) ||

      (toward(i, j, +1, -1) + toward(i, j, -1, +1) >= 3);

  }

  function findFirstNonEmptyRow(col) {

    var row = 0;

    while (row < ROWS && board[row][col] === EMPTY) row++;

    return row;

  }

  gameService.makeMove = function(col) {

    if (col < 0 || col >= COLS || board[0][col] !== EMPTY) {

      return false;

    }

    moves[moveCount++] = col;

    var row = findFirstNonEmptyRow(col);

    board[row - 1][col] = turn;

    if (isWinningAt(row - 1, col)) {

      result = turn;

    } else if (moveCount + 1 === ROWS * COLS) {

      result = DRAW;

    }    

    turn = getOpp(turn);

    return true;

  };

  gameService.unMakeMove = function() {

    var col = moves[moveCount - 1];

    moveCount--;

    var row = findFirstNonEmptyRow(col);

    board[row][col] = EMPTY;

    result = 0;

    turn = getOpp(turn);

  };

  gameService.getBoard = function() {

    return board;

  };

  gameService.getTurn = function() {

    return turn;

  };

  gameService.getResult = function() {

    return result;

  };

  gameService.getLastMove = function() {

    var row, col;

    if (moveCount) {

      col = moves[moveCount - 1];

      row = findFirstNonEmptyRow(col);

    } else {

      row = ROWS;

      col = COLS;

    }

    return {row: row, col: col};

  };

  gameService.getMoveCount = function() {

    return moveCount;

  };

  return gameService;

});

​

app.factory('statsService', function() {

  var statsRef = new Firebase('https://connectfour.firebaseio.com/' + FB_DB + '/stats');

  var statsService = {};

  var currentResult;

  statsService.setValueCallback = function(callback) {

    var stats;

    statsRef.on('value', function(snapshot) {

      var stats = snapshot.val();

      if (!stats) {

        stats = {

          0 : {0 : 0, 1 : 0, 2 : 0},

          1 : {0 : 0, 1 : 0, 2 : 0}

        };

        statsRef.set(stats);

      }

      callback(stats);

    });

  };

  statsService.newGame = function() {

    currentResult = undefined;

  };

  function updateStats(turn, result, delta) {

    if (!delta) {

      delta = 1;

    }

    statsRef.child(turn - 1).child(result - 1).transaction(function(currentValue) {

      return currentValue + delta;

    });

  }

  statsService.setResult = function(turn, result) {

    if (currentResult === result) return;

    if (currentResult && currentResult !== result) {

      updateStats(turn, currentResult, -1);

    }

    updateStats(turn, result);

    currentResult = result;

  };

  return statsService;

});

​

app.directive('toggleOn', function() {

  return {

    link: function(scope, element, attrs) {

      scope.$watch(attrs.toggleOn, function(value) {

        if (value) {

          $(element).slideUp();

        } else {

          $(element).slideDown();

        }

      });

    }

  };

});

​

app.controller('AppCtrl', function($scope, $timeout, $location, gameService, engineService, statsService) {

  $scope.total = 0;

  $scope.collapsed = true;

  $scope.toggleStats = function() {

    $scope.collapsed = !$scope.collapsed;

  };

  statsService.setValueCallback(function(stats) {

    var total = 0;

    for (var i = 0; i < stats.length; i++) {

      for (var j = 0; j < stats[i].length; j++) {

        total += stats[i][j];

      }

    }

    $scope.safeApply(function() {

      $scope.total = total;

      $scope.stats = stats;

    });

  });

  $scope.safeApply = function(fn) {

    var phase = this.$root.$$phase;

    if(phase == '$apply' || phase == '$digest') {

      if(fn && (typeof(fn) === 'function')) {

        fn();

      }

    } else {

      this.$apply(fn);

    }

  };

  $scope.debugMode = $location.path() === '/d';

  function getPlayerType(turn) {

    return turn === RED ? $scope.firstPlayer : $scope.secondPlayer;

  }

  $scope.isHumanTurn = function() {

    return getPlayerType($scope.turn) === HUMAN;

  };

  $scope.switchTurn = function() {

    if ($scope.firstPlayer === HUMAN) {

      $scope.firstPlayer = COMPUTER;

      $scope.secondPlayer = HUMAN;

      $scope.computerColor = RED;

      $scope.humanColor = YELLOW;

    } else {

      $scope.firstPlayer = HUMAN;

      $scope.secondPlayer = COMPUTER;

      $scope.humanColor = RED;

      $scope.computerColor = YELLOW;

    }

  };

  function handleGameStateChanged() {

    $scope.turn = gameService.getTurn();

    $scope.result = gameService.getResult();

    $scope.lastMove = gameService.getLastMove();

  }

  $scope.newGame = function() {

    gameService.newGame();

    statsService.newGame();

    $scope.board = gameService.getBoard();

    handleGameStateChanged();

    $scope.playing = false;

    $scope.resultMsg = '';

    $scope.bestScore = 0;

    $scope.depth = 0;

    $scope.undoLeft = UNDO_LIMIT;

    engineService.init($scope.board, $scope.turn);

  };

  $scope.firstPlayer = COMPUTER;

  $scope.switchTurn();

  $scope.newGame();

  $scope.colRange = _.range(COLS);

  $scope.startGame = function() {

    $scope.playing = true;

    if (getPlayerType($scope.turn) === COMPUTER) {

      computerPlay();

    }    

  };  

  $scope.isFull = function(col) {

    return $scope.board[0][col] !== EMPTY;

  };

  $scope.isValid = function(player, col) {

    return !$scope.result && $scope.turn === player && !$scope.isFull(col);

  };

  var announceResult = function(turn) {

    if (turn === DRAW) {

      $scope.resultMsg = 'The game is draw.';

    } else {

      $scope.resultMsg = (turn === $scope.computerColor) ? 'Computer has won. If you enjoy playing, please upvote || +1 || tweet.' : 'Congratulation, you have won.';

    }    

    var resultForComputer;

    if (turn === DRAW) {

      resultForComputer = 2; // DRAW

    } else {

      resultForComputer = turn === $scope.computerColor ? 1 : 3; // WIN or LOSS

    }

    statsService.setResult($scope.computerColor, resultForComputer);

    $scope.hoverAt = undefined;

  };

  $scope.humanPlay = function(col) {

    if (!$scope.result && $scope.humanColor === $scope.turn) {

      play(col);

    }

  };

  $scope.undoable = function() {

    return gameService.getMoveCount() >= 2 &&

        $scope.undoLeft > 0 &&

        ($scope.resultMsg || $scope.isHumanTurn());

  };

  $scope.undo = function() {

    gameService.unMakeMove();

    engineService.unMakeMove();

    // Undo until it is human's turn.

    if (gameService.getTurn() === $scope.computerColor) {

      gameService.unMakeMove();

      engineService.unMakeMove();

    }

    handleGameStateChanged();

    $scope.resultMsg = '';

    $scope.bestScore = 0;

    $scope.depth = 0;

    $scope.undoLeft--;

  };

  function play(col) {    

    if (gameService.makeMove(col)) {

      engineService.makeMove(col);

      handleGameStateChanged();

      if ($scope.result) {

        announceResult($scope.result);

        return;

      }

      if (getPlayerType($scope.turn) === COMPUTER) {

        computerPlay();

      }

    } else {

      alert('Invalid move.');

    }

  }

  function computerPlay() {

    var randomTimeLimit = DEFAULT_TIME_LIMIT - TIME_DELTA + Math.floor(Math.random() * 2 * TIME_DELTA);

    engineService.think(randomTimeLimit).then(function(thinkResult) {

      play(thinkResult.bestMove);

      $scope.bestScore = thinkResult.bestScore;

      $scope.depth = thinkResult.depth;

    });

  }

  $scope.hoverColumn = function(col) {

    if ($scope.playing && !$scope.result) {

      $scope.hoverAt = col;

    }

  };

  $scope.leaveBoard = function() {

    if ($scope.playing && !$scope.result) {

      $scope.hoverAt = undefined;

    }

  };

});

​