dynmic navigation help

ok so I have been working on this site few the last couple of weeks, slowly but surely learning bits and pieces of flash and actionscript 3.0

So here is what I have going on. When the page opens I have 12 circular buttons animate on to the stage, they form a circle around a video of the earth I have spinning in the center of the stage.

So when I click on a button I have all of them animate the rest of they way around the earth and line up evenly across the top of the stage, so I can open new content under the buttons.

I have all of this working right now but the problem I am running into is when I click on one of the buttons again after they have moved to the top of the stage it cues it to replay the animation of the buttons animating up to the top.

Does anybody know how I can get this to work for the first click on any button and then disable it so the buttons stay in place on all subsequent clicks?

I am using actionscript 3.0

and here is the code I have on my buttons:

planet5_btn_mc.addEventListener(MouseEvent.ROLL_OV ER, playMovie5, false, 0, true);
planet5_btn_mc.addEventListener(MouseEvent.ROLL_OU T, stopMovie5, false, 0, true);
planet5_btn_mc.addEventListener(MouseEvent.MOUSE_D OWN, onDown5, false, 0, true);
planet5_btn_mc.addEventListener(MouseEvent.MOUSE_U P, onUp5, false, 0, true);

function playMovie5(e:MouseEvent):void
{
planet5_btn_mc.play();
}

function stopMovie5(e:MouseEvent):void
{
planet5_btn_mc.stop();
}

function onDown5(e:MouseEvent):void
{
this.planet5_btn_mc.planet5_btn_clicked_mc.alpha =.4;
}

function onUp5(e:MouseEvent):void
{
this.planet5_btn_mc.planet5_btn_clicked_mc.alpha =0;
MovieClip(root).gotoAndPlay("btn_click_anim","Scen e 1");
}

You could define a variable:

var clicked:Boolean = false;

then wrap your gotoAndPlay call like this:

PHP Code:

---

function onUp5(e:MouseEvent):void
{
this.planet5_btn_mc.planet5_btn_clicked_mc.alpha =0;
if (!clicked) {
   clicked = true;
   MovieClip(root).gotoAndPlay("btn_click_anim","Scen e 1");
   } 
} 


---

hey that works on a single button, but what I am trying to accomplish is checking for a click across any button, and if when that occurs it only plays the nav animation once. I have twelve buttons each its own movie clip with the code I have above attached to each individual movie clip. Any Idea on how I can apply what you showed me here to handle all the buttons? Do I need to move all of my button code to an actions layer on the main timeline?

in that case, define clicked on your root timeline and refer to it in your movieclips' code as:

MovieClip(root).clicked

then any button that is clicked will set the variable and no further animation calls will take place.


and yes, generally you'd find it better to assign all of these listeners and functions from the main timeline, and you could employ a for loop to iterate through all of your buttons and add the listeners, and define your handler functions once, so you don't have to redundantly include virtually the same exact code 12 times.


Something like this:

PHP Code:

---


for (var i:Number = 1; i<=12; i++)
    {    
    this["button"+i]["planet"+i+"_btn_mc"].addEventListener(MouseEvent.ROLL_OVER, playMovie, false, 0, true);
    this["button"+i]["planet"+i+"_btn_mc"].addEventListener(MouseEvent.ROLL_OUT, stopMovie, false, 0, true);
    this["button"+i]["planet"+i+"_btn_mc"].addEventListener(MouseEvent.MOUSE_DOWN, onDown, false, 0, true);
    this["button"+i]["planet"+i+"_btn_mc"].addEventListener(MouseEvent.MOUSE_UP, onUp, false, 0, true);
    }

function playMovie(e:MouseEvent):void
{
e.target.play();
}

function stopMovie(e:MouseEvent):void
{
e.target.stop();
}

function onDown(e:MouseEvent):void
{
e.target.planet_btn_clicked_mc.alpha =.4;
}

function onUp(e:MouseEvent):void
{
e.target.planet_btn_clicked_mc.alpha =0;
MovieClip(root).gotoAndPlay("btn_click_anim","Scene 1"); 
} 


---

thank you so much for helping me through this but I am so confused right now. I have been working through this and I am not quite sure I understand what you mean.

so I added the code from your first post to each of my buttons. and they work for the first click on each.

But when I click a different button it re runs that animation.

Now you said to define clicked on my root timeline but I am not sure how to do that. Or how to refer to it from the code I have on each button.


^ ^
This would be one way to do it, with the way I have it setup already?
^ ^

It makes no difference to me on how I do it as long as I can get it figured out.

V V
This would be a more streamlined way to do it?
V V



I would also love to be able to figure out how to use that code with the for loop to control all the buttons from one simple group of code but I cant seem to get it figured out. It keeps bringing up some damn error code on an undefined variable. <--- which really pisses me off cause it doesnt tell me where that undefined variable is at.

So I will break down the whole file here and maybe you can help me make a little more sense out of it all.

So I have the main timeline. on there I have 16 layers 12 of which are movie clip symbols that contain another movie clip symbol which is the button.
so the movie clip symbol on the main timeline is called "nav_animationP1_mc" nested inside that is a movie clip called "planet1_btn_mc" this movie clip is the button, inside it it has another movie clip symbol "planet1_btn_clicked_mc" which I am using to darken the circle when it is clipped also inside planet1_btn_mc is an embedded video I am using as the rollover animation.

I have 12 movie clips on the main timeline setup this way, each is incremented, so the names are the same with the exception of the number changing depending on which of the 12 it is.

I dont know if this info helps but I hope you might be able to help me better figure out how to get the desired end point.

Thank you again for your help thus far I hope my being a noob isnt too burdensum

so the first way i described, is a way that you could make your current code work. you would just place var clicked:Boolean in your main timeline, then the code i first mentioned becomes:

PHP Code:

---

function onUp5(e:MouseEvent):void 
{ 
this.planet5_btn_mc.planet5_btn_clicked_mc.alpha =0; 
if (!MovieClip(root).clicked) { 
   MovieClip(root).clicked = true; 
   MovieClip(root).gotoAndPlay("btn_click_anim","Scene 1"); 
   } 
} 


---

as for the second, better way. first, you don't need to name the child clips of the nav_animationPX_mc clip uniquely. for ease of coding you should give them identical instance names. so your first clip would be named uniquely: nav_animationPX_mc, where 'X' is a number. then your sub-clips would just be planet_btn_mc and planet_btn_clicked_mc, so they are easy to deal with in the loop. then your loop code would be this and you'd place it on the main timeline:

PHP Code:

---

for (var i:Number = 1; i<=12; i++) 
    {     
    this["button"+i].planet_btn_mc.addEventListener(MouseEvent.ROLL_OVER, playMovie, false, 0, true); 
    this["button"+i].planet_btn_mc.addEventListener(MouseEvent.ROLL_OUT, stopMovie, false, 0, true); 
    this["button"+i].planet_btn_mc.addEventListener(MouseEvent.MOUSE_DOWN, onDown, false, 0, true); 
    this["button"+i].planet_btn_mc.addEventListener(MouseEvent.MOUSE_UP, onUp, false, 0, true); 
    } 

function playMovie(e:MouseEvent):void 
{ 
e.target.play(); 
} 

function stopMovie(e:MouseEvent):void 
{ 
e.target.stop(); 
} 

function onDown(e:MouseEvent):void 
{ 
e.target.planet_btn_clicked_mc.alpha =.4; 
} 

function onUp(e:MouseEvent):void 
{ 
e.target.planet_btn_clicked_mc.alpha =0; 
gotoAndPlay("btn_click_anim","Scene 1"); 
} 


---

try that and see if it works for you.

dude you are awesome!!!!!!!!!!!!!!!! thank you so much. I know eventually I will be coming across other problems on this project, so I will be back to pick your brain again!

thanks again

word. glad to be a little help.

ok so Im back.

I have it set up the long way with the code attached to each button.

So now on each button When it is clicked I am trying to load new pages ( new swf's loaded into the page ) but now I cant seem to figure out how to remove those loaded pages when I click on a new button to load that page's information.

here is the code I have on each button right now


planet1_btn_mc.addEventListener(MouseEvent.ROLL_OV ER, playMovie1, false, 0, true);
planet1_btn_mc.addEventListener(MouseEvent.ROLL_OU T, stopMovie1, false, 0, true);
planet1_btn_mc.addEventListener(MouseEvent.MOUSE_D OWN, onDown1, false, 0, true);
planet1_btn_mc.addEventListener(MouseEvent.MOUSE_U P, onUp1, false, 0, true);

var clicked:Boolean = false;
var myLoader:Loader=new Loader();

function playMovie1(e:MouseEvent):void
{
planet1_btn_mc.play();
}

function stopMovie1(e:MouseEvent):void
{
planet1_btn_mc.stop();
}

function onDown1(e:MouseEvent):void
{
this.planet1_btn_mc.planet1_btn_clicked_mc.alpha =.4;
}

function onUp1(e:MouseEvent):void
{
this.planet1_btn_mc.planet1_btn_clicked_mc.alpha =0;
var myURL:URLRequest=new URLRequest("page_test.swf");
myLoader.load(myURL);
MovieClip(root).addChild(myLoader);
if (!MovieClip(root).clicked) {
MovieClip(root).clicked = true;
MovieClip(root).gotoAndPlay("btn_click_anim","Scen e 1");
}
};

You could create an MC to hold your SWF's that you're loading in, and remove the previously added SWF like this:

PHP Code:

---

planet1_btn_mc.addEventListener(MouseEvent.ROLL_OVER, playMovie1, false, 0, true);
planet1_btn_mc.addEventListener(MouseEvent.ROLL_OUT, stopMovie1, false, 0, true);
planet1_btn_mc.addEventListener(MouseEvent.MOUSE_DOWN, onDown1, false, 0, true);
planet1_btn_mc.addEventListener(MouseEvent.MOUSE_UP, onUp1, false, 0, true);

var clicked:Boolean = false;
var myLoader:Loader=new Loader();
var swfHolder_mc:MovieClip = new MovieClip();
MovieClip(root).addChild(swfHolder_mc);

function playMovie1(e:MouseEvent):void
{
planet1_btn_mc.play();
}

function stopMovie1(e:MouseEvent):void
{
planet1_btn_mc.stop();
}

function onDown1(e:MouseEvent):void
{
this.planet1_btn_mc.planet1_btn_clicked_mc.alpha =.4;
}

function onUp1(e:MouseEvent):void
{
this.planet1_btn_mc.planet1_btn_clicked_mc.alpha =0;
var myURL:URLRequest=new URLRequest("page_test.swf");
myLoader.load(myURL);
swfHolder_mc.addChild(myLoader);
if (swfHolder_mc.numChildren > 1) swfHolder_mc.removeChildAt(0);
if (!MovieClip(root).clicked) {
MovieClip(root).clicked = true;
MovieClip(root).gotoAndPlay("btn_click_anim","Scene 1");
} 
}; 


---

specifically, look at these lines:

PHP Code:

---

var swfHolder_mc:MovieClip = new MovieClip(); 
MovieClip(root).addChild(swfHolder_mc); 


---

and

PHP Code:

---

swfHolder_mc.addChild(myLoader); 
if (swfHolder_mc.numChildren > 1) swfHolder_mc.removeChildAt(0); 


---

Oh, and wrap your code in PHP tags (hit the little PHP icon in the editor) when you post code, so it's easier to read...

ok im back again. I think I am missing something here with this code. I have it loaded on each button just like you have laid out here. Instead of removing the previously loaded movie clip its just loads the next movie clip. The wierd thing that this code is making it do now is load each successive .swf on top of each other so the .swf that is loaded by button 12 is on top of all the other buttons,

so like 12 on top of 11
11 on top of 10
10 on top of 9
9 on top of 8
and so on

and here is the updated code using what you supplied to me in your last post

PHP Code:

---

planet1_btn_mc.addEventListener(MouseEvent.ROLL_OVER, playMovie1, false, 0, true);
planet1_btn_mc.addEventListener(MouseEvent.ROLL_OUT, stopMovie1, false, 0, true);
planet1_btn_mc.addEventListener(MouseEvent.MOUSE_DOWN, onDown1, false, 0, true);
planet1_btn_mc.addEventListener(MouseEvent.MOUSE_UP, onUp1, false, 0, true);

var clicked:Boolean = false;
var myLoader:Loader=new Loader();
var swfHolder_mc:MovieClip = new MovieClip();
MovieClip(root).addChild(swfHolder_mc);

function playMovie1(e:MouseEvent):void
{
    planet1_btn_mc.play();
}

function stopMovie1(e:MouseEvent):void
{
    planet1_btn_mc.stop();
}

function onDown1(e:MouseEvent):void
{
    this.planet1_btn_mc.planet1_btn_clicked_mc.alpha =.4;
}

function onUp1(e:MouseEvent):void
{
    this.planet1_btn_mc.planet1_btn_clicked_mc.alpha =0;
    var myURL:URLRequest=new URLRequest("page_test.swf");
    myLoader.load(myURL);
    swfHolder_mc.addChild(myLoader);
    if (swfHolder_mc.numChildren > 1) swfHolder_mc.removeChildAt(0);
    if (!MovieClip(root).clicked) {
    MovieClip(root).clicked = true;
    MovieClip(root).gotoAndPlay("btn_click_anim","Scene 1");
}
}; 


---

I was wandering how you put the code into those boxes. Hope you can help.

Chris