Resizing box?

Firstly, i’d like to thank those that helped me with my last question about the mp3 player, you guys rock.

ok, so i am wanting to create a portfolio site for a friend of mine that does photography and i’m still trying to grasp AS. So, i am gonna pre-emptively apologize if this question confuses you.

What i’m trying to create is a blank box that loads an image dynamically. This area would ideally have a smooth size transition depending on the content that’s loaded into it (generally pictures). If this has been stated in a previous thread and i’ve missed it i apologize, any help/direction/advice would be much appreciated.

To exemplify what i am trying to explain, it is what is used at:

http://www.iso50.com

I am not concerned about the slideshow or design, but basically what i’d like to do is the same system of buttons and how they display in the area to the right. again, i apologize for the cryptic question and i appreciate the help!

sorry to do this, just bumping it to see if i can get some more eyes on the question. again, i apologize if i am unclear in my question.

Trying searching the Kirupa Forum’s for “Gallery,Resize” theres lots of tutorials and files on this.

Cheers,

Hetlicht

I was in the “mood” So I built this little booger…

See if this is what you are looking for. If so, you should be able to adapt it to your needs.

Here is the swf, fla, and .as file. Let me know if this works. The fla/swf are setup as somewhat of a demo, but the code should be pretty self explanatory.

You will need Fuse Kit 2.0 in order to recompile. (http://www.mosessupposes.com/Fuse);

=-=-=-=-=-=-=-=-

This allows you to set a bounding box per se. There is a movieClip called photoBoundsMC that is alphaed out. This is where the boundaries come from.

I added an extra layer behind the photo frame and added a Blur Filter to it for a drop shadow effect.

I attached a “stripped” version of the fla without the testing components in (you’ll have to modify the as a bit to omit those), but the fla with the components was well over half a meg.

the swf is in the zip file.

photoBox.as


//Fuse Kit 2.0
//=-=-=-=-=-=-=-=-=-=-=-=-=-=-
import com.mosesSupposes.fuse.*;
ZigoEngine.register(Fuse,PennerEasing,FuseFMP);
_global.LINE = "=-=-=-=-=-=-=-=-=-=-=-=-=-=-=-=-";

//Settings
//=-=-=-=-=-=-=-=-=-=-=-=-=-=-
var transitionTime:Number = 1.5; //Seconds it takes to fade out, resize, and fade in.
var easeType:String = "easeOutExpo";

//Misc Vars
//=-=-=-=-=-=-=-=-=-=-=-=-=-=-
var stageCenter:Object = {x:photoBoundsMC._x + photoBoundsMC._width/2, y:photoBoundsMC._y + photoBoundsMC._height/2};
var frameWidth:Number = (photo._width - photo.photoMask._width) / 2;

//Initialize
//=-=-=-=-=-=-=-=-=-=-=-=-=-=-
trace("Initializing photoBox");trace(LINE);
//--Make Drop Shadow
FuseFMP.writeFilter(photo.photoShadow,"Blur",{blurX:2,blurY:2,quality:15});
//--Hide PhotoHolder
photo.photoHolder._alpha = 0;
//--Find Boundaries
var photoBounds:Object = {w:photoBoundsMC._width - frameWidth*2, h:photoBoundsMC._height - frameWidth*2};
//--Center Photo Box
photo._x = stageCenter.x - photo._width/2;
photo._y = stageCenter.y - photo._height/2;


//Initialize
//=-=-=-=-=-=-=-=-=-=-=-=-=-=-
function loadPhoto(imageURL:String):Void
{
    trace("Attempting to load Photo " + imageURL);
    var movieLoader:MovieClipLoader = new MovieClipLoader();
    var movieListener:Object = new Object();
    movieLoader.addListener(movieListener);
    
    movieListener.onLoadInit = function():Void
    {
        trace("Photo Loaded successfully!");
        doTransition();
        messageText.text = "Success!";
    }
    
    movieListener.onLoadError = function(theMC:MovieClip, errorCode:String, httpStatus:Number):Void
    {
        trace("Photo Failed to Load: " + errorCode);
        enableButton(true);
        messageText.text = "ERROR:" + errorCode;
        var f:Fuse = new Fuse();
        f.push({target:photo.photoHolder, alpha:100, seconds:transitionTime/3, ease:easeType});
        f.push({func:enableButton, args:[true]});
        f.start();
    }
    
    movieLoader.loadClip(imageURL, photo.photoHolder);
}

function doTransition():Void
{
    trace("Resizing and Showing");
    //Check bounds
    if(photo.photoHolder._width > photoBounds.w)
    {
        var newW:Number = photoBounds.w;
    }else{
        var newW:Number = photo.photoHolder._width;
    }
    
    if(photo.photoHolder._height > photoBounds.h)
    {
        var newH:Number = photoBounds.h;
    }else{
        var newH:Number = photo.photoHolder._height;
    }
    
    var photoProps:Object = {x:stageCenter.x - newW/2 - frameWidth,
                              y:stageCenter.y - newH/2 - frameWidth,
                              w:newW,
                              h:newH,
                              ow:newW + frameWidth*2,
                              oh:newH + frameWidth*2};
                              
    var f:Fuse = new Fuse();
    f.push([{target:photo, x:photoProps.x, y:photoProps.y, seconds:transitionTime/3, ease:easeType},
            {target:[photo.photoShadow,photo.photoBack], width:photoProps.ow, height:photoProps.oh, seconds:transitionTime/3, ease:easeType},
            {target:photo.photoMask, width:photoProps.w, height:photoProps.h, seconds:transitionTime/3, ease:easeType}]);
    f.push({target:photo.photoHolder, alpha:100, seconds:transitionTime/3, ease:easeType});
    f.push({func:enableButton, args:[true]});
    f.start();
}

function enableButton(doEnable:Boolean):Void
{
    if(doEnable)
    {
        imageButton.label = "Load Image";
    }else{
        imageButton.label = "Wait";
    }
    
    imageButton.enabled = doEnable;
}

imageButton.onRelease= function():Void
{
    messageText.text = "";
    
    if(transitionData.text < 0 || transitionData.text == "" || transitionData.text == NaN || transitionData.text == undefined)
    {
        transitionData.text = 1;
    }
    
    transitionTime = transitionData.text;
    
    if(imageText.text != "" && imageText.text != undefined)
    {
        var f:Fuse = new Fuse();
        f.push({func:enableButton, args:[false]});
        f.push({target:photo.photoHolder, alpha:0, seconds:transitionTime/3, ease:easeType});
        f.push({func:loadPhoto, args:[imageText.text]});
        f.start();
    }else{
        messageText.text = "There is no image URL to retrieve.";
    }
}

wow, i’ll give it a shot and let you know, either way i super appreciate it, thanks guys!