var move = false;
var menuOpen = false;
var hauteur = 0;

function chargeImages(){
	image1 = new Image();
	image2 = new Image();
	image3 = new Image();
	image4 = new Image();
	image1.src = "images/separateur_offon_menu.jpg";
	image2.src = "images/separateur_onoff_menu.jpg";
	image3.src = "images/fond_menu_active.jpg";	
	image4.src = "images/fond_menu_recherche_on.jpg";	
	document.onmousemove= mouseMove;
	if(document.getElementById('cache')) document.getElementById('cache').style.display = "none";
}

function afficheRecherche(){
	var menu = document.getElementById('menu');
	var listes = menu.getElementsByTagName('ul');
	var lis = listes[0].getElementsByTagName('li');
	switchContexte('recherche', lis[10]);
}

function closeContexte(){
	if (!move) resetMenu();
	move = true;
	if (parseInt(document.getElementById('contexte_menu').style.height) > 10){
		document.getElementById('contexte_menu').style.height = parseInt(document.getElementById('contexte_menu').style.height) - 10 +"px";
		setTimeout("closeContexte()", 10);
	}
	else{
		document.getElementById('contexte_menu').style.height = "0px";
		move = false;
		menuOpen = false;
	}
	/*document.getElementById('contexte_menu').style.height = "0px";
	move = false;*/
}

function openContexte(bloc){
	clearTimeout();
	move = true;
	hauteur = document.getElementById(bloc).offsetHeight;
	var ecart = parseInt(document.getElementById('contexte_menu').style.height) - hauteur;
	if (ecart < -7){
		document.getElementById('contexte_menu').style.height = parseInt(document.getElementById('contexte_menu').style.height) + 7 +"px";
		setTimeout("openContexte('"+bloc+"')", 10);
	}
	else if (ecart > 7){
		document.getElementById('contexte_menu').style.height = parseInt(document.getElementById('contexte_menu').style.height) - 7 +"px";
		setTimeout("openContexte('"+bloc+"')", 10);
	}
	else{
		document.getElementById('contexte_menu').style.height = hauteur + "px";
		move = false;
		menuOpen  = true;
	}
}

function resetMenu(){ //mets les separateurs à offoff et les éléments du menu à l'etat rollout
	var menu = document.getElementById('menu');
	var listes = menu.getElementsByTagName('ul');
	var lis = listes[0].getElementsByTagName('li');
	var separateurs = listes[0].getElementsByTagName('img');
	for (var i=0; i<separateurs.length; i++){
		separateurs[i].src = "images/separateur_offoff_menu.jpg";
	}
	for (var i=0; i<lis.length; i++){
		if(lis[i].className != "separateur") lis[i].className="";		
	}
}

function switchContexte(item, li){
	var menu = document.getElementById('menu');
	var listes = menu.getElementsByTagName('ul');
	var lis = listes[0].getElementsByTagName('li');
	var separateurs = listes[0].getElementsByTagName('img');
	var id;
	//on reinitialise les elements du menu
	for (var i=0; i<lis.length; i++){
		if(lis[i].className != "separateur") lis[i].className="";
		if(lis[i]==li) id=i;		
	}
	li.className="active";
	//on actualise les separateurs
	for (var i=0; i<separateurs.length; i++){
		if (i == id/2-1){
			separateurs[i].src = "images/separateur_offon_menu.jpg";
		}
		else if (i == id/2){
			separateurs[i].src = "images/separateur_onoff_menu.jpg";
		}
		else{
			separateurs[i].src = "images/separateur_offoff_menu.jpg";
		}
	}
	//on actualise le bloc contextuel
	document.getElementById('contexte_menu').innerHTML = document.getElementById(item).innerHTML;
	openContexte(item);
}

function mouseMove(ev){
	ev = ev || window.event;
	var mousePos = mouseCoords(ev);
	if (!move && menuOpen){
		var menu = document.getElementById('menu');
		if (mousePos.y > (hauteur + 190)) closeContexte();
		return false;
	}
	if(dragObject){
		if (dragObject.parentNode){
			var slider = dragObject.parentNode;
			var elems = slider.getElementsByTagName('div');
			var posParent = getPosition(slider);
			var widthParent = parseInt(getStyle(slider, 'width'));
			var posCurseur = Math.min(Math.max((mousePos.x - posParent.x - mouseOffset.x), 14), (widthParent-34));
			refreshSlider(slider, posCurseur);
		}
		return false; 
	} 
}

/******SLIDER ******/

document.onmouseup = mouseUp; 
 
var dragObject = null;
var mouseOffset = null;

function refreshSlider(slider, posCurseur){
	var widthParent = parseInt(getStyle(slider, 'width'));
	var elems = slider.getElementsByTagName('div');
	var myInput = slider.getElementsByTagName('input');
	var rose = elems[1];
	var gris = elems[3];
	var valeur = elems[7];
	var min = parseInt(elems[5].innerHTML);
	var max = parseInt(elems[6].innerHTML);
	var value = parseInt((max-min)/492 * posCurseur + min - 7*(max-min)/246);
	if ((slider.className).indexOf("mois") == -1){
		valeur.innerHTML = value + " €/mois";
	}
	else{
		var cran = Math.floor((widthParent-48)/((max-min)/12));
		posCurseur = Math.min(cran*Math.floor((posCurseur)/cran)+14, (widthParent-34));
		value = 12*Math.floor(value/12);
		valeur.innerHTML = value + " mois";
	}
	dragObject.style.left = posCurseur + "px"; 
	rose.style.width = posCurseur - 4 + "px";
	gris.style.width = 512 - posCurseur + 4 + "px";
	myInput[0].value = value;
}

function initSlider(curseur, value){
	var slider = curseur.parentNode;
	var elems = slider.getElementsByTagName('div');
	var rose = elems[1];
	var gris = elems[3];
	var valeur = elems[7];
	var min = parseInt(elems[5].innerHTML);
	var max = parseInt(elems[6].innerHTML);
	if(value < min || value > max) return false;
	var posCurseur = 492*value/(max-min)+14-492*(min/(max-min));
	curseur.style.left = posCurseur + "px"; 
	rose.style.width = posCurseur - 4 + "px";
	gris.style.width = 512 - posCurseur + 4 + "px";
	if ((slider.className).indexOf("mois") == -1){
		valeur.innerHTML = value + " €/mois";
	}
	else{
		valeur.innerHTML = value + " mois";
	}
}

function getStyle(el,styleProp){
	if (!el){
		var x = document.getElementById(el);
	}
	else{
		var x = el;
	}
	if (x.currentStyle)
		var y = x.currentStyle[styleProp];
	else if (window.getComputedStyle)
		var y = document.defaultView.getComputedStyle(x,null).getPropertyValue(styleProp);
	return y;
}

function mouseCoords(ev){
	if(ev.pageX || ev.pageY){
		return {x:ev.pageX, y:ev.pageY};
	}
	return {
		x:ev.clientX + document.body.scrollLeft - document.body.clientLeft,
		y:ev.clientY + document.body.scrollTop  - document.body.clientTop
	};
}

function getPosition(e){
	var left = 0;
	var top  = 0;
 
	while (e.offsetParent){
		left += e.offsetLeft;
		top += e.offsetTop;
		e = e.offsetParent;
	} 
 
	left += e.offsetLeft;
	top  += e.offsetTop;
 
	return {x:left, y:top};
} 

function getMouseOffset(target, ev){
	ev = ev || window.event;
	var docPos = getPosition(target);
	var mousePos = mouseCoords(ev);
	return {x:mousePos.x - docPos.x, y:mousePos.y - docPos.y};
}

function mouseUp(){
	dragObject = null;
} 

function makeDraggable(item){
	if(!item) return;
	item.onmousedown = function(ev){
		dragObject = this;
		mouseOffset = getMouseOffset(this, ev);
		return false;
	}
}