// BRF 2006 para R Cable y Telecomunicaciones
//
// funciones basadas en LighBox.JS (www.huddletogether.com/projects/lightbox/)
// y sobre todo subModal (http://www.subimage.com/dhtml/subModal/), de donde se han
// tomado algunas funciones auxiliares
//
// lanza una capa centrada sobre todo el web oscureciendo lo que hay detr?s (semitransparente)
// y encima un Flash, una imagen, un iFrame, un VideoLAN/PCTV, etc.

var gPopMask = null;
var gPopContenido = null;
var gImagenMultimedia = null;
var bPopupAbierto = false;
var margenPopContenido = 28; // margen alrededor del multimedia
var gHideSelects = false;


function abrirPopUpMultimedia(ancho, alto, tipo, url, titulo, descripcion) {

  gHideSelects = false;

  var brsVersion = parseInt(window.navigator.appVersion.charAt(0), 10);
  if (brsVersion <= 6 && window.navigator.userAgent.indexOf("MSIE") > -1) {
    gHideSelects = true;
  }

  if(gHideSelects){
    hideSelectBoxes();
  }

  if (!bPopupAbierto)
  {
      var body = document.getElementsByTagName('body')[0];

      if (gPopMask==null)
      {
        // creamos el DIV con el fondo
        var lPopMask = null;
                    var fullHeight = getViewportHeight();
                    var fullWidth = getViewportWidth();

        lPopMask = document.createElement('div');
        lPopMask.id = 'mascaraPopUp';
        lPopMask.style.position = 'absolute';
        lPopMask.style.zIndex = '200';

        lPopMask.style.top ="0px";
        lPopMask.style.left ="0px";

        lPopMask.style.width = fullWidth+"px";
        lPopMask.style.height = document.body.clientHeight + "px";
        lPopMask.style.opacity = '.6';
        lPopMask.style.filter = 'alpha(opacity=60)';
        lPopMask.style.backgroundColor = '#666666';
        lPopMask.style.backgroundImage = 'none';
        lPopMask.style.backgroundRepeat =  'repeat';
        lPopMask.style.display = 'none';
        body.appendChild(lPopMask);

        gPopMask = document.getElementById('mascaraPopUp');
      }

      if (gPopContenido==null)
      {
        // preparamos el contenido del <div>
        var sContenido;

        if (tipo == 'flash')
        {
          // es un flash, con el ancho y alto especificado y como movie el par?metro URL
          sContenido = '<object width="' + ancho + '" height="' + alto + '"><param name="wmode" value="transparent"><param name="movie" value="' + url + '"></param><embed src="' + url + '" type="application/x-shockwave-flash" width="' + ancho + '" height="' + alto + '"></embed></object>';
        }
        else if (tipo == 'flv')
        {
          sContenido = '<object width="' + ancho + '" height="' + alto + '"><param name="wmode" value="transparent" /><param name="movie" value="/Corporativo/players/video/player.swf?video=' + url +'&buffer=2"></param><embed src="/Corporativo/players/video/player.swf?video=' + url +'&buffer=2" type="application/x-shockwave-flash" width="' + ancho + '" height="' + alto + '"></embed></object>';
        }
        else if (tipo == 'mp3')
        {
          sContenido = '<object type="application/x-shockwave-flash" data="/Corporativo/players/audio/player.swf" '+
            'width="'+ ancho +'" height="' + alto + '" id="audioplayer1">'+
            '<param name="movie" value="/Corporativo/players/audio/player.swf"/>'+
            '<param name="FlashVars" value="playerID=1&amp;bg=0xf8f8f8&amp;leftbg=0xeeeeee&amp;lefticon=0x666666'+
            '&amp;rightbg=0xcccccc&amp;rightbghover=0x999999&amp;righticon=0x666666&amp;righticonhover=0xFFFFFF'+
            '&amp;text=0x666666&amp;slider=0xFF9900&amp;track=0xFFFFFF&amp;border=0x666666&amp;loader=0x98CA00'+
            '&amp;soundFile=' + escape(url) + '"/>'+
            '<param name="quality" value="high"/>'+
            '<param name="menu" value="false"/>'+
            '<param name="wmode" value="transparent"/></object>';
        }
        else if (tipo == 'iframe')
        {
          // es un iframe, con el ancho y alto especificado y que carga como contenido lo indicado en el par?metro URL
          sContenido = '<iframe border="0" width="' + ancho + '" height="' + alto + '" src="' + url + '"><img align="center" alt="" src="../images/R/espera.gif"></iframe>';
        }
        else if (tipo == 'imagen')
        {
          sContenido = '<img id="iPopImagenMultimedia" align="center" alt="" src="../images/R/espera.gif">';
          // y seguimos m?s abajo...
        }
        else if (tipo == 'videolan')

        {
          sContenido = '<OBJECT classid="clsid:E23FE9C6-778E-49D4-B537-38FCDE4887D8" codebase="http://downloads.videolan.org/pub/videolan/vlc/latest/win32/axvlc.cab" ' +
            ' width="' + ancho + '" height="' + alto + '" id="PCTVplayer" events="True">' +
            '<param name="Src" value="' + url + '" />'  +
            '<param name="ShowDisplay" value="True" /><param name="AutoLoop" value="True" /><param name="AutoPlay" value="True" />' +
            '<embed name="PCTVplayer" autoplay="yes" loop="yes" target="' + url + '" type="application/x-vlc-plugin" width="' + ancho + '" height="' + alto + '"></embed></OBJECT>';
        }
        else
          // esto debe ser un error
          sContenido = '<img id="iPopImagenMultimedia" align="center" alt="" src="/weblog/t.gif/R/espera.gif">';

        var scLeft;
        var scTop;
        var body = document.getElementsByTagName('body')[0];

        if (self.pageYOffset) // all except Explorer
        {
          scLeft = self.pageXOffset;
          scTop = self.pageYOffset;
        }
        else if (document.documentElement && document.documentElement.scrollTop)
          // Explorer 6 Strict
        {
          scLeft = document.documentElement.scrollLeft;
          scTop = document.documentElement.scrollTop;
        }
        else if (document.body) // all other Explorers
        {
          scLeft = body.scrollLeft;
          scTop = body.scrollTop;
        }
        // creamos el DIV con el contenido
        var lPopContenido = null;
        lPopContenido = document.createElement('div');
        lPopContenido.style.display = 'none';
        lPopContenido.id = 'contenidoPopUp';
        lPopContenido.style.position = 'absolute';
        lPopContenido.style.zIndex = '201';

        lPopContenido.style.top = scTop+"px";
        lPopContenido.style.left = scLeft+"px";

        lPopContenido.style.width = (ancho + margenPopContenido*2) + 'px';
        lPopContenido.style.height = (alto + margenPopContenido*2) + 'px';
        lPopContenido.style.backgroundColor = '#FFFFFF';
        body.appendChild(lPopContenido);

        gPopContenido = document.getElementById('contenidoPopUp');
        gPopContenido.innerHTML =
            '<table width="100%" height="100%" cellpadding="0" cellspacing="0"  border="0">' +
            '<tr><td><img src="/weblog/images/R/t.gif" width="' + margenPopContenido + 'px" height="' + margenPopContenido + 'px"></td><td align="right"></td><td align="center"><a href="javascript:cerrarPopUpMultimedia();"><img border="0" src="/weblog/images/R/close.gif"></a></td></tr>' +
            '<tr><td></td><td valign="middle" align="center" width="100%" height="100%" >' + sContenido + '</td><td></td></tr>' +
            '<tr><td></td><td valign="middle" align="center" width="100%">' + titulo + '</td><td></td></tr>' +
            '<tr><td></td><td valign="middle" align="center" width="100%">' + descripcion + '</td><td></td></tr>' +
            '<tr><td colspan="2"></td><td><img src="/weblog/images/R/t.gif" width="' + margenPopContenido + 'px" height="' + margenPopContenido + 'px"></td>' +
            '</table>';

        addEvent(gPopMask, "click", cerrarPopUpMultimedia);
      }

      if (tipo = "iframe") {
        centrar (ancho + margenPopContenido*2, alto + margenPopContenido*3);
      }
      bPopupAbierto = true;
      gPopMask.style.display = 'block';
      gPopContenido.style.display = 'block';



      //centrarPopUpMultimedia(ancho + margenPopContenido*2, alto + margenPopContenido*3);


      /* No queremos q mueva la imagen al hacer scroll por problemas con imagenes altas
      window.onscroll = centrarPopUpMultimedia;
      addEvent(window, "resize", centrarPopUpMultimedia);*/

      // terminamos en caso de que sea imagen, cargando en background la que sustituir? a la de "wait"
      // lo hacemos al final no vaya a ser que no existiera a?n nada y terminara de cargar la imagen

      if (tipo=='imagen')
      {
        gImagenMultimedia = new Image();
        gImagenMultimedia.onload = swapImagenesPopUpMultimedia; // ya nos avisar? cuando termine
        gImagenMultimedia.src = url;
      }
  }
}

// funci?n que cierra el popup; lo hace al pulsar el "cerrar" o al clickar fuera, en la zona gris

function cerrarPopUpMultimedia() {

  if(gHideSelects){
                displaySelectBoxes();
        }

  //document.listavideos.lista.style.visibility="visible";

  if (gPopMask!=null)
  {
    if (bPopupAbierto) {
      bPopupAbierto = false;
      gPopContenido.style.display = 'none';
      gPopMask.style.display = 'none';

      window.onscroll = null;
      removeEvent(window, "resize", centrarPopUpMultimedia);

      // nos cargamos tambi?n del HTML el objeto
      var body = document.getElementsByTagName('body')[0];
      body.removeChild(gPopContenido);
      gPopContenido = null;
      body.removeChild(gPopMask);
      gPopMask = null;
    }
  }
}

// funci?n de centrado de las capas para la primera vez que aparecen, para cuando se termina
// de cargar la imagen (si es de tipo "imagen"), cuando se hace scroll o cuando el usuario
// cambia la ventana del navegador


function centrarPopUpMultimedia(width, height) {


  if (bPopupAbierto) {

    if (width == null || isNaN(width)) {
      width = gPopContenido.offsetWidth;
    }
    if (height == null || isNaN(height)) {
      height = gPopContenido.offsetHeight;
    }

    var fullHeight = getViewportHeight();
    var fullWidth = getViewportWidth();

    var theBody = document.getElementsByTagName('body')[0]; //document.documentElement;

//		var scTop = parseInt(theBody.scrollTop,10);
//		var scLeft = parseInt(theBody.scrollLeft,10);

    if (self.pageYOffset) // all except Explorer
    {
      scLeft = self.pageXOffset;
      scTop = self.pageYOffset;
    }
    else if (document.documentElement && document.documentElement.scrollTop)
      // Explorer 6 Strict
    {
      scLeft = document.documentElement.scrollLeft;
      scTop = document.documentElement.scrollTop;
    }
    else if (document.body) // all other Explorers
    {
      scLeft = theBody.scrollLeft;
      scTop = theBody.scrollTop;
    }
    //La capa q se utiliza como fondo la pondremos con el tama?o de la ventana
    gPopMask.style.height = document.body.clientHeight + "px";
    gPopMask.style.width = fullWidth + "px";
    gPopMask.style.top = "0px";
    gPopMask.style.left = scLeft + "px";

    gPopContenido.style.width = width +  "px";
    gPopContenido.style.height = "";


    //Si la imagen es mas alta le ponemos como top scTop
    if (fullHeight > height){
      gPopContenido.style.top = (scTop + ((fullHeight - height) / 2)) + "px";
    }
    else{
      gPopContenido.style.top = (scTop) + "px";
    }
    //Si la imagen es mas anccha le ponemos como top scTop
    if (fullWidth > width){
      gPopContenido.style.left =  (scLeft + ((fullWidth - width) / 2)) + "px";
    }
    else{
      gPopContenido.style.left =  (scLeft) + "px";
    }

  }
}

function centrar(width, height) {

  if (width == null || isNaN(width)) {
      width = gPopContenido.offsetWidth;
    }
    if (height == null || isNaN(height)) {
      height = gPopContenido.offsetHeight;
    }

    var fullHeight = getViewportHeight();
    var fullWidth = getViewportWidth();

    var theBody = document.getElementsByTagName('body')[0]; //document.documentElement;

//		var scTop = parseInt(theBody.scrollTop,10);
//		var scLeft = parseInt(theBody.scrollLeft,10);

    if (self.pageYOffset) // all except Explorer
    {
      scLeft = self.pageXOffset;
      scTop = self.pageYOffset;
    }
    else if (document.documentElement && document.documentElement.scrollTop)
      // Explorer 6 Strict
    {
      scLeft = document.documentElement.scrollLeft;
      scTop = document.documentElement.scrollTop;
    }
    else if (document.body) // all other Explorers
    {
      scLeft = theBody.scrollLeft;
      scTop = theBody.scrollTop;
    }
    //La capa q se utiliza como fondo la pondremos con el tama?o de la ventana
    gPopMask.style.height = document.body.clientHeight + 100 + "px";
    gPopMask.style.width = fullWidth + "px";
    gPopMask.style.top = "0px";
    gPopMask.style.left = scLeft + "px";

    gPopContenido.style.width = width +  "px";
    gPopContenido.style.height = "";


    //Si la imagen es mas alta le ponemos como top scTop
    if (fullHeight > height){
      gPopContenido.style.top = (scTop + ((fullHeight - height) / 2)) + "px";
    }
    else{
      gPopContenido.style.top = (scTop) + "px";
    }
    //Si la imagen es mas anccha le ponemos como top scTop
    if (fullWidth > width){
      gPopContenido.style.left =  (scLeft + ((fullWidth - width) / 2)) + "px";
    }
    else{
      gPopContenido.style.left =  (scLeft) + "px";
    }




}

// esta funci?n se llama cuando se carga la imagen referenciada en gImagenMultimedia

function swapImagenesPopUpMultimedia() {

    // swapeamos la imagen existente ("wait") por ?sta

    var lImagen = document.getElementById("iPopImagenMultimedia");

    lImagen.src = gImagenMultimedia.src;

    // redimensionamos las capas para que quepa la imagen
    centrarPopUpMultimedia(gImagenMultimedia.width + margenPopContenido*2, gImagenMultimedia.height + margenPopContenido*3);
}

// funciones auxiliares =========================================================

function addEvent(obj, evType, fn){
 if (obj.addEventListener){
    obj.addEventListener(evType, fn, false);
    return true;
 } else if (obj.attachEvent){
    var r = obj.attachEvent("on"+evType, fn);
    return r;
 } else {
    return false;
 }
}
function removeEvent(obj, evType, fn, useCapture){
  if (obj.removeEventListener){
    obj.removeEventListener(evType, fn, useCapture);
    return true;
  } else if (obj.detachEvent){
    var r = obj.detachEvent("on"+evType, fn);
    return r;
  } else {
    alert("Handler could not be removed");
  }
}
function getViewportHeight() {
  if (window.innerHeight!=window.undefined) return window.innerHeight;
  if (document.compatMode=='CSS1Compat') return document.documentElement.clientHeight;
  if (document.body) return document.body.clientHeight;
  return window.undefined;
}
function getViewportWidth() {
  if (window.innerWidth!=window.undefined) return window.innerWidth;
  if (document.compatMode=='CSS1Compat') return document.documentElement.clientWidth;
  if (document.body) return document.body.clientWidth;
  return window.undefined;
}

/**
* Hides all drop down form select boxes on the screen so they do not appear above the mask layer.
* IE has a problem with wanted select form tags to always be the topmost z-index or layer
*
* Thanks for the code Scott!
*/
function hideSelectBoxes() {

  for(var i = 0; i < document.forms.length; i++) {
    for(var e = 0; e < document.forms[i].length; e++){
      if(document.forms[i].elements[e].tagName == "SELECT") {
        document.forms[i].elements[e].style.visibility="hidden";
      }
    }
  }
}

/**
* Makes all drop down form select boxes on the screen visible so they do not reappear after the dialog is closed.
* IE has a problem with wanted select form tags to always be the topmost z-index or layer
*/
function displaySelectBoxes() {
  for(var i = 0; i < document.forms.length; i++) {
    for(var e = 0; e < document.forms[i].length; e++){
      if(document.forms[i].elements[e].tagName == "SELECT") {
      document.forms[i].elements[e].style.visibility="visible";
      }
    }
  }
}

function PopupPic(sPicURL, titulo, descripcion) {
   if (titulo!=''){
     titulo = "titulo: "+titulo;
   }
   if (descripcion!=''){
     descripcion = "descripcion: "+descripcion;
   }
   abrirPopUpMultimedia(640,480,'imagen',sPicURL, titulo, descripcion);
}