PAGINACION EN FLASH Segunda entrega.

[Potro]

Hola mis estimados colegas, Aquí pondre lo nuevo que le hice a la paginación, les comento en que ha cambiado:

a) El codigo ya es menor ya que se ha incluido for para que ahorrar tiempo y escritura.

b) Se agrego que se pueda ver una imagen en un MoviClip

Empecemos a explicar::::::

PRIMERA PARTE
************************************************


Creación del diseño de los registros en flash

Paginaremos de 5 en 5 como la entrega pasada y necesitamos hacer 5 campos de nombre, 5 de ubicacion, 5 de img y crear 1 MoviClip y ese pegarlo 5 veces y ponerle el nombre de la siguiente manera.

nombre1, nombre2, nombre3, nombre4, nombre5
ubicacion1, ubicacion2, ubicacion3, ubicacion4, ubicacion5
img1, img2, img3, img4, img5

y en los 5 MoviClip en el nombre de instancia le ponemos
contenedor1, contenedor2, contenedor3, contenedor4, contenedor5

Y haremos 2 botones “Siguiente” y “Anterior”


Y dos campos mas Dynamic Text uno con el nombre pagina y otro con el nombre pag_total


Y Salvamos nuestro proyecto yo le pondré paginacion_img.fla


Creación del ASP

Ahora abramos un “bloc de notas” y pongamos el siguiente código


Esto será para ASP:


Y yo lo guardare con el nombre de paises.asp

<%
Response.Expires = 0
response.Write("&nombre1=Anguila&nombre2=Antigua&n ombre3=Antillas Holandesas&nombre4=Aruba&nombre5=Bahamas")
response.Write("&nombre6=Aland&nombre7=Albania&nom bre8=Alemania&nombre9=Andorra&nombre10=Armenia")
response.Write("&nombre11=Angola&nombre12=Argelia& nombre13=Benin&nombre14=Botswana&nombre15=Burkina Faso")
response.Write("&nombre16=Afganistan&nombre17=Arab ia Saudi&nombre18=Armenia&nombre19=Azerbaiyan&&nombre 20=Bahrein")
response.Write("&nombre21=Australia&nombre22=Fiji" )

response.Write("&ubicacion1=Norte America&ubicacion2=Norte America&ubicacion3=Norte America&ubicacion4=Norte America&ubicacion5=Norte America")
response.Write("&ubicacion6=Europa&ubicacion7=Euro pa&ubicacion8=Europa&ubicacion9=Europa&ubicacion10 =Europa")
response.Write("&ubicacion11=Africa&ubicacion12=Af rica&ubicacion13=Africa&ubicacion14=Africa&ubicaci on15=Africa")
response.Write("&ubicacion16=Asia&ubicacion17=Asia &ubicacion18=Asia&ubicacion19=Asia&ubicacion20=Asi a")
response.Write("&ubicacion21=Oceania&ubicacion22=O ceania")

response.Write("&img1=1.jpg&img2=2.jpg&img3=3.jpg& img4=4.jpg&img5=5.jpg")
response.Write("&img6=6.jpg&img7=7.jpg&img8=8.jpg& img9=9.jpg&img10=10.jpg")
response.Write("&img11=11.jpg&img12=12.jpg&img13=1 3.jpg&img14=14.jpg&img15=15.jpg")
response.Write("&img16=16.jpg&img17=17.jpg&img18=1 8.jpg &img19=19.jpg&img20=20.jpg")
response.Write("&img21=21.jpg&img22=22.jpg")

response.Write("&registros=22")
%>



Desarrollo del código en ActionScript


Bueno ahora retomamos nuestro flash para ingresar el código para ingresar los registros de 5 en 5.


Nota: En color verde pondré el código que ustedes ingresaran al flash y en rojo solo haré las observaciones importantes


Seleccionamos el primer KeyFrame y nos vamos a las actions o acciones.

Ahora en principio pondremos un stop(); para que no, nos provoqué algún contratiempo.


Ahora empezaremos a poner el código para mandar a llamar nuestro archivo ASP


var esto:MovieClip = this; //creamos una variable que apunte al contenedor:
var SendData:LoadVars = new LoadVars(); //Cargo la variable new
SendData.load("paises.asp"); //Llamo el archivo (asp o php) en este caso sera asp
//Funccion para primera muestra de registros
SendData.onLoad = function (success){
if (success) {
//Muestro los primeros registros recordemos que mostraremos de 5 en 5.
for(i=1; i<=5; i++) {
esto["nombre"+i] = this["nombre"+i]; //Aquí muestro los nombres
esto["ubicacion"+i] = this["ubicacion"+i]; //Aquí muestro las ubicaciones
esto["img"+i] = this["img"+i]; //Aquí muestro el nombre de las imagenes*/
loadMovie(this["img"+i], esto["contenedor"+i]); //Aquí muestro las imagenes*/
}
registros = this.registros; //Cargo también el número de registros
/*Para sacar el número de paginas obtenidas divido los registros obtenidos entre el número de registros
que muestra la paginación que en este caso son 5*/
var registro2:Number = registros / 5;
/*Obtenemos con otra variable el resultado para mostrarlo en nuestro Dynamic Text y como podría ser que en
esta operación el número obtenido no sea redondo con la funcion Math.ceil la redondeo*/
pag_total.text = Math.ceil(registro2);
}
}


Hasta aquí obtendremos ya los primeros 5 registros y las paginas obtenidas, compilemos nuestro fla y hagamos una prueba:

Nota: Estos archivos hay que correrlos en un servidor, yo le instale el IIS a mi Windows XP si no contamos con esto no podremos ver el resultado.

Nota: En el Dynamic Text con el nombre pagina hay que ponerle por default un 1 por que sabemos que siempre empezara de la página 1.

[Potro]

SEGUNDA PARTE
************************************************** **


Ya obteniendo este resultado prosigamos con el código de que llevaran los botones siguiente y anterior.

Seleccionamos el botón Anterior y en las actions ponemos lo siguiente:

on (press)
{
menos()
}

Ahora seleccionemos el botón Siguiente y pongamos el siguiente codigo:

on (press)
{
mas()
}


Ahora Pasemos de nuevo al primer keyframe y coloquemos esto al ultimo delcodigo que hemos puesto

//asigno 5 variables para los registros y estas variables nos ayudaran mucho en la paginación
for(i=1; i<=5; i++) {
this["num"+i] = i; }


Y ahora colocaremos la function mas()

function mas()
{
if (pagina.text < pag_total.text) //si el número de paginas no ha sido rebasada ejecutamos lo siguiente
{
var pag_act:Number = Number(pagina.text); //La variable pag_act toma el valor en ese momento de pagina.text
var nu:Number = pag_act * 5; //creamos la variable nu que será el resultado de la variable pag_act * 5
pagina.text = pag_act + 1; //Le damos un nuevo valor a pagina.text sumandole 1
//Mostramos los siguientes 5 registros
for(i=1; i<=5; i++) {
this["nombre"+i] = SendData["nombre"+(this["num"+i] + nu)].toString(); //Mostramos los siguientes nombres
this["ubicacion"+i] = SendData["ubicacion"+(this["num"+i] + nu)].toString(); //Mostramos las siguientes ubicaciones
this["img"+i] = SendData["img"+(this["num"+i] + nu)].toString(); //Mostramos las siguientes imagenes
loadMovie(SendData["img"+(this["num"+i] + nu)].toString(), esto["contenedor"+i]); //Mostramos las siguientes imagenes
}
/*Si algún campo es nulo que no tenga información le decimos que lo deje en blanco
y asi evitamos un mensaje de error del flash*/
for(i=1; i<=5; i++) {
if (this["nombre"+i] == undefined)
{ this["nombre"+i] = ""; }
if (this["ubicacion"+i] == undefined)
{ this["ubicacion"+i] = ""; }
if (this["img"+i] == undefined)
{ this["img"+i] = ""; }
}
}
}


Expliquemos ahora que hace esta funcion si recuerdan en la entrega pasada con los botones siguiente y anterior mandabamos primero a llamar una function botones() para asignarle a unas variables numeros para que nos ayudaran a pasar o retroceder entre los registros pues ahora se ha adaptado todo en la misma function para ya no escribir tanto codigo.

y se ha echo lo mismo con la function menos() que ahora mostraremos.


function menos()
{
if (pagina.text > 1) //si la pagina actual es mayor que 1 ejecutamos lo siguiente
{
var pag_act:Number = Number(pagina.text); //La variable pag_act toma el valor en ese momento de pagina.text
var nu2:Number = (pag_act * 5) - 10; //creamos la variable nu2 que será el resultado de pag_actual * 5 - 10 esto nos ayudara a descontarle 5 registros a nuestra paginación
pagina.text = pag_act - 1; //Le damos un nuevo valor a pagina.text descontandole 1
//Aquí mostramos los 5 registros anteriores
for(i=1; i<=5; i++) {
this["nombre"+i] = SendData["nombre"+(this["num"+i] + nu2)].toString(); //Mostramos los anteriores nombres
this["ubicacion"+i] = SendData["ubicacion"+(this["num"+i] + nu2)].toString(); //Mostramos las anteriores ubicaciones
this["img"+i] = SendData["img"+(this["num"+i] + nu2)].toString(); //Mostramos las anteriores imagenes
loadMovie(SendData["img"+(this["num"+i] + nu2)].toString(), esto["contenedor"+i]); //Mostramos las anteriores imagenes
}
}
}


y listo ya con esto podran paginar mas facil y con la posibilidad de poder mostrar una imagen.


Aquí les dejo el ejemplo funcionando:::
http://www.rwa.com.mx/imgforo/paginacion_img.html

Y aquí para que lo puedan descargar:::
http://www.rwa.com.mx/imgforo/paginacion_img.zip



Saludos...

[AlejandroTX]

Gracias, me sirve de muchoo.. pero como puedo hacer para programar el clip "contenedor" de tal manera que cuando se clickee se abra la imagen, mejor dicho donde puede programar un getURl para descargar cada imagen. se puede?
Saludos!

[Potro]

Claro que se puede hacer mi estimado deja programarlo y lo subo.


Saludos...

[rosariopd]

hola, necesito hacer varias consultas

[Potro]

Claro puedes preguntar lo que quieras....

[MoDoRrO]

se puede en php???

[MoDoRrO]

listo, logre adaptarlo a php y a mis espectativas.

te dejo Karma amigo

[MoDoRrO]

Potro. probaste tu script con mas de 100 registros??

pruebalo y dime si te funciona, al parecer va hacer problema de asignacion de variables

[MoDoRrO]

bueno, mas bien, probaste tu script con mas de 10 paginas? (mas de 50 registros) ya que el conteo se hace de 5 en 5

[Potro]

Si mi estimado claro que ya habia salido ese problema y lo solucionamos dandole la variable numerica..

//Con esto volvemos un campo numerico a nuestra variable
var pag_all:Number = Number(pag_total.text);
//Primero validamos si el número de página no ha rebasado el número de páginas obtenidas
if (pagina.text < pag_all)//aqui modificamos
{


el problema es que pasa como texto y al llegar al 10 no distingue que es un numero... pero con eso lo resuelves mas detalles vete al ejemplo largo ahi busca cuando nolose pregunta lo mismo...



y claro que se puede en php ya lo puedes adaptar al lenguaje que quieras...

[MoDoRrO]

perfecto, si ayer, estuve hasta la madrgada, hize algo similar para que funcionara

Gracias! me sirvio mucho para hacerme una galeria.

cuando termino lo muestro.

[Potro]

Espero que puedas mostrar tu galeria para ver que tan bien jala...


Salduos...

[MoDoRrO]

Hola de nuevo, la galeria esta en www.elfresno.com.mx

obviamente utilice tu teoria para montar toda la galeria.

un punto importante que decidi modificar.

tu jalas todos los registros de la BD para despues utilizar flash para "dividirlos" pero, cuando hay mas de 15 o 20mil registros, puede alentarse la consulta, asi que te aconsejo que los dividas directamente desde el php (asp en tu caso) y cada que "pases a otra pagina" envie la pagina a mostrar y el archivo lo procese.

Saludos potro!!!

[Potro]

Muy buena observación MoDoRrO la aplicare asi como dices.