Skip to main content
C
Charles_I
Inspiring
January 20, 2024
Answered

In Animate HTML5 canvas on named last frame of movie clip gotoAndStop on named main timeline frame

  • January 20, 2024
  • 1 reply
  • 2474 views

I have a movie clip on stage on top of a graphic. When the main timeline movie gets to this frame it stops and plays the nested movie clip. I want to code from the main timeline actionscript layer an event listener that detects when the last named frame of the nested clip is played and goto and stop on a named frame of the main timeline.

 

So, for example.

 

On frame 30 which is named "question_1" is a button click event listener that goes to the next frame "question1_answer1":

 

this.q1f1.addEventListener("click", fl_MouseClickHandler.bind(this));

function fl_MouseClickHandler()
{
      this.gotoAndStop("question1_answer1");

}

 

on "question1_answer1" there is a "this.stop();" and a movie clip on the stage named "qchicken" that runs an animation. On the last frame of "qchicken" I have named the frame "chicken_down" at which point I want to go back to "question_1" on the main timeline. So how do I write an event listener that does this:

 

this.qchicken.EVENT LISTENER THAT DETECTS WHEN "chicken_down" IS REACHED.parent.gotoAnd Stop("question_1");

 

And finally, how and where do I put the remove event listener code once the goto is executed (and similarly once a button is pressed on other events)? I've seen more than one variation of writing remove event listener in posts and examples of it being placed before and after the event code. Which is correct?

 

 

 

    This topic has been closed for replies.
    Correct answer Charles_I

    no, you should explicitly stop it.

     

     
    var _this = this;
    var chicken_downFF = chicken_downF.bind(this);
    createjs.Ticker.addEventListener("tick", chicken_downFF);
     
    function chicken_downF() {
     
    if (_this.qchicken.currentLabel == "chicken_down") {
    createjs.Ticker.removeEventListener("tick", chicken_downFF);
    }
    }

    Thanks. So, with the gotoAndStop line the complete working

    var _this = this;
var chicken_downFF = chicken_downF.bind(this);
createjs.Ticker.addEventListener("tick", chicken_downFF);

function chicken_downF() {

	if (_this.qchicken.currentLabel == "chicken_down") {
		createjs.Ticker.removeEventListener("tick", chicken_downFF);
		_this.gotoAndStop("question_1");
	}
}

    code looks like this:

     

    1 reply

    kglad
    Community Expert
    kgladCommunity Expert
    Community Expert
    January 20, 2024

    var _this=this;

    createjs.Ticker.addEventListener("tick",this.chicken_downF);

     

    function chicken_downF(){

    if(_this.qchicken.frameLabel=="chicken_down"){

    createjs.Ticker.removeEventListener("tick",this.chicken_downF);

    _this.gotoAndStop("question_1");

    }

    }

    C
    Charles_IAuthor
    Inspiring
    January 22, 2024

    Hmm, not working for me.  I put the function in the actionscript layer on the frame with the qchicken movie. And I tried putting an alert after the "if...frameLabel" line but nothing happens - the program doesn't reaches it.  Interestingly, if I put an alert in before the function it fires on the mousedown of the previous  frame before it reaches the frame where the qchicken movie is.

     

    Also, I don't understand the reason for creating this variable, "var _this=this;". It appears to me where "_this"  is being used is still the same place where "this" is required as a key word.

    kglad
    Community Expert
    kgladCommunity Expert
    Community Expert
    January 31, 2024

    I don't know where default/ignorable errors are. Are they in Animate, if so where, or in the browser? How do I get to this report?

     

    I stripped everything out of my test movie except the question 1 frame (with a simple stop and button to go to the next frame) and the question 1 answer 1 frame which contins the animation movie, which runs and is supposed to go back to question 1 when done, and I can't get your script to work. The only way I can get this to work is to put

    this.parent.gotoAndStop("question_1");

    on the last frame inside the movie. I was hoping to do this from the main timeline so all the scripts are there but it's not working for me.


    create a new canvas project. test the empty project.  check the dev console.

     

    all the error you see can be ignored.

    Terms & ConditionsAccessibility statement
    Using the community Terms of use Privacy Cookie preferences Do not sell or share my personal information ad choicesAdChoices