/* Author:

*/

$.fn.center = function () {
    this.css("position","absolute");
    this.css("top", (($(window).height() - this.outerHeight()) / 2) + $(window).scrollTop() + "px");
    this.css("left", (($(window).width() - this.outerWidth()) / 2) + $(window).scrollLeft() + "px");
};

var getViewport = (function(){

         var viewportwidth;
         var viewportheight;

 // the more standards compliant browsers (mozilla/netscape/opera/IE7) use window.innerWidth and window.innerHeight

 if (typeof window.innerWidth != 'undefined')
 {
      viewportwidth = window.innerWidth,
      viewportheight = window.innerHeight
 }

// IE6 in standards compliant mode (i.e. with a valid doctype as the first line in the document)

 else if (typeof document.documentElement != 'undefined'
     && typeof document.documentElement.clientWidth !=
     'undefined' && document.documentElement.clientWidth != 0)
 {
       viewportwidth = document.documentElement.clientWidth,
       viewportheight = document.documentElement.clientHeight
 }

 // older versions of IE

 else
 {
       viewportwidth = document.getElementsByTagName('body')[0].clientWidth,
       viewportheight = document.getElementsByTagName('body')[0].clientHeight
 }
        jQuery('body').css({ 'min-height' : viewportheight-25 });
        return { 'width' : viewportwidth-25, 'height' : viewportheight-25 };
});

var jChess = (function() {
        jChess.player();
});

jChess.currentColor = (function(lightSquares, darkSquares, currentColor) {
        if (!currentColor) { var currentColor = lightSquares } else {
        (currentColor === lightSquares) ? currentColor = darkSquares : currentColor = lightSquares;
        }
        return currentColor;
});

jChess.board = (function(elementSize, lightSquares, darkSquares, borderColor) {
        this.column = ['a', 'b', 'c', 'd', 'e', 'f', 'g', 'h'];
        this.row    = ['1', '2', '3', '4', '5', '6', '7', '8'];
        jQuery('body').append('<div id="jChessBoard"></div>').css({'overflow-y' : 'hidden'});
        jQuery('#jChessBoard').css({'width' : elementSize, 'height' : elementSize, 'background-color' : borderColor, 'border-radius' : '15px' }).center();
        var squareSize = elementSize / 8;
        elementSize -= 3;
        squareSize = Math.floor(squareSize-5);
        var currentColor = lightSquares;
        var squares = [new Array(), new Array(), new Array(), new Array(), new Array(), new Array(), new Array(), new Array()];
        var board = new jChess.drawCanvas('#jChessBoard', 'jChessBoardCanvas', elementSize);
        if (this.playerColor === "White") {
              var c=0; clen=this.column.length; while (c<clen) {
                        var posY = (elementSize)-((c+1)*squareSize)-20;
                        currentColor = jChess.currentColor(lightSquares, darkSquares, currentColor);
                                var r=0; rlen=this.row.length; while (r<rlen) {
                                posX = (r*squareSize)+20;
                                squares[c][r] = new jChess.square(this.column[r], this.row[c], board, elementSize, squareSize, posX, posY, lightSquares, darkSquares, currentColor, borderColor);
                                currentColor = jChess.currentColor(lightSquares, darkSquares, currentColor);
                                r++;
                        };
                board.draw.font = "bold 10px sans-serif";
                board.draw.fillStyle = "#fff";
                board.draw.fillText(this.row[c], 10, posY+(squareSize/2)+6);
                board.draw.fillText(this.row[c], elementSize-15, posY+(squareSize/2)+6);
                board.draw.fillText(this.column[7-c], (posX-(c*squareSize)+squareSize/2), elementSize-6);
                board.draw.fillText(this.column[7-c], (posX-(c*squareSize)+squareSize/2)-5, 15);
                c++;
                };
        } else if (this.playerColor === "Black") {
                var c=0; clen=this.column.length; while (c<clen) {
                        var posY = (c*squareSize)+20;
                        currentColor = jChess.currentColor(lightSquares, darkSquares, currentColor);
                        var r=0; rlen=this.row.length; while (r<rlen) {
                                posX = (elementSize)-((r+1)*squareSize)-20;
                                squares[c][r] = new jChess.square(this.column[r], this.row[c], board, elementSize, squareSize, posX, posY, lightSquares, darkSquares, currentColor, borderColor);
                                currentColor = jChess.currentColor(lightSquares, darkSquares, currentColor);
                                r++;
                        };
                board.draw.font = "bold 10px sans-serif";
                board.draw.fillStyle = "#fff";
                board.draw.fillText(this.row[c], 10, posY+(squareSize/2)+6);
                board.draw.fillText(this.row[c], elementSize-15, posY+(squareSize/2)+6);
                board.draw.fillText(this.column[c], (posX+(c*squareSize)+squareSize/2)-5, elementSize-6);
                board.draw.fillText(this.column[c], (posX+(c*squareSize)+squareSize/2)-5, 15);
                c++;
                };
        } else {
                alert('Player color not set!');
        };
        return;
});

jChess.player = (function() {
        this.playerColor = "Black";
        jChess.sizeBoard(this.playercolor);
});
jChess.square = (function(squareColumn, squareRow, boardCanvas, elementSize, squareSize, posX, posY, lightSquares, darkSquares, currentColor, borderColor){
        this.ID = squareColumn+squareRow;
        this.posX               = posX;
        this.posY               = posY;
        var board              = boardCanvas;
//     var square = new jChess.drawCanvas('#jChessBoard', this.ID, squareSize, posX, posY);
//        jQuery('#'+this.ID).css({'background-color' : currentColor, 'border' : '1px solid '+borderColor, 'position' : 'absolute', 'left' : this.posX, 'top' : this.posY});
        board.draw.fillStyle = currentColor;
        board.draw.fillRect(posX, posY, squareSize, squareSize);
        board.draw.fillStyle = borderColor;
        board.draw.strokeRect(posX, posY, squareSize, squareSize);
        currentColor = jChess.currentColor(lightSquares, darkSquares, currentColor);
        });

jChess.drawCanvas = (function(targetElementID, createdElementID, elementSize, posX, posY){
        this.targetElementID    = targetElementID;
        this.createdElementID   = createdElementID;
        this.elementSize        = elementSize;
        this.element            = document.createElement('canvas');
        this.draw               = this.element.getContext('2d');
        jQuery(this.element)
                .appendTo(this.targetElementID)
                .attr({'id' : this.createdElementID, 'width' : this.elementSize, 'height' : this.elementSize})
                .text('Browser doesn\'t support canvas.');
});

jChess.sizeBoard = (function(){
        var lightSquares = "#eee";
        var darkSquares = "#999";
        var borderColor = "#333";
        var vp = getViewport();
        (vp.width >= vp.height) ? elementSize = vp.height : elementSize = vp.width;
        jQuery('#jChessBoard').remove();
        jChess.board(elementSize, lightSquares, darkSquares, borderColor);
});

$(document).ready(function() {
        var game = new jChess();
});

var doit;
$(window).resize(function() {
        clearTimeout(doit);
        doit = setTimeout(function(){jChess.sizeBoard();},200);
});