/*
Description: carouselimage.js - javascript for main image carousel
*/

// Initialize carousel on page load
$(window).load(function () {
    InitializeTimer();
});

var secs;
var timerID = null;
var timerRunning = false;
var delay = 1000;
var carouselXmlDom;
var imageTotal;
var imageCount = 0;

function InitializeTimer() {
    // Set the length of the timer, in seconds
    secs = document.getElementById("REFRESHRATE").value;
    if (secs == null) {
        secs = 10;
    }
    StopTheClock();
    if (carouselXmlDom == null) {

        var carouselXml = document.getElementById("CAROUSELXML").value;

        try //Internet Explorer
		{
            carouselXmlDom = new ActiveXObject("Microsoft.XMLDOM");
        }
        catch (e) {
            try //Firefox, Mozilla, Opera, etc.
			{
                carouselXmlDom = document.implementation.createDocument("", "", null);
            }
            catch (e) { }
        }
        carouselXmlDom.async = false;
        carouselXmlDom.preserveWhiteSpace = true;
        try {

            carouselXmlDom.loadXML(carouselXml);
        }
        catch (e) {
            var parser = new DOMParser();
            carouselXmlDom = parser.parseFromString(carouselXml, "text/xml");
        }

        imageTotal = carouselXmlDom.getElementsByTagName("CarouselItem").length;

        // Loop through images and preload
        preloadImages(carouselXmlDom);
    }

    ShowCarouselImage(carouselXmlDom, imageCount);
    StartTheTimer();
}

function StopTheClock() {
    if (timerRunning) {
        clearTimeout(timerID);
    }
    timerRunning = false;
}

function StartTheTimer() {
    if (secs == 0) {
        imageCount++;
        InitializeTimer();
    }
    else {
        //self.status = secs;
        secs = secs - 1;
        timerRunning = true;
        timerID = self.setTimeout("StartTheTimer()", delay);
    }
}

// For the next button on the images, make sure it is calling the method below --> onclick="NextImage(); return false"
function NextImage() {
    imageCount++;
    InitializeTimer();
}

// For the back button on the images, make sure it is calling the method below --> onclick="PreviousImage(); return false"
function PreviousImage() {
    if (imageCount == 0 && imageTotal != null) {
        imageCount = imageTotal - 1;
    }
    else {
        imageCount--;
    }

    InitializeTimer();
}

function ShowCarouselImage(carouselXmlDom, item) {
    window.status = 'Done';
    if (carouselXmlDom != null) {
        var carouselItem = carouselXmlDom.getElementsByTagName("CarouselItem")[item];

        if (carouselItem == null) {
            var carouselItem = carouselXmlDom.getElementsByTagName("CarouselItem")[0];
            imageCount = 0;
        }
        var imageUrl;
        var imageHeader;
        var imageText;
        try {
            if (navigator.appName == "Microsoft Internet Explorer") {
                imageUrl = carouselItem.childNodes[0].text;
                imageHeader = carouselItem.childNodes[1].text;
                imageText = carouselItem.childNodes[2].text;
            }
            else {
                imageUrl = carouselItem.childNodes[0].childNodes[0].nodeValue;
                imageHeader = carouselItem.childNodes[1].childNodes[0].nodeValue;
                imageText = carouselItem.childNodes[2].childNodes[0].nodeValue;
            }

        }
        catch (e) {

            alert(carouselXmlDom.toString());
            alert(carouselXmlDom.getElementsByTagName('CarouselItem')[0].firstChild.data);
            imageUrl = carouselItem.childNodes[0].nodeValue;
            imageHeader = carouselItem.childNodes[1].nodeValue;
            imageText = carouselItem.childNodes[2].nodeValue;

        }

        var oldImage = $("#carouselImage").attr("src");
        $('.home-billboard').css("background", "transparent url('" + oldImage + "') no-repeat");
        // TODO Escape URL   
        $("#carouselImage").attr("src", imageUrl).css('opacity', 0.0);
        $("#carouselImage").animate({ opacity: 1.0 }, 1500);


        $('#home-transparent-box-content').fadeOut("slow", function () {
            $('#home-transparent-box-content').html("<h1>" + imageHeader + "</h1><p>" + imageText + "</p>");
            $('#home-transparent-box-content').fadeIn("slow");
        });
    }
}

// Preload all images for the main image carousel from a given set of carousel xml
function preloadImages(xmlDom) {
    if (xmlDom != null) {
        // Get image total
        var total = xmlDom.getElementsByTagName("CarouselItem").length;

        // Loop through images and preload to dom
        for (i = 0; i < total; i++) {
            try {
                var imgUrl = '';
                var item = xmlDom.getElementsByTagName("CarouselItem")[i];

                // Check for IE and grab image url
                if (navigator.appName == "Microsoft Internet Explorer") {
                    imgUrl = item.childNodes[0].text;
                }
                else {
                    imgUrl = item.childNodes[0].childNodes[0].nodeValue;
                }

                // Create new image object to preload image
                var imgObj = new Image();
                imgObj.src = imgUrl;
            }
            catch (e) {
                // Display error and xml
                alert('Error: Problem preloading images for image carousel. ' + e);
                break;
            }
        }
    }
}