Variables and Event Listeners

[darngooddesign]

I have 15 buttons that have listeners attached. Btn1, Btn2, Btn3, etc.

This is ideally what I'd like to have happen, but I can't figure the code out.

var a:var = 1;

Btn+a.addEventListener(MouseEvent.CLICK, onNext+a);
function onNext+a(evt:MouseEvent):void {
MC+a.visible = true;
a = a+1;
}

Cheers

[kortex]

I assume the idea is to have a listener function for each button. I think the way most people would handle that would be to have one listener function that determines the object that triggered it and act accordingly.

[darngooddesign]

Right now I have 15 physical buttons and 15 listeners, but I was hoping to streamline some of the code by replacing the number in the button name and on command with a variable that increased each time you clicked.

[inquizard]

i had a similiar problem a while back and someone pointed me in the right direction... assuming you have 15 listeners currently for 15 buttons...?

if so, name your buttons i.e

 printBtn.name = "btn1"; 

you can then use the ".slice" commmand to decide the action to perform in one function.

set up a var (string) called menuIndex, then make the first line of your onClick function

menuIndex=event.currentTarget.name.toString().slice(-1); 

doing this would then mean you could decide in the one function which script to execute by using an if statement, i.e, if menuIndex = 1 do this(...), if menuIndex = 2 do this(...) etc etc.

[neznein9]

//  create an array to hold all of the buttons at once
const BUTTONS:Array = new Array();

//  create a dictionary to hold a variable about each buttons
const MC_BY_BUTTON:Dictionary = new Dictionary();

//  loop from 1 to 3
for(var i:int = 1; i <= 3; i++){

    //  add Btn-i to the array at index [i] 
    BUTTONS[i] = this['Btn'+i];

    //  save MC-i into the dictionary at index [Btn-i]
    MC_BY_BUTTON[this['Btn'+i]] = this['MC'+i];
}


//  loop from [number of buttons] to 1
for(var j:int = BUTTONS.length-1; j; j--){

    //  when you click the button, run the code inside
    BUTTONS[j].addEventListener(MouseEvent.CLICK, function(e:MouseEvent):void{

        //  look up the MC using the clicked button
        var clickedButton:MovieClip = MC_BY_BUTTON[e.target];        
        clickedButton.visible = !clickedButton.visible;
    });        
} 

[darngooddesign]

Its not working for me.

I have a button named "next"

click on "next"
page1.visible = true;

click on "next"
page1.visible = false;
page2.visible = true;

click on "next"
page2.visible = false;
page3.visible = true;

click on "next"
page3.visible = false;
page1.visible = true;

I spent hours searching an no one gives practical examples of how to implement variables, its just theory.

[5TonsOfFlax]

Nez just gave you a complete practical example.

The thing you just posted is a completely different problem than the problem you originally posted.

var pages:Array = [page1, page2, page3];
var currentPage:int = -1;

next.addEventListener(MouseEvent.CLICK, showNextPage);
function showNextPage(evt:MouseEvent = null):void{
  for (var i:int = 0; i < pages.length; i++){
    pages[i].visible = false;
  }
  currentPage = (currentPage + 1) % pages.length;
  pages[currentPage].visible = true;
}

[darngooddesign]

Then I apologize, I must have explained it incorrectly.

I do appreciate all the help.

Cheers

[darngooddesign]

This has been working very well so far, thanks a bunch. The next issue I'm having is that when adding a back button I can't get it to function correctly after i get to the first item "PG1". If I press the back button nothing is visible, as opposed to the next button where it loops back to the first item.

var pages:Array = [PG1, PG2, PG3, PG4, PG5, PG6, PG7, PG8, PG9, PG10, PG11, PG12];
var currentPage:int = 0;
nextBtn.addEventListener(MouseEvent.CLICK, showNextPage);
function showNextPage(evt:MouseEvent = null):void{
for (var i:int = 0; i < pages.length; i++){
pages[i].visible = false;
}
currentPage = (currentPage + 1) % pages.length;
pages[currentPage].visible = true;
}
prevBtn.addEventListener(MouseEvent.CLICK, showPrevPage);
function showPrevPage(evt:MouseEvent = null):void{
for (var j:int = 0; j < pages.length; j++){
pages[j].visible = false;
}
currentPage = (currentPage - 1) % pages.length;
pages[currentPage].visible = true;
}




Also, how would I rework this if I just set an initial var of

var NumberOfPages:Number = 12;

instead of using an array.

[darngooddesign]

Well I fixed the arrow behavior adding the bold code, but it feels a little heavy handed. Anyone know if this is the most efficient method?

var pages:Array = [PG1, PG2, PG3, PG4, PG5, PG6, PG7, PG8, PG9, PG10, PG11, PG12];
prevBtn.visible = false; //Hides the back button on load

var currentPage:int = 0;
nextBtn.addEventListener(MouseEvent.CLICK, showNextPage);
function showNextPage(evt:MouseEvent = null):void{
prevBtn.visible = true; //always forces the button visible
for (var i:int = 0; i < pages.length; i++){
pages[i].visible = false;
}
if (currentPage == 10){//hides the back button on the last PG
nextBtn.visible = false;
}

currentPage = (currentPage + 1) % pages.length;
pages[currentPage].visible = true;
}

prevBtn.addEventListener(MouseEvent.CLICK, showPrevPage);
function showPrevPage(evt:MouseEvent = null):void{
nextBtn.visible = true; //always forces the button visible
for (var j:int = 0; j < pages.length; j++){
pages[j].visible = false;
}
if (currentPage == 1){ //hides the back button on the first PG
prevBtn.visible = false;
}
currentPage = (currentPage - 1) % pages.length;
pages[currentPage].visible = true;
}