# My program isn't doing what I want it to do (x and o game / Tic Tac Toe)

**URL:** <https://discourse.processing.org/t/my-program-isnt-doing-what-i-want-it-to-do-x-and-o-game-tic-tac-toe/25516>\
**Category:** Coding Questions\
**Created:** [November 18, 2020, 7:42pm UTC](https://discourse.processing.org/t/my-program-isnt-doing-what-i-want-it-to-do-x-and-o-game-tic-tac-toe/25516 "2020-11-18T19:42:31Z")\
**Posts on this page:** 20\
**Page:** 3

<div class="post-metadata">

**Author:** ![Chrisir](https://yyz2.discourse-cdn.com/flex036/user_avatar/discourse.processing.org/chrisir/32/45_2.png) [@Chrisir](https://discourse.processing.org/u/Chrisir)\
**Post date:** [December 10, 2020, 4:48pm UTC](https://discourse.processing.org/t/my-program-isnt-doing-what-i-want-it-to-do-x-and-o-game-tic-tac-toe/25516/41 "2020-12-10T16:48:18Z")

</div>

At the Moment you make 0s and Xs in every cell.

(Each cell has its position as x[i],y[i]. Good)

But this is not correct. You want to make X or 0 only once in the clicked cell

So you can for loop over all cells and check if (dist(mouseX, mouseY, x[i],y[i]) \< 60) and then draw the X for this x[i],y[i] only

---

<div class="post-metadata">

**Author:** ![Chrisir](https://yyz2.discourse-cdn.com/flex036/user_avatar/discourse.processing.org/chrisir/32/45_2.png) [@Chrisir](https://discourse.processing.org/u/Chrisir)\
**Post date:** [December 10, 2020, 4:52pm UTC](https://discourse.processing.org/t/my-program-isnt-doing-what-i-want-it-to-do-x-and-o-game-tic-tac-toe/25516/42 "2020-12-10T16:52:17Z")

</div>

There is a nice tutorial about arrays

In our case they are like 2 parallel lists

---

<div class="post-metadata">

**Author:** ![DijaAngel](https://avatars.discourse-cdn.com/v4/letter/d/46a35a/32.png) [@DijaAngel](https://discourse.processing.org/u/DijaAngel)\
**Post date:** [December 10, 2020, 5:18pm UTC](https://discourse.processing.org/t/my-program-isnt-doing-what-i-want-it-to-do-x-and-o-game-tic-tac-toe/25516/43 "2020-12-10T17:18:30Z")

</div>

ok thanks will try it

---

<div class="post-metadata">

**Author:** ![Chrisir](https://yyz2.discourse-cdn.com/flex036/user_avatar/discourse.processing.org/chrisir/32/45_2.png) [@Chrisir](https://discourse.processing.org/u/Chrisir)\
**Post date:** [December 10, 2020, 8:46pm UTC](https://discourse.processing.org/t/my-program-isnt-doing-what-i-want-it-to-do-x-and-o-game-tic-tac-toe/25516/44 "2020-12-10T20:46:26Z")

</div>

**The positions of both arrays as text**

this Sketch shows the positions with println

```auto

int[]x=
  {
  110, 300, 490, 
  110, 300, 490, 
  110, 300, 490
};
int[]y=
  {
  150, 150, 150, 
  300, 300, 300, 
  450, 450, 450
};

for (int i=0; i < x.length; i++) {
  println ("field "+i+" is " +" located at " + x[i] + " and " + y[i] + " (x and y)." );
}//for 

```

* * *

**The positions of both arrays on the screen**

This Sketch shows the positions as a graphic:

```auto

int[]x=
  {
  110, 300, 490, 
  110, 300, 490, 
  110, 300, 490
};
int[]y=
  {
  150, 150, 150, 
  300, 300, 300, 
  450, 450, 450
};

size(600, 600); 

for (int i=0; i < x.length; i++) {
  fill(255); // white 
  ellipse (x[i], y[i], 17, 17);
  fill(0); // black
  text( i, x[i]+19, y[i]);
}//for 

```

* * *

**Matching the mouse position to the positions of both arrays**

And here is a Sketch that receives the mouse inputs and checks the distance to the 9 fields. When this distance is \<50 we draw a X.

```auto

int[]x=
  {
  110, 300, 490, 
  110, 300, 490, 
  110, 300, 490
};
int[]y=
  {
  150, 150, 150, 
  300, 300, 300, 
  450, 450, 450
};

void setup() {
  size(600, 600);
}//func 

void draw() {
  for (int i=0; i < x.length; i++) {
    fill(255); // white 
    ellipse (x[i], y[i], 17, 17);
    fill(0); // black
    textSize(14); 
    text( i, x[i]+19, y[i]);
  }//for
}//func 

void mousePressed() {
  for (int i=0; i < x.length; i++) {
    //check the distance between mouse and the field #i
    if (dist(mouseX, mouseY, x[i], y[i]) < 50) {
      textSize(44); 
      text( "X", x[i]-3, y[i]+13);
    }//if
  }//for
}//func 
//

```

---

<div class="post-metadata">

**Author:** ![DijaAngel](https://avatars.discourse-cdn.com/v4/letter/d/46a35a/32.png) [@DijaAngel](https://discourse.processing.org/u/DijaAngel)\
**Post date:** [December 11, 2020, 6:34pm UTC](https://discourse.processing.org/t/my-program-isnt-doing-what-i-want-it-to-do-x-and-o-game-tic-tac-toe/25516/45 "2020-12-11T18:34:55Z")

</div>

thanks but i find this confusing,i dont know how i would apply this to my program.

---

<div class="post-metadata">

**Author:** ![Chrisir](https://yyz2.discourse-cdn.com/flex036/user_avatar/discourse.processing.org/chrisir/32/45_2.png) [@Chrisir](https://discourse.processing.org/u/Chrisir)\
**Post date:** [December 11, 2020, 6:39pm UTC](https://discourse.processing.org/t/my-program-isnt-doing-what-i-want-it-to-do-x-and-o-game-tic-tac-toe/25516/46 "2020-12-11T18:39:06Z")

</div>

Ah, I just wanted to show you how the arrays work together, one array gives the x-position for one point, the other array gives you the y position.

In the last example, you can see how the program searches the tic tac toe position nearest the mouse position (using a for-loop) and draws a X there.

This is similar to what you have to do in your `mouseClicked() ` function. You want to achieve that not all X’s are drawn at once but only one X in the position you clicked on the tic tac toe board.

Chrisir

---

<div class="post-metadata">

**Author:** ![DijaAngel](https://avatars.discourse-cdn.com/v4/letter/d/46a35a/32.png) [@DijaAngel](https://discourse.processing.org/u/DijaAngel)\
**Post date:** [December 11, 2020, 7:03pm UTC](https://discourse.processing.org/t/my-program-isnt-doing-what-i-want-it-to-do-x-and-o-game-tic-tac-toe/25516/47 "2020-12-11T19:03:14Z")

</div>

```auto
PImage background; // image for background 
char player='X'; // this tells us whose turn it is during the game
int score=0; // the score

//Program screens
final int mainMenu = 0;//defines mainMenu
final int game = 1;//defines game
int state = mainMenu;//sets mainmenu as first screen player sees

void setup() {
  size(600, 600);//sets screen size
  background=loadImage("yo.jpg");//sets picture for background
  strokeWeight(6);//sets the width of the stroke
}

void draw() {
  switch(state) {//this functions switches the state of the program

  case mainMenu:
    runMenu();//sets the screen for the main menu
    break;

  case game:
    runGame();//sets the screen for the game
    break;
  }
  
}

void runMenu() {
  if (background==null)//sets the condition for which the background changes 
    background(255); //sets background to white
  else 
  background(background);//sets background to image

  fill(0); // black text 
  textSize(32);//sets text size
  text("X and O game", 100, 100);//displays X and O game
  textSize(21);//sets text size
  text("Press 'a' to begin the game", 150, 180);//displays press a to begin the game
  if (key=='a') {//states what happens if a key is pressed
    background(110);//sets background colour
    state=game;//takes player to game
  }
}

void runGame() {
  textSize(32);//sets text size
  fill(0, 102, 153);//determines text colour
  text("X and 0 game", 210, 40);//displays x and o game

  // draw grid 
  stroke(0);//sets the colour of the lines to black
  line(200, 100, 200, 500);//creates the first vertical line
  line(400, 100, 400, 500);//creates the second vertical line
  line(100, 100+400/3, 500, 100+400/3);//draws the first horizontal line
  line(100, 250+400/3, 500, 250+400/3);//draws the second horizontal lin

  
  if (player=='X') { //states what happens when its player x's turn 
    deleteFooter();
    fill(0, 102, 153);//sets text colour
    textSize(32);//sets text size
    text("It’s X’s turn", 100, 550);//displays its x turn
  } else {//states what happens if its not player x's turn
    deleteFooter(); 
    textSize(32);//sets text size
    fill(0, 102, 153);//sets text colour
    text("It’s 0’s turn", 100, 550);//displays its o's turn
  }
}

void mouseClicked() {
  if (state != game)//this is to make sure we are in the right state
    return; // leave
  
  if (player=='X') { //sets the condition for what happens when its player x's turn
  for(int i=0;i<x.length;i++){
    if(dist(mouseX,mouseY,x[i],y[i])<50){
    stroke(0, 255, 0); //sets the color for the letter X to green
    line(mouseX+50, mouseY-50, mouseX-50, mouseY+50);//draws the first line of the letter X
    line(mouseX-50, mouseY-50, mouseX+50, mouseY+50);//draws the second line of the letter X

    player='0';//this statement states that its 0's turn now
  } else {
   for(int i=0;i<x.length;i++){
    if(dist(mouseX,mouseY,x[i],y[i])<50){ 
    stroke(255, 0, 0);//changes the colour of the circle to red
    noFill();//this gives the ellipse just the outline and makes it hollow
    ellipse(mouseX, mouseY, 100, 100);//draws a circle

    player='X';//this statement states that its X's turn now
  }
}
  }
}

void deleteFooter() {
  // make a rect to delete the old text "It’s 0’s turn"/"It’s X’s turn"
  fill(110);//fills rectangle
  noStroke(); //no stroke
  rect(0, 520, width, 200);//draws a rectangle
}

```

like this?

---

<div class="post-metadata">

**Author:** ![Chrisir](https://yyz2.discourse-cdn.com/flex036/user_avatar/discourse.processing.org/chrisir/32/45_2.png) [@Chrisir](https://discourse.processing.org/u/Chrisir)\
**Post date:** [December 11, 2020, 7:07pm UTC](https://discourse.processing.org/t/my-program-isnt-doing-what-i-want-it-to-do-x-and-o-game-tic-tac-toe/25516/48 "2020-12-11T19:07:18Z")

</div>

Does it work? You need to test it.

> [@DijaAngel](#):
>
> `if (player=='X') { `

You must close the for loop within this if-clause

> [@DijaAngel](#):
>
> `line(mouseX+50, mouseY-50`

You don’t want to draw at mouse position but where x and y array tells you

---

<div class="post-metadata">

**Author:** ![DijaAngel](https://avatars.discourse-cdn.com/v4/letter/d/46a35a/32.png) [@DijaAngel](https://discourse.processing.org/u/DijaAngel)\
**Post date:** [December 11, 2020, 7:34pm UTC](https://discourse.processing.org/t/my-program-isnt-doing-what-i-want-it-to-do-x-and-o-game-tic-tac-toe/25516/49 "2020-12-11T19:34:50Z")

</div>

Sorrry but im still so confused.i dont know how to apply this.

---

<div class="post-metadata">

**Author:** ![Chrisir](https://yyz2.discourse-cdn.com/flex036/user_avatar/discourse.processing.org/chrisir/32/45_2.png) [@Chrisir](https://discourse.processing.org/u/Chrisir)\
**Post date:** [December 11, 2020, 7:55pm UTC](https://discourse.processing.org/t/my-program-isnt-doing-what-i-want-it-to-do-x-and-o-game-tic-tac-toe/25516/50 "2020-12-11T19:55:54Z")

</div>

> [@DijaAngel](#):
>
> ```auto
> line(x[0]+50, y[0]-50, x[0]-50, y[0]+50);//draws the first line of the letter X
> line(x[0]-50, y[0]-50,x[0] +50,y[0] +50);//draws the second line of the letter X
>     
> 
> ```

It’s almost like here, just use the index from the for loop instead of 0

---

<div class="post-metadata">

**Author:** ![DijaAngel](https://avatars.discourse-cdn.com/v4/letter/d/46a35a/32.png) [@DijaAngel](https://discourse.processing.org/u/DijaAngel)\
**Post date:** [December 11, 2020, 8:07pm UTC](https://discourse.processing.org/t/my-program-isnt-doing-what-i-want-it-to-do-x-and-o-game-tic-tac-toe/25516/51 "2020-12-11T20:07:22Z")

</div>

thanks i finally got it sorry i dont understand things easily

---

<div class="post-metadata">

**Author:** ![Chrisir](https://yyz2.discourse-cdn.com/flex036/user_avatar/discourse.processing.org/chrisir/32/45_2.png) [@Chrisir](https://discourse.processing.org/u/Chrisir)\
**Post date:** [December 11, 2020, 8:08pm UTC](https://discourse.processing.org/t/my-program-isnt-doing-what-i-want-it-to-do-x-and-o-game-tic-tac-toe/25516/52 "2020-12-11T20:08:10Z")

</div>

You are welcome!

Does it work now?

---

<div class="post-metadata">

**Author:** ![DijaAngel](https://avatars.discourse-cdn.com/v4/letter/d/46a35a/32.png) [@DijaAngel](https://discourse.processing.org/u/DijaAngel)\
**Post date:** [December 11, 2020, 8:12pm UTC](https://discourse.processing.org/t/my-program-isnt-doing-what-i-want-it-to-do-x-and-o-game-tic-tac-toe/25516/53 "2020-12-11T20:12:28Z")

</div>

yes thank u so much sorry for taking ur time from ur busy schedule.

---

<div class="post-metadata">

**Author:** ![Chrisir](https://yyz2.discourse-cdn.com/flex036/user_avatar/discourse.processing.org/chrisir/32/45_2.png) [@Chrisir](https://discourse.processing.org/u/Chrisir)\
**Post date:** [December 11, 2020, 8:13pm UTC](https://discourse.processing.org/t/my-program-isnt-doing-what-i-want-it-to-do-x-and-o-game-tic-tac-toe/25516/54 "2020-12-11T20:13:20Z")

</div>

**Next step**

Now the idea is that you can place X and 0 in array `clicked[]`.  
Because the index of x[] and y[] is now `i` and when you make the move you can at the same time say `clicked[i] = player;`. Thus the array `clicked[]` stores your board (with the moves that are made on it).

**Check if field is empty**

Then before placing the move you can check if the chosen field is empty.  
Otherwise the move is not allowed.

- The array `clicked[]` must be empty in the field:

```auto
if(clicked[i]==' ') { // space sign in ' '
    // make move  
}

```

**Detect a Win and Draw/Tie**

Then you can detect a Win using array `clicked[]`.

Besides: a Draw/Tie is when 9 moves have been made (just count them) (and also no Win)

Chrisir

---

<div class="post-metadata">

**Author:** ![DijaAngel](https://avatars.discourse-cdn.com/v4/letter/d/46a35a/32.png) [@DijaAngel](https://discourse.processing.org/u/DijaAngel)\
**Post date:** [December 15, 2020, 10:44am UTC](https://discourse.processing.org/t/my-program-isnt-doing-what-i-want-it-to-do-x-and-o-game-tic-tac-toe/25516/55 "2020-12-15T10:44:14Z")

</div>

HI where would I call moveai in my program is it in the run menu?

---

<div class="post-metadata">

**Author:** ![Chrisir](https://yyz2.discourse-cdn.com/flex036/user_avatar/discourse.processing.org/chrisir/32/45_2.png) [@Chrisir](https://discourse.processing.org/u/Chrisir)\
**Post date:** [December 15, 2020, 11:13am UTC](https://discourse.processing.org/t/my-program-isnt-doing-what-i-want-it-to-do-x-and-o-game-tic-tac-toe/25516/56 "2020-12-15T11:13:59Z")

</div>

No, runMenu() is there to show the menu.

It belongs in the game function ( `runGame()`)

---

<div class="post-metadata">

**Author:** ![DijaAngel](https://avatars.discourse-cdn.com/v4/letter/d/46a35a/32.png) [@DijaAngel](https://discourse.processing.org/u/DijaAngel)\
**Post date:** [December 30, 2020, 3:57pm UTC](https://discourse.processing.org/t/my-program-isnt-doing-what-i-want-it-to-do-x-and-o-game-tic-tac-toe/25516/57 "2020-12-30T15:57:49Z")

</div>

```auto
PImage background; // image for background 
char player='X'; // this tells us whose turn it is during the game
int score=0; // the score
int moveAI='0';

//Program screens
final int mainMenu = 0;//defines mainMenu
final int game = 1;//defines game
int state = mainMenu;//sets mainmenu as first screen player sees
int[]x=
  {
  110, 300, 490, 
  110, 300, 490, 
  110, 300, 490
};
int[]y=
  {
  150, 150, 150, 
  300, 300, 300, 
  450, 450, 450
};
char[] clicked =  
  {
  ' ', ' ', ' ', 
  ' ', ' ', ' ', 
  ' ', ' ', ' '
};

void setup() {
  size(600, 600);//sets screen size
  background=loadImage("yo.jpg");//sets picture for background
  strokeWeight(6);//sets the width of the stroke
}

void draw() {
  switch(state) {//this functions switches the state of the program

  case mainMenu:
    runMenu();//sets the screen for the main menu
    break;

  case game:
    runGame();//sets the screen for the game
    break;
  }
}

void runMenu() {
  if (background==null)//sets the condition for which the background changes 
    background(255); //sets background to white
  else 
  background(background);//sets background to image

  fill(0); // black text 
  textSize(32);//sets text size
  text("X and O game", 100, 100);//displays X and O game
  textSize(21);//sets text size
  text("Press 'a' to begin the game", 150, 180);//displays press a to begin the game
  if (key=='a') {//states what happens if a key is pressed
    background(110);//sets background colour
    state=game;//takes player to game
  }
}

void runGame() {
  textSize(32);//sets text size
  fill(0, 102, 153);//determines text colour
  text("X and 0 game", 210, 40);//displays x and o game

  // draw grid 
  stroke(0);//sets the colour of the lines to black
  line(200, 100, 200, 500);//creates the first vertical line
  line(400, 100, 400, 500);//creates the second vertical line
  line(100, 100+400/3, 500, 100+400/3);//draws the first horizontal line
  line(100, 250+400/3, 500, 250+400/3);//draws the second horizontal lin

  if (player=='X') { //states what happens when its player x's turn 
    deleteFooter();
    fill(0, 102, 153);//sets text colour
    textSize(32);//sets text size
    text("It’s X’s turn", 100, 550);//displays its x turn
  } else {//states what happens if its not player x's turn
    deleteFooter(); 
    textSize(32);//sets text size
    fill(0, 102, 153);//sets text colour
    text("It’s 0’s turn", 100, 550);//displays its o's turn
  }
}

void showWhoseTurnAnd_AI_Manager() {
  if (state != game)//this is to make sure we are in the right state
    return; // leave

  if (player=='X') { //sets the condition for what happens when its player x's turn
    for (int i=0; i<x.length; i++) {
      if (dist(mouseX, mouseY, x[i], y[i])<50) {
        stroke(0, 255, 0); //sets the color for the letter X to green
        line(x[i]+50, y[i]-50, x[i]-50, y[i]+50);//draws the first line of the letter X
        line(x[i]-50, y[i]-50, x[i] +50, y[i] +50);//draws the second line of the letter X
        
      }
    }

    player='0';//this statement states that its 0's turn now
  } else {
    for (int i=0; i<x.length; i++) {
      if (dist(mouseX, mouseY, x[i], y[i])<50) {
        stroke(255, 0, 0);//changes the colour of the circle to red
        noFill();//this gives the ellipse just the outline and makes it hollow
        ellipse(x[i], y[i], 100, 100);//draws a circle
        moveAI();
      }
    }

    player='X';//this statement states that its X's turn now
  }
}

void deleteFooter() {
  // make a rect to delete the old text "It’s 0’s turn"/"It’s X’s turn"
  fill(110);//fills rectangle
  noStroke(); //no stroke
  rect(0, 520, width, 200);//draws a rectangle
}

```

Hi I tried the ai but it says moveAI(); doesn’t exist am I doing something wrong?

---

<div class="post-metadata">

**Author:** ![Chrisir](https://yyz2.discourse-cdn.com/flex036/user_avatar/discourse.processing.org/chrisir/32/45_2.png) [@Chrisir](https://discourse.processing.org/u/Chrisir)\
**Post date:** [December 30, 2020, 4:19pm UTC](https://discourse.processing.org/t/my-program-isnt-doing-what-i-want-it-to-do-x-and-o-game-tic-tac-toe/25516/58 "2020-12-30T16:19:19Z")

</div>

> [@DijaAngel](#):
>
> moveAI()

You need to have the function moveAI in your code!!

And call

> [@DijaAngel](#):
>
> `showWhoseTurnAnd_AI_Manager()`

from runGame please

---

<div class="post-metadata">

**Author:** ![Chrisir](https://yyz2.discourse-cdn.com/flex036/user_avatar/discourse.processing.org/chrisir/32/45_2.png) [@Chrisir](https://discourse.processing.org/u/Chrisir)\
**Post date:** [December 30, 2020, 4:29pm UTC](https://discourse.processing.org/t/my-program-isnt-doing-what-i-want-it-to-do-x-and-o-game-tic-tac-toe/25516/59 "2020-12-30T16:29:11Z")

</div>

Your goal is that a Human plays against the AI

AI plays X

Your showWhoseTurnAnd\_AI\_Manager() function is not correct

There is no human move with X anymore

---

<div class="post-metadata">

**Author:** ![DijaAngel](https://avatars.discourse-cdn.com/v4/letter/d/46a35a/32.png) [@DijaAngel](https://discourse.processing.org/u/DijaAngel)\
**Post date:** [December 30, 2020, 4:56pm UTC](https://discourse.processing.org/t/my-program-isnt-doing-what-i-want-it-to-do-x-and-o-game-tic-tac-toe/25516/61 "2020-12-30T16:56:32Z")

</div>

```auto
PImage background; // image for background 
char player='0'; // this tells us whose turn it is during the game
char playerAI='X';
int score=0; // the score

//Program screens
final int mainMenu = 0;//defines mainMenu
final int game = 1;//defines game
int state = mainMenu;//sets mainmenu as first screen player sees
int[]x=
  {
  110, 300, 490, 
  110, 300, 490, 
  110, 300, 490
};
int[]y=
  {
  150, 150, 150, 
  300, 300, 300, 
  450, 450, 450
};
char[] clicked =  
  {
  ' ', ' ', ' ', 
  ' ', ' ', ' ', 
  ' ', ' ', ' '
};

void setup() {
  size(600, 600);//sets screen size
  background=loadImage("yo.jpg");//sets picture for background
  strokeWeight(6);//sets the width of the stroke
}

void draw() {
  switch(state) {//this functions switches the state of the program

  case mainMenu:
    runMenu();//sets the screen for the main menu
    break;

  case game:
    runGame();//sets the screen for the game
    break;
  }
}

void runMenu() {
  if (background==null)//sets the condition for which the background changes 
    background(255); //sets background to white
  else 
  background(background);//sets background to image

  fill(0); // black text 
  textSize(32);//sets text size
  text("X and O game", 100, 100);//displays X and O game
  textSize(21);//sets text size
  text("Press 'a' to begin the game", 150, 180);//displays press a to begin the game
  if (key=='a') {//states what happens if a key is pressed
    background(110);//sets background colour
    state=game;//takes player to game
  }
}

void runGame() {
  textSize(32);//sets text size
  fill(0, 102, 153);//determines text colour
  text("X and 0 game", 210, 40);//displays x and o game

  // draw grid 
  stroke(0);//sets the colour of the lines to black
  line(200, 100, 200, 500);//creates the first vertical line
  line(400, 100, 400, 500);//creates the second vertical line
  line(100, 100+400/3, 500, 100+400/3);//draws the first horizontal line
  line(100, 250+400/3, 500, 250+400/3);//draws the second horizontal lin

  if (player=='X') { //states what happens when its player x's turn 
    deleteFooter();
    fill(0, 102, 153);//sets text colour
    textSize(32);//sets text size
    text("It’s X’s turn", 100, 550);//displays its x turn
  } else {//states what happens if its not player x's turn
    deleteFooter(); 
    textSize(32);//sets text size
    fill(0, 102, 153);//sets text colour
    text("It’s 0’s turn", 100, 550);//displays its o's turn
  }
  showWhoseTurnAnd_AI_Manager();
}

void showWhoseTurnAnd_AI_Manager() {
  if (state != game)//this is to make sure we are in the right state
    return; // leave

  if (player=='X') { //sets the condition for what happens when its player x's turn
    for (int i=0; i<x.length; i++) {
      if (dist(mouseX, mouseY, x[i], y[i])<50) {
        stroke(0, 255, 0); //sets the color for the letter X to green
        line(x[i]+50, y[i]-50, x[i]-50, y[i]+50);//draws the first line of the letter X
        line(x[i]-50, y[i]-50, x[i] +50, y[i] +50);//draws the second line of the letter X
        moveAI();
      }
    }

    player='0';//this statement states that its 0's turn now
  } else {
    for (int i=0; i<x.length; i++) {
      if (dist(mouseX, mouseY, x[i], y[i])<50) {
        stroke(255, 0, 0);//changes the colour of the circle to red
        noFill();//this gives the ellipse just the outline and makes it hollow
        ellipse(x[i], y[i], 100, 100);//draws a circle
        
      }
    }

    player='X';//this statement states that its X's turn now
  }
}

void deleteFooter() {
  // make a rect to delete the old text "It’s 0’s turn"/"It’s X’s turn"
  fill(110);//fills rectangle
  noStroke(); //no stroke
  rect(0, 520, width, 200);//draws a rectangle
}
// AI player 0
// A stupid AI plays a random move on an empty field/cell 

void moveAI() {
  // make a list of empty cells on the board 
  IntList possibleMoves=new IntList(); 

  for (int i = 0; i<clicked.length; i++) {  
    if (clicked[i] == ' ') { 
      possibleMoves.append(i);
    }//if
  }//for

  // Shuffle the list 
  possibleMoves.shuffle(); 

  // Success 
  // Make the move. Since we shuffled the list, we can always take possible move #0 from the list 
  clicked[possibleMoves.get(0)]=playerAI; // make / record move
  player='0'; // change turn
}//func 
//

```

Sorry I tried it again but x and o plays in the same place and the game crashes

[Previous page](https://discourse.processing.org/t/my-program-isnt-doing-what-i-want-it-to-do-x-and-o-game-tic-tac-toe/25516.md?page=2)

[Next page](https://discourse.processing.org/t/my-program-isnt-doing-what-i-want-it-to-do-x-and-o-game-tic-tac-toe/25516.md?page=4)