/* //3-D Panel Class by Shad Gross (www.roguescholarmedia.com) // v. 1.0 //TODO: find a better way to adjust z-index, stress testing, double check for more pesky /0 issues, add zooming functionality //General usage: //Create a new panel in this fashion: var plate1:Panel3D = new Panel3D(centerX, centerY, zPosition, rate); // centerX and centerY are the center points, would be the same for all elements coming from a center point // zPosition is where this particular object falls in the z Stack //rate is optional, defaults to 1 if not set. Objects of a specific set should have the same rate // // //this.addChild(plate1); //add the panel to whatever the parent will be // //this.plate1.setup(); //run the setup method, this will actually position it in the parent // //this.plate1.addChild(symbol1); //Now add your image. . .make sure it's big enough // // // //USAGE TO SET MOTION BASED ON MOUSE POSITION // //stage.addEventListener(MouseEvent.MOUSE_MOVE, move_clips); //setup a listener to find where the mouse it // //function move_clips(event:Event){ // plate1.setXCoord(mouseX); // plate1.setYCoord(mouseY); //} //set the function call from the eventListener to change the x and y Coords // */ package classes { import flash.display.*; import flash.events.*; public class Panel3D extends MovieClip{ private var focalLength:int = 250; //set the focal length to 250, this is a good general focal length for MOST situations //I set the properties to private, that way you have to use the functions to change them //This ensures that the scale will be changed any time the z value is changed and that scale //is applied to x and y changes private var xCoord:Number; private var yCoord:Number; private var zCoord:Number; private var xCenter:Number; private var yCenter:Number; private var scale:Number; private var clip:Object; private var rateX:Number; private var rateY:Number; private var baseRate:Number; //constructor function - this sets the properties for the code end public function Panel3D(xVal:Number, yVal:Number, zVal:Number, rVal:Number = 1 ){ xCoord = xVal; // x and y are inherited from MovieClip which inherits them from yCoord = yVal; // DisplayObject; this is the outer frames position in its parent xCenter = xVal; yCenter = yVal; zCoord = zVal; baseRate = rVal; scale = focalLength / ( focalLength + zCoord ); addEventListener(Event.ENTER_FRAME,getLocation); //this sets an event listener for change in } //This sets the visual aspects defined by the constructor public function setup(){ x = xCoord; y = yCoord; scaleX = scaleY = scale; } private function setupDistanceX(){ var distFromCenter:Number = xCoord - xCenter; xCoord = xCenter - distFromCenter/11; } private function setupDistanceY(){ var distFromCenter:Number = yCoord - yCenter; yCoord = yCenter - distFromCenter/7; } //This will change the xCoord and then run the adjustRateX fxn to adjust for depth public function setXCoord(baseX:Number){ xCoord = baseX; setupDistanceX(); adjustRateX(); //adjust destination to reflect perspective } //This will change the yCoord and then run the adjustRateY fxn to adjust for depth public function setYCoord(baseY:Number){ yCoord = baseY; setupDistanceY(); adjustRateY(); //adjust destination to reflect perspective } public function setZCoord(newZ:Number){ } //This is the master mover, it takes the current x and y properties, compares them to the xCoord or yCoord and runs the appropriate moveWithPersoective() private function getLocation(event:Event):void { if( xCoord < x ){ moveWithPerspective( "left" ); } if( xCoord > x ){ moveWithPerspective( "right" ); } if( yCoord > y ){ moveWithPerspective( "down" ); } if( yCoord < y ){ moveWithPerspective( "up" ); } } //This function controls the z coordinate, upon which most of the functioning of the 3D effect hinges //Useful for zooming in the panel or zooming it out (as the name denotes) public function zoomInOrOut( rate:Number, inOrOut:String ){ inOrOut = inOrOut.toLowerCase(); //make sure it is lowercase because I have a tendency to forget these things if(inOrOut == "in") zCoord = zCoord - rate; if(inOrOut == "out") zCoord = zCoord + rate; //Because a change has occurred in the z value we must re-evaluate the scale scale = focalLength / ( focalLength + zCoord ); } //This function takes a direction and changes the x position property public function moveWithPerspective( moveDirection:String ){ moveDirection = moveDirection.toLowerCase(); //Because scale affects the movement of objects in perspective we apply it to any movement if(moveDirection == "left") x = x - rateX; //Modified to account for the reduction in distance if(moveDirection == "right") x = x + rateX; if(moveDirection == "up") y = y - rateY; if(moveDirection == "down") y = y + rateY; } // This function takes the base X distance ( at z=0 ) and changes the xCoord property to adjust for depth private function adjustX(){ var isNegative:Boolean = false; var A1:Number = xCoord - xCenter; if( A1 < 0 ) isNegative = true; //Find out if the direction is left ( isNegative = true ) or right ( isNegative = false ) A1 = Math.abs(A1); //Now get rid of the sign var B2:Number = focalLength - zCoord; //by subtracting the zCoord you ensure this is positive distance var theta:Number = Math.atan( A1 / focalLength ); //get the value of the angle in order to figure out the new B //theta = theta * ( 180 / Math.PI ); //convert to degrees var A2:Number = ( Math.tan(theta) ) * B2; if(isNegative){ xCoord = xCenter - A2; }else{ xCoord = xCenter + A2; } } //This function takes the Y distance ( at z=0 ) and changes the yCoord property to adjust for depth private function adjustY(){ var isNegative:Boolean = false; var A1:Number = yCoord - yCenter; if( A1 < 0 ) isNegative = true; A1 = Math.abs(A1); var B2:Number = focalLength - zCoord; //by subtracting the zCoord you ensure this is positive distance var theta:Number = Math.atan( A1 / focalLength ); //get the value of the angle in order to figure out the new B //theta = theta * ( 180 / Math.PI ); //convert to degrees var A2:Number = ( Math.tan(theta) ) * B2; if(isNegative){ yCoord = yCenter - A2; }else{ yCoord = yCenter + A2; } } //This function takes the base rate ( at z=0 ) and changes the rateX propery and xCoord property to reflect depth private function adjustRateX(){ var baseDist:Number = Math.abs( xCoord - xCenter ); adjustX(); //This changes the xCoord to reflect depth var adjustDist:Number = Math.abs( xCoord - xCenter ); var baseTime:Number = Math.ceil( baseDist / baseRate); if(baseTime == 0) baseTime = 0.000000000000001; //Guess what happens if we left baseTime set to 0 . . .hmmmmmmmmm rateX = adjustDist / baseTime; } //This function takes the base rate ( at z=0 ) and changes the rateY and yCoord property to reflect depth private function adjustRateY(){ var baseDist:Number = Math.abs( yCoord - yCenter ); adjustY(); //This changes the yCoord to reflect depth var adjustDist:Number = Math.abs( yCoord - yCenter ); var baseTime:Number = Math.ceil( baseDist / baseRate); if(baseTime == 0) baseTime = 0.000000000000001; //Guess what happens if we left baseTime set to 0 . . .hmmmmmmmmm rateY = adjustDist / baseTime; } } }