window.addEvent("domready", function() {
    var logo = $$("h1.logo")[0];
    logo.addEvent("click", function(e) {
        e.stopPropagation();
        document.location.href = "index.php";
    });
    logo.setStyle("cursor", "pointer");

    var splashDiv = $("splash");
    if (splashDiv)
        setupSplash(splashDiv);

    var calendarTable = $("calendar");
    if (calendarTable)
        setupCalendar(calendarTable);
});

function setupSplash(splashDiv) {
    var testPrepSection = splashDiv.getElement("div.test-prep");
    var collegeCourseworkSection = splashDiv.getElement("div.college-coursework");
    var homeSchoolSection = splashDiv.getElement("div.home-school");
    var campsSection = splashDiv.getElement("div.camps");
    var afterSchoolSection = splashDiv.getElement("div.after-school");
    var enrichmentSection = splashDiv.getElement("div.enrichment");
    var workshopsSection = splashDiv.getElement("div.workshops");

    var sections = [testPrepSection, collegeCourseworkSection,
                    homeSchoolSection, campsSection, afterSchoolSection,
                    enrichmentSection, workshopsSection];
    var sectionNames = ["test-prep", "college-coursework", "home-school",
                        "camps", "after-school", "enrichment", "workshops"];
    var sectionURLs = ["workshops.php", "workshops.php", "services.php",
                       "study-abroad.php", "services.php", "services.php",
                       "workshops.php"];

    // First, we set up the click handler for redirection.  We modify the value
    // of currentDestination in the animation loop below.
    var currentDestination = sectionURLs[0];
    splashDiv.addEvent("click", function(e) {
        e.stopPropagation();
        document.location.href = currentDestination;
    });
    splashDiv.setStyle("cursor", "pointer");

    // Hide the other sections.
    for (var i = 1; i < sections.length; i++)
        sections[i].set("opacity", 0);

        // Now pre-load their images, following a simple convention for filenames,
    // and assuming file types.  We then assign the loaded images to their divs.
    for (var i = 1; i < sections.length; i++) {
        var section = sections[i];
        var sectionName = sectionNames[i];

        var backgroundImageURL = "css/images/splash/" + sectionName + "-image.jpg";
        section.setStyle("background", "url('" + backgroundImageURL + "') no-repeat right");

        var textImageURL = "css/images/splash/" + sectionName + "-text.png";
        section.getElement("h3")
            .setStyle("background", "url('" + textImageURL + "') no-repeat");
    }

    var counter = 0;
    function animateTransition() {
        var oldSection = sections[counter % sections.length];
        var newSection = sections[(counter + 1) % sections.length];

        oldSection.setStyle("z-index", 1);
        newSection.setStyle("z-index", 2);

        newSection.get("tween", {
            property: "opacity",
            duration: 2000,
            onComplete: function() {
                currentDestination = sectionURLs[(counter + 1) % sections.length];
                oldSection.set("opacity", 0);
                counter++;
            }
        }).start(1);
    }

    // We delay the first transition by 2.5 seconds instead of 5 since it
    // probably has been up for a while already.
    (function() {
        animateTransition();
        animateTransition.periodical(5000);
    }).delay(2500);
}

function setupCalendar(calendarTable) {
    var detailsDiv = $("details");

    calendarTable.getElements("td.day").each(function(td) {
        td.addEvent("click", function(e) {
            var dateString = td.id.substring(3);

            var year = dateString.substring(0, 4);
            var month = dateString.substring(4, 6).replace(/^0+/g, "");
            var day = dateString.substring(6, 8).replace(/^0+/g, "");

            detailsDiv.empty();
            new Element("h3")
                .set("text", "Details for " + month + "/" + day + "/" + year)
                .inject(detailsDiv);

            var dayDataDiv = $("dataFor" + dateString);
            if (dayDataDiv) {
                var eventsList = dayDataDiv.getElement("ul.events");
                if (eventsList)
                    eventsList.clone().inject(detailsDiv);

                var attachmentsList = dayDataDiv.getElement("ul.attachments");
                if (attachmentsList)
                    attachmentsList.clone().inject(detailsDiv);
            } else
                new Element("p")
                    .set("text", "There are no details for this date.")
                    .inject(detailsDiv);
        });
    });
}