var refreshIntervalId;
var currentshow = 0;
var pause = 5000; // define the pause for each tip (in milliseconds)
var length;

$(document).ready(function(){	
	//rotate();
	
/*	$(function() {
    	refreshIntervalId = setInterval( "slideSwitch()", 5000 );
	});

	$('#prev').click(function() {
		clearInterval(refreshIntervalId);
    	refreshIntervalId = setInterval( "slideSwitch()", 5000 );
		slideSwitch();
	});

	$('#next').click(function() {
		clearInterval(refreshIntervalId);
    	refreshIntervalId = setInterval( "slideSwitch()", 5000 );
		slideSwitch();
	});

	$('#pause').click(function() {
		clearInterval(refreshIntervalId);
	}).mouseleave(function() {
    	refreshIntervalId = setInterval( "slideSwitch()", 5000 );
	});*/


	length  = $("#slide-box .slide").length -1; 
	rotateSlide();
});


this.rotateSlide = function(){
		show(); 
		refreshIntervalId = setInterval(show,pause);
};

this.heroClick = function(id){
		clearInterval(refreshIntervalId);
		$(".slide"+(currentshow)).attr("id", "slidebtn"+currentshow);
		currentshow = id;	
		rotateSlide();
};
		
this.show = function(){

			$(".slide"+(currentshow)).attr("id", "slidebtn"+currentshow);
			
			if (currentshow == (length+1)) {
				currentshow = 0;
			}	
			currentshow += 1;
						

			$( "#slide-box .slide" ).animate({
  				"left": -((currentshow-1)*196)+"px"
			}, "fast", "swing", function(){ 
				if (currentshow == (length+1)) {
					$("#slide-box .slide").css("left", "0px");
					$(".slide1").attr("id", "selectedslidemenu");
				} else {
					$(".slide"+(currentshow)).attr("id", "selectedslidemenu");		
				}
			} );
};

/*
this.rotate = function(){

		var pause = 5000; // define the pause for each tip (in milliseconds) 
		var length = $("#carousel img").length; 
		var currentshow = 1;
		
		this.show = function(){
			

			$("#carousel img").hide();	

			$("#carousel img:nth-child(" + currentshow  + ")").fadeIn(2000);	
			
			currentshow += 1;
			
			if (currentshow > length) {
				currentshow = 1;
			}	

		};

		show(); setInterval(show,pause);

	};



this.slideSwitch = function() {
    var $active = $('#slideshow IMG.active');

    if ( $active.length == 0 ) $active = $('#slideshow IMG:last');

    // use this to pull the images in the order they appear in the markup
    var $next =  $active.next().length ? $active.next()
        : $('#slideshow IMG:first');


    $active.addClass('last-active');

    $next.css({opacity: 0.0})
	$next.removeClass('not-active')
    $next.addClass('active')
    $next.animate({opacity: 1.0}, 1000, function() {
												 					 
			$active.css({opacity: 0.0});									 
            $active.removeClass('active last-active');						
            $active.addClass('not-active');
			
         });
}
*/