So I'm just starting to make the move from swf output to HTML. I know AS3 as well as JavaScript, but I can't wrap my head around how to effectively use JavaScript in the context of a Flash document.
I'm making an interactive piece where users need to click on keys on a virtual keyboard (represented as a png of a keyboard with clickable buttons placed over each key). Each of these buttons is essentially the same, but they each need a unique identifier ('esc', 'ctrl', 'f1', etc.). Additionally, I would like to be able to assign event listeners to each of these buttons easily.
I started with AS3 and swf output, but for compatibility reasons, I had to switch to HTML5 output.
To better explain what I'm asking, here is a sample of my original code, and of my converted code.
Original AS3:
//Add event listeners to each button on the stage (I have a movieClip named buttons that contains all buttons)
function SetEventListeners(){
for(var i:int = 0; i < buttons.numChildren; i++){
var button = buttons.getChildAt(i);
button.buttonMode = true;
button.addEventListener(MouseEvent.CLICK, ClickButton);
}
}
//Called by each button being clicked. Performs appropriate action based on which button was clicked.
function ClickButton(e:MouseEvent){
var button = e.target;
switch(button.name){
case "esc":
//doSomething
break;
case "f1":
//doSomethingElse
break;
default:
//doSomeDefaultStuff
break;
}
}
New JavaScript:
this.esc.addEventListener("click", ClickEsc);
this.f1.addEventListener("click", ClickF1);
function ClickEsc(){
//doSomething
{
function ClickF1(){
//doSomethingElse
{
As you can see, my JS is going to be extremely bloated and unmaintainable if I take this approach (I'll have to set up a separate function to handle each simulated 'keypress'.
Here are my questions:
- How can I add event listeners to each button without explicitly doing so as in the JS example above?
- How can I determine which button was clicked if each button is assigned the same function to execute when clicked (i.e. how can I pass the button's name to the called function)?
- Is there some resource for learning JS with Flash? My googling has not yielded good results.
1
Reply
AdChoices