// carrousel.js

var idActuel=1;
var tempsCarrousel=null;
var intervalAuto= 5000;
var intervalClic= 8000;
var isPaused=true;
var ie6=false;

$(document).ready(function(){

  $('.howto .num li[id^=carrousel]').click(function(){
    
    id=$(this).attr('id');
    id=id.split('_');
    id=id[1];
    changeStep(id);
    
    return false;
  });

  $('#play_pause').click(function(){
    
    playPause();
  });

  playPause();

});


function playPause(){
  if(isPaused){
    tempsCarrousel=setTimeout('changeStep()',intervalAuto);
    $('#play_pause a').css('background-image','url(./css/hab/howto-off-pause.png)');
    isPaused = false;
  }
  else {
    clearTimeout(tempsCarrousel);
    $('#play_pause a').css('background-image','url(./css/hab/howto-off-play.png)');
    isPaused = true;
  }
}

function changeStep(id){
  
  if(typeof id == 'undefined'){
    if(idActuel == 3){
      id=1;
    }
    else {
      id= idActuel + 1;
    }
    inter=intervalAuto;
  }
  else {
    inter=intervalClic;
    clearTimeout(tempsCarrousel);
  }
  
  spritePos=((id-1)*-409)+'px';
  
  // Image
  $('.howto .sprite').animate({backgroundPosition:spritePos});
  
  // Texte
  $('.howto .title').hide();
  $('.howto .title').css({'left':'410px'});
  $('.howto #title_'+id).show();
  $('.howto #title_'+id).animate({'left':'66px'});
  
  // Numéro
  if(!$.browser.msie || $.browser.version!='6.0'){
    $('.howto .content').css({'background-image':'url(./css/img/howto-'+id+'.png)'});
  }
  $('.howto .page').html(id);
  $('.num li a').attr('class','');
  $('#carrousel_'+id+' a').attr('class','on');
  
  idActuel=parseInt(id);
  tempsCarrousel=setTimeout('changeStep()',inter);
}