// based on simpleSpy plugin; modified for use with clickable button
(function (jQuery) {
jQuery.fn.manualSpy = function (limit) {
	limit = limit || 4;
	
	return this.each(function () {
		// 1. setup
			// capture a cache of all the list items
			// chomp the list down to limit li elements
		var $list = jQuery(this),
		items = [], // uninitialised
		currentItem = limit,
		total = 0, // initialise later on
		height = $list.find('> li:first').height(),
		mheight = $list.find('> li:first').outerHeight(true); // in case margin is applied to <li>s
		
		// capture the cache
		$list.find('> li').each(function () {
		items.push('<li>' + jQuery(this).html() + '</li>');
		});
		
		total = items.length;
		
		$list.wrap('<div class="spyWrapper" />').parent().css({ height : mheight * limit }).siblings("div.nextPanel").children("a").click( function() {
			// 2. effect
				// insert a new item with opacity and height of zero
			var $insert = jQuery(items[currentItem]).css({
				height : 0,
				opacity : 0,
				display : 'none'
			}).prependTo($list);
			
			// fade the LAST item out
			$list.find('> li:last').animate({ opacity : 0}, 1000, function () {
				// increase the height of the NEW first item
				$insert.animate({ height : height }, 1000).animate({ opacity : 1 }, 1000);
				$insert.css("display", "");
				// AND at the same time - decrease the height of the LAST item
					// jQuery(this).animate({ height : 0 }, 1000, function () {
					// finally fade the first item in (and we can remove the last)
				jQuery(this).remove();
				// });
			});
			
			currentItem++;
			if (currentItem >= total) {
				currentItem = 0;
			}
		});
		
		$list.find('> li').filter(':gt(' + (limit - 1) + ')').remove();
	});
};
})(jQuery);