ROLL_OVER behavior inconsistent

programming flash
1

I am working on a series of puzzle games.

Each piece is a movie clip. When the mouse rolls over a piece, its child object movie clip, called the “rotation mark”, appears on the piece. (This is to allow the user to rotate the piece by clicking on it). When the mouse leaves the piece the rotation mark disappears.

I accomplish this by way of ROLL_OVER and ROL_OUT event handlers on the piece movie clip. On ROLL_OVER I simply set the rotation mark movie clip’s *visible *property to true, and on ROLL_OUT I set it to true.

Here is what it looks like. (The mouse cursor doesn’t get captured when you take a screen shot in Windows.)

When the mouse is moved over the rotation mark, inconsistent behaviour results:

  1. When I try it with Control -> Test Movie in Flash it still seems to be considered “over” the piece.

  2. However when I run the SWF embedded in an HTML file, moving the mouse over the rotation mark results in the piece dispatching a ROLL_OUT event.
    (This causes the rotation mark to blink because when it’s gone the piece fires ROLL_OVER, causing it to reappear, which causes the piece to fire ROLL_OUT again, ad infinitum.)

  3. When I try it with Debug -> Debug Movie in Flash I get the same result as 2 above.

Why are these different? What is the expected behaviour.

One thing you may note is that all the MCs here (pieces as well as rotation mark) are loaded assets from external library SWFs. Before, when I had them all in a single SWF that was running I was getting the same results as 1 above in all cases. It was after I changed my design to have use a shell SWF and external libraries that this inconsistent behaviour began.

Any thoughts or ideas?

2

Does the puzzle piece at the link below work the way you want it to?
[COLOR=“Blue”][U]http://www.byrographics.com/AS3/puzzle/puzzle.html[/U][/COLOR]

3

[quote=snickelfritz;2340853]Does the puzzle piece at the link below work the way you want it to?
[COLOR=Blue][U]http://www.byrographics.com/AS3/puzzle/puzzle.html[/U][/COLOR][/quote]

What I need is for the puzzle piece to NOT dispatch a ROLL_OUT when the mouse goes over the rotation mark. In your linked example there is no way for me to determine if that is the case or not.

As for the attached puzzle.fla, I couldn’t publish it as seemed to be missing some files. A timeline script imports gs.TweenMax.

4

MOUSE_OUT function cannot run because it is overwritten by the MOUSE_OVER function by default.
ie: technically, the MOUSE_OUT behavior does not exist while the mouse is over the “puzzle” movieclip.
This is because both functions target the same instance “rotator”, and the default behavior is [COLOR=“Blue”]overwrite:true.[/COLOR]

The rotation mark movieclip is disabled for mouse events, so it does not listen or respond to the mouse at all.
[COLOR=“blue”]rotator.mouseEnabled = false;[/COLOR]

The problem you’re likely having is that the rotation mark is “blocking” the puzzle piece mouse events.
This is why the ROLL_OUT event is dispatched, as it should be, when you rollover the rotation mark, and off of the exposed area of the puzzle piece.

TweenMax is a super-fast tweening class that replaces the klunky Adobe Tween class.
Tweener is another good tweening class.

Here’s the script:

stop();
import gs.TweenMax;
import fl.motion.easing.*;

puzzle.addEventListener(MouseEvent.CLICK, action, false, 0, true);
puzzle.addEventListener(MouseEvent.MOUSE_OVER, action, false, 0, true);
puzzle.addEventListener(MouseEvent.MOUSE_OUT, action, false, 0, true);
puzzle.buttonMode = true;
rotator.mouseEnabled = false;

var button:String = "";
TweenMax.to(rotator, 0, {autoAlpha:0});

function action(event:MouseEvent):void {
	button = event.target.name;
	switch (event.type) {
		case MouseEvent.MOUSE_OVER :
			TweenMax.to(rotator, 1, {autoAlpha:1, rotation:360, dropShadowFilter:{color:0x000000, alpha:0.5, blurX:4, blurY:4, angle:45, distance:2}});
			break;
		case MouseEvent.MOUSE_OUT :
			TweenMax.to(rotator, 1, {autoAlpha:0, rotation:-360, dropShadowFilter:{color:0x000000, alpha:0, blurX:0, blurY:0, angle:45, distance:0}});
			break;
		case MouseEvent.CLICK :
			break;
	}
}