Easiest implementation of onReleaseOutside in AS3?

Question

I'm a long-time ActionScript 2 user, now getting started with ActionScript 3. The one thing I'm missing is an easy way to duplicate the functionality of AS2's MovieClip.onReleaseOutside. It is almost always necessary to implement this event, otherwise you get funny bugs like flash thinks your mouse is down when really it's up.

According to the AS2 to AS3 Migration Guide, I'm supposed to use flash.display.InteractiveObject.setCapture() for this, however it does not exist as far as I can tell. I guess this document is out of date or incorrect. I've found a few posts on the web about how to duplicate this functionality, but they either have their own problems:

• This one triggers onReleaseOutside even if there was no corresponding onPress event.
• This one seems very inefficient, you'll add and remove an event listener every time the mouse is clicked anywhere inside your app.

There has to be an easier way, don't tell me Adobe forgot about this when rewriting Actionscript?

Example AS2 code:

// Assume myMC is a simple square or something on the stage

myMC.onPress = function() {
  this._rotation = 45;
}

myMC.onRelease = myMC.onReleaseOutside = function() {
  this._rotation = 0;
}

Without the onReleaseOutside handler, if you pressed down on the squre, dragged your mouse outside of it, and released the mouse, then the square would not un-rotate, and appear to be stuck.

Answer 1

Have you looked at this event:

flash.events.Event.MOUSE_LEAVE

From the documentation:

Dispatched by the Stage object when the mouse pointer moves out of the stage area. The Event.MOUSE_LEAVE constant defines the value of the type property of a mouseLeave event object.

It will solve your problem if you are only interested whether the user's mouse if off the stage instead of just outside that particular MovieClip.

Answer 2

root.addEventListener(MouseEvent.UP, onMouseReleaseOutside);

You define onMouseReleaseOutside of course. Basically any MouseEvent.UP (a mouse release) that happens outside of your button (or mc) will hit the stage instead of your button. This is the way i usually catch it.

Answer 3

Simple and foolproof:

button.addEventListener( MouseEvent.MOUSE_DOWN, mouseDownHandler );
button.addEventListener( MouseEvent.MOUSE_UP, buttonMouseUpHandler ); // *

function mouseDownHandler( event : MouseEvent ) : void {
    trace( "onPress" );
    // this will catch the event anywhere
    event.target.stage.addEventListener( MouseEvent.MOUSE_UP, mouseUpHandler );
}

function buttonMouseUpHandler( event : MouseEvent ) : void {
    trace( "onRelease" );
    // don't bubble up, which would trigger the mouse up on the stage
    event.stopImmediatePropagation( );
}

function mouseUpHandler( event : MouseEvent ) : void {
    trace( "onReleaseOutside" );
    event.target.removeEventListener( MouseEvent.MOUSE_UP, mouseUpHandler );
}

If you don't care about the difference between onRelease and onReleaseOutside (for example with draggable items) you an skip the mouse up listener on the button itself (commented here with an asterisk).

Answer 4

This suck, since you can't tell what button was initially clicked from the event.target

Answer 5

works great...thanks a bunch