Help with some panning

programming flash
1

I have this website I’m working on and I’m trying get this panning aspect to work right. The problem is that I’m not getting the numbers right somewhere and can’t get the whole image that is panning to show up. Also when a browser window is resized I can’t get the pan to resize as well, if that makes any sense. I’ve found website one that does what I want to do somewhat:

http://www.vermeersch.ca/

Just click on explore and you’ll see how the panning works.

Here’s my Actionscript:

stop();

import com.McSliderB;

Stage.scaleMode="noScale";
Stage.align="TL";

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); //want the image to start centered
var mystartY:Number = ((myclip._height - myviewH)/2); //want the image to start centered

//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);

The “myview” dimensions are 1440x800 and my image is 3000x5000(huge I know), and the stage dimensions are 1800x1500. Not sure if the stage dimensions matter or not though but they seem to have some influence on whether the panning works right or not.

And here’s the class, McSliderB:

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);
        }
    }
}

I grabbed that from an old thread here on Kirupa.

If anyone can help I’d greatly appreciate it, I’m really confused on what’s going on.

2

Thanks for landlord’s sharingwe should work together to build this forum as a knowledge-based, professional forum.go to skf Bearing