Rotating handles

[Fork]

Hey, all! I wanted to first say thanks for the great software; GreenSock's software is incredibly portable on mobile devices and just what I was looking for!

 

So, on to the code. I have made a rotating box thing. The green, red, and blue parts of the box are there to make visualization and debugging easier, since I will make them invisible later. Click and drag the green box to move the whole thing. Click and drag the blue circle to stretch that end of the box. It rotates and updates its width to follow where you want to place it. The red one, I haven't programmed anything for yet, so it doesn't do anything.

 

The problem I am having so far with it is that the blue dot does not always stay at the cursor, like if I drag it from the right side down so the shape is rotated 90 degrees, the cursor is to the left of it, and then if I continue dragging so it is at 180 degrees, the cursor is 32 pixels left of where it should be. Releasing and clicking again will cause it to stay at the cursor and gradually get farther away from it as it gets to another 90 and eventually 180 degree angle. It does this in all directions.

 

Can someone please take a look at my code and give me some input on how I can get it to stop doing this? Thanks, everyone!

 

See the Pen EKRXEE by Fork (@Fork) on CodePen