Comunidad de diseño web y desarrollo en internet online

Fallos en mi Galeria

Citar            
MensajeEscrito el 29 Sep 2007 11:55 am
Hola, he hecho mi "propia" clase para una galeria, es una recopilacion de todo lo que he visto y aprendido aqui. Es una galeria con varias columnas con miniaturas de las imagenes, tambien tiene el efecto lupa, las clases que implemento son las siguientes:

Imagen.as Clase con la informacion de una imagen (nombre, titulo, ruta, ancho, alto, precio, comentario)

Código :

/*-------------------------------------------------------------------------------+
|                          CLASE IMAGEN   -  Imagen                              |
|    @attrib:                                                                    |
|            ruta: String                ancho: Number        precio: Number     |
|            titulo: String              alto: Number                            |
|    @descripcion:                                                               |
|           Almacena en un objeto la información de una imagen                   |
|                                                                                |
+-------------------------------------------------------------------------------*/

class Imagen{
      //Atributos
   private var _ruta:String;
   private var _titulo:String;
   private var _ancho:Number;
   private var _alto:Number;
   private var _precio:Number;
   private var _comentario:String;
   
   
   function Imagen(){
      this._ruta = "";
      this._titulo = "";
      this._ancho = 0;
      this._alto = 0;
      this._precio = 0;
      this._comentario = "";
   }
   
   //*************************** SETTERS *********************************//
   public function set Ruta(value:String) :Void {
      this._ruta = value;
   }
   
   public function set Titulo(value:String) :Void {
      this._titulo = value;
   }
   
   public function set Ancho(value:Number) :Void {
      this._ancho = value;
   }
   
   public function set Alto(value:Number) :Void {
      this._alto = value;
   }
   
   public function set Precio(value:Number) :Void {
      this._precio = value;
   }
   
   public function set Comentario(value:String) :Void {
      this._comentario = value;
   }
   
   //*************************** GETTERS *********************************//
   
   public function get Ruta() :String {
      return this._ruta;
   }
   
   public function get Titulo() :String {
      return this._titulo;
   }
   
   public function get Ancho() :Number {
      return this._ancho;
   }
   
   public function get Alto() :Number {
      return this._alto;
   }
   
   public function get Precio() :Number {
      return this._precio;
   }
   
   public function get Comentario() :String {
      return this._comentario;
   }
}


ImagenMinAmpLupa.as.as Clase con tres atributos de tipo Imagen (miniatura, ampliada y zoom)

Código :

import Imagen;
/*-------------------------------------------------------------------------------+
|                          CLASE IMAGEN GALERIA   -   imagenMinAmpLupa           |
|    @attrib:                                                                    |
|            miniatura: imagen                                                   |
|            ampliada: imagen                                                    |
|    @descripcion:                                                               |
|             Almacena en un objeto una imagen y su correspondiente miniatura    |
|                                                                                |
+-------------------------------------------------------------------------------*/
class ImagenMinAmpLupa {
   
   private var _miniatura:Imagen;
   private var _ampliada:Imagen;
   private var _lupa:Imagen;
   
   function ImagenMinAmpLupa(){
      this._miniatura = new Imagen();
      this._ampliada = new Imagen();
      this._lupa = new Imagen();
   }

   public function set Miniatura(value:Imagen) :Void {
      this._miniatura = value;
   }
   public function set Ampliada(value:Imagen) :Void {
      this._ampliada = value;
   }
   public function set Lupa(value:Imagen) :Void {
      this._lupa = value;
   }
   
   public function get Miniatura() :Imagen {
      return this._miniatura;
   }
   public function get Ampliada() :Imagen {
      return this._ampliada;
   }
   public function get Lupa() :Imagen {
      return this._lupa;
   }
}


GaleriaImagen.as Clase que genera en un MovieClip las miniaturas de la galeria. Funciona siguiendo estos pasos:

1 - Cargo un archivo de configuracion XML:
Cargo un archivo con la siguiente informacion:
- Archivo con la lista de imagenes.
- MovieClip que contendra las imagenes en miniatura.
- MovieClips que funcionan como barra de desplazamiento (boton de subir, bajar y barra de desplazamiento).

Este es el estilo del XML de configuracion:

Código :

<?xml version="1.0" encoding="UTF-8" standalone="no"?>
<galeria>
   <configuracion>
      <datos
rutaXML="ruta del archivo XML con la lista de imagenes"
rutaMin="Ruta de la carpeta de imagenes miniatura"
rutaAmp="Ruta de la carpeta de imagenes miniatura"
rutaLupa="Ruta de la carpeta de imagenes miniatura"
espacioH="Espacio entre columnas de miniaturas"
espacioV="Espacio entre filas de miniaturas"
alto="alto de la galeria"/>
   </configuracion>
</galeria>


2 - Cargo la lista de imagenes en un array
- Cargo la lista de imagenes del archivo rutaXML que es del siguiente estilo:

Código :

<?xml version="1.0" encoding="UTF-8" standalone="no"?>
<lista>
   <imagen>
      <mini ruta="ruta imagen" titulo ="titulo" ancho="ancho imagen" alto="alto imagen" precio="0"/> //informacion Imagen miniatura
      <maxi ruta="ruta imagen" titulo ="titulo" ancho="ancho imagen" alto="alto imagen" precio="0"/>//informacion Imagen ampliada
      <lupa ruta="ruta imagen" titulo ="Sin titulo" ancho="ancho imagen" alto="alto imagen" precio="0"/>//informacion Imagen Lupa
   </imagen>
   <imagen>
.
.
.
.
/imagen>
</lista>


3 - Cargo las miniaturas en el MovieClip contenedor

Código :

import flash.filters.DropShadowFilter;
import mx.controls.UIScrollBar;
import ImagenMinAmpLupa;
import flash.*;
import flash.display.*;
import flash.geom.*;
import mx.utils.Delegate;
/*-------------------------------------------------------------------------------+
|                          CLASE GALERIA IMAGEN  -  GaleriaImagenes              |
|    @attrib:                                                                    |
|                                                                                |
|    @descripcion:                                                               |
|             Almacena en un objeto una imagen y su correspondiente miniatura    |
|                                                                                |
+-------------------------------------------------------------------------------*/
class GaleriaImagenes extends MovieClip {
   
   private var _m_parent_mc:MovieClip;
   private var _myloop:MovieClip;
   private var _btnSub:MovieClip;
   private var _btnBaj:MovieClip;
   private var _scrollBar_mc:MovieClip;
   private var _rutaXML:String;
   private var _rutaMini:String;
   private var _rutaMax:String;
   private var _rutaZoom:String;
   private var _espacioH:Number;
   private var _espacioV:Number;
   private var _columnas:Number;
   private var _ancho:Number;
   private var _alto:Number;
   private var _listaImagenes:Array;
   
   private var _topeSuperior:Number;
   private var _velocidad:Number;
   private var _topeInferior:Number;
   private var _pasoContenedor:Number;
   private var _pasoScrollBar:Number;
   private var _m_parent_mc_height:Number;
   private var _posicionInicialContenedor:Number;
   private var _posicionScroll:Number;
   private var _posicionInicialScrollBar:Number;
   private var _posicionFinalScrollBar:Number;
   private var _contadorImagenes:Number;
   private var _cargadoXML:Boolean;
   private var _cargandoXML:Boolean;
   private var _cargadoMiniaturas:Boolean;
   
   private var _dropShadow:DropShadowFilter;


   function GaleriaImagenes(rutaConfig:String, contenedor:MovieClip, btnSub:MovieClip, btnBaj:MovieClip, scrollBar_mc:MovieClip){
      CargarConfig(rutaConfig);
      this._m_parent_mc = contenedor;
      this._btnSub = btnSub;
      this._btnBaj = btnBaj;
      this._scrollBar_mc = scrollBar_mc;
      
      this._listaImagenes = new Array();
      this._cargadoXML = false;
      this._cargandoXML = false;
      this._cargadoMiniaturas = false;
      this._dropShadow = new DropShadowFilter(5, 45, 0x000000, 0.15, 8, 8, 1, 3);
   }

   /**************************/
   /* Cargo la configuracion de la galeria:
         - rutaXML: Ruta del archivo XML con la lista de las imagenes.
         - rutaMin: Ruta de la carpeta de la imagenes miniaturas.
         - rutaAmp: Ruta de la carpeta de la imagenes ampliadas.
         - rutaLupa: Ruta de la carpeta de la imagenes para el efecto lupa.
         - alto: alto de la galeria.
         - ancho: ancho de la galeria.
         - velocidad: velocidad del scrollBar
   */
   public function CargarConfig(rutaConfig:String) :Void {
      var thisObj = this;
      var objXML:XML = new XML();
      objXML.ignoreWhite = true;
      objXML.onLoad = function(exito:Boolean){
         var thisObj2 = thisObj;
         if(exito){
            var fc:XMLNode = objXML.firstChild;
            var att;
            for(att in fc.childNodes[0].childNodes[0].attributes){
               switch (att) {
                  case "rutaXML" :
                     thisObj2.RutaXML = (fc.childNodes[0].childNodes[0].attributes[att]);
                     break;
                  case "rutaMin" :
                     thisObj2.RutaMini = (fc.childNodes[0].childNodes[0].attributes[att]);
                     break;
                  case "rutaAmp" :
                     thisObj2.RutaMax = (fc.childNodes[0].childNodes[0].attributes[att]);
                     break;
                  case "rutaLupa" :
                     thisObj2.RutaZoom = (fc.childNodes[0].childNodes[0].attributes[att]);
                     break;
                  case "espacioH" :
                     thisObj2.EspacioH = (Number(fc.childNodes[0].childNodes[0].attributes[att]));
                     break;
                  case "espacioV" :
                     thisObj2.EspacioV = (Number(fc.childNodes[0].childNodes[0].attributes[att]));
                     break;
                  case "alto" :
                     thisObj2.Alto = (Number(fc.childNodes[0].childNodes[0].attributes[att]));
                     break;
                  case "ancho" :
                     thisObj2.Ancho = (Number(fc.childNodes[0].childNodes[0].attributes[att]));
                     break;
                  case "columnas" :
                     thisObj2.Columnas = (Number(fc.childNodes[0].childNodes[0].attributes[att]));
                     break;
                  case "velocidad" :
                     thisObj2.Velocidad = (Number(fc.childNodes[0].childNodes[0].attributes[att]));
                     break;
                  default :
                         trace("ERROR:\n\tCódigo: E_GAL_004\n\tDescripción: Disculpe las molestias, no se reconoce el atributo [" + att + "]: \n\t Debe Correjir el archivo XML de configuracion de la caleria: [" + thisObj2.rutaConfig +"]");
               }
            }
            //Creamos la galeria con los datos de configuracion cargados
            thisObj2.Cargar();
         } else {
            trace("ERROR:\n\tCódigo: E_GAL_003\n\tDescripción: Disculpe las molestias, no se ha cargado correctamente el archivo XML de configuracion de la galería: [" + thisObj2.rutaConfig +"]");
         }
      };
      objXML.load(rutaConfig);
   }
   
   /*
   Cargamos la lista de imagenes de la galeria en un array de ImagenMinAmpLupa
   */
   public function Cargar() :Void {
      var thisObj = this;
      var objXML:XML = new XML();
      objXML.ignoreWhite = true;
      objXML.onLoad = function(exito:Boolean){
         var thisObj2 = thisObj;
         if(exito){
            var fc:XMLNode = objXML.firstChild;
            var i:Number;
            for(i=0; i<fc.childNodes.length;i++){
               
               var min:Imagen = new Imagen();
               var amp:Imagen = new Imagen();
               var lup:Imagen = new Imagen();
               var imgMAL:ImagenMinAmpLupa = new ImagenMinAmpLupa();
               var att;
               
               for(att in fc.childNodes[i].childNodes[0].attributes){
                  switch (att) {
                     case "ref" :
                        min.Ref = (fc.childNodes[i].childNodes[0].attributes[att]);
                        break;
                     case "ruta" :
                        min.Ruta = (fc.childNodes[i].childNodes[0].attributes[att]);
                        break;
                     case "titulo" :
                        min.Titulo = (fc.childNodes[i].childNodes[0].attributes[att]);
                        break;
                     case "ancho" :
                        min.Ancho = (Number(fc.childNodes[i].childNodes[0].attributes[att]));
                        break;
                     case "alto" :
                        min.Alto = (Number(fc.childNodes[i].childNodes[0].attributes[att]));
                        break;
                     case "precio" :
                        min.Precio = (Number(fc.childNodes[i].childNodes[0].attributes[att]));
                        break;
                     case "comentario" :
                        min.Comentario = (fc.childNodes[i].childNodes[0].attributes[att]);
                        break;
                     default :
                          trace("ERROR:\n\tCódigo: E_GAL_002\n\tDescripción: Disculpe las molestias, no se reconoce el atributo [" + att + "]: \n\tDebe Correjir el archivo XML de imagenes [" + thisObj.GetRutaXML() +"]");
                  }
               }
               imgMAL.Miniatura = (min);
               for(att in fc.childNodes[i].childNodes[1].attributes){
                  switch (att) {
                     case "ref" :
                        amp.Ref = (fc.childNodes[i].childNodes[1].attributes[att]);
                        break;
                     case "ruta" :
                        amp.Ruta = (fc.childNodes[i].childNodes[1].attributes[att]);
                        break;
                     case "titulo" :
                        amp.Titulo = (fc.childNodes[i].childNodes[1].attributes[att]);
                        break;
                     case "ancho" :
                        amp.Ancho = (Number(fc.childNodes[i].childNodes[1].attributes[att]));
                        break;
                     case "alto" :
                        amp.Alto = (Number(fc.childNodes[i].childNodes[1].attributes[att]));
                        break;
                     case "precio" :
                        amp.Precio = (Number(fc.childNodes[i].childNodes[1].attributes[att]));
                        break;
                     case "comentario" :
                        amp.Comentario = (fc.childNodes[i].childNodes[1].attributes[att]);
                        break;
                     default :
                          trace("ERROR:\n\tCódigo: E_GAL_002\n\tDescripción: Disculpe las molestias, no se reconoce el atributo [" + att + "]: \n\tDebe Correjir el archivo XML de imagenes [" + thisObj.GetRutaXML() +"]");
                  }
               }
               imgMAL.Ampliada = (amp);
               for(att in fc.childNodes[i].childNodes[2].attributes){
                  switch (att) {
                     case "ref" :
                        lup.Ref = (fc.childNodes[i].childNodes[2].attributes[att]);
                        break;
                     case "ruta" :
                        lup.Ruta = (fc.childNodes[i].childNodes[2].attributes[att]);
                        break;
                     case "titulo" :
                        lup.Titulo = (fc.childNodes[i].childNodes[2].attributes[att]);
                        break;
                     case "ancho" :
                        lup.Ancho = (Number(fc.childNodes[i].childNodes[2].attributes[att]));
                        break;
                     case "alto" :
                        lup.Alto = (Number(fc.childNodes[i].childNodes[2].attributes[att]));
                        break;
                     case "precio" :
                        lup.Precio = (Number(fc.childNodes[i].childNodes[2].attributes[att]));
                        break;
                     case "comentario" :
                        lup.Comentario = (fc.childNodes[i].childNodes[2].attributes[att]);
                        break;
                     default :
                          trace("ERROR:\n\tCódigo: E_GAL_002\n\tDescripción: Disculpe las molestias, no se reconoce el atributo [" + att + "]: \n\tDebe Correjir el archivo XML de imagenes [" + thisObj2.GetRutaXML() +"]");
                  }
               }
               imgMAL.Lupa = (lup);
               thisObj2._listaImagenes.push(imgMAL);
            }
            //Confirmamos que la carga del XML se ha completado
            thisObj._cargadoXML=true;
            //Mostramos las miniaturas del array de imagenes
            thisObj.CargarMiniaturas();
         } else {
            trace("ERROR:\n\tCódigo: E_GAL_001\n\tDescripción: Disculpe las molestias, no se ha cargado correctamente el archivo XML de imagenes la galería: [" + thisObj2.GetRutaXML() +"]");
         }
      };
      objXML.load(_rutaXML);
   }
   
   //Carga de miniaturas
   private function CargarMiniaturas() :Void{
      var mitad:Number  = Math.ceil(_listaImagenes.length/2);
      var posx:Number = 0;
      var posy:Number = 0;
      var i:Number;
      //Este metodo es para el caso particular de 2 columnas (es el que me interesa), pero puede modificarse para que muestre las minuaturas en _columnas columnas (este dato esta en el archivo de configuracion con el parametro columnas)
      //mostramos una mitad
      for(i=0;i<mitad;i++){
         posy = (_espacioV/2)-(_listaImagenes[i].Miniatura.Alto/2) + (_espacioV*i);
         posx = (_espacioH/2)-(_listaImagenes[i].Miniatura.Ancho/2);
         CargarImagen(i, _listaImagenes[i].Miniatura, posx, posy);
      }
      this._m_parent_mc_height = mitad*this._espacioV;
      //Mostramos la otra mitad
      for(i=mitad;i<_listaImagenes.length;i++){
         posy = (_espacioV/2)-(_listaImagenes[i].Miniatura.Alto/2) + (_espacioV*(i-mitad));
         posx = (_espacioH/2) - (_listaImagenes[i].Miniatura.Ancho/2) + _espacioH;
         CargarImagen(i, _listaImagenes[i].Miniatura, posx, posy);
      }
      //cargamos la barra de desplazamiento
      CargarScrollBar();
   }
   
   //Carga en un movie clip una imagen del array
   private function CargarImagen(id:Number, img:Imagen, posx:Number, posy:Number) :Void{
      var thisObj = this;
      this._m_parent_mc.createEmptyMovieClip(id.toString(), this._m_parent_mc.getNextHighestDepth());
      this._m_parent_mc[id.toString()].id = id;
      this._m_parent_mc[id.toString()].createEmptyMovieClip("imagen",1);
      
      var my_mcl:MovieClipLoader = new MovieClipLoader();
      my_mcl.loadClip(this._rutaMini + img.Ruta, this._m_parent_mc[id.toString()].imagen);
      
      this._m_parent_mc[id.toString()]._x = posx;
      this._m_parent_mc[id.toString()]._y = posy;
      Eventos(this._m_parent_mc[id]);
      this._contadorImagenes++;
   }
   
   //Creamos un MovieClip que contendra la imagen ampliada
   private function popUp(id:Number) :Void{
      var thisObj = this;
      //Instancia del PopUp
      _root.createEmptyMovieClip("popUp", 0);
      
      //Cargar Transparencia
      _root.popUp.attachMovie("GaleriaTransparencia","transparencia",0);
      _root.popUp.transparencia._alpha = 40;
      _root.popUp.transparencia._x=(Stage.width/2);
      _root.popUp.transparencia._y=(Stage.height/2);
      
      //Cargar mc que contiene la Ampliacion
      _root.popUp.createEmptyMovieClip("Ampliacion", 1);
      _root.popUp.Ampliacion.id = id;
      
      //creacion del boton de cierre
      _root.popUp.attachMovie("GaleriaPopUp_Btn_Cerrar","btnCerrar",2);
      //Posicionamiento del boton de cierre del popup
      _root.popUp.btnCerrar._x = Stage.width - (_root.popUp.btnCerrar._width/2);
      _root.popUp.btnCerrar._y = _root.popUp.btnCerrar._height/2;
      _root.popUp.transparencia.useHandCursor = false;
      _root.popUp.transparencia.onRollOver = function (){
      };
      //Eventos del boton de cierre del popup
      var encimaBoton:Boolean = false;
      _root.popUp.btnCerrar.onRelease = function (){
         thisObj.encimaBoton = false;
         _root.popUp.removeMovieClip(_root.popUp);
      };
      _root.popUp.btnCerrar.onRollOver = function(){
         thisObj.encimaBoton = true;
         _root.popUp.btnCerrar._xscale += 6;
         _root.popUp.btnCerrar._yscale += 6;
      };
      _root.popUp.btnCerrar.onRollOut = function(){
         thisObj.encimaBoton = false;
         _root.popUp.btnCerrar._xscale -= 6;
         _root.popUp.btnCerrar._yscale -= 6;
      };
      _root.popUp.btnCerrar.onMouseMove = function(){
         if(thisObj.encimaBoton){
            Mouse.show();
         }
      };
      
      //Crear mc para la Imagen
      _root.popUp.Ampliacion.createEmptyMovieClip("imagen",1);
      
      var lupaActivada:Boolean = true;
      var infoActivada:Boolean = true;
      var mclListener:Object = new Object();
      mclListener.onLoadInit = function(target_mc:MovieClip) {
         var thisObj2 = thisObj;
         
         //creacion del boton de info
         _root.popUp.attachMovie("GaleriaPopUp_Btn_Info","btnInfo",3);
         //Posicionamiento del boton de cierre del popup
         _root.popUp.btnInfo._y = _root.popUp.btnCerrar._y;
         _root.popUp.btnInfo._x = _root.popUp.btnCerrar._x - _root.popUp.btnInfo._width;
         //Eventos del boton de info del popup
         _root.popUp.btnInfo.onRelease = function (){
            thisObj2.encimaBoton = false;
            thisObj2.infoActivada = !thisObj2.infoActivada;
            if(thisObj2.infoActivada){
               _root.popUp.info.removeMovieClip(_root.popUp.info);
            }else {
               thisObj2.MostrarInfo(id);
            }
         };
         _root.popUp.btnInfo.onRollOver = function(){
            thisObj2.encimaBoton = true;
            _root.popUp.btnInfo._xscale += 6;
            _root.popUp.btnInfo._yscale += 6;
         };
         _root.popUp.btnInfo.onRollOut = function(){
            thisObj2.encimaBoton = false;
            _root.popUp.btnInfo._xscale -= 6;
            _root.popUp.btnInfo._yscale -= 6;
         };
         _root.popUp.btnInfo.onMouseMove = function(){
            if(thisObj2.encimaBoton){
               Mouse.show();
            }
         };
      
         //creacion del boton de Lupa
         _root.popUp.attachMovie("GaleriaPopUp_Btn_Lupa","btnLupa",4);
         //Posicionamiento del boton de cierre del popup
         _root.popUp.btnLupa._y = _root.popUp.btnCerrar._y;
         _root.popUp.btnLupa._x = _root.popUp.btnInfo._x - _root.popUp.btnInfo._width;
         //Eventos del boton de info del popup
         _root.popUp.btnLupa.onRelease = function (){
            thisObj2.encimaBoton = false;
            thisObj2.lupaActivada = !thisObj2.lupaActivada;
            if(thisObj2.lupaActivada){
               _root.popUp.Ampliacion.imgz.removeMovieClip(_root.popUp.Ampliacion.imgz);
               _root.popUp.Ampliacion.lupa.removeMovieClip(_root.popUp.Ampliacion.lupa);
            }else {
               thisObj2.MostrarLupa(id);
            }
         };
         _root.popUp.btnLupa.onRollOver = function(){
            thisObj2.encimaBoton = true;
            _root.popUp.btnLupa._xscale += 6;
            _root.popUp.btnLupa._yscale += 6;
         };
         _root.popUp.btnLupa.onRollOut = function(){
            thisObj2.encimaBoton = false;
            _root.popUp.btnLupa._xscale -= 6;
            _root.popUp.btnLupa._yscale -= 6;
         };
         _root.popUp.btnLupa.onMouseMove = function(){
            if(thisObj2.encimaBoton){
               Mouse.show();
            }
         };
      };
      
      
      //Crea un mcLoader
      var my_mcl:MovieClipLoader = new MovieClipLoader();
      my_mcl.addListener(mclListener);
      //Carga la imagen ampliada en el mc "_root.popUp.Ampliacaion.imagen"
      my_mcl.loadClip(_rutaMax + this._listaImagenes[id].Ampliada.Ruta, _root.popUp.Ampliacion.imagen);
      //Posicionamiento de la imagen
      _root.popUp.Ampliacion.imagen._x=0;
      _root.popUp.Ampliacion.imagen._y=0;
      //Posicionamiento de la ampliacion
      _root.popUp.Ampliacion._x = (Stage.width/2)-(this._listaImagenes[id].Ampliada.Ancho/2);
      _root.popUp.Ampliacion._y = (Stage.height/2)-(this._listaImagenes[id].Ampliada.Alto/2);
      //asignacion de opacidad (_alpha)
      
   }
   private function MostrarLupa(id:Number) :Void{
      //Crear mc para el Zoom
      _root.popUp.Ampliacion.createEmptyMovieClip("imgz", 3);

      _root.popUp.Ampliacion.attachMovie("Lupa","lupa",2);
      //_root.popUp.Ampliacion.attachMovie("LupaMarco","lupaMarco",4);
   
      var mclListener2:Object = new Object();
      mclListener2.onLoadInit = function(target_mc:MovieClip) {
         _root.popUp.Ampliacion.imgz.setMask(_root.popUp.Ampliacion.lupa.mascara);
         _root.popUp.Ampliacion.imagen.onMouseMove = function(){
            if((_xmouse>(_root.popUp.Ampliacion.imagen._x - _root.popUp.Ampliacion.lupa.mascara._width))
            && (_xmouse<(_root.popUp.Ampliacion.imagen._x+_root.popUp.Ampliacion.imagen._width))
            && (_ymouse>(_root.popUp.Ampliacion.imagen._y - _root.popUp.Ampliacion.lupa.mascara._height))
            && (_ymouse<(_root.popUp.Ampliacion.imagen._y+_root.popUp.Ampliacion.imagen._height))
            ) {
               _root.popUp.Ampliacion.lupa.startDrag(true);
               //_root.popUp.Ampliacion.lupaMarco.startDrag(true);
               Mouse.hide();
               var porcx:Number = (_root.popUp.Ampliacion.imagen._xmouse/_root.popUp.Ampliacion.imagen._width)*100;
               var porcy:Number = (_root.popUp.Ampliacion.imagen._ymouse/_root.popUp.Ampliacion.imagen._height)*100;
               var disx:Number = (porcx*_root.popUp.Ampliacion.imgz._width)/100;
               var disy:Number = (porcy*_root.popUp.Ampliacion.imgz._height)/100;
               _root.popUp.Ampliacion.imgz._x = _xmouse - disx - (_root.popUp.Ampliacion.lupa.mascara._width/2);
               _root.popUp.Ampliacion.imgz._y = _ymouse - disy - (_root.popUp.Ampliacion.lupa.mascara._height/2);
               _root.popUp.Ampliacion.imgz._alpha = 100;
            } else {
               _root.popUp.Ampliacion.lupa.startDrag(false);
               Mouse.show();
               _root.popUp.Ampliacion.imgz._alpha = 0;
            }
         };
      };
   
      var my_mcl2:MovieClipLoader = new MovieClipLoader();
      my_mcl2.addListener(mclListener2);
      my_mcl2.loadClip(_rutaZoom + this._listaImagenes[id].Lupa.Ruta, _root.popUp.Ampliacion.imgz);
   }
   
   private function MostrarInfo(id:Number) :Void{
      _root.popUp.createEmptyMovieClip("info",5);
      _root.popUp.info._alpha = 70;
      
      var maskClip:MovieClip = _root.popUp.info.createEmptyMovieClip("fondo", 0);
       with (maskClip) {
           // Dibujar fondo
           beginFill(0xE8E3DC, 100);
           moveTo(0, 0);
           lineTo(270, 0);
           lineTo(270, 124);
           lineTo(0, 124);
           lineTo(0, 0);
           endFill();
       }

      var my_fmt1:TextFormat = new TextFormat();
      my_fmt1.font = "Century Gothic"
      my_fmt1.bold = true;
      my_fmt1.size = 18;
      my_fmt1.color = 0x000000;
      
      var my_fmt2:TextFormat = new TextFormat();
      my_fmt2.font = "Century Gothic"
      my_fmt2.bold = true;
      my_fmt2.size = 18;
      my_fmt2.color = 0x4D6600;
      
      _root.popUp.info.createTextField("info_txt",1,0,0,270,124);
      _root.popUp.info.info_txt.selectable = true;
      _root.popUp.info.info_txt.html = true;
      _root.popUp.info.info_txt.multiline = true;
      _root.popUp.info.info_txt.border = true;
      _root.popUp.info.info_txt.borderColor = 0x000000;
      //_root.popUp.info.info_txt.background = true;
      //_root.popUp.info.info_txt.backgroundColor = 0xE8E3DC;
      _root.popUp.info.info_txt.wordWrap = true;
      
      var pos:Number = 0;      
      if((this._listaImagenes[id].Lupa.Ref <> "") && (this._listaImagenes[id].Lupa.Ref <> undefined)){
         _root.popUp.info.info_txt.htmlText += "Referencia: ";
         _root.popUp.info.info_txt.setTextFormat(pos,_root.popUp.info.info_txt.length,my_fmt1);
         pos = _root.popUp.info.info_txt.length;
      
         _root.popUp.info.info_txt.htmlText += this._listaImagenes[id].Lupa.Ref + "<br><br>";
         _root.popUp.info.info_txt.setTextFormat(pos,_root.popUp.info.info_txt.length,my_fmt2);
         pos = _root.popUp.info.info_txt.length;
      }
      
      if((this._listaImagenes[id].Lupa.Titulo <> "") && (this._listaImagenes[id].Lupa.Titulo <> undefined)){
         _root.popUp.info.info_txt.htmlText += "Titulo: ";
         _root.popUp.info.info_txt.setTextFormat(pos,_root.popUp.info.info_txt.length,my_fmt1);
         pos = _root.popUp.info.info_txt.length;
      
         _root.popUp.info.info_txt.htmlText += this._listaImagenes[id].Lupa.Titulo + "<br><br>";
         _root.popUp.info.info_txt.setTextFormat(pos,_root.popUp.info.info_txt.length,my_fmt2);
         pos = _root.popUp.info.info_txt.length;
      }
      
      if((this._listaImagenes[id].Lupa.Ancho <> 0) && (this._listaImagenes[id].Lupa.Ancho <> NaN)){
         _root.popUp.info.info_txt.htmlText += "Ancho: ";
         _root.popUp.info.info_txt.setTextFormat(pos,_root.popUp.info.info_txt.length,my_fmt1);
         pos = _root.popUp.info.info_txt.length;
      
         _root.popUp.info.info_txt.htmlText += this._listaImagenes[id].Lupa.Ancho + " cm<br><br>";
         _root.popUp.info.info_txt.setTextFormat(pos,_root.popUp.info.info_txt.length,my_fmt2);
         pos = _root.popUp.info.info_txt.length;
      }
      
      if((this._listaImagenes[id].Lupa.Alto <> 0) && (this._listaImagenes[id].Lupa.Alto <> NaN)){
         _root.popUp.info.info_txt.htmlText += "Alto: ";
         _root.popUp.info.info_txt.setTextFormat(pos,_root.popUp.info.info_txt.length,my_fmt1);
         pos = _root.popUp.info.info_txt.length;
      
         _root.popUp.info.info_txt.htmlText += this._listaImagenes[id].Lupa.Alto + " cm<br><br>";
         _root.popUp.info.info_txt.setTextFormat(pos,_root.popUp.info.info_txt.length,my_fmt2);
         pos = _root.popUp.info.info_txt.length;
      }
      
      if((this._listaImagenes[id].Lupa.Precio <> 0) && (this._listaImagenes[id].Lupa.Precio <> NaN)){
         _root.popUp.info.info_txt.htmlText += "Precio: ";
         _root.popUp.info.info_txt.setTextFormat(pos,_root.popUp.info.info_txt.length,my_fmt1);
         pos = _root.popUp.info.info_txt.length;
         
         _root.popUp.info.info_txt.htmlText += this._listaImagenes[id].Lupa.Precio + " €<br><br>";
         _root.popUp.info.info_txt.setTextFormat(pos,_root.popUp.info.info_txt.length,my_fmt2);
         pos = _root.popUp.info.info_txt.length;
      }
      
      if((this._listaImagenes[id].Lupa.Comentario <> "") && (this._listaImagenes[id].Lupa.Comentario <> undefined)){
         _root.popUp.info.info_txt.htmlText += "Comentario: ";
         _root.popUp.info.info_txt.setTextFormat(pos,_root.popUp.info.info_txt.length,my_fmt1);
         pos = _root.popUp.info.info_txt.length;
      
      
         _root.popUp.info.info_txt.htmlText += this._listaImagenes[id].Lupa.Comentario;
         _root.popUp.info.info_txt.setTextFormat(pos,_root.popUp.info.info_txt.length,my_fmt2);
         pos = _root.popUp.info.info_txt.length;
      }
      _root.popUp.info.createClassObject(mx.controls.UIScrollBar, "my_sb", 20);
      
      // Establecer el campo de texto de destino de la barra de desplazamiento.
      _root.popUp.info.my_sb.setScrollTarget(_root.popUp.info.info_txt);
      
      // Cambiar el tamaño para ajustar el campo de texto.
      _root.popUp.info.my_sb.setSize(16, _root.popUp.info.info_txt._height); 
      
      // Desplazarlo junto al campo de texto.
      _root.popUp.info.my_sb.move(_root.popUp.info.info_txt._x + _root.popUp.info.info_txt._width, _root.popUp.info.info_txt._y);
   }
   //Eventos para las miniaturas
   private function Eventos(mClip) :Void{
      var thisObj = this;
      mClip.onRollOver = function (){
         mClip.filters = [thisObj._dropShadow];
         mClip._xscale+= 6;
         mClip._yscale += 6;
         mClip._x -= 3;
         mClip._y -= 3;
      };
      mClip.onRelease = function (){
         thisObj.popUp(mClip.id);
      };
      mClip.onRollOut = function (){
         mClip.filters = [];
         mClip._xscale-= 6;
         mClip._yscale -= 6;
         mClip._x += 3;
         mClip._y += 3;
      };
   }
   
   private function CargarScrollBar() :Void {
      var ts:Number;
      
      this._posicionInicialContenedor = this._m_parent_mc._y;
      this._topeInferior = Math.abs(this._posicionInicialContenedor);
      ts = (this._m_parent_mc_height - this._alto);
      if (ts>0){
         this._topeSuperior = ts;
      } else {
         this._topeSuperior = 0;
      }
      this._posicionInicialScrollBar = this._btnSub._y + this._btnSub._height;
      this._posicionFinalScrollBar = this._btnBaj._y - this._btnBaj._height;
      this._scrollBar_mc._y = this._posicionInicialScrollBar;
      this._scrollBar_mc.filters = [this._dropShadow];
      this._posicionScroll = 0;
      this._pasoContenedor = (this._espacioV/this._velocidad);
      this._pasoScrollBar = (this._posicionFinalScrollBar - this._posicionInicialScrollBar)/(this._topeSuperior/this._pasoContenedor);
      
      BotonesSubirBajar();
   }
   public function Informacion() :Void {
      
      trace("alto = " + this._alto);
      trace("_btnSub._y = " + this._btnSub._y);
      trace("_btnSub._height = " + this._btnSub._height + "\n");
      trace("_btnBaj._y = " + this._btnBaj._y);
      trace("_btnBaj._height = " + this._btnBaj._height + "\n");
      trace("_scrollBar_mc._y = " + this._scrollBar_mc._y);
      trace("_scrollBar_mc._height = " + this._scrollBar_mc._height + "\n");
      trace("_m_parent_mc._y = " + this._m_parent_mc._y);
      trace("_m_parent_mc._height = " + this._m_parent_mc._height + "\n");
      trace("_m_parent_mc_height = " + this._m_parent_mc_height + "\n");
      trace("_topeSuperior = " + this._topeSuperior); 
      trace("_topeInferior = " + this._topeInferior); 
      trace("_posicionScroll = " + this._posicionScroll + "\n"); 
      trace("_posicionInicialScrollBar = " + this._posicionInicialScrollBar); 
      trace("_posicionFinalScrollBar = " + this._posicionFinalScrollBar);
      trace("_velocidad = " + this._velocidad);
      trace("_pasoContenedor = " + this._pasoContenedor);
      trace("_pasoScrollBar = " + this._pasoScrollBar);
      trace("\n\n\n\n");
   }
   
   private function BotonesSubirBajar() :Void{
      var thisObj =  this;
      _btnSub.onRollOver = function (){
         thisObj._btnSub.filters = [thisObj._dropShadow];
         thisObj._btnSub._yscale += 6;
         thisObj._btnSub._xscale += 6;
      };
      _btnSub.onRollOut = function (){
         thisObj._btnSub.filters = [];
         thisObj._btnSub._yscale -= 6;
         thisObj._btnSub._xscale -= 6;
      };
      _btnSub.onRelease = _btnSub.onReleaseOutside = function (){
         thisObj.stopScroll();
      };
      _btnSub.onPress = function(){
         if(thisObj._posicionScroll>=0){
            thisObj.startScroll(1);
         }
      };
   
      _btnBaj.onPress = function(){
         if(thisObj._posicionScroll<=thisObj._topeSuperior){
            thisObj.startScroll(-1);
         }
      };      
      _btnBaj.onRelease = _btnBaj.onReleaseOutside = function(){
         thisObj.stopScroll();
      };
      _btnBaj.onRollOver = function (){
         thisObj._btnBaj.filters = [thisObj._dropShadow];
         thisObj._btnBaj._yscale += 6;
         thisObj._btnBaj._xscale += 6;
      };
      _btnBaj.onRollOut = function (){
         thisObj._btnBaj.filters = [];
         thisObj._btnBaj._yscale -= 6;
         thisObj._btnBaj._xscale -= 6;
      };
      
   }
   
   // -- detener desplazamiento de la galeria
   private function stopScroll() :Void {
      delete this._myloop.onEnterFrame;
   }
   // -- función que desplaza texto 
   private function startScroll(direccion:Number) :Void {
      var thisObj =  this;
      this._myloop = _root.createEmptyMovieClip("_myloop", this.getNextHighestDepth());
      _myloop.onEnterFrame = function() {
         if ((thisObj._posicionScroll>=0) && (thisObj._posicionScroll<=thisObj._topeSuperior)) {
            // -- mover galeria
            thisObj._posicionScroll += (thisObj._pasoContenedor*(-direccion));
            if(thisObj._posicionScroll<0){
               thisObj._posicionScroll = 0;
               thisObj._m_parent_mc._y = thisObj._posicionInicialContenedor;
               thisObj._scrollBar_mc._y = thisObj._posicionInicialScrollBar;
            } else if (thisObj._posicionScroll>thisObj._topeSuperior){
               thisObj._posicionScroll = thisObj._topeSuperior;
               thisObj._m_parent_mc._y = thisObj._posicionInicialContenedor - thisObj._topeSuperior;
               thisObj._scrollBar_mc._y = thisObj._posicionFinalScrollBar;
            } else {
               thisObj._m_parent_mc._y += (direccion*thisObj._pasoContenedor);
               thisObj._scrollBar_mc._y += (thisObj._pasoScrollBar*(-direccion));
            }
         }
      };
   }
   
   /******************SETTER Y GETTER*****************/
   public function set RutaXML(value:String) :Void {
      this._rutaXML = value;
   }
   public function set RutaMini(value:String) :Void {
      this._rutaMini = value;
   }
   public function set RutaMax(value:String) :Void {
      this._rutaMax = value;
   }
   public function set RutaZoom(value:String) :Void {
      this._rutaZoom = value;
   }
   public function set EspacioH(value:Number) :Void {
      this._espacioH = value;
   }
   public function set EspacioV(value:Number) :Void {
      this._espacioV = value;
   }
   public function set Columnas(value:Number) :Void {
      this._columnas = value;
   }
   public function set Ancho(value:Number) :Void {
      this._ancho = value;
   }
   public function set Alto(value:Number) :Void {
      this._alto = value;
   }
   public function set TopeSuperior(value:Number) :Void {
      this._topeSuperior = value;
   }
   public function set TopeInferior(value:Number) :Void {
      this._topeInferior = value;
   }
   public function set PosicionScroll(value:Number) :Void {
      this._posicionScroll = value;
   }
   public function set PosicionInicialScrollBar(value:Number) :Void {
      this._posicionInicialScrollBar = value;
   }
   public function set PosicionFinalScrollBar(value:Number) :Void {
      this._posicionFinalScrollBar = value;
   }
   public function set Velocidad(value:Number) :Void {
      this._velocidad = value;
   }
   
   /***********/
   
   public function get RutaXML() :String {
      return this._rutaXML;
   }   
   public function get RutaMini() :String {
      return this._rutaMini;
   }   
   public function get RutaMax() :String {
      return this._rutaMax;
   }   
   public function get RutaZoom() :String {
      return this._rutaZoom;
   }   
   public function get EspacioH() :Number {
      return this._espacioH;
   }
   public function get EspacioV() :Number {
      return this._espacioV;
   }
   public function get Columnas() :Number {
      return this._columnas;
   }
   public function get Ancho() :Number {
      return this._ancho;
   }
   public function get Alto() :Number {
      return this._alto;
   }
   public function get TopeSuperior() :Number {
      return this._topeSuperior;
   }
   public function get TopeInferior() :Number {
      return this._topeInferior;
   }
   public function get PosicionScroll() :Number {
      return this._posicionScroll;
   }
   public function get PosicionInicialScrollBar() :Number {
      return this._posicionInicialScrollBar;
   }
   public function get PosicionFinalScrollBar() :Number {
      return this._posicionFinalScrollBar;
   }
   public function get Velocidad() :Number {
      return this._velocidad;
   }
}


El fallo está en los botones de "Lupa" y de "Informacion" que no siempre funcionan al primer click, aveces funciona, otras veces hay que hacer dobleclick, es un fallo al que no le encuentro sentido, podeis ver el fallo en la pagina
http:\\www.norler.com
en la seccion "Galeria" y escogeis alguna ciudad, preferentemente "Sevilla" o "Ediciones" que son las que mas imagenes tienen.

Tambien me gustaria saber si teneis alguna sugerencia, se que le faltan elementos importantes como un loader, pero no los he hecho un poco por pereza no le doy mucha prioridad, son cosas que dejare para el final, sin embargo si me podeis decir una forma facil y eficaz (pido mucho verdad??) os lo agradeceria.

Saludos

Por cientocien

0 de clabLevel



 

firefox
Citar            
MensajeEscrito el 30 Sep 2007 06:36 pm
[list]>>En la funcion: "public function Cargar() :Void {"

* Porque "objXML.load(_rutaXML);" esta luego de todo el proceso de paso de variables, es decir al final y no al principio

* tambien dime si: "objXML.onLoad = function(exito:Boolean){..." es un evento dentro de una función???? no sabia que eso se podia!!! explicame que hace eso, para mi parece que se ejecuta en el momento que el objeto objXML se carga por completo con toda su lsta de variables.

>>PARA MI en caso de ser correcta mi apreciasión anterior, tiene logica todo; tienes que colocar: "objXML.load(_rutaXML);" antes de "objXML.onLoad = function(exito:Boolean){..." si no vas a realizar un proceso de paso de variables vacios por que no se ha realizado carga alguna previamente, lo que ocasiona que le das un click entonces "objXML.onLoad = function(exito:Boolean){..." intenta cargar NADA y luego al final "objXML.load(_rutaXML);" carga las variables que necesitaba lo anterior, por eso al volverle a dar click "objXML.onLoad = function(exito:Boolean){..." si funciona por que ahora si esta todo en emmoria

>>> PERO la averracion de programacion de un evento ("objXML.onLoad = function(exito:Boolean){...") entrod e una funcion ("public function Cargar() :Void {") jamas en mi vida lo havia visto lo que me hace suponer.. bueno realmente solo especularia por que no tienen ni sentido para mi eso... solo dire que ocurre lo mismo o parecido que lo anterior, se ejecuta primero lo que esta dentro de "objXML.onLoad = function(exito:Boolean){..." sin pensar que es un evento por que no tienen ni sentido para mi eso, y luego se pide la carga de "objXML.load(_rutaXML);" que es lo que necesitaba lo anterior

Osea yo se que esta bien lo de esa supuesto evento dentro de otro por que lo tienes alli y de seguro ya compilado, pero hijo jamas havia visto eso... :o

Recuerda que la carga de variables es asincrona con el evento de carga que se invocó entonces tenes que hacer un proceso que espere a que carge por completo la variable y a posterior llamar los procesos que usaran dichos valores. es decir esto esta mal

LoadVar(Path) // Se pide la carga de MyExternalVar que esta en un archivo
trace(MyExternalVar)// Se quiere realizar algun tipo de operacion inmedita luego de pedir la carga

por otro lado

>>Colocale indicador de carga a las cosas, veo que la pagina siempre esta quiriendo cargar algo y no se que sera
>>Tu pagina usa el 89% de mi cpu eso quiere decir que tienes algun codigo de proceso redundante inecesario por ejemplo cosas así:

Código :

//Codigo ineficiente
//Aqui se alla terminado de cargar el MC o no siempre se le aplica el efecto de alpha al MC inecesariamente
this.onEnterFrame = function() {
  if MC.getBytesTotal() == MC.getBytesLoaded();{
    MC._alpha = 100;
  }else{
    MC._alpha = 0;
  }
}

//Codigo más eficiente
//Aqui se aplica el efecto efecto de alpha al MC solo cuando se necesito
Var Flag:Boolean = false;
this.onEnterFrame = function() {
  if MC.getBytesTotal() == MC.getBytesLoaded() and MC._alpha != 100;{
    MC._alpha = 100;
  }else if MC.getBytesTotal() == 0 and MC._alpha != 0;{{
    MC._alpha = 0;
  }
}


Revisa tu codigo a ver donde esta ocurriendo eso de la redundancia incesesaria...

>> Utiliza colores menos altisonantes y mas armonicos con el tema para la lupa y el boton de info

Chaito :D

Por Enav

180 de clabLevel



Genero:Masculino  

firefox
Citar            
MensajeEscrito el 30 Sep 2007 06:40 pm
Si sabes como resolver este problema hazmelo saber por favor :D
http://www.cristalab.com/foros/viewtopic.php?t=46201&highlight=

Por Enav

180 de clabLevel



Genero:Masculino  

firefox

 

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