Challenge: Tic-Tac-Toe

Can you tell me what I'm doing wrong? My code is doing what it's supposed to, I think but I still get this error message " Hm.. the onClick method should just ignore invalid moves on tiles that are not empty, but it looks like your method is doing something else. " even though the o-noise guy is showing there are no errors with my codes and when I click on tiles that have a symbol it is being ignored.

Here's my code:

var playerTurn = 0;
var NUM_COLS = 3;
var NUM_ROWS = 3;
var SYMBOLS = ["X","O"];

var tiles = [];

var checkWin = function() {

};

var Tile = function(x, y) {
this.x = x;
this.y = y;
this.size = width/NUM_COLS;
this.label = "";
};

Tile.prototype.draw = function() {
fill(214, 247, 202);
strokeWeight(2);
rect(this.x, this.y, this.size, this.size, 10);
textSize(100);
textAlign(CENTER, CENTER);
fill(0, 0, 0);
text(this.label, this.x+this.size/2, this.y+this.size/2);
};

Tile.prototype.empty = function() {
return this.label === "";
};

Tile.prototype.onClick = function() {
if (!this.empty()) {
Tile.draw();
}
// If the tile is not empty, exit the function
this.label = SYMBOLS[playerTurn];
// Put the player's symbol on the tile
playerTurn++;
if ( playerTurn >= SYMBOLS.length) {
playerTurn = 0;
}
// Change the turn
};

Tile.prototype.handleMouseClick = function(x, y) {
// Check for mouse clicks inside the tile
};
Tile.prototype.handleMouseClick = function(x, y) {
if ( x >= this.x && x <= this.x + this.size &&
y >= this.y && y <= this.y + this.size )
{
this.onClick();
}
};

for (var i = 0; i < NUM_COLS; i++) {
for (var j = 0; j < NUM_ROWS; j++) {
tiles.push(new Tile(i * (width/NUM_COLS-1), j * (height/NUM_ROWS-1)));
}
}

var drawTiles = function() {
for (var i in tiles) {
tiles[i].draw();
}
};

mouseReleased = function() {
for (var i in tiles) {
tiles[i].handleMouseClick(mouseX, mouseY);
}
};

draw = function() {
background(143, 143, 143);
drawTiles();
};

Challenge: Tic-Tac-Toe

Aradığınızı bulamadınız mı?

1 yorum

Aradığınızı bulamadınız mı?