// JavaScript Document
var active_slide=0;
var isCliced=false;
$(document).ready(function()
	{
		$('#slider #nav_slider span').click(function(e) {
			if(!isClicked){	
				window.clearInterval(timerval);
				isClicked=true;
				var $clicked = $(this);
				var linkIndex = $clicked.prevAll().length;				
				$clicked.addClass('active');			
				$clicked.siblings().removeClass('active');
				var $prev=$('#slider_content').children().eq(active_slide);
				
				$prev.animate({
					opacity: 0
				  }, 500, function() {
				 	 $prev.css('display', 'none');
					 var $current=$('#slider_content').children().eq(linkIndex);
					 $current.css('opacity','0');
					 $current.css('display', 'block');	
					 putContentInSlider(linkIndex);
					 active_slide=linkIndex;	
					 $current.animate({opacity: 1}, 500, function() {
						timerval = setInterval(onTimer,5000); 
					});					 
				  });				
			}
		});
		
		putContentInSlider(0);
		timerval = setInterval(onTimer,5000);
	
		
		$("body").delegate('#slider','mouseover mouseleave', function(e){
		    if (e.type == 'mouseover') {
		       window.clearInterval(timerval);
	    	} else {
				if(!isClicked){	
		        	timerval = setInterval(onTimer,5000)
				}
		    }
		});
	}
);
function putContentInSlider(no){
	var $current=$('#slider_content').children().eq(no);
	var boxHeight = $current.find("h2").attr('offsetHeight')+$current.find("p").attr('offsetHeight');
	$current.find("h2").css('margin-top', 185-boxHeight);
	isClicked=false;
	$('#slider .item:first').css('opacity','1');
}
function onTimer(){
	if(!isClicked){				
		var linkIndex = $('#nav_slider').children().length;	
		var $currNav = $('#nav_slider').children().eq(active_slide);
		if(active_slide+1==linkIndex){
			active_slide=-1;	
		}

		isClicked=true;		
		$currNav.removeClass('active');
		active_slide++;
		$currNav = $('#nav_slider').children().eq(active_slide);
		$currNav.addClass('active');
		var linkIndex = active_slide;	

		var $prev=$('#slider_content').children().eq(active_slide-1);				
		
		$prev.animate({
			opacity: 0
		  }, 500, function() {
		 	 $prev.css('display', 'none');
			 var $current=$('#slider_content').children().eq(linkIndex);
			 $current.css('opacity','0');
			 $current.css('display', 'block');	
			 putContentInSlider(linkIndex);
			 active_slide=linkIndex;	
			 $current.animate({opacity: 1}, 500, function() { });					 
		  });		
		
	}
}