// JavaScript Document

$(document).ready(function(){
						   
  var currentPosition = 0;
  var slideWidth = 550;
  var slides = $('.slide');
  var numberOfSlides = slides.length;
  
  var animation = 1;
  var left_actif = 0;
  var right_actif = 0;

  // Remove scrollbar in JS
  $('#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
  $('#slideInner').css('width', slideWidth * numberOfSlides);

  // Insert controls in the DOM
  $('#slideshow')
    .prepend('<span class="control1" id="leftControl"> </span>')
    .append('<span class="control2" id="rightControl"> </span>')
	.append('<span class="control_play_pause" id="rightControl_pause"> </span>');


  // Hide left arrow control on first load
  manageControls(currentPosition);

  // BOUTON LEFT Create event listeners for .controls clicks
  $('.control1')
  	.bind('click', function(){
		if (animation == 0) {
			if (currentPosition != 0){
			
				// Determine new position
				currentPosition-=1;
				
				// Hide / show controls
				manageControls(currentPosition, 0, numberOfSlides);
				// Move slideInner using margin-left
				$('#slideInner').animate({
				  'marginLeft' : slideWidth*(-currentPosition)}, 900 );
			}
		} 
  });
	
  // BOUTON RIGHT Create event listeners for .controls clicks
  $('.control2')
  	.bind('click', function(){
		if (animation == 0) {
			if (currentPosition <= numberOfSlides-2){
				// Determine new position
				currentPosition+=1;
				// Hide / show controls
				manageControls(currentPosition, 0, numberOfSlides);
				// Move slideInner using margin-left
				$('#slideInner').animate({
				  'marginLeft' : slideWidth*(-currentPosition)}, 900);
			}else{
				// Determine new position
				currentPosition = 0;
				
				// Hide / show controls
				manageControls(currentPosition, 0, numberOfSlides);
	
				//$('#slideInner').fadeTo("fast", 0);
				
				$('#slideInner').animate({
					'marginLeft' : slideWidth*(0)}, 10);
				
				//$('#slideInner').fadeTo("fast", 1);
			}
		}
 });




//  BOUTON PLAY PAUSE Create event listeners for .controls clicks
  $('.control_play_pause')
  	.bind('click', function(){
		if (animation==0){
			$('#rightControl_play').attr("id",'rightControl_pause');
			animation=1;
			//right_actif = 0;
			//left_actif = 0;
		} else {
			$('#rightControl_pause').attr("id",'rightControl_play');
			animation=0;
			//right_actif = 1;
			
			if (currentPosition == 0){
				left_actif = 0;
			}else{
				left_actif = 1;
			}
		}
		manageControls(currentPosition, animation, numberOfSlides);
		
 });
	



setInterval(function(){
	if (animation == 1) {
		// Determine new position
		currentPosition += 1;
		// Hide / show controls
		manageControls(currentPosition,1);
	
		if (currentPosition < numberOfSlides){
			// Move slideInner using margin-left
			$('#slideInner').animate({
			  'marginLeft' : slideWidth*(-currentPosition)}, 900);
			
		} else {
			
			//$('#slideInner').fadeTo("fast", 0);
			
			$('#slideInner').animate({
				'marginLeft' : slideWidth*(0)}, 10);
			
			//$('#slideInner').fadeTo("fast", 1);


			currentPosition = 0;
			
			manageControls(0,1, numberOfSlides);
		}
	}
},12000);






});
	


	

// manageControls: Hides and Shows controls depending on currentPosition
function manageControls(currposition, animation, numberOfSlides){
	if (animation==0){  // ANIMATION SUR PAUSE
		// Hide left arrow if position is first slide
		if(currposition==0){
			$('#leftControl').fadeTo("fast", 0.25); //left_actif = 0;
		} else{
			$('#leftControl').fadeTo("fast", 1); //left_actif = 1;
		}
		// Hide right arrow if position is last slide
		if(currposition==numberOfSlides-1){
			$('#rightControl').fadeTo("fast", 1);  //right_actif = 1;
		} else{
			$('#rightControl').fadeTo("fast", 1);  //right_actif = 1;
		}
		
	} else { // ANIMATION SUR PLAY

		$('#leftControl').fadeTo("fast", 0.25); //left_actif = 0;
		$('#rightControl').fadeTo("fast", 0.25); //right_actif = 0;
	}
	
}