// JavaScript Document
/*Coloque un codigo similar al siguiente en la cabecera de su documento

<SCRIPT language="javascript" src="album.js"></SCRIPT>

Coloque un codigo similar al siguiente en el lugar donde quiera colocar el ambum de fotos
<SCRIPT language="javascript">
directorio = "album";
nfotos = 11;
ajustanch = 760;
titulos = new Array("infantil","jugar es importante","En talleres","En la guardería","Talleres","Jugando se aprende","todos aprenden","Instituto","trabajando""Centro de adultos");
estilo = "titfotos";
fotosfila =4;
nuevaventana = true;
poneralbum();
</SCRIPT>


directorio --> Indica la carpeta donde esta almacenado el album de fotos. En el deberán 
crearse dos carpetas, una con nombre 'chicas' donde se almacenaran las fotos en miniatura y 
otra con nombre grandes donde se almacenaran las fotos en tamaño grande. Tenga en cuenta que 
el tamaño de las fotos grandes no deben ser superior de la celda o capa en la quiere colocar.
El nombre de las fotos debe ser en ambas carpetas imgNUM.jpg y de formato JPG. Por ejemplo:
img1.jpg, img2.jpg, img3.jpg ... y la imagen img1.jpg de la carpeta chicas debe corresponder 
a la imagen img1.jpg de la carpeta grandes, la img2.jpg de chicas a la img2.jpg de grandes ...

nfotos --> Indica el número de fotos.

ajustanch --> (opcional) Las imagenes se ajusta a esta anchura.

titulos -->(opcional) Titulo para cada una de las fotos, el primero correspondera a la img1.jpg, el segundo a la img2.jpg

estilo -->(opcional) Nombre del estilo que se utilizara para poner los titulos de las fotos.

fotosfila --> Número de fotos por fila del album

nuevaventana --> true --> Para que se abra cada foto en una ventana nueva. (Valor por Defecto).
                 false --> Para abrir las fotos en la misma ventana. Valido par IE 5 y Netscape 6 o superiores.

ponerAlbum() --> Coloca el album de fotos.*/

//NO MODIFIQUE NINGUN CÓDIGO DESDE AQUI HASTA EL FINAL DEL ARCHIVO

//directorio de las fotos
var directorio = "";
//número de fotos del album
var nfotos = 0;
//Anchura a la que se ajustan las fotos
var ajustanch = 0;
//vector de titulos
var titulos = null;
//estilo de los titulos de las fotos
var estilo = "";
//numero de fotos por fila
var fotosfila = 0;
//Nueva ventana o no
var nuevaventana = true;

//Funcion que crea una capa llamada capa y dentro coloca la tabla del album
function poneralbum(){	
	document.write("<DIV id='capa' class =" + estilo + ">")
	document.write(tablaalbum());
	document.write("</DIV>");
}

//Funcion que crea una cadena con el html de la tabla que construira el album
function tablaalbum(){
	var porcen =  toString(parseInt(100/nfotos))+'%';
	var html;
	
	html = "<TABLE width=100%>";
	var i=0;
	var j=0;
	while(i < nfotos){
		html = html + "<TR>";
		for(j=0; j < fotosfila; j++){
			html = html + "<TD align=center width=" + porcen+ ">";
			html = html + "<A href='#'> <IMG border=0 src='" + directorio + "/chicas/img" + (i+j+1) +".jpg'";
			
			//Dependiendo de crearnueva creamos una nueva ventana con la imagen actual o la colocaremos en 
			//la misma ventana
			if(nuevaventana){
				html = html + " onClick='imagennueva("+(i+j)+")'";
			}
			else{
				html = html + " onClick='imagenmisma("+(i+j)+")'";
			}
			html = html + "></A><BR clear=all>";
			
			if(titulos.length > i+j){
				html = html + titulos[(i+j)];
			}
			html = html + "<BR><BR></TD>";
		}
		html = html + "</TR>";
		i=i+j;
	}
	html = html + "</TABLE>";
	
	return html;
}

//Funcion que muestra una imagen en una nueva ventan
function imagennueva(i)
{
	ventana=open("","DisplayWindow","toolbar=no,resizable=yes,scrollbars=yes");
	ventana.document.write("<HTML><HEAD></HEAD><BODY>");
	
	ventana.document.write("<IMG src='" + directorio + "/grandes/img" + (i+1) + ".jpg'" );
	
	if(ajustanch > 0){
		ventana.document.write(" width =" + ajustanch);
	}
	ventana.document.write("></BODY></HTML>");
}

//Deteccion del navegador
var ie4 = document.all;
var ns6 = document.getElementById && !document.all; 

//Funcion que muestra una imagen y los enlaces en la misma pagina utilizando la capa creada por 
//poneralbum
function imagenmisma(i){
//Obenemos la referencia de la capa
if(ie4){
	mostrar = capa;}
else{
	if(ns6){
		mostrar = document.getElementById('capa');}
	else{
		return;}
	}
//Variable que contendra el html	
var html;
html = "<TABLE cellspacing=20><TR><TD>"
//Inicio
html = html + "<a  href='#' style='font-size: 12px;' onClick='restaurar()'>Inicio</a></TD><TD>"
//Anterior
if(i>0){
	html = html + "<a  href='#' style='font-size: 12px;' onClick='imagenmisma(" + (i-1) + ")'>&lt;&lt;Anterior</a>"
}
html = html + "</TD><TD>";
//Siguiente
if(i<nfotos-1){
//nfotos es una variable global
	html = html + "<a href='#' style='font-size: 12px;' onClick='imagenmisma(" + (i+1) + ")'>Siguiente &gt;&gt;</a>"
}
html = html + "</TD></TR></TABLE>";
//La imagen
html = html + "<IMG src='" + directorio + "/grandes/img" + (i+1) + ".jpg'";
//Si se indica la anchua la colocar la indicamos
if(ajustanch > 0){
	html = html + " width =" + ajustanch;
}
html = html + ">"

//Ponemos el html en la capa
mostrar.innerHTML = html;
}

//Funcion que coloca en la capa lo que contenia en un principio
function restaurar(){
//Obtenemos la referencia de la capa
if(ie4){
	mostrar = capa;}
else{
	if(ns6){
		mostrar = document.getElementById('capa');}
	else{
		return;}
	}
//Colocamos el html en la capa
mostrar.innerHTML = tablaalbum();
}

