Copy link to clipboard
Copied
I'm trying to create a very standard menu, the type where there are links on each page that links to each other. So far I've put each menu page on a separate frame (total around 35 frames), and each link as its own instance/class. Originally I planned to create an array containing all the links like this:
var menuLinks:Array =
[
//Main menu - frame 1
menuRightSide.newStoryLink,
menuRightSide.continueStoryLink,
menuRightSide.selectChapterLink,
menuRightSide.optionsLink,
menuRightSide.charactersLink,
menuRightSide.aboutLink,
//chapters menu - frame 2
menuRightSide.chapter1,
menuRightSide.chapter2,
menuRightSide.chapter3,
menuRightSide.chapter4,
menuRightSide.chapter5,
//characters - frame 3
menuRightSide.char1,
menuRightSide.char2,
menuRightSide.char3,
menuRightSide.char4,
menuRightSide.char5,
menuRightSide.char6,
//options - frame 4
menuRightSide.languageLink,
menuRightSide.costumeLink,
...
...
//function links - these exist on MULTIPLE frames/pages, eg options, characters, chapters all have backToMainLink
menuRightSide.backToMainLink,
menuRightSide.backToCharLink,
menuRightSide.backToOptionsLink,
menuRightSide.backToCostumeLink,
]; //create array of links for menus
currentPage = "main_menu";
for each (var links:MovieClip in menuLinks)
{
links.buttonMode = true; //set links to behave like button
links.mouseChildren = false; //mouse over does not affect this instance's children
links.addEventListener(MouseEvent.ROLL_OVER, onOver);
links.addEventListener(MouseEvent.ROLL_OUT, onOut);
links.addEventListener(MouseEvent.CLICK, onClick);
}
function onOver(e:MouseEvent):void //apply glow to every link
{
TweenMax.to(e.target, 1, {glowFilter:{color:0xFFFFFF, alpha:1, blurX:10, blurY:10}}); //glow effect
}
function onOut(e:MouseEvent):void //remove glow on link on mouse out
{
TweenMax.to(e.target, 1, {glowFilter:{color:0xFFFFFF, alpha:0, blurX:0, blurY:0, remove:true}}); //remove glow
}
function onClick(e:MouseEvent):void
{
currentPage = e.target.name;
if (e.target.name == "newStoryLink") { //if click newStoryLink
delegate.beginStory();
...
...
} else if (e.target.name == "optionsLink") { //if click optionsLink
TweenLite.to(menuRightSide, 0.2, {alpha:0, onComplete:menuRightSide.gotoAndStop, onCompleteParams:[45]}); //go to frame 45, options screen
TweenLite.to(menuRightSide, 0.2, {alpha:1, delay:0.2});
} else if (e.target.name == "charactersLink") { //if click charactersLink
TweenLite.to(menuRightSide, 0.2, {alpha:0, onComplete:menuRightSide.gotoAndStop, onCompleteParams:[10]}); //go to frame 10, char screen
TweenLite.to(menuRightSide, 0.2, {alpha:1, delay:0.2});
} else if (e.target.name == "aboutLink") { //if click aboutLink
TweenLite.to(menuRightSide, 0.2, {alpha:0, onComplete:menuRightSide.gotoAndStop, onCompleteParams:[180]}); //go to frame 180, about screen
TweenLite.to(menuRightSide, 0.2, {alpha:1, delay:0.2});
}
}
}
Basically adding listener for every link, then simply telling AS what to do when I click the link regardless of what page I'm currently on.
However the problem is I realized listeners can't be added for links that exist on other frames other than frame 1, because they're null I think until AS flips to that frame.
So does anyone have an idea on how I should code this? Another challenge is some links (the ones at the bottom of the array) exist on MULTIPLE frames, but perform the exact same thing regardless of which page it was clicked on.
Thanks.
Copy link to clipboard
Copied
You either need to assign the listeners in the frames where the objects are, or put the objects in the frame where the code is. One way of attacking this is to have all your butons along the entire timeline asnd control their visibility as needed.
Another way of approaching a design is to have everything in frame 1 instead of spreading things out along the timeline, using movieclips as your pages and controlling their visibility.
If kGlad stops by and gives this a look he can offer a way of assigning the listeners from frame 1 even if the buttons are in other frames... has to do with assigning a listener for the stage redrawing for the new frame and then assigning the listeners. You should find a posting he answered for this here somewhere in the last month.
Copy link to clipboard
Copied
I arranged them on separate frames because that way I know exactly what's on each page. If I simply list out all the links on one frame, then it gets extremely messy visually.
So if I want to add listeners on other frames, how would I do that? I know the pseudo-code:
on frame 1:
for (each link on frame 1) {
link.addEventListener()
}
on frame 2:
for (each link on frame 2) {
link.addEventListener()
}
... etc
function onClick(e:MouseEvent):void
{
currentPage = e.target.name;
if (e.target.name == "newStoryLink") {
delegate.beginStory();
} else if (e.target.name == "continueStoryLink") {
//do something else
}
Copy link to clipboard
Copied
If you want to use a loop, then you portions of the array you have for the different frames... a "for each" approach isn't going to work since that array is for all frames. You need to specify the starting and ending indices for the loop relative to each frame... as in...
for(var i:uint=framestartIndex; i<=frameendIndex; i++){
menuLinks.addEventListener...
Copy link to clipboard
Copied
Can you explain the loop you used? Does it simply loop through each frame of the class? I need to add a listener for the instances on each frame though.
Also if you have a link to kglad's post regarding this that'll be great, I'm new to the forum so I don't know what post he made.
Copy link to clipboard
Copied
It is a loop that uses an index as the basis for counting, not much different from the one you have already, but it isn't looking for all of the elements in the array, just certain portions of them. Since you would want to use only a portion of the array for each different frame, the index is set to target the portions of the array. For your frame 1 you would use a framestartIndex value of 0 and a frame end index of 5, so that only the frame 1 links get assigned.
You'll have to search for kGlad's posting, I don't keep track of them and cannot say if finding it will be easy.
Copy link to clipboard
Copied
Ah I see. But what if some links exist on multiple pages? For example the "backToMain" link exist on lots of frames, clicking that link leads to frame 1 (main menu). Then this wouldn't work right? Because then I'll need to duplicate the instance in the array and put it in more than one "section", AS doesn't allow that right?
Copy link to clipboard
Copied
i couldn't tell what you're trying to do but i can tell from one of ned's messages that you might be trying to reference an object that exists on a frame that's not the same as the frame that contains your code. and because of his message i suspect you're using a goto to navigate to the frame that contains that object and, after that goto executes, you want to reference the object on that frame.
if all that's true, use the render event:
function gotoF():void{
stage.invalidate();
this.addEventListener(Event.RENDER,renderF);
gotoAndStop(someotherframewithyourobject);
}
function renderF(e:Event):void{
// you can now reference yourobject that's in that goto target frame
}
Copy link to clipboard
Copied
Within an array you can repeat as many things as you like.
If you have some links in every section, then you can probably get away with having just one of them that extends the length of the timeline so that you only need to assign the link in frame 1.
Copy link to clipboard
Copied
Up.