

var $j = jQuery.noConflict();  
    
  $j().ready(function(){
	// jQuery Content Slider
	var currentPosition = 0;
	var slideWidth = 420;
	var slideTimer = 5000;
	var slides = $j('.featuredProducts .product');
	var numberOfSlides = slides.length;
	
	// Remove scrollbar in JS
	//$('#slidesContainer').css('overflow', 'hidden');
	
	// Wrap all .slides with #slideInner div
	slides.wrapAll('<div id="slideInner"></div>').css("float","left");
	
	// Set #slideInner width equal to total width of all slides
	$j('#slideInner').css('width', slideWidth * numberOfSlides);
	
	// Insert controls in the DOM
	$j('#slides').prepend('<span class="control" id="leftControl">Clicking moves left</span>').append('<span class="control" id="rightControl">Clicking moves right</span>');
	
	//animate controls fader
	$j(".control").fadeTo("slow", 0.1);
	$j(".control").hover(function(){
	  $(this).stop().fadeTo("slow", 1.0);
	},function(){
	  $(this).stop().fadeTo("slow", 0.1);
	});
	
	// Create event listeners for .controls clicks
	$j('.control')
	.bind('click', function(){
	  animateSlider(true, this);
	});
	
	//Animate slide after timeout
	interval = window.setInterval(function(){
	  animateSlider(false, null);
	}, slideTimer);
	
	$j('#slides').hover(function () {
		  clearInterval(interval);
		}, function () {
		  interval = setInterval(function(){
		animateSlider(false, null);
	  }, slideTimer);
		});
	  
	function animateSlider(clicked, object){
	  if(clicked){
	    // Determine new position
	    currentPosition = ($j(object).attr('id')=='rightControl') ? currentPosition+1 : currentPosition-1;
	    
	    //reset position if position > amount of divs
	    if(currentPosition >= (numberOfSlides)){
	      currentPosition = 0;
	    }
	    else if(currentPosition < 0){
	      currentPosition = (numberOfSlides - 1);
	    }
	  }
	  else{
	    //reset position if position > amount of divs
	    if(currentPosition == (numberOfSlides -1)){
	      currentPosition = 0;
	    }
	    //increment the position after timeout
	    else{
	      currentPosition++;
	    }
	  }
	  // Move slideInner using margin-left
	  $j('#slideInner').animate({
	  'marginLeft' : slideWidth*(-currentPosition)
	  });
	}
});
