/**	 
 *
 * Usage:
 *
 *	 // Init element with slideshow, using the default options.
 *	 $(selector).slideshow({assets: asset_object}, height: 420);
 *
 */

(function($) {

	/*
		Constants
	*/
	
	PLUGIN_NAME = 'slideshow';
	current_image_index = 1;
	prev_element = null;
	next_element = null;
	assets = null;

	/*
		Private methods
	*/

	function rotateSwitch($this, duration) {
		slideshow_play = setInterval(function(){
			rotate($this);
		}, duration);
	}

	function rotate($this) {
		if (!current_image_index || current_image_index >= assets.length) {
			current_image_index = 0;
		} else if (current_image_index < 0) {
			current_image_index = assets.length -1;
		}
	    next_element = $this.find("div.slide:eq(" + current_image_index + ")");
		$this.find("a.jump").removeClass('active');
		$this.find("a.jump[rel='" + current_image_index + "']").addClass('active');
		transitionSlideshow($this, assets[current_image_index].effect, assets[current_image_index].speed);
		clearInterval(slideshow_play);
		rotateSwitch($this, assets[current_image_index].duration);
		prev_element = next_element;
		current_image_index++;
	}
	
	function start($this) {
		prev_element = $this.find(".hero-slideshow-container > div.slide:eq(0)").show();
		$this.find("a.jump[rel='0']").addClass('active');
		rotateSwitch($this, assets[0].duration);
	}

	function transitionSlideshow($this, effect, speed) {
		prev_element.stop();
		next_element.stop();
		switch(effect) {
			case "slide-left":
				prev_element.animate({left: -WIDTH}, speed );
				next_element.show().css('left', WIDTH).animate({left: 0}, speed );
				break;
			case "slide-right":
				prev_element.animate({left: WIDTH}, speed );
				next_element.show().css('left', -WIDTH).animate({left: 0}, speed );
				break;
			case "fade":
				prev_element.fadeOut(speed);
				next_element.css('left', 0).hide().fadeIn(speed, function() {
				    if (prev_element.css("opacity") != 1) {
				        prev_element.css("opacity", 1);
				    }
                    if (next_element.css("opacity") != 1) {
                        next_element.css("opacity", 1);
                    }
				});
		}
	}

	function attachEvents($this) {
		$this.find("a.prev").click(function() {
			current_image_index = current_image_index -2;
			clearInterval(slideshow_play);
			rotateSwitch($this, 0);
			return false;
		})

		$this.find("a.next").click(function() {
			clearInterval(slideshow_play);
			rotateSwitch($this, 0);
			return false;
		})

		$this.find("a.jump").click(function() {
			if(current_image_index -1 != parseInt($(this).attr('rel'))) {
				current_image_index = $(this).attr('rel');
				clearInterval(slideshow_play);
				rotateSwitch($this, 0);
			};
			return false;
		})
	}

	/*
		Public methods
	*/

	var publicMethods = {
		init: function(options) {return this.each(function() {
			var opts  = $.extend({}, $.fn['slideshow'].defaults, options);
			var $this = $(this);
			assets = opts.assets;
			WIDTH = opts.width;
			
			$this.empty();
			$this.append($("<div>").addClass('hero-slideshow-container').height(opts.height).width(opts.width));
			if(opts.nested_controls) {
				$this.find(".hero-slideshow-container").append($("<div>").addClass('slideshow-controls'));
			} else {
				$this.append($("<div>").addClass('slideshow-controls'));
			}
			$this.find(".slideshow-controls").css('z-index', 1).append("<a class='prev' href='#'>Prev</a>");
			if(typeof(opts.left) == 'number') {
				$this.find(".slideshow-controls").css('left', opts.left)
			}

			for (i = 0; i < assets.length; i++) {
				var overlay = "",
				copy = "";
				if (assets[i].heading || assets[i].caption) {
					
					overlay = "<div class='overlay "+ assets[i].theme + "'>";
					copy = "<h2>" + assets[i].heading + "</h2><p>" + assets[i].caption + "</p>";
					if (assets[i].link != '' && assets[i].link !== undefined) {
						copy = "<h2><a href='" + assets[i].link + "'" + assets[i].link_target + ">" + assets[i].heading + "</a></h2><p>" + assets[i].caption + "</p>";
					};
					
					overlay = overlay + copy;
					
					// If slideshow contains button call to action link assets
					if ( assets[i].link !== undefined && assets[i].link_text !== undefined ) {
						if (assets[i].link != "" && assets[i].link_text != "") {
							overlay = overlay + "<a href='" + assets[i].link + "'" + assets[i].link_target + "><span>" + assets[i].link_text + "</span></a>";
						}
					}
					
					overlay = overlay + "</div>";
				}

				/* Set up the image, and add a block-level link if it's been selected in options */
				img = "<img src='" + assets[i].image_url + "' />";
				if (assets[i].link != '' && typeof(assets[i].link) != 'undefined') {
					img = "<a href='" + assets[i].link + "'" + assets[i].link_target + ">" + img + "</a>";
				};
				
				$this.find(".hero-slideshow-container").append(
					$(
						"<div class='slide'>" +
						img +
						overlay +
						"</div>"
					).hide()
				);
				$this.find(".slideshow-controls").append("<a class='jump' href='#' rel='" + i + "'>" + (i+1) + "</a>");
			}
			
			$this.find(".slideshow-controls").append("<a class='next' href='#'>Next</a>");
			
			if(typeof(opts.left) == 'string') {
				switch (opts.left) {
					case 'center':
						var left_pos = (opts.width / 2) - ($this.find(".slideshow-controls").width() / 2);
						$this.find(".slideshow-controls").css('left', left_pos);
				}
			}
			
			var data  = $this.data(PLUGIN_NAME);
			if (!data) {
				$this.data(PLUGIN_NAME, {
					opts : opts
				});
			};
			
			attachEvents($this);
			start($this);
			
		})}

	};

	/*
		Initialization
	*/
	
	$.fn[PLUGIN_NAME] = function(method) {
		if (publicMethods[method]) {
			return publicMethods[method].apply(
				this,
				Array.prototype.slice.call(arguments, 1)
			);
		}
		else if (typeof method == 'object' || !method) {
			return publicMethods.init.apply(this, arguments);
		}
		else {
			$.error('Method ' + method + ' does not exist on jQuery.' + PLUGIN_NAME);
		}
	};

	/*
		Default options
	*/
	
	$.fn[PLUGIN_NAME].defaults = {
		width: 1150,
		left: 115,
		link_type: 'inline',
		overlay: true,
		nested_controls: true
	};
})(jQuery);
