// JavaScript Document
//////////////////////////////////////////gestion deplacement de div////////////////////////////////////////////
var div_a_deplacer=null;
var div_deplacable=null;
var last_x=0;
var last_y=0;
var tab_div_deplacable=new Array();
var place_libre_on=false;
var place_libre=null;
var dernier_id_pousse=null;

var menu_haut_top="0";
var menu_milieu_top="30%";
var menu_bas_1_top="75%";
var menu_bas_2_top="90%";

//class obj_point//////////////////////////////////////////
function obj_point(x,y){	
	this.x=x;
	this.y=y;
}
///////////////////////////////////////////////////////////



//class obj_div/////////////////////////////////////////////
function obj_div(div,no_ordre){	
	//on garde l'objet html 
	this.html=div;
	//initialisation hauteur et largeur
	this.hauteur_init=div.offsetHeight;
	this.largeur_init=div.offsetWidth;
	//initialisation des 4 coins du div (hg,hd,bg,bd)
	this.hg_init=new obj_point(this.html.offsetLeft,this.html.offsetTop);
	this.hd_init=new obj_point(this.hg_init.x+this.largeur_init,this.hg_init.y);	
	this.bg_init=new obj_point(this.hg_init.x,this.hg_init.y+this.hauteur_init);
	this.bd_init=new obj_point(this.html.offsetRight,this.html.offsetBottom);	
	//initialisation des 4 coins du div (hg,hd,bg,bd)
	this.hg_actuel=this.hg_init;
	this.hd_actuel=this.hd_init;	
	this.bg_actuel=this.bg_init;
	this.bd_actuel=this.bd_init;	
	//no ordre
	this.no_ordre=no_ordre;
	//methodes
	this.point_ds_div=point_ds_div;
	this.setPosition=setPosition;
	this.setPosCookie=setPosCookie;
	this.isCache=isCache;
	this.setCache=setCache;
}

//pour recuperer via le cookie si le div est caché ou pas
function isCache(){	
	//on lit le cookie
	var cookie=lire_cookie("arrobe_cache_"+this.html.id);
	//alert(cookie);
	return cookie;
}
//pour ecrire la nouvelle valeur de cache d'un div dans un cookie
function setCache(valeur) {
	//on supprime un eventuel cookie deja existant
	var date_validite=new Date;
	date_validite.setMonth(date_validite.getMonth()+1);
	ecrire_cookie("arrobe_cache_"+this.html.id,valeur,date_validite);
}


//pour ecrire la nouvelle position d'un div dans un cookie
function setPosCookie() {
	//on supprime un eventuel cookie deja existant
	/*
	var date_anterieur=new Date;
	date_anterieur.setMonth(date_anterieur.getMonth()-1);
	ecrire_cookie("arrobe_pos_"+this.html.id,"",date_anterieur);
	*/
	var date_validite=new Date;
	date_validite.setMonth(date_validite.getMonth()+1);
	//if(this.html.id=="menu_haut") 
	//	$('logo').innerHTML+="<br />ici dans setPosCookie : "+this.html.id+" "+this.hg_actuel.y;
	ecrire_cookie("arrobe_pos_"+this.html.id,this.hg_actuel.y,date_validite);
}

//pour savoir si un point 'point' est rentré dans notre div ou pas
//point=objet de type point
function point_ds_div(point){
	if(point.x >= this.hg_actuel.x && point.x <= this.hd_actuel.x && point.y >= (this.hg_actuel.y+20) && point.y <= (this.bg_actuel.y-20)){	
		return true;
	}	
	return false;
}

//pour modifier les coordonnées reel hg du div
//point de type obj_point
function setPosition(point){
	
	this.html.style.top=point.y+"px";
	this.html.style.left=point.x+"px";	

	//on maj aussi les attribut de position actuel
	this.hg_actuel=new obj_point(point.x,point.y);
	this.hd_actuel=new obj_point(this.hg_actuel.x+this.largeur_init,this.hg_actuel.y);		
	this.bg_actuel=new obj_point(this.hg_actuel.x,this.hg_actuel.y+this.hauteur_init);
	this.bd_actuel=new obj_point(this.html.offsetRight,this.html.offsetBottom);
}
////////////////////////////////////////////////////////////




//pou changer les coordonnées d'un div avec un autre
//div_source et div_cible sont de type obj_div
function intervertir(div_source,div_cible){	
	var pos_source=new obj_point(div_source.hg_init.x,div_source.hg_init.y);
	var pos_cible=new obj_point(div_cible.html.offsetLeft,div_cible.html.offsetTop);	
	div_source.setPosition(pos_cible);	
	div_cible.setPosition(pos_source);
}

//cette fonction permet de calculer l'ordre des div en fonction de leurs position
function calcul_no_ordre(tab_div){
	var no_ordre=0;	
	//on trie le tableau en fonction de la position des div
	tab_div=tri_position(tab_div);
	//pour chaque div maintenant trié alors on va affecter le numero d'ordre
	for(i in tab_div){
		tab_div[i].no_ordre=no_ordre;
		no_ordre++;
	}	
	return tab_div;
}


function deplacer_div(id_div, event){
	//alert("dans deplacer div");
	//on intercepte le click droit pour que si on veut afficher 
	//le menu contextuel on effectue pas la procedure de deplacement des div
	//comme ca ca recalcul pas les cookis etc...
	if(event.button==2){//si click droit alors demande menu contextuel
		return false;
	}

	
	//on regarde si on a pas cliquer dans la croix
	//si oui alors c qu'on veut fermer le div et pas le deplacer (on saute cette fonction)
	var target = event.target || event.srcElement;
	if(target.className=="img_close"){
		fermer_div(id_div);
		return false;
	}
	else if(target.className=="clic"){
		return false;
	}

	
	//on recupère le div à deplacer
	div_a_deplacer=new obj_div(document.getElementById(id_div));

	//on recupère le div place_libre
	place_libre=new obj_div(document.getElementById("place_libre"));
	
	//on recupère l'ensemble des div deplacables de la page
	var tab=document.getElementsByTagName("div");	
	for(var i=0;i<tab.length;i++){	
		if(tab[i].className=="deplacable" && tab[i].id!=id_div){
			var a_ins=new obj_div(tab[i]);
			//$('logo').innerHTML+="<br />Dans deplacer div chargement a_ins "+a_ins.html.id+".cache => "+a_ins.isCache();
			tab_div_deplacable.push(a_ins);		
		}
	}	
	//on calul les numero d'ordre en fct de la position des div
	tab_div_deplacable=calcul_no_ordre(tab_div_deplacable);	
	//on trie les div
	tab_div_deplacable=tri_position(tab_div_deplacable);
		
	//on initialise la position de la souris
	last_x=event.clientX;
	last_y=event.clientY;
	
	//on modifie le fond du div à bouger
	if(ie){
		div_a_deplacer.html.style.filter="alpha(opacity=50)";
	}
	else{
		div_a_deplacer.html.style.opacity="0.5";
	}
	
	// lance doDrag tant que l'on appuie sur le bouton de la souris en la bougeant
	document.onmousemove=drag;
	
	// lance endDrag quand on relache le bouton de la souris
	document.onmouseup=end_drag;	
	
	return false;
	
}




function drag(event){
//$('logo').innerHTML+="<br />Dans drag ";
	//on recupère la position initial du div
	var div_x=parseInt(div_a_deplacer.html.offsetLeft);
	var div_y=parseInt(div_a_deplacer.html.offsetTop);
	
	//on recupere la position en cours de la souris
	if(ie==1){
		var x_souris=window.event.clientX;
		var y_souris=window.event.clientY;
	}
	else{
		var x_souris=event.clientX;
		var y_souris=event.clientY;
	}
	
	//on calcul l'ecart entre la souri actuelle et l'ancienne	
	var ecart_x=x_souris-last_x;
	var ecart_y=y_souris-last_y;

	//on calcul la nouvelle position du div
	var nouv_x=div_x+ecart_x;
	var nouv_y=div_y+ecart_y;
	
	var nouv_pos=new obj_point(nouv_x,nouv_y);
	
	//on assigne les nvelles coordonnées pour effectuer le deplacement
	div_a_deplacer.setPosition(nouv_pos);

	//on maj la position de la souris
	last_x=x_souris;
	last_y=y_souris;	
	
	//on regarde si on est tjs dans la bonne zone
	var valide=position_valide();
	
	//si oui alors on regarde si on doit intervertir notre div avec un autre
	if(valide){
		//on regarde si il faut effectuer un intervetissage 8-)
		reorganiser_div();
		//document.getElementById('logo').innerHTML+=place_libre_on+" / ";
		//on reorganise le tableau de div deplacable pour le mettre dans le nouvel ordre
		tab_div_deplacable=tri_position(tab_div_deplacable);
	}
	else{
		//$('logo').innerHTML+="<br />dans drag position pas valide ";
	}
	
	//pour eviter la selection du text lors du drag, bug de ie...
	return false;
}	



function position_valide(event){
	
	//on recupère la largeur du "coin menu" et on regarde si le coin hg_x du div est compri entre 0 et cette largeur -1px
	var interval=div_a_deplacer.largeur_init;
	//on recupère l'absice du coin hg du div qu'on bouge
	var hg_x=div_a_deplacer.hg_actuel.x;
	//on test
	return (hg_x>=interval) ? false : true ;

}





function end_drag(){

	document.onmousemove=null;
	document.onmouseup=null;
	//$('logo').innerHTML+="<br />DEBUT end drag ";
	//$('logo').innerHTML+="<br />dans end drag ";
	//si on est dans le cas ou il y a pas eu intervertissement de div
	//alors on regarde si on a "laché" le div dans la partie "deplacable" (le coin gauche en gros)
	//si largage mord dans le div contenu alors on remet le div a sa place initiale	
	if(!place_libre_on){		
		div_a_deplacer.setPosition(div_a_deplacer.hg_init);
		//$('logo').innerHTML+="<br />CAS 1";
	}	
	//sinon si ca a bouger on regarde si le div a deplacer se trouve dans la place libre
	//si oui on le met dedans pour de bon
	else if(!position_valide()){
		//$('logo').innerHTML+="<br />CAS 2";
		for(var i=0;i<tab_div_deplacable.length;i++){
			//$('logo').innerHTML+="<br />Dans end drag "+tab_div_deplacable[i].html.id+".isCache()="+tab_div_deplacable[i].isCache();
			if(tab_div_deplacable[i].isCache()==0 || tab_div_deplacable[i].isCache()==null){
				//$('logo').innerHTML+="<br />Dans end drag "+tab_div_deplacable[i].html.id+" est set_position";
				tab_div_deplacable[i].setPosition(tab_div_deplacable[i].hg_init);
			}
		}
		div_a_deplacer.setPosition(div_a_deplacer.hg_init);
		//on cache le div place libre
		place_libre.html.style.display="none";		
	}
	else{		
		//$('logo').innerHTML+="<br />CAS 3";
		//document.getElementById("logo").innerHTML+="<br>=>"+place_libre.hg_actuel.y;
		div_a_deplacer.setPosition(place_libre.hg_actuel);
		//on cache le div place libre
		place_libre.html.style.display="none";
	}	
	
	//afin d'eviter toute superposition entre les div alors on les aligne pour finaliser le deplacement
	//on recupère l'ensemble des div deplacables de la page
	var tab=document.getElementsByTagName("div");
	var tab_div=new Array;
	var last_hg_y=0;		
	for(var i=0;i<tab.length;i++){	
		if(tab[i].className=="deplacable"){
			tab_div.push(new obj_div(tab[i]));
		}
	}			
	tab_div=tri_position(tab_div);
	for(var i=0;i<tab_div.length;i++){
	//$('logo').innerHTML+="<br />Dans end drag "+tab_div[i].html.id+".isCache()="+tab_div[i].isCache();
		if(tab_div[i].isCache()==0 || tab_div[i].isCache()==null){
			tab_div[i].setPosition(new obj_point(0,last_hg_y));
			if(i<tab_div.length-1){
				last_hg_y=tab_div[i].bg_actuel.y;	
			}
		}
	}	
	
	//on enregistre les positions ds les cookies
	for(var i=0; i<tab_div.length;i++){
		if(tab_div[i].isCache()==0 || tab_div[i].isCache()==null){	
		//$('logo').innerHTML+="<br />Dans end drag FIN "+tab_div[i].html.id+".isCache()="+tab_div[i].isCache();
			tab_div[i].setPosCookie();
		}
	}
	
	place_libre_on=false;
	
	if(ie){
		div_a_deplacer.html.style.filter="alpha(opacity=100)";
	}
	else{
		div_a_deplacer.html.style.opacity="1";
	}
		
	tab_div_deplacable=new Array();
	place_libre=null;
	div_deplacable=null;
	dernier_id_pousse=null;
  dernier_sens=null;
	//$('logo').innerHTML+="<br />FIN end drag ";

}	



function tri_position(tab_div){

	for(var i=0; i<tab_div.length-1;i++){
		var id_min=i;
		for(var j=i+1; j<tab_div.length;j++){
			if(tab_div[j].hg_actuel.y < tab_div[id_min].hg_actuel.y){
				id_min=j;			
			}		
		}
		var temp=tab_div[id_min];
		tab_div[id_min]=tab_div[i];
		tab_div[i]=temp;
	}
	
	
	return tab_div;
	
}



//on regarde si le div monte ou descend dans l'ordre des div
function sens_deplacement(div){
	
	//x=on a pas bouger
	var sens="x";
	
	//cas ou on descend le div avec la souris
	if(div.hg_actuel.y > div.hg_init.y){
		sens="b";
	}
	//cas ou on monte le div avec la souris
	else if(div.hg_actuel.y < div.hg_init.y){
		sens="h";
	}
	
	return sens;
	
}




function reorganiser_div(){
	//$('logo').innerHTML+="<br />DEBUT reorganiser_div";
	var ln=tab_div_deplacable.length;
	//$('logo').innerHTML+="<br />dans reorganiser_div tab_div_deplacable.length="+ln;
	//on parcourt les liste des div deplacables qui ne sont pas caché
	for(var i=0; i<ln; i++){
	//	alert(tab_div_deplacable[i].isCache());
		if(tab_div_deplacable[i].isCache()==0 || tab_div_deplacable[i].isCache()==null){
		//$('logo').innerHTML+="<br />ici reorganiser_div => "+tab_div_deplacable[i].html.id+" : "+tab_div_deplacable[i].isCache();
			var sens=sens_deplacement(div_a_deplacer);
			
			//on regarde si le div_a_deplacer mord dans le div_deplacable_i
			//si oui
			if(tab_div_deplacable[i].point_ds_div(div_a_deplacer.hg_actuel)){
				
				if(dernier_id_pousse!=tab_div_deplacable[i].html.id){
								
					//cas 1 : le div_a_deplacer est le premier des div initiaux et il est descendu sur le deuxième initial (le premier dans le nouvel ordre)
					if(i==0 && div_a_deplacer.hg_init.y < tab_div_deplacable[i].hg_actuel.y && sens=="b"){
						var n_y_deplacable=div_a_deplacer.hg_init.y; //= 0 normalement
					}
					//cas 2 : le div_a_deplacer est le dernier des div initiaux et il est monté sur l'avant dernier initial (le dernier dans le nouvel ordre)
					else if(i==ln-1 && div_a_deplacer.hg_init.y > tab_div_deplacable[i].hg_actuel.y && sens=="h"){
						var n_y_deplacable=div_a_deplacer.bg_init.y - tab_div_deplacable[i].hauteur_init; //bas de la page - la hauteur du div deplacable(i)
					}
					//cas 3 : div_a_deplacer est un div "de base" en deplacement vers le bas
					else if(sens=="b"){
						var n_y_deplacable=tab_div_deplacable[i-1].bg_actuel.y;
					}
					//cas 4 : div_a_deplacer est un div "de base" en deplacement vers le haut
					else if(sens=="h"){
						var n_y_deplacable=tab_div_deplacable[i+1].hg_actuel.y - tab_div_deplacable[i].hauteur_init;		
					}
					//cas 5 : surpriiiiiiise !!! 
					else{
						return false;
					}
					
					tab_div_deplacable[i].setPosition(new obj_point(0,n_y_deplacable));
					dernier_id_pousse=tab_div_deplacable[i].html.id;
	
			
					//calcul de la place libre
					place_libre.html.style.width=div_a_deplacer.largeur_init+"px";
					place_libre.html.style.height=div_a_deplacer.hauteur_init+"px";
					place_libre.largeur_init=div_a_deplacer.largeur_init;
					place_libre.hauteur_init=div_a_deplacer.hauteur_init;			
					
					//cas ou on descend le div_a_deplacer
					if(sens=="b"){			
						var y_libre=tab_div_deplacable[i].bg_actuel.y-2;
					}
					//cas ou on monte le div_a_deplacer
					else{
						var y_libre=tab_div_deplacable[i].hg_actuel.y-div_a_deplacer.hauteur_init+2;
					}				
				
					place_libre.setPosition(new obj_point(0,y_libre));			
					//on affiche le div place libre
					place_libre.html.style.display="block";		
					//div_a_deplacer.setPosition(place_libre.hg_actuel);
					place_libre_on=true;
	
				}
							
			}
			
		}
		
	}
	//$('logo').innerHTML+="<br />FIN reorganiser_div";
}



function fermer_div(id_div){
	//alert("//debut fermer div");
	//on recupère l'ensemble des div deplacables de la page
	var tab=document.getElementsByTagName("div");
	var tab_div=new Array;
	var no_ordre=0;		
	for(var i=0;i<tab.length;i++){	
		if(tab[i].className=="deplacable"){
			tab_div.push(new obj_div(tab[i]));
		}
	}			
	//on calcul les numero d'ordre
	tab_div=calcul_no_ordre(tab_div);	
	//on recupère notre div a fermer avec son numero d'ordre
	for(var i=0; i<tab_div.length;i++){
		if(tab_div[i].html.id==id_div){
			var div=tab_div[i];
			break;
		}
	}
	//on ferme le div
	//alert("//on ferme le div");
	div.html.style.display="none";
	div.hg_actuel.y="x";
	div.setCache(1);
	div.setPosCookie();
	//$('logo').innerHTML+="<br />Dans fermer div av => "+div.html.id+" : "+div.isCache();
	//on va faire remonter l'ensemble des div qui sont en dessous de lui de sa hauteur
	//alert("//on va faire remonter l'ensemble des div qui sont en dessous de lui de sa hauteur");
	var decalage=div.hauteur_init;
	for(var i=0; i<tab_div.length;i++){		
		if(tab_div[i].no_ordre>div.no_ordre){	
			tab_div[i].setPosition(new obj_point(0,(tab_div[i].hg_actuel.y-decalage)));
			tab_div[i].setPosCookie();
		}
	}
	//$('logo').innerHTML+="<br />Dans fermer div apres => "+div.html.id+" : "+div.isCache();
	//alert("//fin fermer div");
}

function ouvrir_div(id_div){

	//on recupère notre div a ouvrir 
	var div=new obj_div(document.getElementById(id_div));
	
	//on recupère l'ensemble des div deplacables de la page
	var tab=document.getElementsByTagName("div");
	var tab_div=new Array;
	var no_ordre=0;		
	for(var i=0;i<tab.length;i++){	
		if(tab[i].className=="deplacable" && tab[i].id!=id_div && tab[i].style.display!="none"){
			tab_div.push(new obj_div(tab[i]));
		}
	}	
	var nb=tab_div.length;
	
	//si ils sont tous caché alors on met notre div a sa position initiale
	if(nb==0){
		div.setPosition(new obj_point(0,div.hg_init.y));
	}
	else{
		//on trie le tableau par ordre de placement des div
		tab_div=tri_position(tab_div);
		//on recupère le dernier div affiché
		var dernier_div=tab_div[tab_div.length-1];
		//on positionne le div sous le dernier div
		div.setPosition(new obj_point(0,dernier_div.bg_actuel.y));
	}
	div.setCache(0);
	div.setPosCookie();
	//on ouvre le div
	div.html.style.display="block";
	
}




function initPosDivDeplacable(){
	//$('logo').innerHTML="";
	//on essaye de lire les cookies de positions des div
	var tab_id=new Array('menu_haut','menu_milieu','menu_bas_1','menu_bas_2');
	var tab_id_c=new Array();	
	var tout_ok=true;

	for(var i=0;i<tab_id.length;i++){
		var cookie=lire_cookie("arrobe_pos_"+tab_id[i]);
		//alert(cookie);
		//si pas trouvé alors quitte la fonction et les position des div deplacables deviennent celle de base du css
		if(cookie!=null){
			
			var pos=cookie;
			//x=>caché
			if(pos!="x"){		
				pos=parseInt(pos);			
			}
			
			//alert("dans initposdiv debut : "+tab_id[i]+" "+pos);
			tab_id_c[tab_id[i]]=pos+"px";

			
		}
		else{
			//alert("dans initposdiv debut : "+tab_id[i]+" merdouille");
			tout_ok=false;
			break;
		}
	}
	//alert("avant if tt ok");
	if(tout_ok){
		for(var i=0;i<tab_id.length;i++){
			//alert("dans initposdiv : "+tab_id[i]+" "+tab_id_c[tab_id[i]]);
			if(tab_id_c[tab_id[i]]=="xpx"){
				document.getElementById(tab_id[i]).style.display="none";
			}
			else{
				document.getElementById(tab_id[i]).style.top=tab_id_c[tab_id[i]];
				document.getElementById(tab_id[i]).style.display="block";
			}
		}
	}
	//un des cookie de position est manquant alors on les met tous par defaut
	else{
		reinitialiser();
	}

}

////////////////////////////////////////////////////////////////////////////////////////////////////////////////

//cette fonction permet de réinitialiser les positions des div à l'etat de base (celui des css) et les tailles des polices
function reinitialiser(){

	//on parcourt les cookies et on supprime ceux commencant par arrobe_
	date_anterieur=new Date;
	date_anterieur.setFullYear(date_anterieur.getFullYear()-1);
	var date_validite=new Date;
	date_validite.setMonth(date_validite.getMonth()+1);
	//on extrait dans un tableau les differents elements des cookies
	var reg=new RegExp("[ ;]+", "g");
	var tableau=document.cookie.split(reg);
	for (var i=0; i<tableau.length; i++){
		if(tableau[i].indexOf("arrobe_",0)!=-1){
			var pos=tableau[i].indexOf("=",0);
			var nom=document.cookie.substring(0,pos);
			ecrire_cookie(nom,"",date_anterieur);
		}
	}

	//on repositionne les 4 div
	document.getElementById("menu_haut").style.top=menu_haut_top;
	document.getElementById("menu_haut").style.display="block";
	ecrire_cookie("arrobe_cache_menu_haut",0,date_validite);
	document.getElementById("menu_milieu").style.top=menu_milieu_top;
	document.getElementById("menu_milieu").style.display="block";
	ecrire_cookie("arrobe_cache_menu_milieu",0,date_validite);
	document.getElementById("menu_bas_1").style.top=menu_bas_1_top;
	document.getElementById("menu_bas_1").style.display="block";
	ecrire_cookie("arrobe_cache_menu_bas_1",0,date_validite);
	document.getElementById("menu_bas_2").style.top=menu_bas_2_top;
	document.getElementById("menu_bas_2").style.display="block";
	ecrire_cookie("arrobe_cache_menu_bas_2",0,date_validite);
}