/* built with Studio Sketchpad: 
 *   https://sketchpad.cc
 * 
 * observe the evolution of this sketch: 
 *   https://studio.sketchpad.cc/sp/pad/view/ro.KOL$pf5i9IP/rev.12868
 * 
 * authors: 
 *   Jeff Bauer

 * license (unless otherwise specified): 
 *   creative commons attribution-share alike 3.0 license.
 *   https://creativecommons.org/licenses/by-sa/3.0/ 
 */ 



/*
 
Tic Tac Toe
by Jeff Bauer
 
*/
 
background(255);
 
size(300, 300);
 
mark = ["X", "O"];
 
var buttons = [];
 
var markedX = [];
 
var markedO = [];

var playing = true;
 
// draw the grid
var drawGame = function() {
    line(125, 75, 125, 225);
    line(175, 75, 175, 225);
    line(75, 125, 225, 125);
    line(75, 175, 225, 175);
}
 
var drawWin = function() {
    // background(0, 0, 0);
    textSize(20);
    fill(0);
    textAlign(CENTER, TOP);
    text("3 X's in a row!", width/2, 20);
    playing = false;
}
 
var drawGameOver = function() {
    // background(0, 0, 0);
    textSize(20);
    fill(0);
    textAlign(CENTER, TOP);
    text("3 O's in a row!", width/2, 20);
    playing = false;
}
 
var drawTie = function() {
    // background(0, 0, 0);
    textSize(20);
    fill(0);
    textAlign(CENTER, TOP);
    text("It's a draw!", width/2, 20);
    playing = false;
}
 
drawGame();
 
var Button = function(x, y, row, col) {
    this.x = x || 0;
    this.y = y || 0;
    this.row = row || 0;
    this.col = col || 0;
    this.width = 50;
    this.height = 50;
    this.label = "";
    this.onClick = function() { 
       fill(0, 0, 0);
       textSize(50);
       textAlign(CENTER, CENTER);
       text(mark[0], this.x+this.width/2, this.y+this.height/2);
       this.label = mark[0];
    };
};
 
Button.prototype.isMouseInside = function() {
    return mouseX > this.x &&
           mouseX < (this.x + this.width) &&
           mouseY > this.y &&
           mouseY < (this.y + this.height);
};
 
Button.prototype.handleMouseClick = function() {
    if (this.isMouseInside()) {
        if (playing) {
            this.onClick();
            pos = buttons.indexOf(this);
            markedX.push(buttons[pos]);
            buttons.splice(pos, 1);
            if(checkVictoryX()) {
                drawWin();
            } 
            if(markedX.length + markedO.length < 9) {
                compMove();
            }
            if(checkVictoryO()) {
                drawGameOver();
            } 
            if(markedX.length + markedO.length == 9) {
                drawTie();
            }
        }
    }
};
 
for(var x = 0; x < 3; x++) {
    for(var y = 0; y < 3; y++) {
        buttons.push(new Button(x * 50 + 75, y * 50 + 75, y, x));
    }
}
 
mouseClicked = function() {
    for(i = 0; i < buttons.length; i++) {
        buttons[i].handleMouseClick();
    }
};
 
// Easy
 
var compMove = function() {
    var r = random(buttons.length);
    r = floor(r);
    fill(0, 0, 0);
    textSize(50);
    textAlign(CENTER, CENTER);
    text(mark[1], buttons[r].x+buttons[r].width/2, buttons[r].y+buttons[r].height/2);
    buttons[r].label = mark[1];
    markedO.push(buttons[r]);
    buttons.splice(r, 1);
};
 
 
// Hard
/*
var compMove = function() {
    if(markedX < 2) {
        var r = random(buttons.length);
        r = floor(r);
        fill(0, 0, 0);
        textSize(50);
        textAlign(CENTER, CENTER);
        text("O", buttons[r].x+buttons[r].width/2, buttons[r].y+buttons[r].height/2);
        markedO.push(buttons[r]);
        buttons.splice(r, 1);
    } else if( 
};
*/
 
var sortX = function(ar) {
    ar.sort(function(a, b) {
        return a.x - b.x;
    });
}
 
var sortY = function(ar) {
    ar.sort(function(a, b) {
        return a.y - b.y;
    });
}
 
var checkVictoryX = function() {
    var row0 = 0;
    var row1 = 0;
    var row2 = 0;
    var col0 = 0;
    var col1 = 0;
    var col2 = 0;
    var diagTL = 0;
    var diagTR = 0;
    for(var i = 0; i < markedX.length; i++) {
        if(markedX[i].row == 0) {
            row0++;
            if(markedX[i].col == 0) {
                diagTL++;
            }
            if(markedX[i].col == 2) {
                diagTR++;
            }
            if(diagTL > 2) {
                return true;
            }
            if(diagTR > 2) {
                return true;
            }
            if(row0 > 2) {
                return true;
            }
        } else if(markedX[i].row == 1) {
            row1++;
            if(markedX[i].col == 1) {
                diagTL++;
                diagTR++;
            }
            if(diagTL > 2) {
                return true;
            }
            if(diagTR > 2) {
                return true;
            }
            if(row1 > 2) {
                return true;
            }
        } else if(markedX[i].row == 2) {
            row2++;
            if(markedX[i].col == 2) {
                diagTL++;
            }
            if(markedX[i].col == 0) {
                diagTR++;
            }
            if(diagTL > 2) {
                return true;
            }
            if(diagTR > 2) {
                return true;
            }
            if(row2 > 2) {
                return true;
            }
        } 
        if(markedX[i].col == 0) {
            col0++;
            if(col0 > 2) {
                return true;
            }
        } else if(markedX[i].col == 1) {
            col1++;
            if(col1 > 2) {
                return true;
            }
        } else if(markedX[i].col == 2) {
            col2++;
            if(col2 > 2) {
                return true;
            }
        }  
    }
    return false;
}
 
var checkVictoryO = function() {
    var row0 = 0;
    var row1 = 0;
    var row2 = 0;
    var col0 = 0;
    var col1 = 0;
    var col2 = 0;
    var diagTL = 0;
    var diagTR = 0;
    for(var i = 0; i < markedO.length; i++) {
        if(markedO[i].row == 0) {
            row0++;
            if(markedO[i].col == 0) {
                diagTL++;
            }
            if(markedO[i].col == 2) {
                diagTR++;
            }
            if(diagTL > 2) {
                return true;
            }
            if(diagTR > 2) {
                return true;
            }
            if(row0 > 2) {
                return true;
            }
        } else if(markedO[i].row == 1) {
            row1++;
            if(markedO[i].col == 1) {
                diagTL++;
                diagTR++;
            }
            if(diagTL > 2) {
                return true;
            }
            if(diagTR > 2) {
                return true;
            }
            if(row1 > 2) {
                return true;
            }
        } else if(markedO[i].row == 2) {
            row2++;
            if(markedO[i].col == 2) {
                diagTL++;
            }
            if(markedO[i].col == 0) {
                diagTR++;
            }
            if(diagTL > 2) {
                return true;
            }
            if(diagTR > 2) {
                return true;
            }
            if(row2 > 2) {
                return true;
            }
        } 
        if(markedO[i].col == 0) {
            col0++;
            if(col0 > 2) {
                return true;
            }
        } else if(markedO[i].col == 1) {
            col1++;
            if(col1 > 2) {
                return true;
            }
        } else if(markedO[i].col == 2) {
            col2++;
            if(col2 > 2) {
                return true;
            }
        } 
    }
    return false;
}