Hi everybody !

I'm trying to create a navigation system that relies on the user dragging on a wheel in order to rotate it into a specific position:

http://ilariniitamo.com/gear/gear2.html

The problem I have is that whenever a drag is initiated, the wheel jumps to a position where it points the zero-rotation point (indicated in the example by the red dashline) at the mouse direction. Whenever the drag is ended, the wheel stays at the position where the mouse has left it, which is correct. However, when another drag is initiated, the same thing reoccurs - the dashed red line jumps to point towards the direction of the mouse. In short, I need the wheel to drag/rotate directly from the position where it was previously left or where it is by default. It shouldn't matter from which position the user drags the wheel.

The code is located in the script of the wheel-movieClip, and is as follows:
Code:
onClipEvent (enterFrame){
	this.onPress = function(){
		// when the mouse presses on the wheel
		this.onMouseMove = function(){
			// get an angle to the mouse using atan2 (gets radians)
			var angle = Math.atan2(this._parent._ymouse-this._y,this._parent._xmouse-this._x);
			// apply rotation to wheel by converting angle into degrees
			this._rotation = angle*180/Math.PI;
		}
	}
	this.onMouseUp = function(){
		// if a mouse move event exists, delete it on mouse up
		if (this.onMouseMove) delete this.onMouseMove;
	}
}
I can see how lacking the code is, and I can see why it does what it does. I just can't figure out how to implement it so that the wheel rotation is independent from the position of mouse, while it is dragged.

Thanks in advance! Please ask if anything is unclear in the description of the problem.