// Adds a table of contents of a number of time-sensitive events to a pre-determined div 
// (id="EventTableOfContents"). If the number of events is greater than maxTocCount,
// then a "More..." link is added as the maxTocCount item.
function AddEventTableOfContents(maxTocCount)
{
    // alert("AddEventTableOfContents()")

    // if we have an EventTableOfContents div
    var eventsListDiv = document.getElementById("EventTableOfContents");
    if (eventsListDiv != null)
    {
        // alert("Found EventsList")
        
        // collect up all the appropriate events that are currently visible
        var events = new Array();
        divs = document.getElementById("Column2").getElementsByTagName("div"); 
        for (var i = 0; i < divs.length; ++i) 
            if (   (divs[i].className == "TimeSensitive") 
                && (divs[i].style.display == displayInherit))
                events.push(divs[i])

        // add a limited number of the events to our EventTableOfContents
        var innerHTML = ""
        var count = Math.min(events.length, maxTocCount)
        
        if (count > 0)
        {
            for (var i = 0; i < count; ++i)
            {
                // if we have a heading (with an id) for this event
                var headings = events[i].getElementsByTagName("h1");
                var heading = (headings.length > 0) ? headings[0] : null;
                if ((heading != null) && (heading.id != null))
                {
                    // Decide if we should use the heading text or "More..." if we've
                    // truncated the list
                    var text = ((i == (maxTocCount - 1)) && (events.length > maxTocCount)) ? "More..." : heading.innerHTML;
                    
                    // strip out any line breaks for a more compact TOC entry
                    text = text.replace(/<br>/gi, ". ");

                    // add the entry
                    innerHTML += "<li> <a href=\"#" + heading.id + "\">" + text + "</a></li>"
                }
            }
        }
        else
        {
            innerHTML = "<li>No upcoming events. Please check back later.</li>"
        }
        
        // create the Upcoming Events section
        eventsListDiv.innerHTML = "<h1>Upcoming Events</h1> <ul>" + innerHTML + "</ul>";
    }
}