(function ($) {

	$.fn.imageRotator = function (options) {

		function doRotate() {
			// rotate
			$ChildImageRotators[ChildImageRotatorIndex].childImageRotator('rotate');

			// increment index
			ChildImageRotatorIndex = (ChildImageRotatorIndex + 1) % $ChildImageRotators.length;
		};

		var settings = {
			interval: 3000,
			visibleItems: null
		};

		if (options) {
			$.extend(settings, options);
		}

		var ChildImageRotatorIndex = 0;
		var $ChildImageRotators = Array();

		this.each(function () {
			// create settings for child
			var childSettings = { interval: settings.interval };
			if (settings.visibleItems != null)
				$.extend(childSettings, { visibleItems: settings.visibleItems });
			
			var $Rotator = $(this).childImageRotator(childSettings);

			if ($Rotator.childImageRotator('willRotate')) {
				$ChildImageRotators.push($Rotator);
			}
		});

		if ($ChildImageRotators.length > 0)
			setInterval(doRotate, settings.interval);

		return this;

	};

})(jQuery);

(function ($) {

	var settings = {
		itemHeight: 129,
		itemVGap: 8,
		interval: 5000,
		visibleItems: null
	};

	var methods = {
		init: function(options) {

			if (options) {
				$.extend(settings, options);
			}

			var $List = $(this);
			var $Container = $List.parent();
			var $ListItems = $List.children('li');

			$List.addClass('imageRotatorList');

			var VisibleItems = settings.visibleItems != null ?
								settings.visibleItems :
								($Container.height() + settings.itemVGap) / (settings.itemHeight + settings.itemVGap);

			$Images = Array();
			$ListItems.each(function(){
				var $image = $(this).find('img').first();
				$Images.push($image);
			});

			ImagePointer = VisibleItems;
			VisibleItemPointer = 0;

			$(this).data('Images', $Images);
			$(this).data('ListItems', $ListItems);
			$(this).data('VisibleItems', VisibleItems);
			$(this).data('ImagePointer', ImagePointer);
			$(this).data('VisibleItemPointer', VisibleItemPointer);

			return this;
		},
		
		willRotate: function() {
			// if there are more items than can be displayed, thing will rotate
			var VisibleItems = $(this).data('VisibleItems');
			var $ListItems = $(this).data('ListItems');
			return VisibleItems < $ListItems.size();
		},

		rotate: function() {
			var $ListItems = $(this).data('ListItems');
			var $Images = $(this).data('Images');
			var VisibleItems = $(this).data('VisibleItems');
			var VisibleItemPointer = $(this).data('VisibleItemPointer');
			var ImagePointer = $(this).data('ImagePointer');

			var $ListItem = $ListItems.eq(VisibleItemPointer);
			
			// fade new image in
			var $OldImage = $ListItem.children('img');
			$OldImage.css('z-index', '1');
			
			var $NewImage = $Images[ImagePointer].clone();
			$NewImage.css('z-index', '2');
			$NewImage.hide();
			
			$ListItem.append($NewImage);
			$NewImage.fadeIn(500, function(){ $OldImage.remove(); });

			VisibleItemPointer = (VisibleItemPointer + 1) % VisibleItems;
			ImagePointer = (ImagePointer + 1) % $Images.length;

			$(this).data('VisibleItemPointer', VisibleItemPointer);
			$(this).data('ImagePointer', ImagePointer);
		}
	};

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