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

							//});
						}
					}