var count = 0; 
var baseSpeed = 0.1; 
var speed = 0.8;
var imageDivs = '';
var numberOfElements = 0;
var carousel = '';
var speedTest = '';
var prec = null;
var suiv = null;
var inter = 0;
var posix = Array();
var largeur = 115;
var hauteur = 102;
var limiteGauche = 0;
var limiteDroite = 0;
var marge = null;
var largeurMarge = 0;
var largeurMargeBase = 0;
var margeLimite = 0;
var liPremier = null;
var liDernier = null;
var backWrap = null;
var backPos = 0;
var nav = null;
var navElementsArray = '#gallery_wrap ul li';
var navActiveElement = '#gallery_wrap ul li.actif';
var arrowY = '0px';
var leftOffset = '0';
var youAreHere = '';
/*var inout = null;
function out(t) {
	inout.innerHTML+='<br />'+t;
}*/
window.addEvent('domready', function() {
	
	carousel = $('gallery').getElements('ul.gallery');
	carousel = $(carousel[0]);
	//speedTest = $('speedTest');
	/*inout = $('header');
	inout.style.overflow='auto';
	inout.style.color='#FFFFFF';
	inout.innerHTML = '';*/
	backWrap = $('gallery_wrap');
	backWrap.style.margin='0 0 0 -'+(2*largeur)+'px';
	
	prec = $('btn_gauche');
	suiv = $('btn_droite');
	
	
	marge = new Element('li', {id: 'marge'});
	marge = marge.inject(carousel, 'top');
	largeurMargeBase = largeurMarge = 1 * largeur;
	marge.style.width = largeurMarge + 'px';
	marge.style.height = hauteur + 'px';
	margeLimite = largeurMargeBase - largeur;
	
	goToFirst();
	goToSelected();
	
	imageDivs = carousel.getElementsByTagName("li"); 
	numberOfElements = imageDivs.length-1; 

	limiteGauche = 0;
	liPremier = $(imageDivs[1]);
	liDernier = $(imageDivs[numberOfElements]);
	
	var menu = $('gallery_wrap');
	menu.style.width = ((numberOfElements+1)*largeur)+'px';

	backWrap = $('gallery_wrap');
	if(Browser.Engine.gecko) {
		leftOffset = '0';
	}
	navSlider();
	
	var conteneur = $('gallery_container');
	if(conteneur.getSize().x < (backWrap.getSize().x)) {
		prec.addEvent('mouseover', function(){
			moveGauche();
		});
		suiv.addEvent('mouseover', function(){
			moveDroite();
		});
		prec.addEvent('mouseout', function(){
			moveStop();
		});
		suiv.addEvent('mouseout', function(){
			moveStop();
		});
	}
/*
*/

});

function goToFirst() {
	var lis = $$(navElementsArray);
	var nbLi = lis.length;
	lis = $$(navElementsArray);
	var liTmpBase = $(lis[nbLi-1]);
	var liTmp = liTmpBase.clone(true, true);
	liTmp.inject(marge, 'after');
	liTmpBase.dispose();
}

function goToSelected() {
	var activeEl = $$(navActiveElement);
	activeEl = $(activeEl[0]);
	if(activeEl != null) {

		var lis = $$(navElementsArray);
		var nbLi = lis.length;
		var index = 0;
		for(var i=0; i<nbLi; i++) {
			if($(lis[i]).hasClass('actif')) {
				index = i;
			}
		}
		// on inverse, pour aller dans le bon sens
		index=nbLi+1-index;
		for(var i=0; i<index; i++) {
			lis = $$(navElementsArray);
			var liTmpBase = $(lis[nbLi-1]);
			var liTmp = liTmpBase.clone(true, true);
			liTmp.inject(marge, 'after');
			liTmpBase.dispose();
		}
	}
}


function moveStop() {
	clearInterval(inter);
}

function moveGauche() {
	calculPos();
	inter=setInterval('startCarousel(1)',40);
}

function moveDroite() {
	calculPos();
	inter=setInterval('startCarousel(-1)',40);
}

function onMouseMove( evt ) {
	
	tempX = evt.client.x;
	speed = (tempX - centerX) / 2500;
	
}
function calculPos() {
	var activeEl = $$(navActiveElement);
	activeEl = $(activeEl[0]);
	if(activeEl == null) {
		activeEl = $$(navElementsArray)
		activeEl = $(activeEl[0]);
	}
	backPos = activeEl.getPosition(backWrap).x - 1;
	backWrap.setStyle('background-position', backPos + 'px 0px'); 
}

function startCarousel(sens){
	/*for(i=0; i < numberOfElements; i++){
	
		imageDivsStyle = imageDivs[ i ].style; 
		imageDivsStyle.position='relative'; 
		
		posix[i] = posix[i] + (sens * ( baseSpeed * speed * largeur));
		if(sens > 0) {
			if(posix[i] > limiteDroite) {
				posix[i]-=numberOfElements * largeur;
			}
		} else {
			if(posix[i] < limiteGauche) {
				posix[i]+=numberOfElements * largeur;
			}
		}

		posY = 0;
		
		imageDivsStyle.left = posix[i]+"px"; 
		imageDivsStyle.top = posY+"px";
		
	
	}
	*/
	largeurMarge = largeurMarge + (sens * ( baseSpeed * speed * largeur));
	if(sens > 0) {
		if(largeurMarge > largeurMargeBase) {
			largeurMarge = margeLimite;
			var liTmp = liDernier.clone(true, true);
			liPremier = liTmp.inject(marge, 'after');
			liPremier.addEvent('mouseenter', function() { 
				navEnter(this);
			});
			liDernier.dispose();
			liDernier = null;
			imageDivs = carousel.getElementsByTagName("li"); 
			liDernier = $(imageDivs[numberOfElements]);
			//calculPos();
		}
	} else {
		if(largeurMarge < margeLimite) {
			largeurMarge = largeurMargeBase;
			var liTmp = liPremier.clone(true, true);
			liDernier = liTmp.inject(carousel, 'bottom');
			liDernier.addEvent('mouseenter', function() { 
				navEnter(this);
			});
			liPremier.dispose();
			liPremier=null;
			imageDivs = carousel.getElementsByTagName("li"); 
			liPremier=$(imageDivs[1]);
			//calculPos();
		}
	}
	marge.style.width = largeurMarge + 'px';
	//backPos = backPos + (sens * ( baseSpeed * speed * largeur));;
	//backWrap.setStyle('background-position', backPos + 'px 0px');  
	calculPos();
	
	count+=sens;
}

function navEnter(item) {
	var thisPos = item.getPosition(backWrap).x - leftOffset; 
	youAreHere.cancel();
	youAreHere.start('background-position', thisPos + 'px ' + arrowY + 'px'); 
}

var navSlider = function() {
	var activeEl = $$(navActiveElement);
	activeEl = $(activeEl[0]);
	if(activeEl == null) {
		activeEl = $$(navElementsArray)
		activeEl = $(activeEl[0]);
	}
	
	youAreHere = new Fx.Tween($(backWrap), { 
		duration: 800,
		transition: Fx.Transitions.Back.easeOut  
	});
	
	var enter = function(item) {
		var thisPos = item.getPosition(backWrap).x - leftOffset; 
		youAreHere.cancel();
		youAreHere.start('background-position', thisPos + 'px ' + arrowY + 'px'); 
	
	}
	
	$$(navElementsArray).each(function(item){  
		item = $(item);
		item.addEvent('mouseenter', function() { 
			//var thisPos = item.getPosition(backWrap).x  + item.getSize().x - leftOffset; 
			navEnter(item);
			//var thisPos = item.getPosition(backWrap).x - leftOffset; 
			//youAreHere.cancel();
			//youAreHere.start('background-position', thisPos + 'px ' + arrowY + 'px'); 
		});
	});
	
	var currentArrow = function() {
		activeEl = $$(navActiveElement);
		activeEl = $(activeEl[0]);
		if(activeEl == null) {
			activeEl = $$(navElementsArray)
			activeEl = $(activeEl[0]);
		}
		youAreHere.cancel();
//		var activePos = $(activeEl).getPosition(backWrap).x  + $(activeEl).getSize().x - leftOffset; 
//		var activePos = $(activeID).getPosition(backWrap).x  + $(activeID).getSize().x - leftOffset; 
		var activePos = $(activeEl).getPosition(backWrap).x  - leftOffset; 
		youAreHere.start('background-position', activePos + 'px ' + arrowY + 'px');      
	};
	
	//correct IE rendering problem (without this, it wont go to the active nav onload)
//	var activePos = $(activeEl).getPosition(backWrap).x  + $(activeEl).getSize().x - leftOffset; 
//	var activePos = $(activeID).getPosition(backWrap).x  + $(activeID).getSize().x - leftOffset; 
	var activePos = $(activeEl).getPosition(backWrap).x  - leftOffset; 
	$(backWrap).setStyle('background-position', activePos + 'px ' + arrowY);
	
	//works to set image to starting position in other browsers
	currentArrow(); 
	
	$(backWrap).addEvent('mouseleave', currentArrow);	
};