// JavaScript Diaporama
//$().ready(function() {
jQuery.fn.extend({
	// Chargement d'une page à afficher
	creeDiaporamaScroll: function() {
   // fixation de la largeur des éléments
/*   var largeur = $(this).width();
   if (($.browser.msie) && (largeur == 699))
      largeur -= 99;
   $('#diaporama').width(largeur); 
   $('#diapo').width(largeur);
   $('#diapo_navigation').width(largeur - 120);
   $('#diapo_navigation ul').width(largeur - 120);
    $('#diapo li').width(largeur - 2); 
    $('#diapo li').css({"float":"left"}); */
   // mise en place de la liste pour les onglets$
//   $('#diaporama #diapo:first').before("<img class=\"diapo_prev\" src=\"prev.gif\" width=\"28\" height=\"36\" alt=\"pr&eacute;c&eacute;dent\" />");
   var liste = "";
   liste += "<div id=\"diapo_navigation\">";
  liste += "<ul>";
   var cpt = 0;
   $('#diaporama #diapo li').each(function(){
      cpt++;
      liste += '<li><a href="#">'+ ($(this).attr("title") == ""?cpt:cpt + "- " + $(this).attr("title")) +'</a></li>';
   }); 
   liste += '</ul>';
   liste += '</div>';
//   liste += '<img class="diapo_next" src="next.gif" alt="suivant" width="28" height="36" />'; 
   $('#diaporama #diapo:first').before(liste); 
//   $("#diapo_navigation").width($('#diaporama #diapo:first').width() - 56);
   // calcul de la hauteur des éléments
   var hauteur =    0;
   $(".blocs_destination").toggleClass("blocs_invisible");
   $("#diaporama #diapo ul li").each(function(){
      if (hauteur < $(this).outerHeight(true))
        hauteur =   $(this).outerHeight(true);
        if ($(this).outerHeight(true) > 900){
          $(this).children().each(function(){
          });
        }
   });
   $("#diaporama #diapo ul li").height(hauteur);
   
   $(".blocs_destination").toggleClass("blocs_invisible");
/*   var offset = $("#diaporama #diapo").offset().top - $("#diaporama").offset().top; */
    var offset = $('#diapo_navigation').outerHeight();   
   $('#diaporama #diapo').height(hauteur + 2);
   $('#diaporama').height(hauteur + offset + 2);  
/*			$('#diapo_navigation li').corner({
			  tl: { radius: 16 },
			  tr: false,
			  bl: false,
			  br: { radius: 16 },
			  antiAlias: true,
			  autoPad: true ,
			  validTags: ["li"] 
        }); */
   $('#diapo_navigation li:first').toggleClass('selected');
// });
// jQuery(function( $ ){

//	$('#diaporama').serialScroll({
    $('#diaporama').transition({
		target:'#diapo',
		items:'li', // Selector to the items ( relative to the matched elements, '#diapo' in this case )
		prev:'img.diapo_prev',// Selector to the 'prev' button (absolute!, meaning it's relative to the document)
		next:'img.diapo_next',// Selector to the 'next' button (absolute too)
		axis:'xy',// The default is 'y' scroll on both ways
		navigation:'#diapo_navigation li a',
		nomTransition: $(this).attr("transition"), 
		duration:500,// Length of the animation (if you scroll 2 axes and use queue, then each axis take half this time)
		force:true, // Force a scroll to the element specified by 'start' (some browsers don't reset on refreshes)
		// easing:'swing', 
		//queue:false,// We scroll on both axes, scroll both at the same time.
		//event:'click',// On which event to react (click is the default, you probably won't need to specify it)
		//stop:false,// Each click will stop any previous animations of the target. (false by default)
		//lock:true, // Ignore events if already animating (true by default)		
		//start: 0, // On which element (index) to begin ( 0 is the default, redundant in this case )		
		//cycle:true,// Cycle endlessly ( constant velocity, true is the default )
		//step:1, // How many items to scroll each time ( 1 is the default, no need to specify )
		//jump:false, // If true, items become clickable (or w/e 'event' is, and when activated, the pane scrolls to them)
		// lazy:false,// (default) if true, the plugin looks for the items on each event(allows AJAX or JS content, or reordering)
		//interval:1000, // It's the number of milliseconds to automatically go to the next
		// constant:false, // constant speed
		
		onBefore:function( e, elem, $pane, $items, pos ){
			/**
			 * 'this' is the triggered element 
			 * e is the event object
			 * elem is the element we'll be scrolling to
			 * $pane is the element being scrolled
			 * $items is the items collection at this moment
			 * pos is the position of elem in the collection
			 * if it returns false, the event will be ignored
			 */
			 //those arguments with a $ are jqueryfied, elem isn't.
			e.preventDefault();
			if( this.blur )
				this.blur();
   $('#diapo_navigation .selected').toggleClass('selected');
   $('#diapo_navigation li:eq(' + pos +')').toggleClass('selected');
		return true;		
		},
		onAfter:function( elem ){
			//'this' is the element being scrolled ($pane) not jqueryfied
/*			elem.find(".blocs_destination").toggleClass("blocs_invisible");*/
		}
	});

	}
});  
