Run local function from global function

[teamtblt48427890]

Hey all,

Here is my problem:

I have made a function global by adding

document.myFunction = function()

I acces this from a button outside the canvas and

if I test this with window.alert it works fine.

But when I use it to run a local function within animate cc it give errors.

So my setup will be:

document.myFunction = function(){

     RotateObject();

}

function RotateObject(){

     this.movieClip_1.rotation+=45;

}

in my html page I have a button that has this:

<button onclick="myFunction()">Click me</button>

Can anyone help me with this?

thnx Robin

[avid_body16B8]

I am not sure but have you tried these?

var root = this;

function RotateObject(){

     root.movieClip_1.rotation+=45;

}

or just

function this.RotateObject(){

     this.movieClip_1.rotation+=45;

}

[ClayUUID · Accepted solution]

teamtblt48427890  wrote

But when I use it to run a local function within animate cc it give errors.

So my setup will be:

document.myFunction = function(){

     RotateObject();

}

function RotateObject(){

     this.movieClip_1.rotation+=45;

}

Of course it gives an error, because it's a local function. If you could call it like that, it would be global, not local.

So, the global object in JavaScript is window, not document. If you want to declare a global function in JavaScript, just code it in the .html, outside any other function as:

function myFunction() {

     //whatever

}

If you were defining this function inside Animate though, you would have to do window.myFunction = function etc...

Now, to call a local function from outside its context, you have to expose a reference to it. There are overkill ways to do this involving closures and constructors and bears oh my, but the simplest way is to alias it to a global variable, like this:

function RotateObject() {

     this.movieClip_1.rotation += 45;

}

window.RotateObject = RotateObject;

Then your global code would... NOT work. The problem is this, which in this context gets set to the global object instead of the expected value. It's a JavaScript thing. To make the above work correctly, you'd have to add another variable and reference that:

var _this = this;

function RotateObject() {

     _this.movieClip_1.rotation += 45;

}

window.RotateObject = RotateObject;

This works because JavaScript uses lexical scoping, meaning functions can access variables in the scope that they were originally defined, no matter what context (value of this) they're called in.

Or, as noted above, your global function could just do the work directly. The automatically declared global variable exportRoot points to the root timeline, so if your movieclip is on the root timeline you could do:

function myFunction() {

     exportRoot.movieClip_1.rotation += 45;

}