mouseovers + one-time-only behavior WITHOUT mouse action = me confused. ;)

[jgriffee]

I'm stuck on something and in need of advice. Flash / AS3 newbie here, and please talk to me like a designer, not a developer, 'cause I get lost easy. ;)

My file has four hexagons that normally get bigger or smaller in response to MOUSE_OVER and MOUSE_OUT behavior. Trouble is, when the file opens, I need one of them to expand independent of any user interaction, just the once, and reduce size whenever anything _else_ is moused over, just the once. Then the whole thing can go back to normal.

I'm trying to look through code examples, but I'm getting lost in people talking about packages and custom events and so forth that I don't understand (remember: designer here!). Can someone at least help me break down the concept?


This is what I have, which probably isn't the most succinct thing on earth but works for the mouseovers and for stacking the items properly, since they overlap a bit (the playHexIn and Outs just go to tweens iin the timelines of each hexagon, making them bigger or smaller):


var maxIndex:Number = this.numChildren - 1;

hex1.addEventListener(MouseEvent.MOUSE_OVER,sendTo Top);
hex2.addEventListener(MouseEvent.MOUSE_OVER,sendTo Top);
hex3.addEventListener(MouseEvent.MOUSE_OVER,sendTo Top);
hex4.addEventListener(MouseEvent.MOUSE_OVER,sendTo Top);

function sendToTop(e:Event):void
{
this.setChildIndex(e.currentTarget as MovieClip, maxIndex);
}

hex1.buttonMode = true;
hex2.buttonMode = true;
hex3.buttonMode = true;
hex4.buttonMode = true;



hex1.addEventListener(MouseEvent.MOUSE_OVER,hex1.p layHexIn);
hex1.addEventListener(MouseEvent.MOUSE_OUT,hex1.pl ayHexOut);
hex1.addEventListener(MouseEvent.CLICK, hex1.gotoSite);

hex2.addEventListener(MouseEvent.MOUSE_OVER,hex2.p layHexIn);
hex2.addEventListener(MouseEvent.MOUSE_OUT,hex2.pl ayHexOut);
hex2.addEventListener(MouseEvent.CLICK,hex2.gotoSi te);

hex3.addEventListener(MouseEvent.MOUSE_OVER,hex3.p layHexIn);
hex3.addEventListener(MouseEvent.MOUSE_OUT,hex3.pl ayHexOut);
hex3.addEventListener(MouseEvent.CLICK,hex3.gotoSi te);

hex4.addEventListener(MouseEvent.MOUSE_OVER,hex4.p layHexIn);
hex4.addEventListener(MouseEvent.MOUSE_OUT,hex4.pl ayHexOut);
hex4.addEventListener(MouseEvent.CLICK,hex4.gotoSi te);

[akiersky]

one nice trick to use a function linked to an event listener; when declaring your function you can add '=null' inside the function paramaters. this will allow you to call the function without an event:


function onRollOver (e:Event = null):void {
//do stuff
}

might not work in your situation, but I was saved when i found that out. another way is to have the button you want dispatch the roll over event:


btn1.dispatchEvent(new MouseEvent(MouseEvent.ROLL_OVER));


that will make the button think it was rolled over.

good luck!
ak

[jgriffee]

Thanks for the tip! I'll give that a shot.


eta: the error I got on the first one is as follows:

Warning: 1090: Migration issue: The onRollOver event handler is not triggered automatically by Flash Player at run time in ActionScript 3.0. You must first register this handler for the event using addEventListener ( 'mouseOver', callback_handler).


The second one didn't have any noticeable effect (I changed the button name and added the function I wanted), but I'll keep at it and see if I can get it to cooperate. In the meantime, any further advice would be appreciated.

[Shaedo]

This is how I would reccomend your code works.

1st off have a function that activates when you mouse over a button. Have all the buttons listen to this event.
This function does two things:
1) run a seperate function that sets ALL of the hexagons to a small size (no exceptions)
2) Sets the event.target hexagon to a large size

eg
function mouseOver(e:MouseEvent):void
{
mouseOut(null); // sets all sizes to small as precuationary
e.target.playHexIn(); // sets 'target' (thing calling the event eg one of your buttons) size to large
}.
Then add a second function that makes things smaller/handles the mouse out event is done like this:

function mouseOut(e:MouseEvent):void
{
hex1.playHexOut();
hex2.playHexOut();
hex3.playHexOut();
hex4.playHexOut();
}

So your total code will look like this:


var maxIndex:Number = this.numChildren - 1; // as per before
//add buttonMode
hex1.buttonMode = true;
hex2.buttonMode = true;
hex3.buttonMode = true;
hex4.buttonMode = true;
//set the first one to big
hex1.playHexIn();
//add all the event listeners
hex1.addEventListener(MouseEvent.MOUSE_OVER, mouseOver); // note only a single MOUSE_OVER event is now used.
hex1.addEventListener(MouseEvent.MOUSE_OUT, mouseOut);
hex1.addEventListener(MouseEvent.CLICK, mouseClick);
hex2.addEventListener(MouseEvent.MOUSE_OVER, mouseOver);
hex2.addEventListener(MouseEvent.MOUSE_OUT, mouseOut);
hex2.addEventListener(MouseEvent.CLICK, mouseClick);
hex3.addEventListener(MouseEvent.MOUSE_OVER, mouseOver);
hex3.addEventListener(MouseEvent.MOUSE_OUT, mouseOut);
hex3.addEventListener(MouseEvent.CLICK, mouseClick);
hex4.addEventListener(MouseEvent.MOUSE_OVER, mouseOver);
hex4.addEventListener(MouseEvent.MOUSE_OUT, mouseOut);
hex4.addEventListener(MouseEvent.CLICK, mouseClick);
// the functions....
function mouseOut(e:MouseEvent):void
{
hex1.playHexOut();
hex2.playHexOut();
hex3.playHexOut();
hex4.playHexOut();
}
function mouseOver(e:MouseEvent):void
{
mouseOut(null); // sets all sizes to small as precuationary, the 'null' substituets for an actual event try removing it and see what happens
e.target.playHexIn();
this.setChildIndex(e.currentTarget as MovieClip, maxIndex);// this is your code only moved combined into the one mouse over function.
}
function mouseClick(e:MouseEvent):void
{
e.target.gotoSite();
}

make sense?
good luck!!

S

[jgriffee]

This is how I would reccomend your code works....

I'm getting a couple errors when trying to incorporate this. First off, I have another beginner question:

The code I had in there originally would trip playHexIn and playHexOut just fine on the mouseovers. Stripped of all other instructions, though, if I plunk "hex1.playHexIn;" on the main timeline, it doesn't do anything.

This is what the movie clip itself is doing for those functions. All it's doing is playing through a few frames and stopping again. I'm assuming something here needs to change, but I'm not sure what the right event handler is now:

stop();

function playHexIn(e:Event):void
{
gotoAndPlay(2);
}
function playHexOut(e:Event):void
{
gotoAndPlay(11);
}


thanks again,
- j

[Shaedo]

<EDIT>:
Ah Huge apology! I missed out a pair of brackets! I have added them in the code above (so you can copy and paste) and explained below. I did not notice! </EDIT>

In general, to call a function you have write it with the brackets as in:

hex1.playHexIn();
or

hex1.gotoAndPlay(2);

when you call it in an event listener you don't include the brackets as for example in your:

hex1.addEventListener(MouseEvent.MOUSE_OVER, mouseOver);where the 'mouseOver' function does not have the '()'.

A bit of a tangent here: You MIGHT have to do something like this instead?

hex1.gotoAndPlay(10); so it jumps to the end of the sequence?


Also you could also simplify by changing the code like this just change the code in the functions to this:

// the functions....
function mouseOut(e:MouseEvent):void
{
hex1.gotoAndPlay(11);
hex2.gotoAndPlay(11);
hex3.gotoAndPlay(11);
hex4.gotoAndPlay(11);
}
function mouseOver(e:MouseEvent):void
{
mouseOut(null); // sets all sizes to small as precuationary, the 'null' substituets for an actual event try removing it and see what happens
e.target.gotoAndPlay(2);
this.setChildIndex(e.currentTarget as MovieClip, maxIndex);// this is your code only moved combined into the one mouse over function.
}
function mouseClick(e:MouseEvent):void
{
e.target.gotoSite();
}

[jgriffee]

gotcha. I'll try this today and see how it goes. Thanks!


eta:

okay -- as is, running with your first corrected batch of code, what pops up is this:

ArgumentError: Error #1063: Argument count mismatch on for_experiments_fla::hex1_1/playHexIn(). Expected 1, got 0.
at for_experiments_fla::MainTimeline/frame1()

I tried changing this bit:

//set the first one to big
hex1.playHexIn();

so it was

//set the first one to big
hex1.playHexIn(null);

and that made the first one play in okay by itself. The others still throw this, though:

ArgumentError: Error #1063: Argument count mismatch on for_experiments_fla::hex1_1/playHexOut(). Expected 1, got 0.
at for_experiments_fla::MainTimeline/mouseOut()
at for_experiments_fla::MainTimeline/mouseOver()

and I start getting "not a function" errors if I mess with the rest. Any ideas? :)