function initialize_body()
{
    var myDropdowns = array_elements_by_name_with_className( "div", "dropdown" );
    apply_to_array( myDropdowns, initialize_dropdown );
    
    var myButtons = array_elements_by_name_with_className( "input", "toggle_dropdowns" ); 
    apply_to_array( myButtons, initialize_button ); 

    var myTimestamps = array_elements_by_name_with_className( "p", "timestamp" );
    apply_to_array( myTimestamps, set_timestamp );  
}

//---------------------  timestamps --------------------------

function set_timestamp( givenElement )
{
    var myDate = new Date( document.lastModified );
    var myYear = myDate.getFullYear();
    var myMonth = monthName( myDate.getMonth() );
    var myDay = dayName( myDate.getDay() );
    var myDate = myDate.getDate();
    var myString = "This page was last updated on " + myDay + ", " + myMonth + " " + myDate + ", " + myYear + " ";
    givenElement.innerHTML = myString + givenElement.innerHTML;
}
function monthName( monthNumber )
{
    var months = new Array( "January", "February", "March", "April", "May", "June", "July", "August", "September", "October", "November", "December" );
    return months[ monthNumber ];
}
function dayName( dayNumber )
{
    var days = new Array( "Sunday", "Monday", "Tuesday", "Wednesday", "Thursday", "Friday", "Saturday" );
    return days[ dayNumber ];
}

//---------------------  dropdowns --------------------------

function initialize_dropdown( givenDropdown )
{
    var myHead = first_child_with_className( givenDropdown, "dropdown_header" );
    myHead.onclick = function() { toggle_dropdown( givenDropdown ) };
    myHead.onmouseover = function() { highlight_dropdown( givenDropdown ) };
    myHead.onmouseout = function() { un_highlight_dropdown( givenDropdown ) };
    
    var myCaption = "click the header to close this item";
    
    var myBody = first_child_with_className( givenDropdown, "dropdown_body" );
    if( myBody != null )
    {
        close_dropdown( givenDropdown );
        make_caption( myBody, myCaption );
    }
    
    var openedDropdown = first_child_with_className( givenDropdown, "dropdown_open" );
    if( openedDropdown != null )
    {
        make_caption( openedDropdown, myCaption );
    }
}
function toggle_dropdown( givenDropdown )
{
    var closedChild = first_child_with_className( givenDropdown, "dropdown_closed" );
    var openChild = first_child_with_className( givenDropdown, "dropdown_open" );
    if( closedChild != null )
    {
        closedChild.className = "dropdown_open";
    }
    else if( openChild != null )
    {
        openChild.className = "dropdown_closed";
    }
    else alert( "can not toggle the element " + givenDropdown.outerHTML );
}
function open_all_dropdowns()
{
    var myDropdowns = array_elements_by_name_with_className( "div", "dropdown" );
    apply_to_array( myDropdowns, open_dropdown );
}
function open_dropdown( givenDropdown )
{
    var closedChild = first_child_with_className( givenDropdown, "dropdown_closed" );
    if( closedChild == null ) closedChild = first_child_with_className( givenDropdown, "dropdown_body" );
    if( closedChild != null )
    {
        closedChild.className = "dropdown_open";
    }
}
function close_all_dropdowns()
{
    var myDropdowns = array_elements_by_name_with_className( "div", "dropdown" );
    apply_to_array( myDropdowns, close_dropdown );
}
function close_dropdown( givenDropdown )
{
    var openChild = first_child_with_className( givenDropdown, "dropdown_open" );
    if( openChild == null ) openChild = first_child_with_className( givenDropdown, "dropdown_body" );
    if( openChild != null )
    {
        openChild.className = "dropdown_closed";
    }
}


function highlight_dropdown( givenDropdown )
{
    var headerChild = first_child_with_className( givenDropdown, "dropdown_header" );
    if( headerChild != null ) headerChild.style.backgroundColor = "gainsboro";
}
function un_highlight_dropdown( givenDropdown )
{
    var headerChild = first_child_with_className( givenDropdown, "dropdown_header" );
    if( headerChild != null ) headerChild.style.backgroundColor = "white";

}

//---------------------  toggle buttons --------------------------

var expandCaption = " EXPAND ALL ITEMS ON THIS PAGE ";
var contractCaption = " COLLAPSE ALL ITEMS ON THIS PAGE ";

function initialize_button( givenButton )
{
    givenButton.value = expandCaption;
    givenButton.onclick = function () 
        { 
            toggle_button( givenButton );
            open_all_dropdowns();
        };
}
function toggle_button( givenButton )
{
    if( givenButton.value == expandCaption )
    {
        givenButton.value = contractCaption;
        givenButton.onclick = function () { close_all_dropdowns(); toggle_button( givenButton ); };
    }
    else if( givenButton.value == contractCaption )
    {
        givenButton.value = expandCaption;
        givenButton.onclick = function () { open_all_dropdowns(); toggle_button( givenButton ); };
    }
    else alert( "can not toggle the button " + givenButton.outerHTML );
}

//---------------------  generic --------------------------

function make_caption( givenParent, captionText )
{
    var myCaption = construct_element( givenParent, "div", "dropdown_caption" )
    myCaption.appendChild( document.createTextNode( captionText ) );
}
function construct_element( givenParent, givenTagName, givenClassName )
{
    var myElement = document.createElement( givenTagName );
    givenParent.appendChild( myElement );
    myElement.className = givenClassName;
    return myElement;
}
function remove_children( givenParent )
{
    while( givenParent.hasChildNodes() )
    {
        givenParent.removeChild( givenParent.firstChild );
    }
}
function first_child_with_className( givenParent, givenClassName )
{
    for ( var i=0; i < givenParent.childNodes.length; i++ )
    {
        var currentChild = givenParent.childNodes[ i ];
        if( currentChild.className == givenClassName ) return currentChild;
    }
    return null;
}
function array_elements_by_name_with_className( givenElementName, givenClassName )
{
    // can I use XPath here?
    var newArray = [];
    var myElements = document.getElementsByTagName( givenElementName );
    for( var i = 0; i < myElements.length; i++ )
    {
        var currentElement = myElements[ i ];
        if( currentElement.className == givenClassName  )
        {
            newArray[ newArray.length ] = currentElement;
        }
    }
    return newArray;
}
function apply_to_array( givenArray, givenFunction )
{
    for( var i = 0; i < givenArray.length; i++ )
    {
        givenFunction( givenArray[ i ] );
    }
}