as3 MOUSE_UP stopDrag() not functioning - actionscript-3

Question

I am working on a basic as3 slingshot game which uses startDrag() and stopDrag() to let the user pull an object and fire. when the object is not stretching the "elastic" the MOUSE_UP function works as it should, but when it is below the set points and is stretching the string the MOUSE_UP function is not being called.
vars
var gravity = 0.1;
var angle1:Number = 0;
var angle2:Number = 0;
var radius:Number = 1;
var elasticCoefficient:Number = 0.002;
var released:Boolean = true;
var forced:Boolean = false;
var acc:Object = {x:0 , y:0};
var vel:Object = {x:0 , y:0};
var elastic:MovieClip = new MovieClip();
the ENTER_FRAME code is
function doConstantly(e:Event):void
{
acc.x = 0;
acc.y = gravity;
if(released == true)
{
vel.x += acc.x;
vel.y += acc.y;
ball.x += vel.x;
ball.y += vel.y
}
if(ball.y > stage.stageHeight + 500 || ball.y < -50)
{
resetLevel();
}
elastic.graphics.clear();
elastic.graphics.lineStyle(2, 0xFFF2BD);
if(ball.y > point1.y && ball.x < point2.x)
{
forced = true;
var x1:Number = ball.x - point1.x;
var y1:Number = ball.y - point1.y;
var x2:Number = point2.x - ball.x;
var y2:Number = point2.y - ball.y;
var distance1:Number = Math.sqrt(x1 * x1 + y1 * y1);
var distance2:Number = Math.sqrt(x2 * x2 + y2 * y2);
angle1 = Math.atan2(y1,x1);
angle2 = Math.atan2(y2,x2);
var xOffset:Number = Math.cos(angle1 + Math.PI / 2) * radius;
var yOffset:Number = Math.sin(angle1 + Math.PI / 2) * radius;
var xOffset2:Number = Math.cos(angle2 + Math.PI / 2) * radius;
var yOffset2:Number = Math.sin(angle2 + Math.PI / 2) * radius;
angle1 += Math.sin(radius / distance1);
angle2 += Math.sin(radius / distance2) * -1;
elastic.graphics.moveTo(point1.x, point1.y);
elastic.graphics.lineTo(ball.x+xOffset, ball.y+yOffset);
elastic.graphics.moveTo(point2.x, point2.y);
elastic.graphics.lineTo(ball.x+xOffset2, ball.y+yOffset2);
}
else
{
forced = false;
if(forced == true){trace("forced is true")}
if(forced == false){trace("forced is false")}
elastic.graphics.moveTo(point1.x, point1.y);
elastic.graphics.lineTo(point2.x, point2.y);
}
if (released == true && forced == true)
{
acc.x += distance1 * Math.sin(angle2) * elasticCoefficient;
acc.y += - distance1 * Math.cos(angle1) * elasticCoefficient;
acc.x += distance2 * Math.sin(angle1) * elasticCoefficient;
acc.y += - distance2 * Math.cos(angle2) * elasticCoefficient;
vel.x += acc.x;
vel.y += acc.y;
}
}
and the mouse events
function ballMouseDown(event:MouseEvent)
{
//call function to reset level
resetLevel();
//follow mouse
ball.x = mouseX;
ball.y = mouseY;
ball.startDrag();
//set released to false so that gravity wont affect the ball when clicked
released = false;
}
function ballMouseUp(event:MouseEvent)
{
trace("mouse up function called")
released = true; //gravity will affect the ball when released
ball.stopDrag();
}
Thanks.

Answer 1

Try adding the MOUSE_UP handler to the stage instead - at the moment, you will need to release your mouse while it is over the ball which may not be the case.
Update your MOUSE_DOWN handler to attach the listener to the stage:
function ballMouseDown(e:MouseEvent):void
{
// ...your current code.
stage.addEventListener(MouseEvent.MOUSE_UP, ballMouseUp);
}
And removing the listener when the handler is triggered:
function ballMouseUp(e:MouseEvent):void
{
// ...your current code.
stage.removeEventListener(MouseEvent.MOUSE_UP, ballMouseUp);
}