/*
 * Archivo: win.js
 * Autor: Mike79
 * Version: 0.1 basado en vent06
 * Fecha: 9 de Jun de 2009
 * Modificado: 22 de Feb de 2010
 * Descripcion: Funciones para el manejo de Ventanas
 * Cuadros, transparencias y posiciones.
 */

function getX( oElemento ) {
    
}

function getY( oElemento ) {

}

function Encuentra() {
   var oVent = document.getElementById('hola');
   alert(oVent);
}

function prueba1 () {
   oVentana = document.getElementById('ventana');
   Modal();
   Ventana(500,200);
}

function Ventana(iAncho,iAlto) {
   var oMuestra = document.getElementById('muestra');
   var oSombra = document.getElementById('sombra');
   Cuadro(oMuestra,0,0,iAncho,iAlto);
   Cuadro(oSombra,5,5,iAncho,iAlto);
   Transparente(oSombra,60);
   Debug ("Ancho: "+iAncho+" Alto: "+iAlto);
   CuadroCentrado(oVentana,iAncho+5,iAlto+5);
}

function CuadroCentrado(oObjeto,iAncho,iAlto) {
   var iBodyAncho = document.body.clientWidth;
   var iBodyAlto = document.body.clientHeight;
//   var iAncho = oObjeto.offsetWidth;
//   var iAlto = oObjeto.offsetHeight;
   var iX, iY;
   iX = (iBodyAncho / 2) - (iAncho / 2);
   iY = (iBodyAlto / 2) - (iAlto / 2);
   Debug ("Body Ancho: "+iBodyAncho+" Body Alto: "+iBodyAlto);
   Debug ("Cuadro Centrado: X: "+iX+" Y: "+iY+" Ancho: "+iAncho+" Alto: "+iAlto);
   Cuadro(oObjeto,iX,iY,iAncho,iAlto);
}

function Cuadro(oObjeto,iX,iY,iAncho,iAlto) {
   oObjeto.style.left = iX;
   oObjeto.style.top = iY;
   oObjeto.style.width = iAncho;
   oObjeto.style.height = iAlto;
}

// Oculta el resto de la pagina web
function Modal(oObjeto) {
    alert("Modal");
   var oOculta = document.getElementById('oculta');
   oOculta.style.top = 0;
   oOculta.style.left = 0;
//   oOculta.style.width = document.body.clientWidth;
   oOculta.style.width = document.body.scrollWidth;
   oOculta.style.height = document.body.scrollHeight;
   Transparente(oOculta,60);
}

function Transparente(oElemento,iValor) {
   if(oElemento.filters) {
      oElemento.style.filter = "alpha(opacity="+iValor+")";
   } else if (!(oElemento.style.MozOpacity === undefined)) {
      oElemento.style.MozOpacity = (iValor/100);
   } else if (!(oElemento.style.opacity === undefined)) {
      oElemento.style.opacity=(iValor/100);
   } else if (!(oElemento.style.khtmlOpacity === undefined)) {
      oElemento.style.khtmlOpacity=(iValor/100);
   } else {
      // Entonces no hagas nada
   }
}

function Visible( oElemento, bValor ) {
    if ( bValor ) {
        oElemento.style.visibility="visible";
    } else {
        oElemento.style.visibility="hidden";
    }
}

function Arrastra(elemento,evento) {
    if ( (evento === undefined) ) {
        evento = event;
    }
    var deltaX = evento.clientX - elemento.offsetLeft;
    var deltaY = evento.clientY - elemento.offsetTop;

//    Debug("El elemento tiene las propiedades: ");
//    DebugObj(elemento);
//    Debug("<br><br>El evento tiene las propiedades: ");
//    DebugObj(evento);
//    DebugObj(document.body);


    if (document.addEventListener) {
       document.addEventListener("mousemove", moveHandler, true);
       document.addEventListener("mouseup", upHandler, true);
       evento.stopPropagation( );
       evento.preventDefault( );
       Transparente(elemento,60);
    } else if (document.attachEvent) {
       document.attachEvent("onmousemove", moveHandler);
       document.attachEvent("onmouseup", upHandler);
       window.event.cancelBubble = true;
       window.event.returnValue = false;
//       Debug("attachEvent - Active Transparencia");
//       Transparente(elemento,60);
//       var oMuestra = document.getElementById('muestra');
//       var oSombra = document.getElementById('sombra');
//       Transparente(oMuestra,60);
//       Transparente(oSombra,10);
    }


    function moveHandler(evento) {
       if (!(evento.clientX === undefined)) {
          elemento.style.left = (evento.clientX - deltaX) + "px";
          elemento.style.top = (evento.clientY - deltaY) + "px";
       } else if (!(window.event.clientX === undefined)) {
          elemento.style.left = (window.event.clientX - deltaX) + "px";
          elemento.style.top = (window.event.clientY - deltaY) + "px";
       }
    }

    function upHandler(evento) {
       if (document.removeEventListener) {
          document.removeEventListener("mouseup", upHandler, true);
          document.removeEventListener("mousemove", moveHandler, true);
          evento.stopPropagation( );
          Transparente(elemento,100);
       } else if (document.detachEvent) {
          document.detachEvent("onmouseup", upHandler);
          document.detachEvent("onmousemove", moveHandler);
//          Debug("attachEvent - DesActive Transparencia");
//          Transparente(elemento,100);
//          var oMuestra = document.getElementById('muestra');
//          var oSombra = document.getElementById('sombra');
          //Transparente(oMuestra,100);
          //Transparente(oSombra,100);
       }
    }
}

function Debug(sTexto) {
   var oDebug=document.getElementById("debug");
   oDebug.innerHTML = oDebug.innerHTML + sTexto + "<br>\n";
}

function DebugObj(oObjeto) {
   var j, sDebug="----<br>\n";
   for (j in oObjeto) {
      sDebug += j+" = ";
      try {
         sDebug += oObjeto[j];
      } catch (e) {
         sDebug += " Nosepuedemostrar";
      }
      sDebug +="<br>\n";
   }
   Debug(sDebug+"-----<br><br>\n");
}

var oVentana;

function Ventana2(iX, iY, iAncho, iAlto){
   this.iX = iX;
   this.iY = iY;
   this.iAncho = iAncho;
   this.iAlto = iAlto;
   this.iMargen = 10;

   this.oVentana = document.createElement('div');
   this.oVentana.style.position = "absolute";
//   this.oVentana.id = "hi";
   //this.oVentana.style.border = "1px dotted black";
   //this.oVentana.style.backgroundColor = "#FFD0FF";
   this.oVentana.style.cursor = "move";
   this.oVentana.onmousedown = function (event) { Arrastra(this, event); };

   this.oMarco = document.createElement('div');
   this.oMarco.style.position = "absolute";
   this.oMarco.style.border = "1px solid blue";
   this.oMarco.style.backgroundColor = "white";
   this.oMarco.style.margin = "0px";
   this.oMarco.style.padding = "0px";

   this.oSombra = document.createElement('div');
   this.oSombra.style.position = "absolute";
   this.oSombra.style.backgroundColor = "#606060";

   this.oContenido = document.createElement('div');
   this.oContenido.style.position = "absolute";
   this.oContenido.style.padding = "0px";
   this.oContenido.style.overflow = "hidden";

   this.oModal = document.createElement('div');
   this.oModal.style.border = "0px solid black";
   this.oModal.style.backgroundColor = "black";
   this.oModal.style.position = "absolute";
   this.oModal.style.visibility="hidden";
   this.oModal.id = "modalhi";
   yo = this;
   this.oModal.onmousedown = function () { yo.visible(false); };

   document.documentElement.lastChild.appendChild(this.oModal);
   this.oVentana.appendChild(this.oSombra);
   this.oVentana.appendChild(this.oMarco);
   this.oVentana.appendChild(this.oContenido);
   document.documentElement.lastChild.appendChild(this.oVentana);

   this.pinta = function(){
      var iTempMargen;
      Cuadro(this.oVentana,this.iX,this.iY,this.iAncho,this.iAlto);
      Cuadro(this.oMarco,0,0,this.iAncho-5,this.iAlto-5);
      Cuadro(this.oSombra,5,5,this.iAncho-5,this.iAlto-5);
      Transparente(this.oSombra,60);
      iTempMargen=(this.iMargen*2)+5;
      Cuadro(this.oContenido,this.iMargen,this.iMargen,this.iAncho-iTempMargen,this.iAlto-iTempMargen);
      return 0;
   }
   this.modal = function(bValor) {
       var iAncho, iAlto;
      if (bValor) {
         this.oModal.style.top = 0;
         this.oModal.style.left = 0;
         iAncho = document.body.scrollWidth;
         iAlto = document.body.scrollHeight;
         if ( iAncho < document.body.clientWidth ) {
             iAncho = document.body.clientWidth;
         }
         if ( iAlto < document.body.clientHeight ) {
             iAlto = document.body.clientHeight;
         }
         //this.oModal.style.width = document.body.clientWidth;
         //this.oModal.style.height = document.body.clientHeight;
         this.oModal.style.width = iAncho;
         this.oModal.style.height = iAlto;
         Visible( this.oModal, true );
         //this.oModal.style.visibility="visible";
         Transparente(this.oModal,60);
      } else {
         Visible( this.oModal, false );
         //this.oModal.style.visibility="hidden";
      }
   }
   this.setContenido = function(sValor) {
      this.oContenido.innerHTML = sValor;
   }
   this.resize = function (iX,iY,iAncho,iAlto) {
      this.iX = iX;
      this.iY = iY;
      this.iAncho = iAncho;
      this.iAlto = iAlto;
      this.pinta();
   }
   this.center = function () {
       var iX, iY;
       var iBodyAncho = document.body.clientWidth;
       var iBodyAlto = document.body.clientHeight;
       iX = (iBodyAncho / 2) - (this.iAncho / 2);
       iY = (iBodyAlto / 2) - (this.iAlto / 2);
       this.iX = iX;
       this.iY = iY;
   }
   this.visible = function (bValor) {
       if ( bValor ) {
           this.modal(1);
           Visible( this.oVentana , true );
       } else {
           this.modal(0);
           Visible( this.oVentana, false);
       }
   }
}

function prueba2() {
  oVent = new Ventana2(50,50,150,150);
  oVent2 = new Ventana2(150,100,250,250);
  oVent.modalColor = "black";
  oVent.modal(0);
  oVent.setContenido('<h1 align="center">Hola</h1><p align="center">Este es un parrafo</p>');
  oVent.pinta();
  oVent2.modal(0);
  oVent2.pinta();
  oVent2.modalColor="black";
  oVent2.setContenido('<div style="text-align: center;"><a href="#" onclick="Resize();">Cambia Tama&ntilde;o y Posici&oacute;n</a></div><p>Otra cosa</p>');
}

function Resize() {
  if (bTamanio) {
    oVent2.resize(150,100,250,250);
  } else {
    oVent2.resize(300,300,200,75);
  }
  bTamanio = !bTamanio;
}

var oVent, oVent2;
var bTamanio;