var j = jQuery.noConflict();

j(document).ready(function(){
  var currentPosition = 0;
  var slideWidth = 980;
  var slides = j('.slide');
  var numberOfSlides = slides.length;
  var move = 0;

  // Remove scrollbar in JS
  j('#slidesContainer').css('overflow', 'hidden');

  // Wrap all .slides with #slideInner div
  slides
    .wrapAll('<div id="slideInner"></div>')
    // Float left to display horizontally, readjust .slides width
	.css({
      'float' : 'left',
      'width' : slideWidth
    });

  // Set #slideInner width equal to total width of all slides
  j('#slideInner').css('width', slideWidth * numberOfSlides);

  // Insert controls 
  j('#slideshow')
    .prepend('<span class="control" id="leftControl">Clicking moves left</span>')
    .append('<span class="control" id="rightControl">Clicking moves right</span>');

  
	j('#leftControl').click(function() {
		previousPosition = currentPosition;
		currentPosition==0 ? move=0:move=1;
			//alert(currentPosition);
		if (move==1){
			currentPosition -=1;
			j('#slide'+previousPosition).fadeOut();
			j('#slide'+currentPosition).fadeIn();
		}
		
		if (move==0){
			currentPosition =numberOfSlides-1;
			j('#slide'+previousPosition).fadeOut();
			j('#slide'+currentPosition).fadeIn();
		}
		
	});
	  
	j('#rightControl').click(function() {
		previousPosition = currentPosition;
		currentPosition==numberOfSlides-1 ? move =0:move=1;
		if (move==1){
			currentPosition +=1;
			j('#slide'+previousPosition).fadeOut();
			j('#slide'+currentPosition).fadeIn();
			
		}
		if (move==0){
			currentPosition =0;
			j('#slide'+previousPosition).fadeOut();
			j('#slide'+currentPosition).fadeIn();
			
		}
	});  
  
});