scrollRect and browser resizing

1

I’m trying to make a full browser webpage that utilizes the scrollRect type of class to pan around a movieclip that contains other movieclips and so on. The problem I run into is that when the browser window is resized that panning doesn’t go with it. So panning to all the edges becomes impossible. I’ve tried a bunch of different stage resizing techniques but none of them give any good results. Here’s the actionscript I’m currently working with:

stop();

import com.McSliderB;

Stage.scaleMode="noScale";
Stage.align="TL";
var stageListener:Object = new Object();
stageListener.onResize = function() {

img._x = Stage.width - img._width;
img._y = Stage.height - img._height;

};
Stage.addListener(stageListener);

var myclip:MovieClip = _root.img;
var myeasing:Number = .9;
var myX:Number = 0;
var myY:Number = 0;
var myviewW:Number = 1440;
var myviewH:Number = 800;
var mystartX:Number = ((myclip._width - myviewW)/2); 
var mystartY:Number = ((myclip._height - myviewH)/2); 
//new McSlider(yourMovieClip, easing, clipX, clipY, aperature_width, aperature_height, initial_x_Offset, initial_y_Offset);
var nMC:McSliderB = new McSliderB(myclip, myeasing, myX, myY, myviewW, myviewH, mystartX, mystartY);

If anyone could help me out with this I would greatly appreciate it. Thanks!

2

not very clear could you explain once more… in a bit detail

3

I’ve used a class like the one here:

http://www.sephiroth.it/tutorials/flashPHP/scrollRect/

Except I’m trying to make it work in a full browser webpage. I found a webpage that does something similar here:

http://www.vermeersch.ca/

Just click explore and resize the browser window. That’s how I’d like my webpage to work but haven’t been able to recreate the resizing aspect. If you can help it would be greatly appreciated, thanks so much!

4

if you’re using the McSlider class that I built - its not readily set up to accommodate dynamic scrollRect size changes. You’d have to add that to the class… like a public function that gets triggered when the stage scales. But, I’m not sure how easy it will be to add - all of the positioning math is based on the initial scrollRect dimensions - so, if the scrollRect dimensions chage, it will involved resetting the aperature rectangle, and probably will require other variables to be changed as well when the scaling occurs. I’m just too tied up with other projects to tackle this - might want to post the class and see if someone else may want to help with it… if added to the class properly, bit would a very cool addition.

5

Yeah, this is the class taken from your old thread. I thought it might have to be something that would have to change in the class but I’m too inexperienced to know how to change it.

Here’s the class actionscript:

import mx.utils.Delegate;
import flash.geom.Rectangle;

class com.McSliderB  {
    private var __mc:MovieClip;
    private var __mcp:MovieClip;
    private var __ease:Number;
    private var __control:MovieClip;

    private var __yDiff:Number;
    private var __yScale:Number;
    private var __yPos:Number;
    private var __xDiff:Number;
    private var __xScale:Number;
    private var __xPos:Number;
    
    private var __imgW:Number;
    private var __imgH:Number;    
    private var __rect:Rectangle;
    
    
    //new McSlider(yourMovieClip, easing, clipX, clipY, aperature_width, aperature_height, initial_x_Offset, initial_y_Offset);
    public function McSliderB(_mc:MovieClip, _ease:Number, _clipX:Number, _clipY:Number, _apertureW:Number, _apertureH:Number, _xoff:Number, _yoff:Number) {
        // your clip to pan
        __mc = _mc;
        // amount of easing - .7 works well
        __ease = _ease;
        // store the clip's parent in a variable, it will be used for _xmouse, _ymouse
        __mcp = __mc._parent;
        // get the initial width and height of the images
        __imgW = __mc._width;
        __imgH = __mc._height;
        // position the clip to x, y
        __mc._x = _clipX;
        __mc._y = _clipY;
        
        // turn on cache
        __mc.cacheAsBitmap = true;

        // I decided to run the onEnterframe within another clip vs. __mc
        // just incase __mc contained an animation or some other onEnterFrame events
        __control = __mc.createEmptyMovieClip("controller", __mc.getNextHighestDepth());
        
        // create a new rectangle - position your clip to the offsets and aperature width / height
        
        __rect = new Rectangle(_xoff, _yoff, _apertureW, _apertureH);
        // set the clip's scrollRect
        __mc.scrollRect = __rect;
        
        // button events to control movement start / stop
        __mc.onRollOver = Delegate.create(this,initiateMovement);
        __mc.useHandCursor = false;
    } 

    private function killMovement():Void {
        delete __control.onEnterFrame;
    }

    private function initiateMovement():Void {
        delete __mc.onRollOver;
        __control.onEnterFrame = Delegate.create(this,calcXY);
    }
    
    private function calcXY():Void {
        // calculate the Y offset / positions
        __yDiff = __mcp._ymouse-__mc._y;
        __yScale = __yDiff/__rect.height;
        __yPos = __yScale*(__imgH-__rect.height);
        
        // calculate the X offset / positions
        __xDiff = __mcp._xmouse-__mc._x;
        __xScale = __xDiff/__rect.width;
        __xPos = __xScale*(__imgW-__rect.width);
        
        // set the rectangles offsets
        __rect.x = __xPos-(__xPos-__rect.x)*__ease;
        __rect.y = __yPos-(__yPos-__rect.y)*__ease;
        
        __mc.scrollRect = __rect;
        
        //detect hit area
        if(!__mc.hitTest(_root._xmouse, _root._ymouse, true)) {
            killMovement();
            __mc.onRollOver = Delegate.create(this,initiateMovement);
        }
    }
}

If anyone could help or point me into maybe some other alternative to tackling this problem I’d greatly appreciate it. Thank you so much!