// Norton Quiz Machine Version 2.0
// Released 3/16/01
// Written by Cliff Landesman; modified by Yaching Yu, J.Lucca and Cliff Landesman
// Revised by Cliff 7/18/01
// Revised by Cliff 9/24/01 Fixed 5.0 problem with line that strips out html for email. 
//  Improved function structure and removed a bug for Opera 5.12.
// Revised by Yaching 7/17/02. Uses CDONTS mailer.asp.
// Revised by Cliff 10/24/02. Automatically adjusts the maximum number of possible questions.
// Revised by Cliff 11/1/02. One line fixed to have style sheet apply to numbering of questions.
// Revised by Cliff 4/21/03. Modified line 104, adding escaped quotes.
// Revised by Cliff 3/26/04. Added hidden variables required for sending student responses to 
//  database. Added alt tags for images.
// Revised by Cliff 5/12/04. Revised for use with Gradebook. Added checkboxes, book number, chapter number.
// Revised by Cliff. Removed checkboxes.
// Revised by Alejandro 1/05.
// Revised by Cliff 2/10/05. Changed language regarding Gradebook.
// Revised by J.Lucca 3/8/05. Integrated histograms into gradebook. Added HISTOGRAM boolean.  
// Revised by Jack 3/13/05. Added background to histograms.  Also updated stylesheet to reflect this change
// Revised by Cliff 3/21/05. Modified URL for gradebook in PopUpGradebook()

// The code assumes the following external files:
// quiz_demo.htm (which sets up the frames, contains all the quiz content and calls this script)
// upper.htm
// upper2.htm
// lower.htm
// confirm.htm (usually located in the directory of htm pages for the site)
// quiz_styles.css
// ../images/begin_button.gif (called from lower.htm)
// ../images/quiz_title.gif
// ../images/send_quiz.gif
// ../images/next_question.gif

/**
 * Histogram toggle
 */
var HISTOGRAM = false

// All Gradebooks: General settings
var first_try = new Array(number_questions)
var alpha_count = new Array("a", "b", "c", "d", "e", "f", "g", "h", "i", "j")
var my_correct = 0
var my_wrong = 0
var current_q = 0
var answ_html = ""
var CSS_Path = "../../stylesheets/quiz_styles.css"
var Img_Path = "../../images/"
var PostURL="/college/nrl/gradebook/post.asp"


// HISTOGRAM: section/type arrays
var section_correct = new Array(0, 0, 0, 0, 0, 0, 0, 0, 0, 0)
var section_answered = new Array(0, 0, 0, 0, 0, 0, 0, 0, 0, 0)
var type_correct = new Array(0, 0, 0, 0, 0)
var type_answered = new Array(0, 0, 0, 0, 0)

// All Gradebooks: Used for collection score for uploading to database
var responses = new Array();

// All Gradebooks: Toggles/sets ordering of the questions
// Gradebook usually 'y' and histogram 'n'
var randomize_questions = (HISTOGRAM) ? "n" : "n"
randomize()

/** 
 * Use: Sets the order of the questions for the student. 
 * Either randomly order the questions from the pool 
 * or order questions w/o randomizing. 
 * Gradebook usually 'y' and histogram 'n'
 */
function randomize()
{
    order = new Array(number_questions)

    if (randomize_questions == "y")
    {
        pool = new Array(number_questions)
        no_remaining = number_questions

        // Fill the pool[] for use in random selection 
        for (i = 0; i < number_questions; i++)
        {
            pool[i] = i + 1
        }

        // Set order of questions by filling order[]
        for (i = 0; i < number_questions; i++)
        {
            // Get random number
            rand = Math.random() * (no_remaining - 1)
            rand = Math.round(rand)

            // Pick from pool and assign to order
            order[i] = pool[rand]

            // Repack pool[], skipping rand pick, and decrement no_remaining
            for (j = 0; j < (no_remaining - 1); j++)
            {
                if (j >= rand)
                {
                    pool[j] = pool[j + 1]
                }
            }

            no_remaining = (no_remaining - 1)
        }
    }
    else // Order questions without randomizing.
    {
        for (i = 0; i < number_questions; i++)
        {
            order[i] = i + 1;
        }
    }
}

/** 
 * Use: Determines if there are more questions to be answered
 * or if it's time to wrap up and present email fields. 
 *
 * write_upper_frame() is used in two ways:
 *  1) When a student clicks on begin & the quiz is first loaded, 
 * 		upper2.htm calls this function (only thing upper2 does) 
 *  
 *  2) Each time student clicks 'next question'
 */
function write_upper_frame()
{
    if (current_q < number_questions)
    {
        choices()
    }
    else
    {
    	  // If no more questions, present email fields.
        email()
    }

    // Make the lower frame blank.
    reset_lower()
}

/**
 * Use: Writes initial page. Shows intro text, number of questions. 
 * Allows student to select number of questions. 
 * Lower.htm calls this function 50 milliseconds after loading.
 */
function write_initial()
{
    upper.document.open()

    // Intro text, num questions
    upper.document.write("" + "<html><head>"
                            + "<link rel=\"stylesheet\" type=\"text/css\" href=\"" 
                            + CSS_Path + "\"></head><body>"
                            + "<FORM ACTION=\"null\" NAME=how_many METHOD=POST>\n"
                            + "<TABLE WIDTH=100% BORDER=0 cellpadding=10>\n"
                            + "<TR>\n"
                            + "<TD valign=\"top\"><INPUT NAME=\"NoQuestions\" TYPE=\"HIDDEN\" VALUE=\"" 
                            + number_questions + "\">\n"
                            + "<P class=\"text\">There are "
                            + "<span class=\"qnum\">"
                            + number_questions
                            + "</span>\n"
                            + " questions available for this quiz.<br><br>Answer feedback is immediate and often includes an explanation as to why a given answer is correct. You may select only one answer per question.<br><br>At the end of the quiz you may use the <a href=\"javascript:parent.PopUpGradebook()\">Norton Gradebook</a> to share your results with your professor and track your progress. "
                            + "<br><br>Select the number of questions you would like: </TD></TR></TABLE>\n"
                            + "<TABLE BORDER=0 cellpadding=0>\n"
                            + "<TR><td width=10>&nbsp;</td>\n")

    // Let student select number of questions. We don't offer more than are available.
    for (i = 1; i * 5 < number_questions; i++)
    {
        upper.document.write(""
                                 + "<TD><INPUT TYPE=radio NAME=how_many VALUE=\"" 
                                 + i * 5 
                                 + "\" onClick=\"parent.number_questions=" 
                                 + i * 5 
                                 + "\"></TD><TD class=\"ans\">"
                                 + i * 5 
                                 + "&nbsp;</TD>\n" + "")
    }

    // We do offer the maximum number available.
    upper.document.write(""
                             + "<TD><INPUT TYPE=radio NAME=how_many VALUE=\"" 
                             + number_questions 
                             + "\" onClick=\"parent.number_questions=" 
                             + number_questions 
                             + "\"></TD><TD class=\"ans\">"
                             + number_questions
                             + "&nbsp;</TD></TR>\n"
                             + "</TABLE>\n"
                             + "</FORM>"
                             + "</body></html>")

    upper.document.close()
}

/**
 * Use: Present multiple choice questions. 
 * Sets up onclick behavior to call 
 * 	score(shown_no, order[current_q], answer for each question)
 */
function choices()
{
    // Write top of page
    upper.document.open()
    upper.document.write("<html><head><link rel=\"stylesheet\" type=\"text/css\" href=\"" 
    						+ CSS_Path 
    						+ "\"></head><body><FORM ACTION=/%22null/%22 NAME=which_choices METHOD=POST target=\"_top\">\n"
                            + "<BR>")

    // Loop through questions
    upper.document.write("" + "<TABLE WIDTH=95% BORDER=0 CELLSPACING=0 CELLPADDING=2>")

    shown_no = current_q + 1

    // Question
    upper.document.write("" + "<TR>"      
    						+ "<TD VALIGN=\"top\" width=10% align=right class=\"qnum\">" 
    						+ shown_no
                            + ".</TD> \n" + "<TD COLSPAN=3 width=90% class=\"ques\">")

    question = "q" + order[current_q]
    question = eval(question)
    upper.document.write(question)

    upper.document.write("" + "<BR><BR></TD>\n" + "</TR>\n")

    // Loop through answers
    for (j = 0; j < (number_answers[order[current_q] - 1]); j++)
    {
    	// Radio button and alpha_count
        upper.document.write("" + "<TR>\n"
                                + "<TD width=10%>&nbsp;</TD>\n"
                                + "<TD VALIGN=\"top\" width=2% class=\"ans\">"
                                + "<INPUT TYPE=\"radio\" NAME=\"quest" 
                                + shown_no 
                                + "\" ONCLICK=\"parent.score(" 
                                + shown_no 
                                + "," + order[current_q] + "," + j + ")\"></TD>"
                                + "<TD class=\"ans\"><B>"
                                + alpha_count[j]
                                + ")</B></td><td width=95% class=\"ans\">")
                         
		// Answer      
        answer = "q" + order[current_q] + alpha_count[j]
        answer = eval(answer)
        upper.document.write(answer)
        upper.document.write("" + "</TD></TR>\n")
    }

    // Bottom of document
    upper.document.write("" + "</TABLE></FORM></BODY></HTML>\n")
    upper.document.close()
}

/**
 * Use: Last question has been answered. 
 * if HISTOGRAM true show histograms. 
 * All results posted to /college/nrl/gradebook/post.asp
 */
function email()
{
    my_score = (my_correct / number_questions) * 100
    my_score = Math.round(my_score);
    upper.document.open()

    if (HISTOGRAM)
    {
    	// Show histograms for this quiz
        histograms()
    }

    // Hidden form variables
    upper.document.write("" + "<HTML><HEAD><link rel=\"stylesheet\" type=\"text/css\" href=\""
                            + CSS_Path
                            + "\"></head><body><FORM ACTION=\"" + PostURL + "\" NAME=\"form1\" METHOD=POST target=\"_top\">"
                            + "<INPUT TYPE=\"HIDDEN\" NAME=\"final_page\" VALUE=\"" 
                            + parent.confirm + "\">"
                            + "<INPUT TYPE=\"HIDDEN\" NAME=\"book_title\" VALUE=\"" 
                            + parent.book_title + "\">"
                            + "<INPUT TYPE=\"HIDDEN\" NAME=\"book_no\" VALUE=\"" 
                            + parent.book_no + "\">"
                            + "<INPUT TYPE=\"HIDDEN\" NAME=\"chapter_no\" VALUE=\"" 
                            + parent.chapter_no + "\">"
                            + "<INPUT TYPE=\"HIDDEN\" NAME=\"answ\" VALUE=\"\">"
                            + "<INPUT TYPE=\"HIDDEN\" NAME=\"responses\" VALUE=\"\">"
                            + "<INPUT TYPE=\"HIDDEN\" NAME=\"number_questions\" VALUE=\"" 
                            + number_questions + "\">"
                            + "<INPUT TYPE=\"HIDDEN\" NAME=\"my_score\" VALUE=\"\">"
                            + "<INPUT TYPE=\"HIDDEN\" NAME=\"post_responses\" VALUE=\"true\">"
                            + "<INPUT TYPE=\"HIDDEN\" NAME=\"email_responses\" VALUE=\"false\">")
                            
	// Final text and email address text fields
    upper.document.write("" + "<BR><TABLE ALIGN=CENTER BORDER=0 CELLSPACING=7 CELLPADDING=0>"
                            + "<TR>"
                            + "<TD colspan=3 class=\"email\">"
                            + "Your Score: "
                            + my_score
                            + "% &nbsp; &nbsp;<A HREF=javascript:parent.show_answers()>Your Answers</A><BR><BR></TD>"
                            + "</TR>"
                            + "<TR>"
                            + "<TD colspan=3>Complete this form to share your results with your professor and track your progress. We will post to the <a href=\"javascript:parent.PopUpGradebook()\">Norton Gradebook</a> and email you a copy of the scored quiz.</TD>"
                            + "</TR>"
                            + "<TR>"
                            + "<TD class=\"email\" width=30%>First Name: </td>"
                            + "<TD><INPUT TYPE=TEXT NAME=first_name size=30></td>"
                            + "</TR>"
                            + "<TR>"
                            + "<TD class=\"email\" width=30%>Last Name: </TD>"
                            + "<TD><INPUT TYPE=TEXT NAME=last_name size=30></TD>"
                            + "</TR>"
                            + "<TR>"
                            + "<TD class=\"email\" width=30%>Your Email: </TD>"
                            + "<TD><INPUT TYPE=TEXT NAME=stu_email size=30></TD>"
                            + "<TD>&nbsp;</TD>"
                            + "</TR>"
                            + "<TR><TD class=\"email\" width=30%>Your Professor's Email: </TD>"
                            + "<TD><INPUT TYPE=TEXT NAME=prof_email size=30></TD>"
                            + "</TR>"
                            + "<TR>"
                            + "<TD class=\"email\" width=30%>Section: </TD>"
                            + "<TD><INPUT TYPE=TEXT NAME=section size=30></TD>"
                            + "<TD align=\"center\"><a href=javascript:parent.error_check()><img src=\""
                            + Img_Path
                            + "send_quiz.gif\" border=\"0\" alt=\"Send Quiz\"></a></TD>"
                            + "</TR>"
                            + "</TABLE></FORM></BODY></HTML>")

    upper.document.close()
    
    // Compile long results (transcript) of student answers, correct answers.
    // Used for email version to be sent out and future html transcript display in browser
    long_results()

    upper.document.form1.first_name.focus();
}

/**
 * Called when user clicks 'Your Answers' on last page of quiz.
 * email() function assembles the html for this page. 
 */
function show_answers()
{
    resultsWindow = window.open("", "resultsWindow", "width=400,height=400,scrollbars=yes,resizable=yes")
    resultsWindow.document.write(""
                                     + "<head><link rel=\"stylesheet\" type=\"text/css\" href=\"" + CSS_Path + "\"></head>"
                                     + "<body><p class=showansbd>Results:</p>"
                                     + "<P class=showans>Total number of questions: "
                                     + parent.number_questions
                                     + "<BR>Percent correct: "
                                     + my_score
                                     + "%"
                                     + answ_html
                                     + "<BR><BR><div align=\"center\"><INPUT TYPE=button onClick=\"window.close()\" VALUE=\"Close\"></div></body>")
}

/**
 * Use: Collect score for uploading to database. 
 * if HISTOGRAMs will update section and type counter arrays here.
 */
function score(shown_no, question_no, answer_no)
{
    correct = "q" + question_no + "answer"
    correct = eval(correct)
    choice = alpha_count[answer_no]
    review = "q" + question_no + "review"
    review = eval(review)
    repeat = "repeat = first_try[" + question_no + "]"
    repeat = eval(repeat)
    lower.document.open()

    if (HISTOGRAM)
    {
        // Update histogram main counter arrays 
        // that track section and types that have been answered
        section_number = "q" + question_no + "section"
        section_number = eval(section_number)
        type_number = "q" + question_no + "type"
        type_number = eval(type_number)
        section_answered[section_number] = section_answered[section_number] + 1
        type_answered[type_number] = type_answered[type_number] + 1
    }

    // Collect score for uploading to gradebook database
    response_no = shown_no - 1 // start with zero
    responses[response_no] = parent.book_no + ":" 
    							+ parent.chapter_no + ":" + question_no + ":" 
    							+ choice + ":" + correct

    // We record first try answer for locking radio button
    first_try[question_no] = answer_no   
    

    // Start score html page
    lower.document.write(""
                             + "<html><head><link rel=\"stylesheet\" type=\"text/css\" href=\"" 
                             + CSS_Path 
                             + "\"></head><body><TABLE WIDTH=100% border=0 CELLPADDING=8>")

    // Student gets only one try per question
    if (repeat || repeat == 0)
    {
        lower.document.write(""
                                 + "<TR><TD width=10%>&nbsp;</TD><TD class=\"guessing\" width=70%>Sorry, no second guessing.</TD>"
                                 + "<TD valign=top width=20%><A HREF=javascript:parent.write_upper_frame()><img name=\"next_question\" src=\"" 
                                 + Img_Path + "next_question.gif\" border=\"0\"></TD></TR>")

        // Lock radio button so it always shows first asnwer
        switch_radio = "upper.document.which_choices.quest" + shown_no + "[" + repeat + "].checked =true";
        eval(switch_radio)
    }
    else
    // This is the first try
    {
        if (correct == choice)
        {
        	// Correct answer!
            lower.document.write(""
                                     + "<TR><TD width=10%>&nbsp;</TD><TD class=\"review\" width=70%><span class=\"correct\">"
                                     + "Correct!</span><br>"
                                     + review
                                     + "</TD>"
                                     + "<TD valign=top width=20%><A HREF=javascript:parent.write_upper_frame()><img name=\"next_question\" src=\"" 
                                     + Img_Path + "next_question.gif\" border=\"0\"></TD></TR>")

            // Update student's total correct score.
            my_correct++

            if (HISTOGRAM)
            {
                // Update histogram 'correct answer' counter arrays 
                // that record correct section and type answers
                section_correct[section_number] = section_correct[section_number] + 1
                type_correct[type_number] = type_correct[type_number] + 1
            }
        }
        else
        {
            // Sorry, incorrect answer
            lower.document.write("" + "<TR><TD width=10%>&nbsp;</TD><TD class=\"review\" width=70%>"
                                    + "<span class=\"incorrect\">Sorry, but the correct answer is (<b>"
                                    + correct
                                    + "</b>).</span><br>"
                                    + review
                                    + "</TD>"
                                    + "<TD valign=top width=20%><A HREF=javascript:parent.write_upper_frame()><img name=\"next_question\" src=\"" 
                                    + Img_Path 
                                    + "next_question.gif\" border=\"0\"></TD></TR>")

            // Update student's total wrong score
            my_wrong++
        }   

		// Next question counter
        current_q++
    }

    lower.document.write("" + "</TABLE></body></html>")
    lower.document.close()
}

/**
 * Use: Gradebook and Histogram use identical function
 * Compile long results (transcript) of student answers, correct answers.
 * Prepares two versions:
 *  1) html version for future browser display when user clicks transcript.
 *		 html version is displayed from show_answers() function.
 *  2) email version for sending out
 */
function long_results()
{
    // Include answers.
    for (i = 0; i < number_questions; i++)
    {
        ques = "q" + order[i]
        ques = eval(ques)


        // Test for an answer
        if (first_try[order[i]] || first_try[order[i]] == 0)
        {
            letter = alpha_count[first_try[order[i]]]
            ans = "q" + order[i] + letter
            ans = eval(ans)
            letter = letter + ") "
        }
        else
        {
            letter = "No Answer"
            ans = " "
        }

        correct_ans = "q" + order[i] + "answer"
        correct_ans = eval(correct_ans)
        correct_ans_words = "q" + order[i] + correct_ans
        correct_ans_words = eval(correct_ans_words)

        // Create html version of results for presenting to browser.
        answ_html += "\n <p class=\"showans\"><span class=\"showansbd\">Question: </span>" + ques
        answ_html += "\n<BR><span class=\"showansbd\">Student answered: </span>" + letter + ans
        answ_html += "\n<BR><span class=\"showansbd\">Correct answer: </span>" + correct_ans + "\) " + correct_ans_words + "\n"

        // Create the email version for sending out.
        upper.document.form1.answ.value = upper.document.form1.answ.value + "\nQuestion: " + ques
        upper.document.form1.answ.value = upper.document.form1.answ.value + "\nStudent answered: " + letter + ans
        upper.document.form1.answ.value = upper.document.form1.answ.value + "\nCorrect answer is: " + correct_ans + "\) " + correct_ans_words + "\n"
    }

    upper.document.form1.my_score.value = my_score

    // Delete all html tags when writing answers for email.
    // We can't use ? for nongreedy pattern matching because it trips up IE 5.0.
    // We search for > and < instead.

    if (window.RegExp)
    {
        upper.document.form1.answ.value = upper.document.form1.answ.value.replace(/\<[^<]*\>([^<>]*)\<[^>]*\>/g, "$1")
    }

    upper.document.form1.answ.value = upper.document.form1.answ.value + "\n"

    // GRADEBOOK: Update responses for uploading to database.
    // upper.document.form1.responses.value=responses
    upper.document.form1.responses.value = responses
}

/** 
 * Use: Checks that student has filled required fields. Called from email()
 * Then prepare to email.
 */
function error_check()
{
    var error_msg = "-1"
    var error_code = -1

    // GRADEBOOK: We alway send to gradebook, but never to professor.
    var pass_checkbox = 1

    // These 2 lines were commented out in the original quiz_gradebook.js. 
    // if(upper.document.form1.email_responses.checked) {pass_checkbox=1}
    // if(upper.document.form1.post_responses.checked) {pass_checkbox=1}   

    // Get student name
    var stu_name = upper.document.form1.first_name.value + " " + upper.document.form1.last_name.value

    while (error_code == -1)
    {
        if (upper.document.form1.first_name.value == '')
        {
            // GRADEBOOK: Error with first name
            error_code = 1
            error_msg = "You are required to enter your first name."
            break;
        }

        if (upper.document.form1.last_name.value == '')
        {
            // GRADEBOOK: Error with last name    
            error_code = 2
            error_msg = "You are required to enter your last name."
            break;
        }

        if (upper.document.form1.stu_email.value == '')
        {
            // BOTH: Error with student email
            error_code = 3
            error_msg = "You are required to enter your email addresses."
            break;
        }

        if (upper.document.form1.prof_email.value == '')
        {
            // BOTH: Error with prof. email   
            error_code = 4
            error_msg = "You are required to enter your professors\'s email addresses."
            break;
        }

        if (pass_checkbox == 0)
        {
            // GRADEBOOK: Student didn't check either the email or the gradebook checkbox
            error_code = 5
            error_msg = "You are required to check one of the checkboxes."
            break;
        }

        // If we got here, no errors 
        error_code = 0
    }

    // Display outcome
    if (error_code == 0)
    {
        // No errors, email header
        upper.document.form1.answ.value = "\nPercent correct: " 
        									+ my_score + "%\n\n" 
        									+ upper.document.form1.answ.value
        									
        upper.document.form1.answ.value = "\nNumber of questions: " 
        									+ parent.number_questions  
            								+ upper.document.form1.answ.value
            								
        upper.document.form1.answ.value = "\nStudent's email: " 
        									+ upper.document.form1.stu_email.value 
        									+ upper.document.form1.answ.value
        									
        upper.document.form1.answ.value = "\nStudent's name: " 
        									+ stu_name 
        									+ upper.document.form1.answ.value
        									
        upper.document.form1.answ.value = "\nQuiz name: " 
        									+ parent.book_title 
        									+ upper.document.form1.answ.value
        									
        upper.document.form1.submit()
    }
    else
    {
        // BOTH: Display error message in lower frame
        lower.document.open()
        lower.document.write("<head><link rel=\"stylesheet\" type=\"text/css\" href=\"" 
        						+ CSS_Path + "\"></head><body><div align=\"center\"><p class=\"error\">Error: <span class=\"text\">"
                                + error_msg
                                + "</span></p></div></body>")
        lower.document.close()
    }
}

/**
 * Use: Blank out lower frame. Called from write_upper_frame() 
 */
function reset_lower()
{
    lower.document.open()
    lower.document.write("<head><link rel=\"stylesheet\" type=\"text/css\" href=\"" 
    						+ CSS_Path + "\"></head><body>&nbsp;</body>")
    my_score = (my_correct / number_questions) * 100
    my_score = Math.round(my_score)
    lower.document.close()
}

/**
 * Use: Function is used for linking to the Gradebook.
 */
function PopUpGradebook()
{
    win = window.open("/college/nrl/gradebook/", "Gradebook",
                      'status=no,scrollbars=yes,toolbar=no,resizable=yes,width=800,height=600');
    win.focus();
}

/**
 * Use: After last question answered email() function calls histograms()
 * for histogram quizzes only. 
 */
function histograms()
{
    labels = new Array("", "A", "B", "C", "D", "E", "F", "G", "H", "I", "J");
    upper.document.write("" + "<center><span class=\"qnum\">Your Total Score: "
                            + my_score
                            + "%</center></span>"
                            +

    // We print the headers.
                             "<BR><BR><table border=0 cellpadding=8>" + // start table 1
                             "<tr><td  bgcolor=\"#efefef\" class=\"correct\"><b>Sections:</b></td><td bgcolor=\"#efefef\" class=\"correct\"><b>Types:</b></td></tr>"
                            +

    // We print the Section titles and data.
                             "<tr><td valign=top><table border=0>") // start table 2.0

    for (i = 1; i < section_title.length; i++)
    {
        upper.document.write("" + "<tr><td class=\"correct\">"    + labels[i]
                                + ")</td><td class=\"correct\">"  + parent.section_title[i]
                                + "  </td><td class=\"correct\">" + section_correct[i]
                                + " out of "                      + section_answered[i]
                                + "</td></tr>")
    }

    upper.document.write(""
                             + "</table></td><td valign=top class=\"correct\"><table border=0>") // end table 2.0; start table 2.1

    // We print the Type titles and data. 
    for (i = 1; i < type_title.length; i++)
    {
        upper.document.write("" + "<tr><td class=\"correct\">"    + labels[i]
                                + ")</td><td class=\"correct\">"  + parent.type_title[i]
                                + "  </td><td class=\"correct\">" + type_correct[i]
                                + " out of "                      + type_answered[i]
                                + "</td></tr>")
    }

    upper.document.write("" + "</table></td></tr>") // end table 2.1

    // We print the Sections histogram.
    upper.document.write("" + "<tr><td><table border=0 cellpadding=0><tr><td>"
                            +                          // start table 2.2
                             "<table cellpadding=0>" + // start table 3.0
                             "<tr><td><img src=" 
                            + Img_Path 
                            + "spacer.gif></td><tr>"
                            + "<tr><td valign=bottom><img src=" 
                            + Img_Path 
                            + "axis.gif height=200></td><tr>"
                            + "</table></td>")         // end table 3.0

    for (i = 1; i < section_title.length; i++)
    {
        section_percent = section_correct[i] / section_answered[i];
        section_height = section_percent * 200;
        upper.document.write(""
                                 + "<td valign=bottom><table cellpadding=0><tr><td><img src=" 
                                 + Img_Path 
                                 + "spacer.gif></td></tr><tr><td class=histogramBar width=15 height=" 
                                 + section_height 
                                 + "><img src=" 
                                 + Img_Path 
                                 + "spacer.gif></td></tr></table></td>")
    } // start/end tables 3.1 

    // We add the Section labels.
    upper.document.write("" + "</tr><tr><td>&nbsp;</td>")

    for (i = 1; i < section_title.length; i++)
    {
        upper.document.write("" + "<td height=20 align=middle class=\"correct\">" 
        						+ labels[i] + "</td>")
    }

    upper.document.write("" + "</tr></table>"
                            + // end table 2.2 
                             "</td><td>" +

    // We print the Type histogram.
    						 // start table 2.3
                             "<table border=0 height=200 cellpadding=0><tr><td>"
                             // start table 3.2
                             + "<table cellpadding=0>" 
                             + "<tr><td><img src=" 
                             + Img_Path 
                             + "spacer.gif></td><tr>"
                             + "<tr><td valign=bottom><img src=" 
                             + Img_Path + "axis.gif height=200></td><tr>"
                             // end table 3.2 
                             + "</table></td>")

    for (i = 1; i < type_title.length; i++)
    {
        type_percent = type_correct[i] / type_answered[i];
        type_height = type_percent * 200;
        upper.document.write("" + "<td valign=bottom><table cellpadding=0><tr><td class=histogramBar width=15 height=" 
        						+ type_height + "><img src=" 
        						+ Img_Path 
        						// start/end tables 3.3
        						+ "spacer.gif></td></tr></table></td>") 
    }

    // We add the Type labels.
    upper.document.write("" + "</tr><tr><td>&nbsp;</td>")

    for (i = 1; i < type_title.length; i++)
    {
        upper.document.write("" + "<td class=\"correct\" height=20 align=middle>" + labels[i] + "</td>")
    }

    upper.document.write("" + "</tr></table></td></tr></table>") // end table 2.3 and 1
}                                                                // End of histogram function.
