[2, 2, 2],

  [2, 2, 2],

  [2, 2, 2]

];

var startPos = [

  [2, 2, 2],

  [2, 2, 2],

  [2, 2, 2]

];

var winRow, winCol;

var winDia = {

  a:null,

  b:null,

  c:null,

  d:null

};

var gameState = 0;

var lane;

var currPlayer;

var x = 1;

var o = 0;

var Title;

var title;

var PLA;

var winner = 2;

var reset;

​

function setup() {

  currPlayer = x;

  title = 'Tic Tac Toe (' + PLA + ')'

  Title = createElement('h1');

  Title.html(title);

  createCanvas(420, 420);

  createP('Try playing two-player TicTacToe Game with result checking');

  lane = width / 6;

}

​

function draw() {

  background(51);

  //"LOl noone can see me !"

  Title.html(title);

  title = 'Tic Tac Toe (' + PLA + ')'

  stroke(255);

  strokeWeight(3);

  push();

  stroke(255, 0, 0);

  strokeWeight(5);

  line(30, lane * ((2 * (winRow + 1)) - 1), width - 30, lane * ((2 * (winRow + 1)) - 1));

  line(lane * ((2 * (winCol + 1)) - 1), height - 30, lane * ((2 * (winCol + 1)) - 1), 30);

  if (winDia.a)

  line(winDia.a, winDia.b, winDia.c, winDia.d);

  pop();

  if (game == startPos) {

    gameState = 0;

  }

  if (gameState !== 2) {

    checkWinner();

  }

  switch (currPlayer) {

    case 0:

      PLA = 'O';

      break;

    case 1:

      PLA = 'X';

      break;

    case 2:

      PLA = 'over';

      break;

    default:

      break;

  }

  line(width / 3, 0, width / 3, height);

  line(2 * width / 3, 0, 2 * width / 3, height);

  line(0, height / 3, width, height / 3);

  line(0, 2 * height / 3, width, 2 * height / 3);

  for (var row = 0; row < 3; row++) {

    for (var element = 0; element < 3; element++) {

      if (game[row][element] == 1) {

        drawX(element + 1, row + 1);

      } else if (game[row][element] == 0) {

        drawO(element + 1, row + 1);

      }

    }

  }

}

​

function mousePressed() {

  var row, col;

  if (mouseX < width / 3) {

    row = 1;

  } else if (mouseX < width * 2 / 3) {

    row = 2

  } else if (mouseX < width) {

    row = 3

  }

  if (mouseY < height / 3) {

    col = 1;

  } else if (mouseY < height * 2 / 3) {

    col = 2

  } else if (mouseY < height) {

    col = 3

  }

  if (game[col - 1][row - 1] == 2 && gameState !== 2) {

    gameState = 1

    game[col - 1][row - 1] = currPlayer;

    if (currPlayer == x) {

      currPlayer = o;

    } else {

      currPlayer = x;

    }

  }

​

}

​

function drawX(x, y) {

  var pos = {

    x: lane * ((2 * x) - 1),

    y: lane * ((2 * y) - 1),

  }

  push();

  translate(pos.x, pos.y);

  line(-30, -30, 30, 30);

  line(30, -30, -30, 30);

  pop();

}

​

function drawO(x, y) {

  var pos = {

    x: lane * ((2 * x) - 1),

    y: lane * ((2 * y) - 1),

  }

  push();

  translate(pos.x, pos.y);

  noFill();

  ellipse(0, 0, 60);

  pop();

}

​

function checkWinner() {

  for (var row = 0; row < 3; row++) {

    if ((game[row][0] == game[row][1] && game[row][0] == game[row][2]) && game[row][0] !== 2) {

      winner = game[row][0];

      winRow = row;

      gameState = 2;

      currPlayer = 2;

    }

  }

  if (winner == 2) {

    for (var col = 0; col < 3; col++) {

      if ((game[0][col] == game[1][col] && game[0][col] == game[2][col]) && game[0][col] !== 2) {

        winner = game[0][col];

        winCol = col;

        gameState = 2;

        currPlayer = 2;

      }

    }

  }

  if (winner == 2) {

    if ((game[0][0] == game[1][1] && game[0][0] == game[2][2]) && game[0][0] !== 2) {

      winner = game[0][0];

      winDia = {a:30, b:30, c:width-30, d:height-30};

      gameState = 2;

      currPlayer = 2;

    }

    if ((game[0][2] == game[1][1] && game[0][2] == game[2][0]) && game[0][2] !== 2) {

      winner = game[0][0];

      winDia = {a:width-30, b:30, c:30, d:height-30};

      gameState = 2;

      currPlayer = 2;

    }

  }

}

function keyPressed(){

  if(keyCode == 32){

    resetl();

  }

}

function resetl(){

  game = null;

  game = startPos;

  winRow = undefined;

  winCol = undefined;

  winDia = {

    a:null,

    b:null,

    c:null,

    d:null

  };

  gameState = 0;

  lane = null;

  currPlayer = null;

  x = 1;

  o = 0;

  PLA = null;

  winner = 2;

  currPlayer = x;

  lane = width / 6;

}