Exit
  • Global community
    • Language:
      • Deutsch
      • English
      • Español
      • Français
      • Português
  • 日本語コミュニティ
  • 한국 커뮤니티
0

Animate beginners javascript function issue

Explorer ,
Mar 31, 2017 Mar 31, 2017

Hi – I've just started with playing around with javascript in Animate (not sure it's even the right software for the animation I want to do yet!), but am having a beginners' issue with getting functions to run. I've adapted some of the code from this tutorial.

When I use this code in the first keyframe to change the text on a Dynamic Text box called 'yearText' it works fine:

var currentYear = 2017;

var year = 1971;

this.yearText.text = year;

this.playBtn.addEventListener("click", playClicked.bind(this));

function playClicked() {

    this.play();

    isPlaying = true;

    year = year + 1;

    this.yearText.text = year;

}

But then if I put a function inside the function in place of the last two lines like this, it no longer works:

this.playBtn.addEventListener("click", playClicked.bind(this));

function playClicked() {

    this.play();

    isPlaying = true;

    year = year + 1;

    this.yearText.text = year;

}

function yearIncrease() {

        year = year + 1;

        this.yearText.text = year;

    }

Have I completely misunderstood something about how functions work?

Any help very much appreciated! Then i can see if Animate is something I'll be able to use properly...

1.3K
Translate
Report
Community guidelines
Be kind and respectful, give credit to the original source of content, and search for duplicates before posting. Learn more
community guidelines

correct answers 1 Correct answer

LEGEND , Mar 31, 2017 Mar 31, 2017

I thnk you misquoted yourself, and didn't have yearIncrease() in the later function.

That aside, the bind(this) part makes the first function use the 'this' value from the main timeline, and in going to another level of function you've lost track of 'this'.

An easy solution is to have a variable pointing to the field. This works:

var currentYear = 2017;

var year = 1971;

var yearTextField = this.yearText;

yearTextField.text = year;

this.playBtn.addEventListener("click", playClicked.bind(this));

function

...
Translate
LEGEND ,
Mar 31, 2017 Mar 31, 2017

I thnk you misquoted yourself, and didn't have yearIncrease() in the later function.

That aside, the bind(this) part makes the first function use the 'this' value from the main timeline, and in going to another level of function you've lost track of 'this'.

An easy solution is to have a variable pointing to the field. This works:

var currentYear = 2017;

var year = 1971;

var yearTextField = this.yearText;

yearTextField.text = year;

this.playBtn.addEventListener("click", playClicked.bind(this));

function playClicked() {

  this.play();

  isPlaying = true;

  yearIncrease();

}

function yearIncrease() {

  year = year + 1;

  yearTextField.text = year;

}

Translate
Report
Community guidelines
Be kind and respectful, give credit to the original source of content, and search for duplicates before posting. Learn more
community guidelines
Explorer ,
Mar 31, 2017 Mar 31, 2017

So helpful – hadn't got my head round defining text boxes as variables!

thanks very much...

Translate
Report
Community guidelines
Be kind and respectful, give credit to the original source of content, and search for duplicates before posting. Learn more
community guidelines
Explorer ,
Mar 31, 2017 Mar 31, 2017
LATEST

and yes I did misquote myself, so even more well spotted...

Translate
Report
Community guidelines
Be kind and respectful, give credit to the original source of content, and search for duplicates before posting. Learn more
community guidelines