$(document).ready(function(){
  var currentPosition = 0;
  var slideWidth = 467;
  var slides = $('.introduce-slider .slide');
  var numberOfSlides = slides.length;
  var delayLength = 4000;

  // Remove scrollbar in JS
  $('.introduce-slider #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
  $('.introduce-slider #slideInner').css('width', slideWidth * numberOfSlides);

  // Hide left arrow control on first load
  manageControls(currentPosition);

  // Create event listeners for .controls clicks
  $('.introduce-slider .control')
    .bind('click', function(){
    // Determine new position
	$('.slidebuttons .control').removeClass('activeControl');
	$(this).addClass('activeControl');
	
	var controlClass = $(this).attr('id');
	var control = 0;
	control = controlClass.substring(7);
	currentPosition = control;
	
	// Hide / show controls
    manageControls(currentPosition);
    // Move slideInner using margin-left
    $('#slideInner').animate({
      'marginLeft' : slideWidth*(-(currentPosition-1))
    });
  });
  

  // manageControls: Hides and Shows controls depending on currentPosition
  function manageControls(position){
    // Hide left arrow if position is first slide
	if(position==0){ $('.introduce-slider #leftControl').hide() } else{ $('.introduce-slider #leftControl').show() }
	// Hide right arrow if position is last slide
    if(position==numberOfSlides-1){ $('.introduce-slider #rightControl').hide() } else{ $('.introduce-slider #rightControl').show() }
  }	
  
  // Auto slide
  	
  	if(typeof $('.introduce-slider #slidesContainer').attr('delay') == 'string')
	{
  		interval = window.setInterval(function(){
  			elm = $('.introduce-slider .activeControl');
  			if(typeof elm.next().attr('class') == 'undefined')
  			{
  				elm = $('.introduce-slider .control:first');
  			}
  			else
  			{
  				elm = elm.next();
  			}
  			elm.click();
  		},$('.introduce-slider #slidesContainer').attr('delay'));
	}
  
});
