Determine rotation direction (CW/CCW)

[davegrant]

Hi,

 

I'm using Tweenlite and the following script to click and drag a wheel from its fixed center, causing it to spin in the direction the mouse is travelling.

 

This works great however i now need to determine the direction in which the wheel is travelling i.e. clockwise/counter-clockwise.

 

I've attempted to do this by various means including checking the start rotation on mouse down and checking if the new rotation on mousemove is greater or less than the start point however if the user drags from say 0 (mousedown start point) to 50 (mousemove rotation point) and then back again without releasing the mouse, the wheel has to get past 0 before registering as counter-clockwise.

 

I figure then the best way to determine the direction is by calculating the angle with atan2 between two points and see if this decreases/increases but i'm having some trouble getting it to update (probably my sub-par code) and i'm not even sure if this is the right approach?

 

What i have so far is below and the fla if it helps is at: http://s46264.gridserver.com/dev/dave/rotate/rotateDirection4.fla.zip

 

Any ideas on how to determine the direction of spin here would be immensely appreciated. Math's not my strong point and i've been trying to figure this out for an age

 

Thanks

 

import com.greensock.*;
import com.greensock.easing.*;
import com.greensock.plugins.*;
import flash.events.*;

TweenPlugin.activate([shortRotationPlugin]);
var oldRotation,ax,ay,bx,by,thetaA,thetaB,delTheta,newTheta:Number;

var anchor1X:Number;
var anchor1Y:Number;
var anchor2X:Number;
var anchor2Y:Number;

function dragger(evt:MouseEvent)
{
   if (evt.type == MouseEvent.MOUSE_DOWN)
   {
       stage.addEventListener(MouseEvent.MOUSE_MOVE, dragger);
       stage.addEventListener(MouseEvent.MOUSE_UP, dragger);
       oldRotation = vinyl_mc.rotation;
       ax = stage.mouseX - vinyl_mc.x;
       ay = stage.mouseY - vinyl_mc.y;
       thetaA = Math.atan2(ay,ax) * 180 / Math.PI;
       if (thetaA < 0)
       {
           thetaA =  -  thetaA;
       }
       else
       {
           thetaA = 360 - thetaA;
       }

   }
   else if (evt.type == MouseEvent.MOUSE_MOVE)
   {

       bx = stage.mouseX - vinyl_mc.x;
       by = stage.mouseY - vinyl_mc.y;
       thetaB = Math.atan2(by,bx) * 180 / Math.PI;

       if (thetaB < 0)
       {
           thetaB =  -  thetaB;
       }
       else
       {
           thetaB = 360 - thetaB;
       }

       delTheta = thetaB - thetaA;
       newTheta = oldRotation - delTheta;

       TweenLite.to(vinyl_mc, 1, {shortRotation:{rotation:newTheta}, overwrite:true, ease:Cubic.easeOut});

	anchor1X = vinyl_mc.anchor1.x;
	anchor1Y = vinyl_mc.anchor1.y;
	anchor2X = vinyl_mc.anchor2.x;
	anchor2Y = vinyl_mc.anchor2.y;

	trace(getAngle(anchor1X, anchor1Y, anchor2X, anchor2Y));

   }
   else if (evt.type == MouseEvent.MOUSE_UP)
   {
       stage.removeEventListener(MouseEvent.MOUSE_MOVE, dragger);
       stage.removeEventListener(MouseEvent.MOUSE_UP, dragger);
   }
}

function getAngle (x1:Number, y1:Number, x2:Number, y2:Number):Number
{
trace(x1, y1, x2, y2);
   var dx:Number = x2 - x1;
   var dy:Number = y2 - y1;
   return Math.atan2(dy,dx);
}

vinyl_mc.addEventListener(MouseEvent.MOUSE_DOWN, dragger);

[Zync]

Tweens can have an onUpdate eventListener attached to them and I reckon this would do what you need it to do with a bit of really simple math. Sorry I don't have Flash in front of me atm but I can write some psuedo code for you.

 

1. //So Make your tween and add an onUpdate event listener to run to a function

2. //Create a global var called - var oldRotation:Number = 0;

3. //In the onUpdate function create a new variable called var newRotation:Number = yourMC.rotation

4. //Do a test to see if the new rotation is greater than the old - ie your moving clockwise

5. //Do an else to see if the new rotation is less than the old Rotation - ie your moving counter-clockwise

6. //Set the oldRotation var to equal the newRotation var so that when the onUpdate fires the next time round, it will test with the new old Rotation.

 

Hope that makes a bit of sense.

[davegrant]

That's perfect thanks!

 

I'm actually doing the inverse and setting the oldrotation with the onUpdate function and the newRotation with on mousemove. The delay between the two though is sufficient to track whether it's pulling forwards or backwards which is perfect and more than sufficient for my purpose.

 

Wasn't aware of this feature of tweenlite so can't thank you enough for the heads up

[Zync]

No worries mate