TIC TAC TOE javascript

Issue

Creating a tic tac toe game. I am trying to read columns and rows of the tic tac toe to check who won. I am using $scope.checkResults() to grab the columns and rows and pass them into the allTheSame function to check if the values are equal which is not working.
Here is the codepen link. http://codepen.io/theMugician/pen/ojJrRp

var app = angular.module("ticTacToe", []);
app.controller("MainCtrl", function($scope){
  var cell = $(".square");
  $scope.player = "";
  $scope.AI = "";
  // changed special chars to X and O as the if statement failed.
  var cross = "✖";
  var circle = "◯";

  /*** Choose a shape ***/
  $scope.choosePlayer = function(e) {
  $scope.player = $(e.currentTarget).text();
        $('.choose').css('top', '-2000px');
        $('#wrapper').css('top', '-600px');
        $('#wrapper').css('opacity', '1');
    //these if statements failed before (AI was always empty)
    if($scope.player === cross){
    $scope.AI = circle;
    }else if($scope.player === circle){
    $scope.AI = cross;
  }
}

  /*** Shape Cells ***/
  $scope.cells = [ { value: '' }, { value: '' }, { value: '' }, 
     { value: '' }, { value: '' }, { value: '' } ,
    { value: '' }, { value: '' }, { value: '' }  
  ];
  // made a ref to scope cells
  $scope.emptyCells = $scope.cells;

  /*** Make a move ***/
  $scope.move = function(cell){
    cell.value = $scope.player;
    var round = 0;
    /*** AI makes a move ***/
    while(round < 1){
     // filtered to get only available cells (for performance)
      $scope.emptyCells = $scope.cells.filter(function(cell){
        return cell.value === '';
      });
      // got random cell according to empty cells
      var randomCell =  $scope.emptyCells[Math.floor((Math.random()*($scope.emptyCells.length-1))+1)];
      if(randomCell.value === "" ){
      randomCell.value = $scope.AI;
      round = 1;
      }else{
        round = 0;
      } 
    }
  $scope.checkResults();
  };

  //checks if values are the same
  function allthesame(arr){
    var L= arr.length-1;
    while(L){
        if(arr[L--]!==arr[L]) return false;
    }
    alert(arr[L].value + "is the winner");
}

  //checks Columns and rows
  $scope.checkResults = function(){
    var allCells = $scope.cells;
    // check rows
     var cellRows = [];
    while(allCells > 0){
      cellRows.push(allCells.splice(0,3));
    }
      for(var i = 0; i < cellRows.length; i++){
        allTheSame(cellRows[i]);
      }
    // check columns
       var cellCols = [];
         while(allCells > 0){
          cellCols.push(allCells.splice(0));
          cellCols.push(allCells.splice(3));
          cellCols.push(allCells.splice(6));
      }
      while(cellCols > 0){
      cellCols.push(cellCols.splice(0,3));
    }
      for(var i = 0; i < cellCols.length; i++){
        allTheSame(cellCols[i]);
      }
  }

$scope.reset = function(){
  $scope.cells = [ { value: '' }, { value: '' }, { value: '' }, 
     { value: '' }, { value: '' }, { value: '' } ,
    { value: '' }, { value: '' }, { value: '' }  
  ];
}
});

Solution

So you have an array of 9 values and need to compare to 8 possible winning arrangements, 3 vertical, 3 horizontal and 2 diagonal.. an array iteration against the follow list of “winning” combinations might be what you want to do.

{0,1,2}
{3,4,5}
{6,7,8}
{0,3,6}
{1,4,7}
{2,5,8}
{0,4,8}
{2,4,6}

I was just on my way out the door I can post some code later but I think saving this list as a comparison item for your cells might be the easier method.

Here is a reference article I grabbed quickly: this should be easy to convert to javascript: http://www.codeproject.com/Articles/2400/Tic-Tac-Toe-in-C

Answered By – tremor

This Answer collected from stackoverflow, is licensed under cc by-sa 2.5 , cc by-sa 3.0 and cc by-sa 4.0