var paginaActual = 1;
var columnasTotales = 1;
var totalPaginas = 0;
var altura = 0;
var altoFila = 0;	
var primeraVez = true;
var anchoColumna = 8;

function encolumnar(recargar)
{
	if (anchoColumna < 2)
	{
		anchoColumna = 2;
	}
	document.getElementById("contenido").style.lineHeight = altoFila + "px";
	document.getElementById("tablaInterior").style.lineHeight = altoFila + "px";

	document.getElementById("tablaInterior").style.height = "";
	altura = document.getElementById("contenido").clientHeight;			

	var anchura = (document.getElementById("contenido").clientWidth / columnasTotales) - anchoColumna;

	document.getElementById("tablaInterior").style.width = anchura + "px";
	
	totalPaginas = Math.floor(document.getElementById("tablaInterior").clientHeight / altura);

	lineasTotales = Math.floor ( altura / altoFila );
	alturaRedondeada = lineasTotales * altoFila ;
	sobrante = altura - alturaRedondeada;

	if ((document.getElementById("tablaInterior").clientHeight % altura) > 0)
	{
		totalPaginas++;
	}
	document.getElementById("tablaInterior").style.height = alturaRedondeada + "px" ;
	document.getElementById("tablaInterior").style.marginBottom = sobrante + "px" ;

	if (recargar)
	{		
		
		var contenedor = document.getElementById("contenido");
				
		//primero eliminamos los parrafos que existan de paginaciones anteriores
		for (var cont = 1; cont < 5; cont++)
		{
			var el = document.getElementById("tablaInterior" + (cont + 1));
			if (el != null)
			{
			alert(el);
				contenedor.removeChild(el);
			}
		}
		
		if (primeraVez)
		{
			primeraVez = false;
		}
		else
		{
			//borrar el ultimo párrafo que controla la minima altura
			document.getElementById("tablaInterior").innerHTML = document.getElementById("tablaInterior").innerHTML.substring(0, document.getElementById("tablaInterior").innerHTML.toLowerCase().lastIndexOf("<p"));
			totalPaginas--;
		}
		//crear tantos div tablaInterior como columnas que queremos
		for (var cont = 1; cont < columnasTotales; cont++)
		{
			var nuevoDiv =  document.createElement("div");
			nuevoDiv.id  = "tablaInterior" + (cont + 1);	

			var anteriorDiv;
			if (cont == 1){
				anteriorDiv = document.getElementById("tablaInterior");
			}else{
				anteriorDiv = document.getElementById("tablaInterior" + cont);
			}
			nuevoDiv.className = anteriorDiv.className;
			nuevoDiv.style.width = anteriorDiv.style.width;
			nuevoDiv.style.float = "left";
			nuevoDiv.style.overflow = anteriorDiv.style.overflow;
			nuevoDiv.style.position = anteriorDiv.style.position;
			nuevoDiv.style.left = anteriorDiv.style.left;

			nuevoDiv.style.height = alturaRedondeada - sobrante + "px" ;
			nuevoDiv.style.paddingTop = anteriorDiv.style.marginBottom ;
			nuevoDiv.style.marginBottom = sobrante + "px" ;
			
			nuevoDiv.style.paddingLeft = anchoColumna + "px";

			nuevoDiv.innerHTML = anteriorDiv.innerHTML;
			contenedor.appendChild(nuevoDiv);				

		}		
		
		//añadir el parrafo altura a tablainterior
		contenedor = document.getElementById("tablaInterior");
		var nuevoParrafoAltura =  document.createElement("p");
		nuevoParrafoAltura.id  = "parrafoAltura";
		nuevoParrafoAltura.style.lineHeight = altura + "px";
		nuevoParrafoAltura.innerHTML = "&nbsp;";
		contenedor.appendChild(nuevoParrafoAltura);		
		
//		var parrafo = "<p id=\"parrafoAltura\" style=\"line-height: " + altura + "px\">&nbsp;</p>";
//		document.getElementById("tablaInterior").innerHTML += parrafo;		

		for (var cont = 1; cont < columnasTotales; cont++)
		{
			parrafo = "<p id=\"parrafoAltura" + (cont + 1) + "\" style=\"line-height: " + altura + "px\">&nbsp;</p>";
			document.getElementById("tablaInterior" + (cont + 1)).innerHTML = document.getElementById("tablaInterior" + (cont + 1)).innerHTML + parrafo;
		}
		document.getElementById("tablaInterior").style.paddingLeft = (anchoColumna / 2) + "px";		
	}
	else if (!primeraVez)
	{
		document.getElementById("parrafoAltura").style.lineHeight = altura + "px";
		for (var cont = 1; cont < columnasTotales; cont++)
		{
			document.getElementById("tablaInterior" + (cont + 1)).style.height = altura + "px";
			document.getElementById("parrafoAltura" + (cont + 1)).style.lineHeight = altura + "px";
		
			var anteriorDiv;
			if (cont == 1)
			{
				anteriorDiv = document.getElementById("tablaInterior");
			}
			else
			{
				anteriorDiv = document.getElementById("tablaInterior" + cont);
			}
			document.getElementById("tablaInterior" + (cont + 1)).style.height = alturaRedondeada - sobrante + "px" ;
			document.getElementById("tablaInterior" + (cont + 1)).style.paddingTop = anteriorDiv.style.marginBottom ;
			document.getElementById("tablaInterior" + (cont + 1)).style.marginBottom = sobrante + "px" ;
		}

		totalPaginas--;
	}

	if (!primeraVez)
	{
		//aqui ver si puede seguir en la misma pagina
		if (((paginaActual - 1) * columnasTotales) >= totalPaginas)
		{
			paginaActual--;
		}
		
		paginar();
	}
	actualizarBotones();
}

function siguiente()
{
	if ((paginaActual * columnasTotales) < (totalPaginas))
	{
		paginaActual++;
		
		paginar();
	}
	else
	{
		alert("no hay mas paginas");
	}
	actualizarBotones();
}

function anterior()
{
	if (paginaActual > 1)
	{
		paginaActual--;
		paginar();
	}
	else
	{
		alert("no hay mas paginas");
	}
	actualizarBotones();
}

function paginar()
{
		var posicionPagina = alturaRedondeada * columnasTotales * (paginaActual - 1);

		document.getElementById("tablaInterior").scrollTop = posicionPagina;

		for (var cont = 1; cont < columnasTotales; cont++)
		{
			document.getElementById("tablaInterior" + (cont + 1)).scrollTop = posicionPagina + (alturaRedondeada * cont) + sobrante;
		}
}

function actualizarBotones()
{
  try
  {

    if (paginaActual == 1)
    {
        document.getElementById("pag_anterior").style.display = "none";
        document.getElementById("pag_anterior2").style.display = "none";
    }
    else
    {
            document.getElementById("pag_anterior").style.display = "";
            document.getElementById("pag_anterior2").style.display = "";
    }
    if (paginaActual == totalPaginas)
    {
        document.getElementById("pag_siguiente").style.display = "none";
        document.getElementById("pag_siguiente2").style.display = "none";
    }
    else
    {
    	try
    	{
        document.getElementById("pag_siguiente").style.display = "";
        document.getElementById("pag_siguiente2").style.display = "";
        }
        catch(e){}
    }
    if (totalPaginas == 1)
    {
    	document.getElementById("pagFooter").style.visibility = "hidden";
    	document.getElementById("pagFooter2").style.visibility = "hidden";
    }
    
   }
   catch(e){}

}

function cargarBotonesPaginacion()
{
	if (document.getElementById("pagFooter") != null)
	{
		var divContenedorPaginacion = document.getElementById("pagFooter");
		var boton;
		var span;
		
		boton = document.createElement("a");
		boton.title = "anterior";
		boton.className = "pestana_left";
		boton.id = "pag_anterior";
		boton.href = "javascript:anterior();";
		divContenedorPaginacion.appendChild(boton);

		span = document.createElement("span");
		span.className = "pestana_middle";
		span.innerHTML = "<div class=\"spacer\"></div>";		
		divContenedorPaginacion.appendChild(span);

		boton = document.createElement("a");
		boton.title = "siguiente";
		boton.className = "pestana_right";
		boton.id = "pag_siguiente";
		boton.href = "javascript:siguiente();";
		divContenedorPaginacion.appendChild(boton);

		divContenedorPaginacion = document.getElementById("pagFooter2");
		
		boton = document.createElement("a");
		boton.title = "anterior";
		boton.className = "pestana_left";
		boton.id = "pag_anterior2";
		boton.href = "javascript:anterior();";
		divContenedorPaginacion.appendChild(boton);

		span = document.createElement("span");
		span.className = "pestana_middle";
		span.innerHTML = "<div class=\"spacer\"></div>";		
		divContenedorPaginacion.appendChild(span);

		boton = document.createElement("a");
		boton.title = "siguiente";
		boton.className = "pestana_right";
		boton.id = "pag_siguiente2";
		boton.href = "javascript:siguiente();";
		divContenedorPaginacion.appendChild(boton);
	}
}
