Comunidad de diseño web y desarrollo en internet online

boton next/prev en galeria, no me funciona-[Porfavor]

Citar            
MensajeEscrito el 17 Ago 2010 02:28 pm
Hola a todos, tengo ya montada una galería en la que se cargan tanto las thumbs como las bigs desde un xml, y al hacer click en las correspondientes thumbs, van apareciendo sus ampliaciones.

El problema lo tengo al crear los botones de atrás y adelante, que no me carga las imágenes, y he probado mil cosas ya, y no lo consigo, a ver si me podéis echar una manita.

Os expongo las funciones que intervienen a continuación:

Función que se ocupa de la carga de las thumbs:

Código ActionScript :

function galleryChoice(q) {
   pArray = new Array();
   tArray = new Array();
   iArray = new Array();
   my_xml = new XML();
   for (var j = 0; j<curLength; j++) {
      this.scroll.th_nav["thmb"+j].removeMovieClip();
   }
   my_xml.ignoreWhite = true;
   my_xml.onLoad = function(loaded) {
      if (loaded) {
         gallery = this.firstChild.childNodes[q];
         curLength = gallery.childNodes.length;
         for (var i = 0; i<gallery.childNodes.length; i++) {
            pArray.push(gallery.childNodes[i].attributes.source);
            tArray.push(gallery.childNodes[i].attributes.thumb);
            iArray.push(gallery.childNodes[i].attributes.title);
         }
      }
      delay = setInterval(makeButtons, 50);
   };
   my_xml.load("gallery.xml");
}


Función que se ocupa de la carga de las ampliaciones:

Código ActionScript :

MovieClip.prototype.loadPic = function(pic) {
   cur = pic;
   container._alpha = 0;
   this.loadMovie(pArray[pic]);
   this._parent.onEnterFrame = function() {
      var t = container.getBytesTotal(), l = container.getBytesLoaded();
      bar._visible = 1;
      per = Math.round((l/t)*100);
      if (t == l && container._width>0 && container._height>0) {
         var w = container._width+spacing, h = container._height+spacing;
         border.resizeMe(w, h);
         bar._visible = 0;
         info.text = iArray[pic];
         container._alpha = 0;
         delete this.onEnterFrame;
      } else {
         bar._width = per;
         info.text = per+" % loaded";
      }
   };
};


Y aquí el code que le tengo puesto a los botones:

Código ActionScript :

prevb.onRelease = function() {
   cur--;
   if (cur<0) {
      container.loadPic(pArray.length-1);
   } else {
      container.loadPic(cur);
   }
};
nextb.onRelease = function() {
   cur++;
   if (cur>pArray.length-1) {
      container.loadPic(0);
   } else {
      container.loadPic(cur);
   }
};


¿En qué estoy fallando? ¿Porque no me carga las ampliaciones usando los botones?

Muchisimas gracias por adelantado.

Por Hapki

Claber

268 de clabLevel



 

firefox
Citar            
MensajeEscrito el 17 Ago 2010 02:41 pm
No es buena idea usar un prototype, y si lo usas, no uses nombre de instancia dentro sino la palabra clave this.
Luego pones el alpha a 0 y nunca lo pasas a 100

Jorge

Por solisarg

BOFH

13669 de clabLevel

4 tutoriales
5 articulos

Genero:Masculino   Bastard Operators From Hell Premio_Secretos

Argentina

firefox
Citar            
MensajeEscrito el 17 Ago 2010 06:16 pm
Gracias Jorge, he cambiado MovieClip por this en cada prototype, pero me deja de funcionar todo, y también he probado a cambiar la linea del prototype por function loadpic(), para que sea una función, pero haga lo que haga, me deja de funcionar todo....

Y ahora mismo, tal y como está, me funciona todo bien, excepto el tema de los botones, y es extraño, porque haciendo algunos cambios en el code completo, conseguí que me funcionara bien los botones, pero al hacerlo dejaban de funcionar los eventos de los thumbs, y elegí el "mal menor" que era solucionar éste, pero haga lo que haga no funciona todo a la vez.

Gracias de nuevo, a ver si me podéis seguir orientando para solucionarlo...

Por Hapki

Claber

268 de clabLevel



 

firefox
Citar            
MensajeEscrito el 17 Ago 2010 07:27 pm
Luego pones el alpha a 0 y nunca lo pasas a 100

Jorge

Por solisarg

BOFH

13669 de clabLevel

4 tutoriales
5 articulos

Genero:Masculino   Bastard Operators From Hell Premio_Secretos

Argentina

firefox
Citar            
MensajeEscrito el 17 Ago 2010 08:32 pm
Ya lo hice, pero me deja de funcionar las ampliaciones...

Pongo el code completo aqui tal cual lo tenía, sin los cambios q me has aconsejado, ya que si los pongo no me funciona las ampliaciones, y el code como está ahora mismo, funciona todo EXCEPTO los dichosos botones:

Código ActionScript :

var tnNr;
spacing = 10;
container._alpha = 0;
var curLength;

MovieClip.prototype.loadPic = function(pic, id) {
   info.text = "";
   this._alpha = 0;
   this.loadMovie(pic);
   temp = this._parent.createEmptyMovieClip("temp2", 998);
   temp.onEnterFrame = function() {
      var t = container.getBytesTotal(), l = container.getBytesLoaded();
      if (Math.round(l/t) == 1 && container._width != 0 && container._height != 0) {
         var w = container._width+spacing, h = container._height+spacing;
         border.resizeMe(w, h, id);
         delete this.onEnterFrame;
      }
   };
};
MovieClip.prototype.resizeMe = function(w, h, id) {
   var speed = 3;
   container._alpha = 0;
   this.onEnterFrame = function() {
      this._width += (w-this._width)/speed;
      this._height += (h-this._height)/speed;
      if (Math.abs(this._width-w)<1 && Math.abs(this._height-h)<1) {
         this._width = w;
         this._height = h;
         container._x = this._x-this._width/2+spacing/2;
         container._y = this._y-this._height/2+spacing/2;
         info._y = Math.round(this._y+this._height/2+spacing/2);
         container._alpha += 5;
         if (container._alpha>90) {
            info.text = id;
            container._alpha = 100;
            delete this.onEnterFrame;
         }
      }
   };
};
//carga las thumbs
function galleryChoice(q) {
   pArray = new Array();
   tArray = new Array();
   iArray = new Array();
   my_xml = new XML();
   for (var j = 0; j<curLength; j++) {
      this.scroll.th_nav["thmb"+j].removeMovieClip();
   }
   my_xml.ignoreWhite = true;
   my_xml.onLoad = function(loaded) {
      if (loaded) {
         gallery = this.firstChild.childNodes[q];
         curLength = gallery.childNodes.length;
         for (var i = 0; i<gallery.childNodes.length; i++) {
            pArray.push(gallery.childNodes[i].attributes.source);
            tArray.push(gallery.childNodes[i].attributes.thumb);
            iArray.push(gallery.childNodes[i].attributes.title);
         }
      }
      delay = setInterval(makeButtons, 50);
   };
   my_xml.load("gallery.xml");
}
//columnas de las thumbs
function makeButtons() {
   tnNr = 0;
   clearInterval(delay);
   for (var i = 0; i<tArray.length; i++) {
      var thb = scroll.th_nav.thmb.duplicateMovieClip("thmb"+i, 1000+i);
      thb.id = i;
      thb._x = i%2*100;
      thb._y = Math.floor(i/2)*100;
   }
   loadButtons();
}
//carga thumbs como botones
function loadButtons() {
   var tbox = scroll.th_nav["thmb"+tnNr].box;
   tbox.loadMovie(tArray[tnNr]);
   temp = this.createEmptyMovieClip("tmp"+tnNr, 999);
   temp.onEnterFrame = function() {
      bt = tbox.getBytesTotal();
      bl = tbox.getBytesLoaded();
      if (bt == bl && bt>4) {
         nextButton();
         delete this.onEnterFrame;
      }
   };
}
//Hacen que vaya cargando todas las thumbs de una en una, si no solo se carga la primera
function nextButton() {
   if (tnNr<tArray.length-1) {
      tnNr++;
      loadButtons();
   } else {
      activateButtons();
   }
}
//Activa la funcion de boton a las thumbs
function activateButtons() {
   mainButtons();
   for (var i = 0; i<pArray.length; i++) {
      var but = scroll.th_nav["thmb"+i];
      but.id = i;
      but.onRelease = function() {
         container.loadPic(pArray[this.id], iArray[this.id]);
         disButtons2(this.id);
      };
   }
   container.loadPic(pArray[0], iArray[0]);
   disButtons2(0);
}
//efecto de alpha en las thumbs al estar seleccionadas
function disButtons2(d) {
   for (var i = 0; i<tArray.length; i++) {
      if (i != d) {
         this.scroll.th_nav["thmb"+i].enabled = 1;
         this.scroll.th_nav["thmb"+i].box._alpha = 100;
      } else {
         this.scroll.th_nav["thmb"+i].enabled = 0;
         this.scroll.th_nav["thmb"+i].box._alpha = 50;
      }
   }
}

galleryChoice(0);

//Los DICHOSOS BOTONES
prevb.onRelease = function() {
   cur--;
   if (cur<0) {
      container.loadPic(pArray.length-1);
   } else {
      container.loadPic(cur);
   }
};
nextb.onRelease = function() {
   cur++;
   if (cur>pArray.length-1) {
      container.loadPic(0);
   } else {
      container.loadPic(cur);
   }
};

Por Hapki

Claber

268 de clabLevel



 

firefox
Citar            
MensajeEscrito el 17 Ago 2010 09:14 pm
A ver si entiendo, ¿funcionan los botones (carga el siguiente pic), pero no las ampliaciones?

Jorge

Por solisarg

BOFH

13669 de clabLevel

4 tutoriales
5 articulos

Genero:Masculino   Bastard Operators From Hell Premio_Secretos

Argentina

firefox
Citar            
MensajeEscrito el 17 Ago 2010 09:21 pm
Me explico:

1- La sección de thumbs, que al pinchar en ella se carga la ampliación---> funciona ok.
2- A parte de acceder a las ampliaciones desde las thumbs, tb se accede con los botones de atras y adelante, pues estos botones, al pinchar en ellos, la ampliacion no aparece, es decir, si yo estoy en la foto1 y pulso en boton adelante, la foto2 no aparece, no hace nada, es como si no hubiera pinchado, sin embargo cuando pincho en el panel de salida, me aparece q el problema es de ruta (creo), pq aparece ésto:

Error al abrir la URL 'file:///Macintosh%20HD/Users/imac/Desktop/MIS%20DOCUMENTOS/web/1'

Y el nº 1 q aparece en el error va cambiando a los numeros siguientes conforme voy pulsando una y otra vez en "next".

Por Hapki

Claber

268 de clabLevel



 

firefox
Citar            
MensajeEscrito el 18 Ago 2010 03:06 pm
Ok, el metodo loadPic tiene esta signatura:

Código ActionScript :

MovieClip.prototype.loadPic = function(pic, id) { 
    (...)
    this.loadMovie(pic); 
    (...)
}


El segundo parámetro no se usa, así que aunque no lo pasas no ocurre nada (en AS3 el compilador te tira error)
Luego como pic espera un nombre de jpg o swf, entonces tu boón debería decir:

container.loadPic(curr+".jpg");

y las variaciones según los if que tienes

Jorge

Por solisarg

BOFH

13669 de clabLevel

4 tutoriales
5 articulos

Genero:Masculino   Bastard Operators From Hell Premio_Secretos

Argentina

firefox
Citar            
MensajeEscrito el 18 Ago 2010 08:01 pm
Gracias Jorge, ya está CASI arreglado.

Siguiendo tus instrucciones, y haciendo una pequeña modificación para que me coja la ruta donde se encuentra las fotos, he puesto en el boton ésto:

Código ActionScript :

nextb.onRelease = function() {
   cur++;
   if (cur>pArray.length-1) {
      container.loadPic(0);
   } else {
      container.loadPic("pics/pic"+cur+".jpg");
   }
};


Y ahora, sí que funciona, PERO, siempre empieza desde la foto nº1, es decir, si yo previamente he hecho click en las thumbs y estoy en la foto nº 6, al usar el boton next, me vuelve a empezar desde la 1, incluso estando en la foto 1, hago click en el boton y me vuelve a mostrar primero la foto1... además no tiene límite, si llego al final de las fotos, y sigo haciendo click, intenta mostrarme más fotos, (que no las hay claro) y se queda el recuadro marron ahí ... y lo q debería hacer, es o volver a la primera, o desactivarse el boton.

He probado en vez de usar la variable cur, usar el array pArray, pero ha sido una tontería, pq no ha funcionado nada...:S

A ver si me puedes ayudar este poquito más... mil gracias Jorge.

Por Hapki

Claber

268 de clabLevel



 

firefox
Citar            
MensajeEscrito el 18 Ago 2010 10:16 pm
En el click tienes que setear el valor de "cur" al nro de foto que hayas clickado, sino pierdes sincro, y los botones next/prev llevan un contador independiente

Jorge

Por solisarg

BOFH

13669 de clabLevel

4 tutoriales
5 articulos

Genero:Masculino   Bastard Operators From Hell Premio_Secretos

Argentina

firefox
Citar            
MensajeEscrito el 19 Ago 2010 12:55 pm
Lo siento, pero no sé como se hace éso que me dices, he buscado en google como setear un valor en actionscript, pero no encuentro ninguna explicación.

Los botones están bien así como están no? Tengo que setear cur tb dentro del boton no? pq es donde se hace click ... pero que script setea un valor?

Por Hapki

Claber

268 de clabLevel



 

firefox
Citar            
MensajeEscrito el 19 Ago 2010 01:14 pm
Bien, supongamos que tienes 5 fotos (pic0 a pic4)
Luego el contador usa la variable cur para moverse, y esa variable esta inicializada a 0
Dado que cuando le das click a una foto esa variable no cambia de valor, no importa en que foto estés, para los botones siempre estarás en la primera.
Para corregir eso, al darle a las fotos hay que actualizar el valor de cur al nro de foto que se está haciendo click, así el botón anterior y siguiente no pierden syncro
Si vamos al código, el cambio sería por acá:

Código ActionScript :

//efecto de alpha en las thumbs al estar seleccionadas 
function disButtons2(d) { 
   cur = d
   (....)
}


Luego al principio de todo inicializa cur

var curLength;
var cur = 0;

Por solisarg

BOFH

13669 de clabLevel

4 tutoriales
5 articulos

Genero:Masculino   Bastard Operators From Hell Premio_Secretos

Argentina

firefox
Citar            
MensajeEscrito el 19 Ago 2010 06:20 pm
Gracias Jorge, con lo que me dices se soluciona el problema el problema de sincro entre thumbs y botones, aunque sigue sin tener "límite" los botones, es decir, si llego a la última foto, y pulso en next, intenta mostrarme otra foto (que no hay) y se queda el cuadrado marrón ahí vacío, ocurre lo mismo de atrás a adelante, cuándo lo normal sería, que al llegar a la última, o que se quede bloqueada la imagen última ahí, o q se desactive el uso del botón, pero no que intente mostrarme una y otra vez fotos que no hay :(

Por Hapki

Claber

268 de clabLevel



 

firefox
Citar            
MensajeEscrito el 19 Ago 2010 07:36 pm
Corrige el contador en el if:

Código ActionScript :

prevb.onRelease = function() { 
   if (cur<0) { 
      cur = pArray.length-1
      container.loadPic("pics/pic"+cur+".jpg"); 
   }
(...)
nextb.onRelease = function() { 
   cur++; 
   if (cur>pArray.length-1) { 
      cur = 0;
      container.loadPic("pics/pic"+cur+".jpg"); 
   } 


Jorge

Por solisarg

BOFH

13669 de clabLevel

4 tutoriales
5 articulos

Genero:Masculino   Bastard Operators From Hell Premio_Secretos

Argentina

firefox
Citar            
MensajeEscrito el 19 Ago 2010 09:29 pm
Ahora sí! Gracias Jorge! Miles de gracias! ^_^

Quedo a la espera de tu aviso si reanudas las clases ^_-.

Saludos!!

Por Hapki

Claber

268 de clabLevel



 

firefox

 

Cristalab BabyBlue v4 + V4 © 2011 Cristalab
Powered by ClabEngines v4, HTML5, love and ponies.