external swfs with previous and next buttons

[killploki]

thanks to anyone in advance if they can help me out, i've been searching around for weeks now and have decided to sign up and actually describe my issue in a forum thread....

i recently finished building my website in AS2, i hacked it together the best i could to get it working how i needed it, the problem is now im trying to re-create the site using AS3. Basically there is a portfolio section on the site. I have 16 buttons that run along the bottom that correspond to an external swf that loads, i have that working. My problem is i also have a previous and next arrow button that i need to load the next or previous swf in order.

for example, the user clicks on button 5, and external swf#5 loads, i need the previous and next arrows to know what external swf is loaded so that if they are pressed the next swf loads properly, (in this case i would need external swf#6 to load next)

Im completely new to AS3 and it seems just different enough from AS2 to be causing headaches. You can see the site how it works right now as AS2 to see the navigation i am talking about : hatchedstudios.com
i am not allowed to post links as this is my first post...

Again, thankyou to anyone who can help.

[killploki]

maybe its not a newbie question...

[Mazoonist]

Use a variable to keep track of the currently loaded swf. This variable will be an integer. So you might call it currentSwfIndex.
var currentSwfIndex:int = 0;
When you click on one of your numbered buttons, this variable will be set to the number that corresponds with the button. So if button #8 were clicked, immediately set this variable's value to 8. So the inside of button 8's event handler would contain:
currentSwfIndex = 8;
When you click on either the previous or next buttons, the variable will be either incremented or decremented. Supposing that someone clicked on the next button, inside that event handler, you would say:
currentSwfIndex++;
Of course, there is the chance that when someone clicks next, they are already at the last swf. You need to decide how your program should handle the ends. The two basic ways are to either wrap around or just stop. Wrap around would mean that if someone were at the last swf and they click next, they should wrap around to the first swf again.
currentSwfIndex++;
if(currentSwfIndex > 16) {
currentSwfIndex = 1;
}
Here's how you might stop at the end:
currentSwfIndex++;
if(currentSwfIndex > 16) {
currentSwfIndex = 16;
}
Hope this begins to help a bit.
[Edit: Whenever a variable is an integer keeping track of an index number, I like to work the word "index" in there somehow. So I edited this and changed it.]

[killploki]

thanks for that info, i'll try to wrap my head around it when i get a chance. it seems pretty straight forward, but it will be easier to understand when i am looking at my code i have so far.......in theory

[killploki]

ok, i have had the chance to try out the code. my question is if the currentSwfIndex doesnt update until after the number button is pressed, how will the next buton know what swf is supposed to come next? and how can i load it?

[Mazoonist]

The idea is that the next button and all the numbered buttons are all referencing the same variable. Each time one of the buttons is clicked, this same variable is manipulated, just in different ways. The numbered buttons will set the variable to a specific number. The prev and next buttons will increment or decrement the variable (and handle the end cases appropriately).

To have such a variable that all the functions can reference, you must declare it outside of all the functions.

To load the swf's, you should have their file names in an array. Then just use the index number to load them. I'll give you an example:
var urlArray:Array = ["one.swf", "two.swf", "three.swf"];
var currentIndex:int = 0;
var loader:Loader = new Loader();
addChild(loader);

one_btn.addEventListener(MouseEvent.CLICK, one_onClick);
two_btn.addEventListener(MouseEvent.CLICK, two_onClick);
three_btn.addEventListener(MouseEvent.CLICK, three_onClick);

prev_btn.addEventListener(MouseEvent.CLICK, prev_onClick);
next_btn.addEventListener(MouseEvent.CLICK, next_onClick);

function one_onClick(event:MouseEvent):void {
currentIndex = 0;
loader.load(new URLRequest(urlArray[currentIndex]);
}
function two_onClick(event:MouseEvent):void {
currentIndex = 1;
loader.load(new URLRequest(urlArray[currentIndex]);
}
function three_onClick(event:MouseEvent):void {
currentIndex = 2;
loader.load(new URLRequest(urlArray[currentIndex]);
}

function next_onClick(event:MouseEvent):void {
currentIndex++;
if(currentIndex > urlArray.length - 1) {
currentIndex = 0;
}
loader.load(new URLRequest(urlArray[currentIndex]);
}
function prev_onClick(event:MouseEvent):void {
currentIndex--;
if(currentIndex < 0) {
currentIndex = urlArray.length - 1;
}
loader.load(new URLRequest(urlArray[currentIndex]);
}
For this to work for you, you must have:
Files named one.swf, two.swf, and three.swf located in the same folder that you are publishing your main swf to.

Buttons with instance names one_btn, two_btn, three_btn, and also prev_btn and next_btn.

By way of explanation, urlArray[currentIndex] will return a string, which will be the name of the file that you want to load, depending on the value of the currentIndex variable. If the variable's value is currently 0, you will get "one.swf". If the variable's value is 1, you will get "two.swf", and if the variable's value is 2, you will get "three.swf."

You can expand on this system by just adding more file names to the urlArray, and adding more buttons and event listeners. But the code for the prev and next buttons won't need to be touched.

(it's possible to have a system where you can just add file names to the url array, add button instance names to a buttonArray, and not have to touch any other code. To do this, you just need to understand how arrays and loops (and shared event listeners) work. See this tutorial on my website: http://theflashconnection.com/content/streamlining-your-as3-code

[killploki]

amazing! between this and the tutorials on your site, you have helped me greatly. your explanations are very clear and easy to understand leading me to some "AHA" moments this morning.

i make a living as a visual artist, so math and programming are not my most favourite things to do. But i appreciate someone who can write code like this so easily, it is an artform in its own way and you are a talented artist! I've bookmarked your site and look forward to seeing what future tutorials you have.;);)