/**************************************************************************************/
/*
/*	  Configuration options:
/*
/* 	  pauseSeconds  float    number of seconds between each photo to be displayed
/* 	  fadeSpeed     float    number of seconds for the fading transition, the value should not exceed 'pauseSeconds'
/* 	  width         integer  width of the slideshow, in pixels
/* 	  height        integer  height of the slideshow, in pixels
/* 	  caption       boolean  display photo caption?
/* 	  cssClass      string   name of the CSS class, defaults to 'slideshowlite'
/*
/**************************************************************************************/

(function($)
{
	$.fn.slideshow = function(options)
	{

		var defaults = {
			pauseSeconds: 5,
			fadeSpeed: 0.5,
			width: 435,
			height: 220,
			caption: true,
			cssClass: 'slideshowlite'
		};

		var options = $.extend(defaults, options);

		// ----------------------------------------
		// slideshow objects and variables
		// ----------------------------------------

		var target = this;
		var items  = $(target).children("a");
		var instance;

		// ----------------------------------------
		// some mandontory styling
		// ----------------------------------------

		if ( ! $(this).hasClass(options.cssClass)) $(this).addClass(options.cssClass);

		$(this).css({
					width: options.width + "px",
					height: options.height + "px"
					});

		// ----------------------------------------
		// create anchor links to make the structure simpler for manupilation
		// ----------------------------------------
		$(this).children("img").wrap(document.createElement("a"));
		$(this).children("a").attr("target", "blank");

		// ----------------------------------------
		// add item sequence markups
		// ----------------------------------------
		var i = 1;
		$(this).children("a").each(function()
		{
			$(this).attr("rel", i++);
		});

		// ----------------------------------------
		// create pagination and caption
		// ----------------------------------------
		$(this).append("<ul></ul>");
		$(this).append("<ol></ol>");

		var pagination = $(this).children("ul");
		var caption = $(this).children("ol");

		var i = 1;
		var j = 0;

		$(this).children("a").each(function()
		{
			//pagination.append("<li><a href=\"#\">" + i++ + "</a></li>");
			//caption.append("<li>" + $("#" + $(target).attr("id") + " img:nth(" + j++ + ")").attr("alt") + "</li>");
		});

		//pagination.fadeTo(0, 0.8);
		//caption.fadeTo(0, 0.6);
		//caption.hide();

		// ----------------------------------------
		// shortcuts
		// ----------------------------------------
		var firstItem   = $(target).children("a:first");
		var lastItem    = $(target).children("a:last");
		var currentItem = firstItem;

		// ----------------------------------------
		// pagination highlight
		// ----------------------------------------
		var paginationHighlight = function(sequence)
		{
			//pagination.children("li").children("a").removeClass("current");
			//pagination.children("li").children("a:nth(" + sequence + ")").addClass("current");
		}

		// ----------------------------------------
		// caption
		// ----------------------------------------
		var showCaption = function(sequence)
		{
			caption.show();
			caption.children("li").hide();
			caption.children("li:nth(" + sequence + ")").fadeIn();
		}

		// ----------------------------------------
		// slideshow logic
		// ----------------------------------------
		var makeSlideshow = function()
		{
			// pagination click
			pagination.children("li").children("a").click(function()
			{
				if ( ! $(this).hasClass("current"))
				{
					// select the current item after the pagination click
					currentItem = $(target).children("a:nth(" + ($(this).text()-1) + ")");
					currentItem.show();
					startSlideshow();
				}
			});

			// pagination highlight
			// paginationHighlight(currentItem.attr("rel")-1);

			// show caption
			if (options.caption == true)
			{
				showCaption(currentItem.attr("rel")-1);
			}

			// show the current slide
			currentItem.fadeIn(options.fadeSpeed*2000, function()
			{
				$(target).children("a").hide();
				$(this).show().css("z-index", 1);
			});

			// prepare for the next slide
			// determines the next item (or we need to rewind to the first item?)
			if (currentItem.children("img").attr("src") == lastItem.children("img").attr("src"))
			{
				currentItem = firstItem;
				currentItem.css("z-index", 2);
			}
			else
			{
				currentItem = currentItem.next();
			}
		};


		

		var startSlideshow = function()
		{
			clearInterval(instance);
			makeSlideshow();
			instance = setInterval(makeSlideshow, options.pauseSeconds*1000);
		};


		// ----------------------------------------
		// start the slideshow!
		// ----------------------------------------
		startSlideshow();
	};

})(jQuery);