pixelbyter #rich nicholls

I wrote this example a couple of years ago while researching Actionscript 3, inverse kinematics and the mathematic principles behind motion. I’m currently porting it to a CSS3 example.

Get the Flash source files here.

The following Actionscript 3 snippet is the bread and butter of the code that makes the above example possible:

//calculates angle of centre
var dx:Number = mouseX - thisPhoto.x;
var dy:Number = mouseY - thisPhoto.y;
var angle:Number = Math.atan2(dy, dx);

//handles spinning
var newRotation:Number = (angle - thisPhoto.origAngle) * 180 / Math.PI;

//handles dragging
var newX:Number = mouseX - Math.cos(angle) * thisPhoto.distanceToCentre;
var newY:Number = mouseY - Math.sin(angle) * thisPhoto.distanceToCentre;

//sets new positioning
thisPhoto.x = newX;
thisPhoto.y = newY;
thisPhoto.rotation = newRotation;