Ayuda con galería de fotos en AS

[el_tigre]

hey brother una mano en esto, es una galería de fotos que elaboró un men, pero he tratado de hacer dos modificaciones mas y no consigo cómo. Le he dado como la mula al trigo pero más ya no puedo, es que aun no logro darle al AS, sólo me estoy guiando por mis conocimientos de VB

Necesito hacer.

1. Que cargue la primera "imagen grande" junto a los thumbs

2. Las thumbs deben cargar en el cuadro del centro, los ejes X, Y juegan un papel. ya he probado con el Y=2 para poder bajarlo un poquito pero para dezplazarlo al cuadro del centro es el problema, este debe funcionar cuando se avanza tmb y cuando se retrocede.

Muchas gracias por la ayuda.....alguien por fa.

Código HTML:

http://www.uploading.com/files/OJ0UA52L/visorcompos.rar.html

[el_tigre]

nada que ver sobre este tema amigos?

[Bandit]

Hola el_tigre:
Ya baje tu archivo, voy a verlo y te aviso.

Espero poderte ser de ayuda.

[Bandit]

No puedo abrir tu archivo, porque debe de estar guardado para Flash 8, esa versión no la tengo instalado.

Espero poderte ser de ayuda.

[el_tigre]

Hola bandit, creo que estaba en la versión 7, pero aca te mando en versión 6

http://www.uploading.com/files/HT484Y92/fotos.rar.html

me imagino que las carpeta del thumbs y fotos ya las tienes, asi que solo te puse el fla.


Gracias

[Bandit]

No se puede bajar por el momento, parece que el servidor está saturado.

Saludo.

[el_tigre]

Bandit, en todo caso, lo único que tiene este código es lo sgte, el primer frame va este Scrip y todo lo jala de las carpetas del thumb y de las fotos, como ya te expliqué arriba no logro centrar los thumbs ni hacer que cargue la primera foto junto a los thumb.

Código HTML:

//Importamos las clases
import mx.containers.ScrollPane
import mx.controls.ProgressBar
import mx.controls.Loader

//Declaramos variables
var imagenes_lv:LoadVars = new LoadVars();
var imagenes_fo:LoadVars = new LoadVars();
var i:Number = new Number(1);
var x:Number = new Number(0);
var y:Number = new Number(2);
var nFot:Number = new Number(1);
var fotAct:Number = new Number(0);
var nPag:Number = new Number(1);
var elTope:Number = new Number(1);
var final:Boolean = new Boolean(false);
var alClicar:Object = new Object();
var alCargar:Object = new Object();
var cargando:Object = new Object();

//Atacheamos los objetos que necesitamos
attachMovie("ProgressBar", "barra", 9998);
attachMovie("ProgressBar", "barraThumbs", 9999);
//Puedes cambiar la forma de mostrar las imágenes, poniendo en vez de un Loader un ScrollPane
//No olvides añadirlo a tu biblioteca
attachMovie("Loader", "imgGrande", _root.getNextHighestDepth());
//attachMovie("ScrollPane", "imgGrande", _root.getNextHighestDepth());

//Empezamos cargando por la primera imagen
imagenes_lv.dirurl = "thumbs/" + i + ".jpg";
imagenes_lv.parent = this;
imagenes_lv.load(imagenes_lv.dirurl);

//Empezamos cargando por la primera imagen
//imagenes_fo.dirurl = "fotos/1.jpg";
//imagenes_fo.parent = this;
//imagenes_fo.load(imagenes_fo.dirurl);

//Propiedades del Loader/ScrollPane ok
imgGrande.setSize(398, 299);
imgGrande.move(190, 235);
imgGrande.addEventListener("complete", alCargar);
imgGrande.addEventListener("progress", cargando);

//Propiedades de la barra de carga ok
barra._visible = false;
barra.move(300, 370);
barra.label = "Cargando %3%";
barra.mode = "manual";

//Propiedades de la barra de carga de los thumbnails ok
barraThumbs._visible = false;
barraThumbs.setSize(125, 44);
barraThumbs.move(320, 150);
barraThumbs.indeterminate = true;
barraThumbs.labelPlacement = "up";


//******************************** FUNCIONES ***********************************//
//Función para ir pasando de imagen en imagen
function siguienteImg (i){
	barraThumbs._visible = true;
	barraThumbs.label = "Cargando imagen " + (i-1);
	if (i < 10){
		imagenes_lv.dirurl = "thumbs/" + i + ".jpg";
		imagenes_lv.load(imagenes_lv.dirurl);
	}
	else if (i >= 10){
		imagenes_lv.dirurl = "thumbs/" + i + ".jpg";
		imagenes_lv.load(imagenes_lv.dirurl);
	}
}

//Función para hacer grande la imagen
function agrandarImg(id){
	//Asignamos que vamos a cargar y ponemos la barra de preload
	if (id < 10){
		imgGrande.contentPath = "fotos/" + id + ".jpg";
	}
	else if (id >= 10){
		imgGrande.contentPath = "fotos/" + id + ".jpg";
	}
	//Mostramos la barra de carga
	barra._visible = true;
	
	fotAct = id;
}

//Función para pasar de página hacia adelante
function paginaAde(){
	//Quitamos las imagenes anteriores
	for (n=1; n<i; n++){
		removeMovieClip(["loader"+n]);
	}
	
	//Inicializamos variables y nos situamos en la page siguiente
	nPag++;
	nFot = 1;
	x = 0;
	y = 2;
	
	siguienteImg(i);
}

//Función para pasar de página hacia atrás
function paginaAtr(){
	//Quitamos las imagenes anteriores
	for (n=1; n<i; n++){
		removeMovieClip(["loader"+n]);
	}
	
	//Inicializamos variables y nos situamos en la page anterior
	nPag--;
	nFot = 1;
	x = 0;
	y = 2;
	//El índice de la imagen es igual a:
	//12 --> Número de imágenes mostradas
	//(nPag-1) --> multiplicado por el número de página actual - 1
	//más 1, que dará como resultado
	//i = (12 * (1-1)) + 1 --> 1 [Nos situamos en imagen 1 si la página es la 1]
	//i = (12 * (2-1)) + 1 --> 13 [Nos situamos en imagen 13 si la página es la 2]
	//i = (12 * (3-1)) + 1 --> 25 [Nos situamos en imagen 25 si la página es la 3]
	//etc...
	i = (12 * (nPag-1)) + 1;
	
	siguienteImg(i);
}

//********************************** EVENTOS *********************************//
//Cuando se ha cargado del todo la imagen
alCargar.complete = function(objeto){
	barra._visible = false;
	imgGrande.setSize(398, 299);
	imgGrande.refreshPane();
}

//Monitorizamos la descarga de la imagen
cargando.progress = function(){
	barra.setProgress(imgGrande.getBytesLoaded(), imgGrande.getBytesTotal());
}

//Cargamos las thumbnails
imagenes_lv.onLoad = function() {
	if (imagenes_lv.loaded == true) {
		if (nFot < 13){
			//Existe la imagen
			attachMovie("Loader", "loader" + i, i);
			eval("loader"+i).setSize(48, 36);
			eval("loader"+i).move((65 * x + 13), (50 * y + 13));
			eval("loader"+i).id = i;
			
			trace(this.dirurl + " / " + eval("loader"+i));
			
			eval("loader"+i).contentPath = this.dirurl;
			
			//Cargamos la imagen en grande y le pasamos el id de la thumbnail
			eval("loader"+i).onPress = function(){
				agrandarImg(this.id);
			}
			
			i++;
			nFot++;
			//Si no hemos llegado al final seguimos sumando para llegar al tope
			if (final == false){
				elTope++;
			}
			
			//Posiciones de las imagenes
			x++;
			if (x > 5){
				y++;
				x = 0;
			}
			
			siguienteImg(i);
		}
		else{
			//Cuando hemos cargado todas las thumbs quitamos la barra de carga
			barraThumbs._visible = false;
		}
	}
	else{
		//Si llegamos al final, restamos uno al tope para que no se puedan seguir cargando
		//imagenes
		if (final == false){
			elTope--;
		}
		final = true;
		barraThumbs._visible = false;
	}
}

alClicar.click = function(objeto){
	if (objeto.target == sigPage_btn){
		//Si la imagen actual es menor o igual que el tope, podemos seguir avanzando
		if (i <= elTope){
			paginaAde();
		}
	}
	else if (objeto.target == antPage_btn){
		if (nPag > 1){
			paginaAtr();
		}
	}
	else if(objeto.target == sigImg_btn){
		//Mientras no lleguemos a la última foto podemos seguir pasando
		trace(fotAct + " < " + elTope);
		if (fotAct < elTope){
			fotAct++;
			agrandarImg(fotAct);
		}
		
		//Desactivamos el botón si hemos llegado al final
		if (fotAct == elTope && final == true){
			objeto.target.enabled = false;
		}
		//Activamos el botón de siguiente imagen
		antImg_btn.enabled = true;
		
		//Cambiamos de página si ya hemos visto todas las fotos de la pagina actual
		if (fotAct == (nPag * 12 + 1)){
			paginaAde();
		}
	}
	else if(objeto.target == antImg_btn){
		if (fotAct > 1){
			fotAct--;
			agrandarImg(fotAct);
		}
		
		//Desactivamos el botón si hemos llegado al principio
		if (fotAct == 1){
			objeto.target.enabled = false;
		}
		//Activamos el botón de siguiente imagen
		sigImg_btn.enabled = true;
		
		//Cambiamos de página si ya hemos visto todas las fotos de la pagina actual
		if (fotAct == (nPag-1) * 12){
			paginaAtr();
		}
	}
}

//******************************** LISTENERS ***********************************//
sigPage_btn.addEventListener("click", alClicar);
antPage_btn.addEventListener("click", alClicar);
sigImg_btn.addEventListener("click", alClicar);
antImg_btn.addEventListener("click", alClicar);

[Bandit]

Por ejemplo para un escenario de 550 x 450.
Para centrar las imágenes grandes:
En ésta línea: imgGrande.move(190, 235); la cambias por: imgGrande.move(78, 120);
Para centrar los thumbnails:
En ésta línea: eval("loader"+i).move((65 * x + 13), (50 * y + 13)); cámbia por : eval("loader"+i).move((65 * x + 90), (50 * y + 13));

Espero haberte sido de ayuda.

[el_tigre]

Muchas gracias Bandit, me has dado mucha luz, cuestión de números...jejeje..que cosas....ahora sólo me falta una cosa, donde cambio o agrego para que me muestre la primera img grande junto con los thumbs?