colorizedTable

window.onload = function (){

    var tableCreate = function (tableRowsCols, tdWidth, tdHeight) {

        if (tableRowsCols < 3 || tableRowsCols % 2 === 0) {
            tableRowsCols += 1;
        }

        var body = document.getElementsByTagName('body')[0],
            table = document.createElement('table'),
            mytablebody = document.createElement("tbody");

        table.style.width = tdWidth * tableRowsCols + "px";

        // creating all cells
        for(var j = 0; j < tableRowsCols; j++) {
            var mycurrent_row = document.createElement("tr");
            for(var i = 0; i < tableRowsCols; i++) {
                mycurrent_cell = document.createElement("td");
                // creates a Text Node
                // currenttext = document.createTextNode(j + ' ' + i + ' ');
                currenttext = document.createTextNode(' ');
                // appends the Text Node we created into the cell <td>
                mycurrent_cell.appendChild(currenttext);
                // appends the cell <td> into the row <tr>
                mycurrent_cell.style.width = tdWidth + 'px';
                mycurrent_cell.style.height = tdHeight + 'px';

                if (j === i || (i+j+1) === tableRowsCols) {
                    mycurrent_cell.style.background = 'red';
                } else {
                    if (j < i && (i+j+1) < tableRowsCols) {
                        mycurrent_cell.style.background = 'blue';
                    }
                    if (j < i && (i+j+1) > tableRowsCols) {
                        mycurrent_cell.style.background = 'grey';
                    }
                    if (j > i && (i+j+1) > tableRowsCols) {
                        mycurrent_cell.style.background = 'black';
                    }
                    if (j > i && (i+j+1) < tableRowsCols) {
                        mycurrent_cell.style.background = 'pink';
                    }
                }

                mycurrent_row.appendChild(mycurrent_cell);
            }
            // appends the row <tr> into <tbody>
            mytablebody.appendChild(mycurrent_row);
        }
        // appends <tbody> into <table>
        table.appendChild(mytablebody);
        body.appendChild(table);
    };

    tableCreate(12, 50, 50);
}