(function($){
        $.fn.viewer = function(){
			var timer
			var isPlaying = true;
			var e = 0
			var itemId
			var viewer = $(this);
			var viewerItem = $(this).find('.viewerItem');
			var viewerNav = $(this).find('.viewerNav')
			init();
			
			function init(){
				jQuery.easing.def = "easeOutQuad";
				$(viewerItem).find('.bg').css({opacity:0.8});
				$(viewerItem).css({position:"absolute",display:"none",opacity:0})
				$(viewerItem).eq(0).css({display:"block",opacity:null})
				$(viewerItem).children(".content").css({left:-386})
				$(viewerNav).children('li').eq(0).addClass('active')
				$(viewerNav).children('li').css({opacity:0.8})
					
				manageNav();
				launchViewer();
			}
			
			function launchViewer(){
				setTimeout(function(){infoAppear(e);},1000);
			}
					
			function manageNav(){
				
				var navItem = $(viewerNav).children('li')
				$(navItem).each(function(i){
						$(this).bind("click",function(){
								isPlaying =false;
								clearInterval(timer)
								itemId = $(navItem).index(this)
								handleClick(itemId)
								 })
					})
			}
			
			function handleClick(itemId){
				
				var clickedItem = $(viewerItem).eq(itemId)
				$(clickedItem).addClass('active')
	
				if($(clickedItem).css("display") == "block") {return;}

				$(viewerNav).children('li').unbind("click")
				$(viewerItem).css({zIndex:0})
				
				$(clickedItem).css({display:"block",zIndex:1})
				$(clickedItem).animate({opacity:1},"slow","jswing",function(){
					$(".viewerItem:not(.active)").css({display:"none",opacity:0})
					$(".viewerItem:not(.active)").children('.content').css({left:-386})
					$(clickedItem).removeClass('active')
					$(clickedItem).css({opacity:null})
					setTimeout(function(){infoAppear(itemId);},500);
					
					manageNav()
					})
				
				$(viewerNav).children('li').each(function(i){
						var itemWidth =	$(this).children('em').width()		
						$(this).stop().animate({width:itemWidth,backgroundColor:"#000000"},function(){$(this).css({backgroundColor:"#000000"})})
						})
				$(viewerNav).children('li').eq(itemId).stop().animate({width:230,backgroundColor:"#6BA707"},function(){$(this).css({backgroundColor:"#6BA707"})})
				}
				
			function infoAppear(itemId){
					 $(viewerItem).eq(itemId).children('.content').stop().animate({left:0},function(){
																									
																							if(isPlaying){
																								
																								e ++
																								if(e == $(viewerItem).length ){e=0}
																								timer = setTimeout(function(){handleClick(e);},4000);
																								}
																							if(!isPlaying){
																								
																								e=itemId+1;
																								if(e >= $(viewerItem).length) e=0;
																								timer = setTimeout(function(){isPlaying=true;handleClick(e);},10000);
																								}
																							})			
				}


        };
})(jQuery);