/*********************  FUNÇÃO STEP BANNERS *********************/
	/**
	 * @name		step banner
	 * @description	gerencia os banners com transição em fade.
	 * @examples $('#IDdiv').stepBanner($('#IDdiv'));
	*/

	$.fn.stepBanner = function (holder, options)
	{
		options = $.extend({}, $.fn.stepBanner.defaults, options);

		return this.each(function ()
		{
			var opts 				= $.fn.stepBanner.elementOptions(this, options);

			//OBJETOS
			var currentItem			= $(this);
			currentItem.banners 	= $(this).find('.' + opts.subClass);

			//VARIÁVEIS
			currentItem.leftOutPos	= $(this).width();
			currentItem.stepIndex	= 0;
			currentItem.stop		= false;
			currentItem.maxBanners	= currentItem.banners.length;
			currentItem.stepNav		= new Array;
			currentItem.opts		= opts;
			currentItem.timer;

			//INIT
			if (currentItem.maxBanners > 1)
			{
				currentItem.banners.each(function (index, element)
				{
					var newNavItem = $(document.createElement('a')).attr('href', '#').addClass(opts.navClass).text(index + 1).attr('title', $(element).attr('title')).click(function (e /*Event*/)
					{
						e.preventDefault();
						$.fn.stepBanner.changeBanner(currentItem, index);
					});
					$(holder).append(newNavItem);
					currentItem.stepNav.push(newNavItem);

					if (index != 0) $(element).css({left: currentItem.leftOutPos});
					else newNavItem.addClass(opts.navActiveClass);
				});

				$.fn.stepBanner.changeBanner(currentItem, null, opts.delay);
			}
			$(currentItem.banners[0]).show();

			//LISTENERS
			$(this).hover(function ()
			{
				currentItem.stop = true;
				clearTimeout(currentItem.timer);
			}, function ()
			{
				currentItem.stop = false;
				$.fn.stepBanner.changeBanner(currentItem, null, opts.delay);
			});
		});
	};

	$.fn.stepBanner.elementOptions = function (ele, options)
	{
		return $.metadata ? $.extend({}, options, $(ele).metadata()) : options;
	};

	$.fn.stepBanner.defaults =
	{
		timeAnim: 		200,
		delay:			6000,
		subClass:		'stepBanners',
		navClass:		'stepNav',
		navActiveClass:	'ativado'
	};

	$.fn.stepBanner.changeBanner = function (currentItem /*Object*/, location /*Number*/, timer) /* Void */
	{
		clearTimeout(currentItem.timer);
		currentItem.timer = setTimeout(function ()
		{
			if (location == currentItem.stepIndex) return;

			var transition;
			var oldIndex			= currentItem.stepIndex;
			currentItem.stepIndex	= location != null ? location : currentItem.stepIndex + 1;

			if (currentItem.stepIndex < 0 || currentItem.stepIndex >= currentItem.maxBanners) currentItem.stepIndex = 0;

			$(currentItem.stepNav[oldIndex]).removeClass(currentItem.opts.navActiveClass);
			$(currentItem.stepNav[currentItem.stepIndex]).addClass(currentItem.opts.navActiveClass);

			$(currentItem.banners[oldIndex]).fadeOut(currentItem.opts.timeAnim, function ()
			{
				$(currentItem.banners[oldIndex]).css({left: currentItem.leftOutPos});
				$(currentItem.banners[currentItem.stepIndex]).css({left: 0}).fadeIn(currentItem.opts.timeAnim);

				if (!currentItem.stop) $.fn.stepBanner.changeBanner(currentItem, null, currentItem.opts.delay);
			});
		}, timer ? timer : 0);
	};
	
	$(document).ready(function() {
							
	$('#stepBanner').stepBanner($('#navHolder'));
	 
	
							  });