/*
	  
	  Documentacion Funciones
	  
	 
	     carga(): se ejecuta al cargar la página (onload) y se encarga de detectar el navegador del usuario para el posterior correcto manejo del objeto event. La variable navegador quedará en 0 si el usuario tiene IE o en 1 para cualquier otro. También aquí se setea la variable posicion en 0; esta variable se incrementa cada vez que se hace click en uno de los divs y se utiliza para el seguimiento del atributo z-index de los mismos. Esta variable es la responsable de que el div que se esté arrastrando en ese momento sea siempre el que se muestre por encima de los demás.
    
	
	evitaEventos(): simplemente evita que otros eventos adicionales sean ejecutados en la propagación (más info en inglés aquí http://www.quirksmode.org/js/events_order.html)
    
	
	 comienzaMovimiento(): esta función es llamada al momento que el usuario clickea una de las capas que pueden ser arrastradas. Esta función se encargará de obtener en las variables cursorComienzoX y cursorComienzoY (hay una forma distinta de obtenerlas según el navegador) que representan la posición del cursor al momento del click; también obtendrá en las variables elComienzoX y elComienzoY que representan la posición del elemento con respecto al borde superior e izquierdo de la página, osea el top y left de CSS. Por último "le dirá" al objeto document que cada vez que el usuario mueva el mouse un pixel, la función enMovimiento debe ser llamada (para poder recalcular la posición de la capa) y que cuando el usuario suelte el mouse la función finMovimiento deberá ejecutarse. Esto se hace añadiendo manejadores de eventos al objeto document para que cuando una acción X sea realizada por el usuario (en este caso mover el mouse con la tecla presionada) se llame a una función Y (en este caso enMovimiento). Más información sobre eventos aquí: http://www.quirksmode.org/js/events_tradmod.html. Esta función también colocará la capa por encima de todas al modificarle su z-index valiendose de la variable posicion declarada en carga().
    
	
	* enMovimiento(): función llamada cuando el usuario mueve el mouse manteniendo el botón presionado sobre una capa perteneciente al Drag. La funcionalidad de este trozo de código es obtener en xActual e yActual la posición actual del puntero del mouse y, como ya teniamos guardada la posición del mouse al comenzar el movimiento y la posición de la capa con respecto a los márgenes, simplemente obtenemos el trayecto en pixeles que ha recorrido el mouse restando la posición actual con la posición inicial (xActual-cursorComienzoX) y a esto le sumamos la posición de la capa respecto de los márgenes (elComienzoX). Este resultado, que suena enredado pero es sencillo de comprender leyendo con detenimeinto, es donde debemos colocar finalmente la capa, modificandole sus atributos left y top con esta sentencia: elMovimiento.style.top=(elComienzoY+yActual-cursorComienzoY)+"px"; Recordemos que esta función se llama cada vez que el usuario mueve el mouse habiendo hecho click sobre la capa; y se seguirá ejecutando hasta que el botón izquierdo sea soltado.
    
	* finMovimiento(): función ejecutada cuando el usuario suelta el botón izuqierdo después de haber realizado el movimiento de la capa. Su funcionalidad será únicamente "avisarle" al objeto document que ya no debe llamar a la función enMovimiento cuando el usuario mueva el mouse; esto, al igual que en las funciones anteriores se realiza diferencialmente dependiendo que navegador posea el usuario... temita de incompatibilidades, los colegas del rubro sabrán entender...

	  */
      
       /*   EJEMPLO   
  
      <div id="div1" style="top:100px; left:100px; position:absolute; background-color:#FF0000; color:#000000;"
  
      onmousedown="comienzoMovimiento(event, this.id);" onmouseover="this.style.cursor='move'">
 
      <span style="font-family:Verdana, Arial, Helvetica, sans-serif; font-size:10px;">
  
      Prueba.................<br>
  
      Prueba.................<br>
 
      Prueba.................<br>
 
      Prueba.................<br>
 
      Prueba.................<br>
 
      </span>
 
      </div>
 
       
 
      <div id="div2" style="top:200px; left:300px; position:absolute; background-color:#FFFF00; color:#000000;"
 
      onmousedown="comienzoMovimiento(event, this.id);" onmouseover="this.style.cursor='move'">
 
      <span style="font-family:Verdana, Arial, Helvetica, sans-serif; font-size:10px;">
 
      Prueba.................<br>
 
      Prueba.................<br>
 
      Prueba.................<br>
 
      Prueba.................<br>
 
      Prueba.................<br>
 
      </span>
 
      </div>
 
       
 
     */
     
     
    
     function modal(nbcapa)
{
                   
               var activaventana=document.getElementById(nbcapa);               
               var ventana=document.getElementById("opaca");               
               
               ventana.style.display="block";
               ventana.style.zIndex=90;
               
               
              /* if(navigator.userAgent.indexOf("MSIE 6.0")>=0 && document.getElementById("limciudad")!=null) {    
                    document.getElementById("limciudad").style.display="none";
                    document.getElementById("limzonas").style.display="none";
               }*/

                if (activaventana.style.display!="block")
                    {
                    activaventana.style.display="block";
                    activaventana.style.zIndex=100;
                    centrarventana(activaventana);
                    }
               
}

     function modal2(nbcapa)
{
                   
                          
                           var activaventana=document.getElementById(nbcapa);               
          
                           
               
              /* if(navigator.userAgent.indexOf("MSIE 6.0")>=0 && document.getElementById("limciudad")!=null) {    
                    document.getElementById("limciudad").style.display="none";
                    document.getElementById("limzonas").style.display="none";
               }*/

                if (activaventana.style.display!="block")
                    {
                    activaventana.style.display="block";
                    activaventana.style.zIndex=100;
                    centrarventana2(activaventana);
                    }
               
}


function centrarventana(capa)
{
//document.getElementById(id).style.visibility='hidden';

//auxaltura=document.documentElement.scrollTop;
//limitealtura=(document.documentElement.clientHeight-capa.offsetHeight)/2;/
var altura;

if(navegador()==0){
    altura = screen.height;
}else{
	altura=window.innerHeight;	
}

limitealtura=(altura-capa.offsetHeight)/2;

if(navegador()==0)
	limitealtura=limitealtura - 100;

capa.style.top=limitealtura +"px";

if (navegador()==0)
     auxaltura=(document.documentElement.width-capa.offsetWidth)/2; 
else
	auxaltura=(document.documentElement.clientWidth-capa.offsetWidth)/2;

capa.style.left=auxaltura +"px"; 





}
   //la funcin carga tienes que llamarla desde en body=onload


function centrarventana2(capa)
{
//document.getElementById(id).style.visibility='hidden';

//auxaltura=document.documentElement.scrollTop;
//limitealtura=(document.documentElement.clientHeight-capa.offsetHeight)/2;
var altura;

if(navegador()==0){
    altura = screen.height;
}else{
    altura=window.innerHeight;    
}

limitealtura=(altura-capa.offsetHeight);

if(navegador()!=0)
    limitealtura=limitealtura + 100;

capa.style.top=limitealtura + "px";

if (navegador()==0)
    auxaltura=(document.documentElement.width-capa.offsetWidth)/2;
else
    auxaltura=(document.documentElement.clientWidth-capa.offsetWidth)/2;

capa.style.left=auxaltura +"px";

} 



var elComienzoY=0;
var elComienzoX=0;

 

 

function navegador() 
{
          if(navigator.userAgent.indexOf("MSIE")>=0) 
            return 0;
          else 
            return 1;
}
        
  
function evitaEventos(event)
{
  if(navegador()==0)
  {
      window.event.cancelBubble=true;
      window.event.returnValue=false;
  }
  else
    event.preventDefault();
}
  
       
  
function comienzoMovimiento(event, valid)
{
    
    //if (nomover==1) return "";
//    nomover=1;
if (valid.className=="modal")    
    elMovimiento=valid;
else
    elMovimiento=valid.parentNode;
if(navegador()==0)
       {
          cursorComienzoX=window.event.clientX+document.documentElement.scrollLeft+document.body.scrollLeft;
          cursorComienzoY=window.event.clientY+document.documentElement.scrollTop+document.body.scrollTop;
          document.attachEvent("onmousemove", enMovimiento);
          document.attachEvent("onmouseup", finMovimiento);
      }
      else
        {   
            cursorComienzoX=event.clientX+window.scrollX;
            cursorComienzoY=event.clientY+window.scrollY;
          document.addEventListener("mousemove", enMovimiento, true);
          document.addEventListener("mouseup", finMovimiento, true);
          }

     var valor=elMovimiento.style.left;
     if (valor=="") valor=0;
      elComienzoX=parseInt(valor);
      valor=elMovimiento.style.top;
     if (valor=="") valor=0;
      elComienzoY=parseInt(valor);
      elComienzoY=gettop(elMovimiento);
      evitaEventos(event);
  }

       

function enMovimiento(event)
{ 
  var xActual, yActual;
  if(navegador()==0)
  {   
         xActual=window.event.clientX+document.documentElement.scrollLeft+document.body.scrollLeft;
         yActual=window.event.clientY+document.documentElement.scrollTop+document.body.scrollTop;
  } 
  else
          {
              xActual=parseInt(event.clientX)+parseInt(window.scrollX);
              yActual=event.clientY+window.scrollY;
          }
  
          elMovimiento.style.left=(elComienzoX+xActual-cursorComienzoX)+"px";
          elMovimiento.style.top=(elComienzoY+yActual-cursorComienzoY)+"px";
          evitaEventos(event);
  }
  
  
function finMovimiento(event)
{
    nomover=0;
  if(navegador()==0)
  {   
      document.detachEvent("onmousemove", enMovimiento);
      document.detachEvent("onmouseup", finMovimiento);
  }
  else  
    {
        document.removeEventListener("mousemove", enMovimiento, true);
        document.removeEventListener("mouseup", finMovimiento, true);
    }
}
  
  
function gettop(ele)
{ //calcular la posicion de un elemento
    if (ele.offsetParent)
        return (ele.offsetTop + gettop(ele.offsetParent));
    else
        return (ele.offsetTop);
}

 


 
 function cerrar(objcapa)
 {

        objcapa=document.getElementById(objcapa);

        objcapa.style.display="none";
                
        objcapa=document.getElementById("opaca");
        objcapa.style.display="none";
        
        /*if(navigator.userAgent.indexOf("MSIE 6.0")>=0 && document.getElementById("limciudad")!=null) {         
               document.getElementById("limciudad").style.display="block";
               document.getElementById("limzonas").style.display="block";
        }*/

 
 }

//deja solo introducir numeros 
function solonumeros(e){
tecla_codigo = (document.all) ? e.keyCode : e.which;
if(tecla_codigo==8)return true;
patron =/[0-9]/;
if (tecla_codigo!=0) {
    tecla_valor = String.fromCharCode(tecla_codigo);
    return patron.test(tecla_valor);
}


}