// HERO IMAGE LANDING PAGE


jQuery(document).ready(function() {
	
  //When page loads...
	$(".tab_content").hide(); //Hide all content
	$("ul.tabs li:first").addClass("active").show(); //Activate first tab
	$(".tab_content:first").show(); //Show first tab content

	//On Click Event
	$("ul.tabs li").click(function() {

		$("ul.tabs li").removeClass("active"); //Remove any "active" class
		$(this).addClass("active"); //Add "active" class to selected tab
		$(".tab_content").hide(); //Hide all tab content

		var activeTab = $(this).find("a").attr("href"); //Find the href attribute value to identify the active tab + content
		$(activeTab).fadeIn(); //Fade in the active ID content
		return false;
	});

					

//rotation speed and timer
	var speed = 5000;
	var run = setInterval('rotate()', speed);	

	//grab the width and calculate left value
	var item_width = $('#heroImageSlides li').outerWidth(); 
	var sliderLength = $('#heroImageSlides li').length;	
	var left_value = item_width * (-1); 
	var pos=0;
	
	
	for(var i=0;i<sliderLength;i++){
   $('#heroImageButtons').append('<a class="indicator" id="indicator'+i+'" href="javascript:void(0);" ></a>');
  	}
	$('#heroImageButtons a#indicator'+pos).addClass('on');
	
  //anoop custom next prev button starts
  $('#heroImageButtons').prepend('<a href="javascript:void(0);" id="prev">prev</a>');
  $('#heroImageButtons').append('<a href="javascript:void(0);" id="next">next</a>');
        
    //move the last item before first item, just in case user click prev button
	$('#heroImageSlides li:first').before($('#heroImageSlides li:last'));
	
	//set the default item to the correct position 
	$('#heroImageSlides ul').css({'left' : left_value});

    //if user clicked on prev button
	$('#prev').click(function() {

		//get the right position            
		var left_indent = parseInt($('#heroImageSlides ul').css('left')) + item_width;

		//slide the item            
		$('#heroImageSlides ul:not(:animated)').animate({'left' : left_indent}, 500,function(){    

            //move the last item and put it as first item            	
			$('#heroImageSlides li:first').before($('#heroImageSlides li:last'));           

			//set the default item to correct position
			$('#heroImageSlides ul').css({'left' : left_value});
			pos=pos-1;
			if(pos<0) pos=4;
			on(pos);
		});

		//cancel the link behavior            
		return false;
            
	});

 
    //if user clicked on next button
	$('#next').click(function() {
		
		//get the right position
		var left_indent = parseInt($('#heroImageSlides ul').css('left')) - item_width;
		
		//slide the item
		$('#heroImageSlides ul:not(:animated)').animate({'left' : left_indent}, 500, function () {
            
            //move the first item and put it as last item
			$('#heroImageSlides li:last').after($('#heroImageSlides li:first'));                 	
			
			//set the default item to correct position
			$('#heroImageSlides ul').css({'left' : left_value});
			pos=pos+1;
			if(pos>=sliderLength) pos=0;
			on(pos);
			
		});
		         
		//cancel the link behavior
		return false;
		
	});        
	
	//if mouse hover, pause the auto rotation, otherwise rotate it
	$('#heroImageSlides').hover(
		
		function() {
			clearInterval(run);
		}, 
		function() {
			run = setInterval('rotate()', speed);	
		}
	); 
 	 
	 function on(pos){
  	 $('#heroImageButtons a.indicator').removeClass('on');
 	 $('#heroImageButtons a#indicator'+pos).addClass('on');
 	}
	




});

//a simple function to click next link
//a timer will call this function, and the rotation will begin :)  
function rotate() {
	$('#next').click();
}

function signupEmail()
{
	$('#divStayTouchSuccess').show();
	$('#divSignupEmail').hide();
}