//Initialise
var delayglob = 200;
var elements = document.getElementsByClassName('menu-image');

var n=0;
var prev = false;
var next = false;

updateControl();

//functions
function movePrev() { //avoid several click to reach a unknown area
	if (n > 5) {
		disapear(n);
		n = n - 6;
		setTimeout("appear('"+n+"')", delayglob * 5 + 800);
		setTimeout("updateControl()", delayglob * 5 + 800);
	}
}

function moveNext() {
	if ((n+6) < elements.length) { //avoid several click to reach a unknown area
		disapear(n);
		n = n + 6;
		setTimeout("appear('"+n+"')", delayglob * 5 + 800);
		setTimeout("updateControl()", delayglob * 5 + 800);;
	}
}

function disapear(n) {
	hideExceed(n-6);
	hideExceed(n+6);
	var delay = delayglob;
	for (var i=n+5; i >= n;i--) {
		if (elements[i])
			setTimeout("disapearUnit('"+i+"')", delay * (-i+n+5));
	}
}

function hideExceed(n) {
	for (var i=n; i <= n+5;i++) {
		if (elements[i])
			Element.hide(elements[i]);
	}
}

function disapearUnit(n) {
	new Effect.Fade(elements[n]);
}

function appear(n) {
	hideExceed(n-6);
	hideExceed(n+6);
	var delay = delayglob;
	for (var i=n; i <= n+5;i++) {
		if (elements[i])
			setTimeout("appearUnit('"+i+"')", delay * (i-n));
	}
}

function appearUnit(n) {
	new Effect.Appear(elements[n]);
}


function updateControl() {
		prev = n > 5;
		next = (n+6) < elements.length;
	
	if (prev)
		Effect.Appear(document.getElementById('menu-prev'));
	else
		Effect.Fade(document.getElementById('menu-prev'));
		
	if (next)
		Effect.Appear(document.getElementById('menu-next'));
	else
		Effect.Fade(document.getElementById('menu-next'));
}

//eventHandler
	document.getElementById('img-prev').onclick = movePrev;
	document.getElementById('img-next').onclick = moveNext;