var intervalID = "";

$(document).ready(function(){
  var slideInterval = 8000;
  var slides = $('#main-splash div.splash-slide');
  var selectedSlide = 0;

  // hide all slides other than the first one
  $('#main-splash div.splash-slide:gt(0)').each(function(){
    $(this).hide();
    if(jQuery.support.opacity)
      $(this).find('div.tagline').hide();
  });

  // create the slideshow slide selector
  var selectorHTML = "<ul>";

  for(var i = 0; i < slides.length; i++){
    selectorHTML += "<li" + (i == 0 ? " class=\"selected\"" : "") + ">" + (i + 1) + '\n';
  }

  selectorHTML += "</ul>";

  $('#slide-selector').html(selectorHTML);

  // add a click event trigger on each selector
  $('#slide-selector ul li').each(function(i){
    $(this).click(function(){
      onSlideLoad(i);
      clearInterval(intervalID);

      intervalID = window.setInterval(advanceSlide, slideInterval);
    });
  });

  intervalID = window.setInterval(advanceSlide, slideInterval); 

  function advanceSlide(){
    onSlideLoad((selectedSlide + 1) % slides.length);
  }

  /**
   * Load a slide.
   */
  function onSlideLoad(i){
    var slide = $(slides[i]);

    var visibleSlide = $('#main-splash div.splash-slide:visible');
    
    if(selectedSlide != i){
      // unhighlight the highlighted selector
      $('#slide-selector ul li.selected').removeClass('selected');
      $($('#slide-selector ul li')[i]).addClass('selected');

      if(jQuery.support.opacity){
        visibleSlide.fadeOut(2000, function(){
          $(this).find("div.tagline").hide();  
        });
        
        slide.fadeIn(2000, function(){
          $(this).find("div.tagline").fadeIn(1000); 
        });
      }
      else {
        visibleSlide.hide();
        slide.show();
      }

      selectedSlide = i;
    }
  }
});