// Variables globales
var indiceZ=0; 
var posElInicial=new Array();
var posElFinal=new Array();
var posEls=new Array();
var posMouseInicial=new Array();
var elEnMov=null;
var movimiento=false;
var timeout = setTimeout('',0);

// Cargo las posiciones de las capas en el documento
onload=posElsAbs;
onresize=posElsAbs;

// Detecto el navegadoregador
if(navigator.userAgent.indexOf("MSIE")>=0) navegador=0; // IE
else navegador=1; // Otros

function delay() 
{ 
	/* 
	En IE sin un pequeño delay parece haber problemas con la captura de las posiciones de las capas. Lo extraño es que no siempre sucede por lo que este
	retraso puede no ser necesario.
	*/
}

function posElsAbs()
{
	/*
	funcion: almacenar las posiciones absolutas de los elementos movibles de la pagina
	parametros:
	retorno:
	*/
	setTimeout("delay()", 200);
	var el=document.getElementsByTagName("div");
	var i=0;
	while(el[i])
	{
		if(el[i].id.substr(0, 4)=="drag")
		{
			el[i].onmousedown=inicioMov;
			posEls[el[i].id]=posElAbs(el[i].id);
		}
		i++;
	}
}

function noEventos(event)
{
	if(navegador==0)
	{
		window.event.cancelBubble=true;
		window.event.returnValue=false;
	}
	if(navegador==1) event.preventDefault();
}

function getEl(idEl) 
{
	/*
	funcion: devolver el elemento cuyo id se recibe
	parametros: (string) id de elemento
	retorno: (objeto) elemento cuyo id se recibe
	*/
	return document.getElementById(idEl); 
}

function copiaArr(arr) 
{ 
	/*
	funcion: devolver una copia exacta del array que se recibe por parametro
	parametros: (array) array a copiar
	retorno: (array) duplicado del array recibido
	*/
	var tArr=new Array();
	for(var n in arr) tArr[n]=arr[n];
	return tArr;
}

function posMouse(event)
{
	/*
	funcion: devolver la posicion del puntero en un momento determinado
	parametros: (objeto) objeto event
	retorno: (array=>["x"] - ["y"]) posicion del puntero
	*/
	var pos=new Array();
	if(navegador==0)
	{
		/* document.body.clientLeft/clientTop es el tamaño del borde (usualmente 2px) que
		encierra al documento ya que en IE este no empieza en (0,0) */
	 	pos["x"]=window.event.clientX+document.body.clientLeft+document.body.scrollLeft;
		pos["y"]=window.event.clientY+document.body.clientTop+document.body.scrollTop;
	}
	if(navegador==1)
	{
		pos["x"]=event.clientX+window.pageXOffset;
		pos["y"]=event.clientY+window.pageYOffset;
	}
	return pos;
}

function posElAbs(idEl)
{
	/*
	funcion: devolver la posicion del elemento con respecto a los bordes del documento
	parametros: (string) id del elemento
	retorno: (array=>["xInicial"] - ["xFinal"] - ["yInicial"] - ["yFinal"]) posicion del elemento
	*/
	var el=elP=getEl(idEl);
	var pos=new Array();
	pos["xInicial"]=pos["yInicial"]=pos["xFinal"]=pos["yFinal"]=0;
	
	do
	{
		pos["xInicial"]+=elP.offsetLeft;
		pos["yInicial"]+=elP.offsetTop;
		elP=elP.offsetParent;
	} while(elP);

	pos["xFinal"]=el.offsetWidth+pos["xInicial"];
	pos["yFinal"]=el.offsetHeight+pos["yInicial"];

	return pos;
}

function posElRel(idEl)
{
	/*
	funcion: devolver la posicion del elemento con respecto a su contenedor (left y top)
	parametros: (string) id del elemento
	retorno: (array=>["x"] - ["y"]) posicion del elemento
	*/
	var el=getEl(idEl);
	var pos=new Array();
	pos["x"]=parseInt(el.style.left);
	pos["y"]=parseInt(el.style.top);
	return pos;
}

function reOrdena(posMouse)
{
	for(var idEl in posEls)
	{
		if(idEl!=elEnMov.id)
		{
			if(posMouse["x"]>=posEls[idEl]["xInicial"] && posMouse["x"]<=posEls[idEl]["xFinal"] &&
			posMouse["y"]>=posEls[idEl]["yInicial"] && posMouse["y"]<=posEls[idEl]["yFinal"]) 
			{
				// La capa cuyo id es idEl debe posicionarse en la posicion de comienzo de la capa en movimiento
				var el=getEl(idEl);
				
				// Intercambio la posicion de la capa estatica por la posicion final de la capa en movimiento
				var temp=new Array();
				temp["x"]=parseInt(el.style.left);
				temp["y"]=parseInt(el.style.top);
				el.style.left=posElFinal["x"]+"px";
				el.style.top=posElFinal["y"]+"px";
				posElFinal=copiaArr(temp);
				
				// Cambio los valores de posicion de la capa estatica y la capa en movimiento en el array de posiciones
				var temp1=new Array();

				temp1=copiaArr(posEls[elEnMov.id]);
				posEls[elEnMov.id]=copiaArr(posEls[idEl]);
				posEls[idEl]=copiaArr(temp1);
				//alert('cambio '+elEnMov.id+' por '+idEl);
				getAjax('modules/grid/grid_ajax.php', 'cambiar='+elEnMov.id+'&por='+idEl+'&dd_name='+document.getElementById('dd_name').value, 'grid_ajax_resp', 'grid_ajax_resp');
			}
		}
	}
}

function inicioMov(event)
{
	resetActionsBox();
	movimiento = true;
	
	if(navegador==0)
	{
	 	elEnMov=window.event.srcElement;
		
		document.attachEvent("onmousemove", enMov);
		document.attachEvent("onmouseup", finMov);
	}
	if(navegador==1)
	{
		elEnMov=event.target;
		
		document.addEventListener("mousemove", enMov, true);
		document.addEventListener("mouseup", finMov, true);
	}
	
	posElInicial=posElRel(elEnMov.id);
	posMouseInicial=posMouse(event);
	
	posElFinal=copiaArr(posElInicial);
	
	//elEnMov.style.zIndex=++indiceZ;
	noEventos(event);
}

function enMov(event)
{	 
	var pos=posMouse(event);
	reOrdena(pos);
	
	elEnMov.style.left=posElInicial["x"]+pos["x"]-posMouseInicial["x"]+"px";
	elEnMov.style.top=posElInicial["y"]+pos["y"]-posMouseInicial["y"]+"px";
	
	noEventos(event);
}

function finMov(event)
{
	elEnMov.style.left=posElFinal["x"]+"px";
	elEnMov.style.top=posElFinal["y"]+"px";
	//elEnMov.style.zIndex=1;
	movimiento = false;
	
	if(navegador==0)
	{    
		document.detachEvent("onmousemove", enMov);
		document.detachEvent("onmouseup", finMov);
	}
	if(navegador==1)
	{
		document.removeEventListener("mousemove", enMov, true);
		document.removeEventListener("mouseup", finMov, true); 
	}
}

function link_opciones(valor) {
	
	switch (valor) {
		case 'url':
			document.getElementById('p_link_url').style.display='block';
			document.getElementById('p_link_archivo').style.display='none';
		break;
		
		case 'archivo':
			document.getElementById('p_link_url').style.display='none';
			document.getElementById('p_link_archivo').style.display='block';	
		break;
		
		case 'null':
			document.getElementById('p_link_url').style.display='none';
			document.getElementById('p_link_archivo').style.display='none';	
		break;
	}
}

function borrar_imagen_grid(id, nodo) {
	if (confirm("Seguro que deseas borrar esta imagen?"))
		location.href="panel.php?opcion=220&id_nodo="+nodo+"&del=1&id_borrar="+id;
}

function editar_imagen_grid(id, nodo) {
	location.href="panel.php?opcion=220&id_nodo="+nodo+"&mod=1&id_mod="+id;
}

function borrar_imagen_slider(id, nodo) {
	if (confirm("Seguro que deseas borrar esta imagen?"))
		location.href="panel.php?opcion=221&id_nodo="+nodo+"&del=1&id_borrar="+id;
}

function editar_imagen_slider(id, nodo) {
	location.href="panel.php?opcion=221&id_nodo="+nodo+"&mod=1&id_mod="+id;
}


function actionsBox(elemento, id, nodo) {

	if (movimiento == false) {
		clearTimeout(timeout);
		
		document.getElementById('action_id_nodo').value = nodo;
		document.getElementById('action_id').value = id;
			
		var box = document.getElementById('actions_box');
		
		var ancho = elemento.offsetWidth; 
		var alto = elemento.offsetHeight; 
	
		var posicionTop = obtenerPosicion(elemento).top;
		var posicionLeft = obtenerPosicion(elemento).left;
		
		box.style.top = (posicionTop-24)+"px";
		box.style.left = (posicionLeft+12)+"px";
	
		box.style.display = "block";
		
		timeout = setTimeout('resetActionsBox()', 5000);
	}
}

function obtenerPosicion(element) {
    
  if (!element) return { top:0,left:0 };
  
  var y = 0;
  var x = 0;
  while (element.offsetParent) {
    x += element.offsetLeft;
    y += element.offsetTop;
    element = element.offsetParent;
  }
  return {top:y,left:x};
}

function resetActionsBox() {
	document.getElementById('actions_box').style.display="none";
}
