function winPopup(id,titulo) {
   objBody = document.getElementsByTagName("body").item(0);
   this.objPopup = document.createElement("div");
   this.objPopup.setAttribute('id','popup_'+id);
   this.objPopup.style.display = 'none';
   this.objPopup.style.position = 'absolute';
   this.objPopup.style.top = '0';
   this.objPopup.style.left = '0';
	this.objPopup.style.width = 'auto';
   this.objPopup.style.height = 'auto';
   this.objPopup.style.zIndex = '1500';
   objBody.insertBefore(this.objPopup, objBody.firstChild);
   this.objPopup.innerHTML =  "<table width='250' border='0' align='center' cellpadding='3' cellspacing='0' class='encabezado'>" + 
                              "<tr><td><table width='100%' border='0' cellpadding='0' cellspacing='0'>" +
                              "<tr><td height='20'><b><div id='titulo_"+id+"'>" + titulo + "</div></b></td>" +
                              "<td align='right'><span title='Cerrar' style='cursor:pointer;' onClick='"+id+".hide();'><b>X</b></span></td></tr>" +
                              "</table></td></tr>" +
                              "<tr><td bgcolor='#FFFFFF' align='center' height='150' id='cuerpo_"+id+"'></td></tr>" +
                              "</table>";
   this.objOverlay = document.getElementById("overlay");
   if(!this.objOverlay) {
      this.objOverlay = document.createElement("div");
      this.objOverlay.setAttribute('id','overlay');
      this.objOverlay.style.backgroundImage = 'url(/images/overlay.png)';
      this.objOverlay.style.backgroundColor = 'transparent';
      this.objOverlay.style.filter = 'progid:DXImageTransform.Microsoft.AlphaImageLoader(src="/images/overlay.png", sizingMethod="scale")';
      this.objOverlay.style.display = 'none';
      this.objOverlay.style.position = 'absolute';
      this.objOverlay.style.top = '0';
      this.objOverlay.style.left = '0';
      this.objOverlay.style.zIndex = '1250';
      this.objOverlay.style.width = '100%';
      this.objOverlay.style.height = '100%';
      objBody.insertBefore(this.objOverlay, objBody.firstChild);
   }
   this.w = 0;
   this.h = 0;
   this.yScroll = 0;
   this.objFrame = null;
   this.archivos = new Array();
   this.total_archivos = 0;
   this.w_th = 100;
   this.getPageScroll = function() {
      var yScroll;
      if (self.pageYOffset) yScroll = self.pageYOffset;
      else if (document.documentElement && document.documentElement.scrollTop) yScroll = document.documentElement.scrollTop;
      else if (document.body) yScroll = document.body.scrollTop;
      return yScroll;
   }
   this.getPageSize = function() {
      var xScroll, yScroll;
      if (window.innerHeight&&window.scrollMaxY) {
         xScroll = document.body.scrollWidth;
         yScroll = window.innerHeight + window.scrollMaxY;
      } else if (document.body.scrollHeight>document.body.offsetHeight){
         xScroll = document.body.scrollWidth;
         yScroll = document.body.scrollHeight;
      } else {
         xScroll = document.body.offsetWidth;
         yScroll = document.body.offsetHeight;
      }
      var windowWidth, windowHeight;
      if (self.innerHeight) {
         windowWidth = self.innerWidth;
         windowHeight = self.innerHeight;
      } else if (document.documentElement&&document.documentElement.clientHeight) {
         windowWidth = document.documentElement.clientWidth;
         windowHeight = document.documentElement.clientHeight;
      } else if (document.body) {
         windowWidth = document.body.clientWidth;
         windowHeight = document.body.clientHeight;
      }
      if (xScroll<windowWidth) pageWidth = windowWidth;
      else pageWidth = xScroll;
      if (yScroll<windowHeight) pageHeight = windowHeight;
      else pageHeight = yScroll;
      arrayPageSize = new Array(pageWidth,pageHeight,windowWidth,windowHeight);
      return arrayPageSize;
   }
   this.hide = function() {
      if (this.objFrame) this.objFrame.style.display = "none";
      this.objPopup.style.display = "none";
      this.objOverlay.style.display = 'none';
   }
   this.show = function() {
      this.objOverlay.style.display = 'block';
      this.objPopup.style.display = "block";
      this.center();
      if (this.objFrame) this.objFrame.style.display = "block";
   }
   this.center = function() {
      var arrayPageSize = this.getPageSize();
      pageWidth = arrayPageSize[0];
      pageHeight = arrayPageSize[1];
      windowWidth = arrayPageSize[2];
      windowHeight = arrayPageSize[3];
		this.w = document.getElementById("popup_"+id).offsetWidth;
      this.h = document.getElementById("popup_"+id).offsetHeight;
      this.yScroll = this.getPageScroll();
      this.objOverlay.style.width = pageWidth + 'px';
      this.objOverlay.style.height = pageHeight + this.yScroll + 'px';
      var x = (pageWidth-this.w-12)/2;
      if (x<0) x = 0;
      this.objPopup.style.left = x + 'px';
      var y = (windowHeight-this.h)/2;
      if (y<0) y = 0;
      y = y + this.yScroll;
      this.objPopup.style.top = y + 'px';
   }
   this._titulo = function(html) {
      document.getElementById("titulo_"+id).innerHTML = html;
   }
   this._popup = function(html) {
      document.getElementById("cuerpo_"+id).innerHTML = html;
   }
   this._iframe = function(url,w,h) {
      document.getElementById("cuerpo_"+id).innerHTML = "<iframe name='iframe_"+id+"' id='iframe_"+id+"' src='"+url+"' width='"+w+"' height='"+h+"' frameborder='0' scrolling='auto'></iframe>";
      this.objFrame = document.getElementById("iframe_"+id);
   }
   this._src = function(url) {
      document.getElementById("iframe_"+id).src = url;
   }
   this.galeria = function(archivos, num_cols) {
      this.archivos = archivos;
      if (num_cols===undefined) num_cols = 5;
      var num = 0;
      var row = 1;
      var col = 1;
      this.total_archivos = this.archivos.length;
      if (this.total_archivos<num_cols) num_cols = this.total_archivos;
      var num_rows = parseInt(this.total_archivos/num_cols);
      if (this.total_archivos%num_cols!=0) num_rows++;
      document.write("<table width='100%' cellpadding='10' cellspacing='0' class='fila_impar'>");
      while (row<=num_rows) {
         col = 1;
         document.write("<tr align=center>");
         while (col<=num_cols) {
            if (num<this.total_archivos) {
               document.write("<td><a href='#' onClick='"+id+".muestraArchivo("+num+");return false;'><img src='"+this.archivos[num][0]+"' width='"+this.w_th+"' class='borde' alt='"+this.archivos[num][1]+"'></a></td>");
               num++;
            } else document.write("<td>&nbsp;</td>");
            col++;
         }
         document.write("</tr>");
         row++;
      }
      document.write("</table>");
      var html =  "<table width='100%' border='0' align='center'>" +
                  "<tr><td id='galeria_archivo'></td></tr>" +
                  "<tr><td align='center' id='galeria_pie'></td></tr>" +
                  "<tr><td><table width='100%' border='0' align='center'>" +
                  "<tr><td width='20%' align='center' id='inicio'></td>" +
                  "<td width='20%' align='center' id='anterior'></td>" +
                  "<td width='20%' align='center' id='num_archivo'></td>" +
                  "<td width='20%' align='center' id='siguiente'></td>" +
                  "<td width='20%' align='center' id='fin'></td></tr>" +
                  "</table></td></tr>" +
                  "</table>";
      document.getElementById("cuerpo_"+id).innerHTML = html;
   }
   this.muestraArchivo = function(num) {
      eval(id+".cambiaArchivo("+num+")");
      eval(id+".show()");
   }
   this.cambiaArchivo = function(num) {
      var fin = this.total_archivos - 1;
      document.getElementById("galeria_archivo").innerHTML = "<img src='"+this.archivos[num][0]+"' class='borde' alt='"+this.archivos[num][1]+"'>";
      document.getElementById("galeria_pie").innerHTML = this.archivos[num][1];
      if (num>0) {
         document.getElementById("inicio").innerHTML = "<a href='#' onClick='"+id+".cambiaArchivo(0);return false;' id='inicio'><img src='/images/doble_atras.gif' width='12' height='10' alt='Inicio' border='0'></a>";
         document.getElementById("anterior").innerHTML = "<a href='#' onClick='"+id+".cambiaArchivo("+(num-1)+");return false;' id='anterior'><img src='/images/flecha_atras.gif' width='10' height='10' alt='Anterior' border='0'></a>";
      } else {
         document.getElementById("inicio").innerHTML = "";
         document.getElementById("anterior").innerHTML = "";
      }
      document.getElementById("num_archivo").innerHTML = (num+1) + "/" + this.total_archivos;
      if (num<fin) {
         document.getElementById("siguiente").innerHTML = "<a href='#' onClick='"+id+".cambiaArchivo("+(num+1)+");return false;' id='siguiente'><img src='/images/flecha_adelante.gif' width='10' height='10' alt='Siguiente' border='0'></a>";
         document.getElementById("fin").innerHTML = "<a href='#' onClick='"+id+".cambiaArchivo("+fin+");return false;' id='fin'><img src='/images/doble_adelante.gif' width='12' height='10' alt='Fin' border='0'></a>";
      } else {
         document.getElementById("siguiente").innerHTML = "";
         document.getElementById("fin").innerHTML = "";
      }
      eval(id+".center()");
   }
   var windowOnResize = (window.onresize) ? window.onresize : function () {};
   window.onresize = function() {
      windowOnResize();
      eval(id+".center();");
   }
}

