var timeoutId;
var index = 0;
var lastIndex;
var numImages;
var carouselImages;
var stockAnimationTime = 2000;
var stockAnimationDelay = 8000;
var stockFadeDivider = 4;
var afterClickAnimationTime = 500;
var afterClickFadeDivider = 10;
var afterClickAnimationDelay = 20000;
var animationTime = 2000;
var animationDelay = 2000;
var fadeDivider = 2;
var slider;

function makeTimer() {
  clearClickHandlers();
  animationTime = stockAnimationTime;
  animationDelay = stockAnimationDelay;
  fadeDivider = stockFadeDivider;
  nextCarouselSlide(function() { 
    timeoutId = setTimeout("makeTimer()",animationDelay);
    setupClickHandlers();
  });
}

function doImageCarouselTransition(callback) {
  console.log("doImageCarouselTransition called.  index = " + index + "; lastIndex = " + lastIndex);
  if (typeof callback === 'undefined') {
    callback = function() { return false; };
  }
  if ($(carouselImages[lastIndex]).children(".watermark").size()) {
    console.log("Previous watermark found.");
    $(carouselImages[lastIndex]).children(".watermark").fadeTo(animationTime / fadeDivider,0,function() {
      $(carouselImages[lastIndex]).children("img").hide();
      updateSlider();
      $(carouselImages[index]).children("img").fadeTo(0,0);
      console.log("Fading in new image.");
      $(carouselImages[index]).children("img").fadeTo(animationTime,1,function() {
	if ($(carouselImages[index]).children(".watermark").size()) {
	  console.log("Current watermark found.");
	  $(carouselImages[index]).children(".watermark").fadeTo(animationTime / fadeDivider,1,function() {
	    callback();
	    $(".carousel .body").css("background-image", "url(" + $(carouselImages[index]).children("img").attr("src") + ")");
	  });
	} else {
	  console.log("Current watermark not found.");
	  callback();
	  $(".carousel .body").css("background-image", "url(" + $(carouselImages[index]).children("img").attr("src") + ")");
	}
      });
    });
  } else {
    console.log("Current watermark not found.");
    $(carouselImages[lastIndex]).children("img").hide();
    updateSlider();
    $(carouselImages[index]).children("img").fadeTo(0,0);
    $(carouselImages[index]).children("img").fadeTo(animationTime,1,function() {
      callback();
      
      $(".carousel .body").css("background-image", "url(" + $(carouselImages[index]).children("img").attr("src") + ")");
    });
  }
}

function nextCarouselSlide(callback) {
  if (typeof callback === 'undefined') {
    callback = function() { return false; };
  }
  
  lastIndex = index;
  index = (index + 1) % numImages;
  console.log("Starting next animation:  lastIndex = " + lastIndex);
  doImageCarouselTransition(callback);
}

function prevCarouselSlide(callback) {
  if (typeof callback === 'undefined') {
    callback = function() { return false; };
  }
  lastIndex = index;
  index = (index - 1) % numImages;
  if (index < 0) {
    index = numImages - 1;
  }
  console.log("Starting next animation:  lastIndex = " + lastIndex);
  doImageCarouselTransition(callback);
}

function updateSlider() {
  slider.css("width",Math.floor($(".carousel .footer .slider-container").width() / numImages) + "px");
  var newpos = slider.width() * index;
  slider.animate({"left": newpos}, animationTime);
}

function setupCarousel() {
  carouselImages = $(".carousel .body .carousel-item");
  console.log(carouselImages);
  slider = $(".carousel .footer .slider-container .slider");
  numImages = carouselImages.size(); 
  index = numImages - 1;
  carouselImages.children("img").hide();

  $(".carousel .caption").fadeTo(0,0);//.css("top","290px");
  $(".carousel .watermark").fadeTo(0,0);
  if (numImages > 1) {
    $(".carousel .body").parent().append('<div id="left-overlay"></div><div id="right-overlay"></div>');
    $(".carousel .body").parent().append('<div id="left-chevron"></div><div id="right-chevron"></div>');
    $("#left-chevron,#right-chevron").fadeTo(0,0.1);
    setupHoverHandlers();
    setupClickHandlers();
    startCarousel();
  } else {
    slider.hide();
  }
}

function setupHoverHandlers() {
  $("#left-overlay").hover(function() {
//     console.log("Hover!");
    $("#left-chevron").stop().fadeTo(250,1);//animate({"left": "-25px"},500);
  },function() {
//     console.log("Un-hover!");
    $("#left-chevron").stop().fadeTo(250,0.1);//animate({"left": "-5px"},500);
  });
  
  $("#right-overlay").hover(function() {
//     console.log("Hover!");
    $("#right-chevron").stop().fadeTo(250,1);//animate({"right": "-25px"},500);
  },function() {
//     console.log("Un-hover!");
    $("#right-chevron").stop().fadeTo(250,0.1);//animate({"right": "-5px"},500);
  });
}

function setupClickHandlers() {
  console.log("Registering click handlers.");
  clearClickHandlers();
  $("#left-overlay").click(function() {
    console.log("Left!");
    animationTime = afterClickAnimationTime;
    animationDelay = afterClickAnimationDelay;
    fadeDivider = afterClickFadeDivider;
    pauseCarousel();
    clearClickHandlers();
    prevCarouselSlide(function() { setupClickHandlers(); resumeCarousel(); });
    return(false);
  });
  
  $("#right-overlay").click(function() {
    console.log("Right!");
    animationTime = afterClickAnimationTime;
    animationDelay = afterClickAnimationDelay;
    fadeDivider = afterClickFadeDivider;
    clearClickHandlers();
    pauseCarousel();
    nextCarouselSlide(function() { setupClickHandlers(); resumeCarousel(); });
    return(false);
  });
}

function clearClickHandlers() {
  console.log("Clearing click handlers.");
  $("#left-overlay,#right-overlay").unbind('click');
}

function startCarousel() {
  console.log("Starting timer.");
  timeoutId = makeTimer("makeTimer()",animationDelay);
}

function resumeCarousel() {
  console.log("Resuming timer.");
  timeoutId = setTimeout("makeTimer()",animationDelay);
}

function pauseCarousel() {
  console.log("Clearing timer.");
  clearTimeout(timeoutId);
  return("Carousel paused.");
}