Target a frame of movieclip on the timeline? (HTML5)

[AbuGabby]

I am working on a HTML5 presentation that has about 100 layers and 400 frames.  About 75% through the development my boss throws me a curve ball and I don't want to start from scratch.

Since I can't use scenes everything is laid out on a timeline.  In the 10th keyframe I have a movieclip named "header" with an instance name of "header".  That movie clip consists of 2 keyframes with a different logo on each frame.  One logo on frame 0 and one on frame 9.

When the user clicks option one at frame 1 of my main timeline, it jumps to a specified keyframe on the main timeline and I want the "header" clip to display the logo on keyframe 0.  When the user selects option 2 at frame 1 of my main timeline, I want the header clip to display the logo on keyframe 9.

Easy?

[AbuGabby · Accepted solution]

As is my habit, I post questions on here while I'm trying to figure it out on my own just in case I come up short.  In this case I seem to have mashed out the correct code somehow.

My original action was this:

this.movieClip_5.addEventListener("click", fl_ClickToGoToAndPlayFromFrame_15.bind(this));

function fl_ClickToGoToAndPlayFromFrame_15()
{
this.gotoAndPlay(25);
}

I simply added multiple variations of code that I don't understand and kept testing until I found that this works:

this.movieClip_5.addEventListener("click", fl_ClickToGoToAndPlayFromFrame_15.bind(this));

function fl_ClickToGoToAndPlayFromFrame_15()
{
this.gotoAndPlay(25);

this.header.gotoAndStop(9);
}

[resdesign]

Hi there,

For one, I would change the name of the functions so they are more meaningful because it makes it easier to manage.

For example:

this.submitBtn.addEventListener("click", submit.bind(this));

function submit() {

//  some code

}

How I do it.

var root = this;      // this makes it easier to manage the main timeline

Then you can pretty much access everything on your timeline from frame one and keep your code there.

Just a thought.

and don;t forget to comment you code so when you come back to it  in 6 months it will be easier.

[AbuGabby]

I'm not sure I follow about the var root = this;

Keep in mind I am not a programmer...I am an old Flash designer that is struggling to use Flash in its current state. 

[ClayUUID]

this in JavaScript is the current execution context. When accessed in an event handler, it references the global object (the browser "window" object). This behavior makes coding event handlers a pain in the neck.

Copying the value of this to a local variable allows event handlers to access the desired scope by using the local variable instead, since it will reference the desired object (a timeline).

The reason an event handler function can use a variable defined outside of itself is because JavaScript uses lexical scoping-- functions can access variables defined in the same function that defined them. It's not apparent in the Animate IDE, but the code for every frame is wrapped in a function when published. frame_0(), frame_1(), frame_2(), etc.