There has to be a better way to do what I’m trying to do (a way that works!)
– I need the image pan to allow the user to pan around the entire image when zoomed in, right now it only pans around part of the image and does not go all the way to image edges to show all detail
– I need the panning movements to be limited to the viewing area (relative to the current image dimensions and current zoom) so image doesnt pan off screen or move past the edges of the image
– I also need the resetPosition function to set the image position back to original xy coordinates, with x centered relative to the image’s width (not reset z)
… the more i work on it the worse it gets!! I was close a while ago but now I am losing ground!! Please help!!! Much appreciated!! + Dana .
what I have so far:
http://steiner.squarespace.com/current
(my .fla is attached)
ROOT TIMELINE:
var xOffset;
// zoom in btn
galleryControls.zoomInBtn.onPress = function() {
_root.onEnterFrame = function() {
if (currentImage._width < 2000) {
xZoomStep = -200;
} else {
xZoomStep = 0;
}
if (env.container.camZ >= -800 && env.container.camZ < -200) {
env.container.stepCam({x:xZoomStep,y:+0,z:+200},5);
} else if (env.container.camZ <= -800) {
env.container.camZ == -800;
} else if (env.container.camZ >= 0) {
env.container.camZ == 0;
}
}
trace ("z = " + env.container.camZ);
}
galleryControls.zoomInBtn.onRelease = function() {
xOffset = env.container.camX;
_root.onEnterFrame = null;
}
// zoom out btn
galleryControls.zoomOutBtn.onPress = function() {
_root.onEnterFrame = function() {
if (currentImage._width < 2000) {
xZoomStep = +80;
} else {
xZoomStep = 0;
}
if (env.container.camZ > -800 && env.container.camZ <= 50) {
env.container.stepCam({x:xZoomStep,y:0,z:-80},5);
} else if (env.container.camZ <= -800) {
env.container.camZ == -800;
} else if (env.container.camZ >= 0) {
env.container.camZ == 0;
}
}
trace ("z = " + env.container.camZ);
}
galleryControls.zoomOutBtn.onRelease = function() {
xOffset = env.container.camX;
_root.onEnterFrame = null;
}
ENV TIMELINE:
// start zoomed out
container.moveCam(0,0,-800);
// reset position
resetPosition = function() {
container.motionCam({x:0, y:0, z:z}, 6);
}
// calculate pan position
function calculatePosition() {
// set vars
var fullZoomIn = 0;
var fullZoomOut = -800;
if (container.camZ <= fullZoomIn && container.camZ > fullZoomOut) {
// enable pan
var zValue = -(container.camZ);
var xOffsetValue = -(_root.xOffset);
var xValue = (_root.currentImage._width / zValue) + xOffsetValue;
var yValue = _root.currentImage._height / zValue;
var px = _root._xmouse - xValue;
var py = _root._ymouse - yValue;
container.motionCam({x:px, y:py, z:z}, 3);
}
}
// add mouse event
_root.mask.onEnterFrame = function() {
if (this.hitTest(_root._xmouse, _root._ymouse, false)) {
//trace ("mask hit test true");
this.onMouseMove = calculatePosition;
} else if (!(this.hitTest(_root._xmouse, _root._ymouse, false))) {
//trace ("mask hit test false");
this.onMouseMove = resetPosition;
}
}
… fla is too big to attach
… also, i am using two 3rd party tools: 3DEnvironment from FlashLoaded.com and SlideshowPro/SlideshowPro Director from slideshowpro.net