Mon morpion / My Tic-tac-toc

Gallery
1 
int x=0;
int y=0; // coordonnées

boolean click = false; 
boolean tour = false;
boolean restart = false;

void setup() {    // s'active ou s'actualisé une fois 
  size(301,301);
  background(255);
  
}

void draw() { // reste continue
  stroke(150); // couleur epaisseur 
  strokeWeight(1); // taille 
  line(300/3,0,300/3,300);
  line(2*300/3,0,2*300/3,300);        // width = largeur
  line(0,300/3,300,300/3);           // height = longeur/hauteur
  line(0,2*300/3,300,2*300/3);

if(restart){
  delay(2000);           // 1seconde= 1000ms
  background(255);
  restart=false;
}
   

if(click){ // emplacement de la souris

// horizontal 
if(mouseX>=0 && mouseX<300/3) x= 300/6;                                          //  .|.|.
if (mouseX>=width/3 && mouseX<2*300/3) x= 3*300/6;                               //  .|.|.
if (mouseX>=2*width/3 && mouseX<300) x= 5*300/6;                                 //  .|.|.

// "" vertical
if(mouseY>=0 && mouseY<height/3) y= 300/6; 
if (mouseY>=height/3 && mouseY<2*height/3) y= 3*300/6;
if (mouseY>=2*height/3 && mouseY<height) y= 5*300/6;
// on determine absisses et ordonnées

if(tour){
  fill(253);
  noStroke();
  rect(x-49,y-49,width/3-1,width/3-1);
  fill(253,0,0);
  stroke(253,0,0);
  ellipse(x,y,width/4,width/4);
  } else {
fill(253);
  noStroke();
  rect(x-49,y-49,width/3-1,width/3-1);
  fill(0,0,253);
  stroke(0,0,253);
  strokeWeight(15);
  line(x-30,y-30,x+30,y+30);
  line(x-30,y+30,x+30,y-30);
} 


if(get(width/6,height/6)==get(width/6,3*height/6) && get(width/6,3*height/6)==get(width/6,5*height/6)){      // ||=ou
  if(get(width/6,5*height/6)==color(253,0,0) || get(width/6,5*height/6)==color(0,0,253)){
  stroke(0,100,0);                                                                                            // 300/6= 50, 5*300/6=250, 3*300/6=150,
  strokeWeight(3);
  line(width/6,0,width/6,height);
  restart=true;
  }
}

//      .|.|.
//      .|.|.
//      .|.|.

if(get(3*width/6,height/6)==get(3*width/6,3*height/6) && get(3*width/6,3*height/6)==get(3*width/6,5*height/6)){
  if(get(3*width/6,5*height/6)==color(253,0,0) || get(3*width/6,5*height/6)==color(0,0,253)){
  stroke(0,100,0);
  strokeWeight(3);
  line(3*width/6,0,3*width/6,height);
  restart=true;
  }
}


if(get(5*width/6,height/6)==get(5*width/6,3*height/6) && get(5*width/6,3*height/6)==get(5*width/6,5*height/6)){
  if(get(5*width/6,5*height/6)==color(253,0,0) || get(5*width/6,5*height/6)==color(0,0,253)){
  stroke(0,100,0);
  strokeWeight(3);   
  line(5*width/6,0,5*width/6,height);
  restart=true;
  }
}

if(get(width/6,height/6)==get(3*width/6,height/6) && get(3*width/6,height/6)==get(5*width/6,height/6)){
  if(get(5*width/6,height/6)==color(253,0,0) || get(5*width/6,height/6)==color(0,0,253)){
  stroke(0,100,0);
  strokeWeight(3);
  line(0,height/6,width,height/6);
  restart=true;
  }
}

if(get(width/6,3*height/6)==get(3*width/6,3*height/6) && get(3*width/6,3*height/6)==get(5*width/6,3*height/6)){
  if(get(5*width/6,3*height/6)==color(253,0,0) || get(5*width/6,3*height/6)==color(0,0,253)){
  stroke(0,100,0);
  strokeWeight(3);
  line(0,3*height/6,width,3*height/6);
  restart=true;
  }
}

if(get(width/6,5*height/6)==get(3*width/6,5*height/6) && get(3*width/6,5*height/6)==get(5*width/6,5*height/6)){
  if(get(5*width/6,5*height/6)==color(253,0,0) || get(5*width/6,5*height/6)==color(0,0,253)){
  stroke(0,100,0);
  strokeWeight(3); 
  line(0,5*height/6,width,5*height/6);
  restart=true;
  }
}

if(get(width/6,height/6)==get(3*width/6,3*height/6) && get(3*width/6,3*height/6)==get(5*width/6,5*height/6)){
  if(get(3*width/6,3*height/6)==color(253,0,0) || get(3*width/6,3*height/6)==color(0,0,253)){
  stroke(0,100,0);
  strokeWeight(3);
  line(0,0,width,height);
  restart=true;
  }
}

if(get(5*width/6,height/6)==get(3*width/6,3*height/6) && get(3*width/6,3*height/6)==get(width/6,5*height/6)){
  if(get(3*width/6,3*height/6)==color(253,0,0) || get(3*width/6,3*height/6)==color(0,0,253)){
  stroke(0,100,0);
  strokeWeight(3);
  line(0,width,height,0);
  restart=true;
  }
}
  
if (get(width/6,height/6)!=color(255) &&
get(3*width/6,height/6)!=color(255) &&
get(5*width/6,height/6)!=color(255) &&
get(width/6,3*height/6)!=color(255) &&
get(3*width/6,3*height/6)!=color(255) &&
get(5*width/6,3*height/6)!=color(255) &&
get(width/6,5*height/6)!=color(255) &&
get(3*width/6,5*height/6)!=color(255) &&
get(5*width/6,5*height/6)!=color(255)) {
 restart =true; } 


tour = !tour; // != inverse boolean true false ( inverse de tour )
click=false;

}
}

void mousePressed() {
  if(get(mouseX,mouseY)==color(255))
    click = true; 
    }
    
void keyPressed() {
  if (key== 'e'){
  exit(); }
}
2 Likes
2

Thank you for sharing this!

When posting code to the forum, please format your code with the </> button.

3

Thanks for sharing this!

It looks beautuful!

There is room for improvement.

You are relying now on get to evaluate what is on the screen, to decide whether the move is valid or we have to restart etc.

It would be better to store everything in variables / data:

  • You could store whose move it is: moveIs = 0 or moveIs = 1; to decide whether o or X is played next.

  • You could store the game board in an 2D array (grid), so you know if a field is empty (it has the value 0), has a X (e.g. value 1) or an o (e.g. value 2). Then you can just check if the field empty. For two-dimensional array see tutorial section

  • You can also store the coordinates of each field (upper left corner x,y plus width and height of the field) and check the mouse against it.

  • You could also use object oriented programming (see tutorials under objects).

Again, thank you and maybe you find the time to keep on working on it when you learn new tricks. :wink:

Chrisir