Gallery image loading - getting image width..help!

1

Ladies and gents:

having a problem with my code somewhere; I’m stumped. Here’s what i’m trying to do:

-When you click on a thumbnail in my gallery a load bar appears that is the width of the loading image
-While the image loads the load bar scales from full width to zero
-Once it finishes loading the image fades in
-Click on a new thumbnail, and the old image fades out, then the scrollbar is supposed to take the width of the NEW image and do the same thing

What is happening is that the scrollbar width does not set itself to the new image size until i click the thumbnail a second time…try this link to see what i mean. it’s on the “portfolio” page.

http://www.lewisweb.ws/staging

here’s the code:

//CONSTANTS
frame_x = 387;  //the exact x coordinate where the box originates
frame_y = 184;  //the exact y coordinate where the box originates
alphaSpeed = 5; //spped at which the pics fade in

//INITIAL SETTINGS
containerMC._alpha = 0;
containerMC._x = frame_x;
containerMC._y = frame_y;

//Fades in a picture loaded externally
MovieClip.prototype.loadPic = function(pic){
    containerMC.fadeOldPic();                //fade out old picture
    containerMC._alpha = 0;
    this.loadMovie(pic);                    //load new pic
    var loadIsComplete = false;                //reset load checker
    var w = containerMC._width;     
    loadBar._width = w;                     //set loadbar to new movieclip width
    loadBar._alpha = 100;                    //make loadbar opaque
    _root.onEnterFrame = function(){
        var t = containerMC.getBytesTotal(), l = containerMC.getBytesLoaded();
        loadIsComplete = (Math.round(l/t) == 1); //check to see if load completed
        loadBar._width = w - ((l/t) * w);         //sets width of loadbar dynamically
         if (loadIsComplete){
            containerMC._alpha += alphaSpeed;     //if load is complete, fade pic in
        }
        //if the load is complete and the picture is fully faded in...
        if (t != 0 && loadIsComplete && _root.containerMC._alpha == 100){            
            loadBar._alpha = 0;            //make the load bar disappear
            delete _root.onEnterFrame;
        }
    }
};

//Fades out an old picture...pretty self explanatory
MovieClip.prototype.fadeOldPic = function(){
    _root.onEnterFrame = function(){
        _root.containerMC._alpha -= alphaSpeed;
        if (_root.containerMC._alpha == 0){            
            delete _root.onEnterFrame;
        }
    }
};

containerMC.loadPic("portfolio/westin.jpg");
stop();

ANY help will be appreciated!

2

Question, how do you know the width of something that flash hasnt loaded yet :wink: Cant be done. Thats why it works the second time, because its already cached in the temp files. If you are using XML or PHP, you could always pass the width over to flash so it knows what the width is before its loaded. =)

3

That would make sense of course. I figured as soon as the loadmovie command processed that the height and width in the image header was stored…guess not!

i’m working on making this XML based anyway so that’ll eliminate that problem.

thanks!