//// 
// variables for browser-specifics
///
var isDOM = (document.getElementById ? true : false); 
var isIE4 = ((document.all && !isDOM) ? true : false);	
var isNS4 = (document.layers ? true : false);

///
// variables for building/checking table
///
var least = 0;
var greatest = 0;
var tries = 0;

///
// utility function to get elements by their id
///
function getWithID(id) {
	if (isDOM) return document.getElementById(id);
	if (isIE4) return document.all[id];
	if (isNS4) return document.layers[id];
}

function buildTable() {
	least = parseInt( prompt("What is the smallest multiplier for this drill?", ""));
	greatest = parseInt( prompt("What is the greatest multiplier for this drill?", ""));
    if( greatest < least ) { // swap them, entered in wrong order
        var tmp = least;
        least = greatest;
        greatest = tmp;
    }
	
	document.write('<center>Complete the following table and click on the "Check" button to determine how you did.</center>');
	document.write('<table border="1" style="table-layout:fixed; border-collapse:collapse;" >');

	document.write('<tr><th style="text-align:center"><b>X</b></th>');
    ////
    // the top row 
    ////
    for(var ii=least; ii<=greatest; ii++) {
        document.write('<th style="text-align:center">' + ii + '</th>');
    }
    document.write('</tr>\n');

    for(var ii=least; ii<=greatest; ii++) {
        document.write('<tr><th style="text-align:center">' + ii + '</th>');
        for(var mm=least; mm<=greatest; mm++) {
            document.write('<td style="text-align:right"><input id="' + ii + 'x' + mm + '" type="text" length="5" style="text-align:left" ></td>');
        }
        document.write('</tr>');
    }

    document.write('</table>\n');

    document.write('<input type="button" value="Check" onclick="checkAnswers()">\n');
    document.write('<div id="tries">Attempts: ___  Number Wrong: ____</div>\n');
}

function checkAnswers() {
    var inKorrect = 0;
    tries++;
    for(var ii=least; ii<=greatest; ii++) {
        for(var mm=least; mm<=greatest; mm++) {
            var strId = '' + ii + 'x' + mm;
            var corr = ii * mm;
            if( getWithID( strId ) ) {
                if( parseInt( getWithID(strId).value ) == corr ) { // correct answer
                    getWithID(strId).style.backgroundColor = 'white';
                } else { // incorrect answer
                    getWithID(strId).style.backgroundColor = 'red';
                    inKorrect++;
                }
            }
        }
    }
    
    if( getWithID('tries') ) {
        getWithID('tries').innerHTML = 'Attempts: <u>' + tries + '</u> Number Wrong: <u>' + inKorrect + '</u>';
    }

    if( inKorrect > 0 ) {
        alert('You got ' + inKorrect + ' wrong.  The wrong answers are marked in red or blank.');
    } else {
        if( tries < 2 )
            alert('You got them all right on the first try! Tell Mom and Dad to come and see!');
        else
            alert('After ' + tries + ' tries, you got them all right!  Tell Mom and Dad to come and see!');
    }
}