///////////////////////////////////////////////////////////////////////////////////////////////////////////////////////////////////////////////////
// Bar Graph Functions.
///////////////////////////////////////////////////////////////////////////////////////////////////////////////////////////////////////////////////

// Write an empty row to the current table.
function WriteEmptyTableRow()
{
    document.writeln("<tr>");
    WriteEmptyTableCell(1);
    document.writeln("</tr>");
}

// Write an empty cell to the current table.
// nNumSpaces: Number of non-breaking spaces the cell should contain.
function WriteEmptyTableCell(nNumSpaces)
{
    document.write("<td>");
    for (var i = 0; i < nNumSpaces; i++)
        document.write("&nbsp;");
    document.writeln("</td>");
}

// Write a bar graph to the current document.
// szTitle: String title of the graph.
// szYAxisName: String name/label for the y-axis.
// szXAxisName: String name/label for the x-axis.
// szaPoints: Array of numbers such that f(i) = szaPoints[i].
// szaHeight: Height, in pixels, of the the highest bar.
function RenderBarGraph(szTitle, szYAxisName, szXAxisName, nPoints, szaHeight)
{
	// Find the maximum and minimum value among the points and use this to scale the graph.
	var MIN_POINT_VALUE = nPoints[0];
	var MAX_POINT_VALUE = nPoints[0];
    for (var i = 0; i < nPoints.length; i++)
	{
	    MIN_POINT_VALUE = Math.min(MIN_POINT_VALUE, nPoints[i]);
		MAX_POINT_VALUE = Math.max(MAX_POINT_VALUE, nPoints[i]);
	}
	var UNIT_HEIGHT = szaHeight / (MAX_POINT_VALUE - MIN_POINT_VALUE);
    
    // Variables for formatting.
    var NUM_COLUMNS = nPoints.length + 2;
    
	// Begin the table.
    document.writeln("<table border='0' cellspacing='0' cellpadding='0'>");

    // Spacing.
    WriteEmptyTableRow();
    
    // Write the title.
    document.writeln("    <tr align='center'>");
    document.writeln("        <td colspan='" + NUM_COLUMNS + "'>");
    document.writeln(             szTitle);
    document.writeln("        </td>");
    document.writeln("    </tr>");
    
    // Write the Y-Axis Label.
    document.writeln("    <tr align='center'>");
                              WriteEmptyTableCell(2);
    document.writeln("        <td valign='center'>");
    for (var i = 0; i < szYAxisName.length; i++)
        document.write(szYAxisName.charAt(i) + "&nbsp;<br />");
    document.writeln("");
    document.writeln("        </td>");
    
    // Draw the actual graph.
    for (var i = 0; i < nPoints.length; i++)
    {
        var height = UNIT_HEIGHT * (nPoints[i] - MIN_POINT_VALUE);

        document.write("<td valign='bottom'>");

        if (i == 0)
        {
            document.write(nPoints[i] + "<br /><img src='Code/Blue Square.jpg' " + 
                                                   "height='" + height + "' " +
                                                   "width='55'>");
        }
        else
        {
            document.write(nPoints[i] + "<br /><img src='Code/Red Square.jpg' " + 
                                                   "height='" + height + "' " +
                                                   "width='55'>");
        }

        document.writeln("</td>");
    }
    WriteEmptyTableCell(2);
    document.writeln("    </tr>");
    
    // Write the X-Axis Scale.
    document.writeln("    <tr align='center'>");
                              WriteEmptyTableCell(2);
                              WriteEmptyTableCell(1);
    for (var i = 0; i < nPoints.length; i++)
        document.writeln("<td>" + i + "</td>");
    document.writeln("    </tr>");
    
    // Write the X-Axis Label.
    document.writeln("    <tr align='center'>");
                              WriteEmptyTableCell();
    document.writeln("        <td colspan='" + NUM_COLUMNS + "'>");
    document.writeln(             szXAxisName);
    document.writeln("        </td>");
    document.writeln("    </tr>");
    
    // Spacing.
    WriteEmptyTableRow();
    
    document.writeln("</table>");
}