window.onload = 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();
            var carouselXmlDom = parser.parseFromString(carouselXml, "text/xml");
            //carouselXmlDom.load(carouselXml);

        }

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


    }
    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);
    }
}

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

//TODO: 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) {
    if (carouselXmlDom != null) {
        var carouselItem = carouselXmlDom.getElementsByTagName("CarouselItem")[item];

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

            }

        }
        catch (e) {

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

        }


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

        $('#as-headertxt').fadeOut("slow", function() {
            $('#as-headertxt').html(imageText);
            $('#as-headertxt').fadeIn("slow");
        });


        //TODO: Set the appropriate <div> titles for the background header and the text (also set the 
        //$('#as-headertxt').fadeOut("slow", function(){
        //    $('#as-header').fadeOut("slow", function(){
        //$('#as-header').find('$as-banner').stop();
        //     $('#as-header').css("background","transparent url('" + imageUrl + "') no-repeat");
        //    $('#as-headertxt').html(imageText);
        //    $('#as-header').fadeIn("slow", function(){
        //        $('#as-headertxt').fadeIn("slow");
        //            //$('#as-header-text').animate({left:0}, {duration:'slow', easing:'easeOutback'});
        //        });
        //    });
        //});

        //$('#as-banner').fadeOut("slow");
        //$('#as-banner').fadeIn("fast");
        //$('#as-banner').fadeIn("slow");

        //$('#as-header').css("background","transparent url('" + imageUrl + "') no-repeat");
        //$('#as-header').animate({backgroundImage: "url('" + imageUrl + "')", background-repeat : "no-repeat", background-color : "transparent"}, 5000);
        //$('#as-header').animate({backgroundColor: "#f6f6f6"}, "slow");
        //$('#as-headertxt').fadeOut("slow", function(){
        //	$('#as-headertxt').html(imageText);
        //	$('#as-headertxt').fadeIn("slow");

        //});
    }
}