Issue with camera attach to node script

Help & Support
1

Hi all,

I am having some issues with converting a script from a legacy script to work with the new system.

The original code is:

pc.script.create('animateCamera', function (app) {
    // Creates a new AnimateCamera instance
    var AnimateCamera = function (entity) {
        this.entity = entity;
    };

    AnimateCamera.prototype = {
        // Called once after all resources are loaded and before the first update
        initialize: function () {
            
            var node = app.root.findByName("BlenderCamera");
            var camera = app.root.findByName("CameraSceneOne");
            camera.reparent(node);
        },

        // Called every frame, dt is time in seconds since last update
        update: function (dt) {
        }
    };

    return AnimateCamera;
});

And my conversion so far looks like:

var AnimateCamera = pc.createScript('animateCamera'); 

    // Creates a new AnimateCamera instance
    var AnimateCamera = function (entity) {
        this.entity = entity;
    };

    AnimateCamera.prototype = {
        // Called once after all resources are loaded and before the first update
        initialize: function () {
            
            var node = app.root.findByName("C4DCamera");
            var camera = app.root.findByName("Camera");
            camera.reparent(node);
        },

        // Called every frame, dt is time in seconds since last update
        update: function (dt) {
        }
    };

But I’m getting errors.

I’m stuck at this and would really appreciate where I’ve gone wrong - still learning so annoying to come across simple issues like this but I’ll get there.

Thank you.

2

On my phone here so bear with me.

You can find a sample of what a script in the new system should look like https://developer.playcanvas.com/en/user-manual/scripting/creating-new/

this.entity is automatically assigned in the new script system too.

You will also need to change app. to this.app.

3

Remove this:

Don’t override the prototype by assigning a whole new object to it:

Instead only define functions like this:

AnimateCamera.prototype.initialize = function ...blah blah..
4

Thanks @vaios and @yaustar,

I have got to the below but receiving errors. Please forgive me still picking this all up and I’m so grateful for your help.

var AnimateCamera = pc.createScript('animateCamera'); 

AnimateCamera.prototype.initialize = function () {
            
            var node = this.app.root.findByName("BlenderCamera");
            var camera = this.app.root.findByName("Camera");
            camera.reparent(node);
        },

        // Called every frame, dt is time in seconds since last update
        update: function (dt) {
        }
    };
5

Have you tried to debug it?

https://developer.playcanvas.com/en/user-manual/scripting/debugging/

Debugging - is essential part of development, it involves investigating your application logic and inspecting state of code to figure out what went wrong.

6

Hi @max,

I did yes - the error I was receiving is:

[animateCamera.js?id=7836760:11]: Uncaught SyntaxError: Unexpected token :

Sorry, I don’t mean to be annoying asking questions.

7

Here we go, check what is on line 11, it says what an issue there. And it is SyntaxError.
Our Code Editor will highlight an issue there as well for convenience.

8

If you check the image from the manual about creating the script, you can see what the default script template looks like (which follows what @vaios is
saying about creating now functions): https://developer.playcanvas.com/images/user-manual/scripting/code-editor.jpg

You also look at public projects like the tutorial samples from PlayCanvas if you need more examples: https://developer.playcanvas.com/en/tutorials/

Almost there!

9

Each function needs each own block. You are doing

AnimateCamera.prototype.initialize = function () {
...
}, update: function () ...

This is wrong you need to do

AnimateCamera.prototype.initialize = function () {
            
          ...
};


AnimateCamera.prototype.update = function (dt) {
            ...

};
10

Thank you so so much @max @vaios and @yaustar - you helped me immensely not only with this issue but understanding how I should go about debugging and general coding practice!

For anyone who searches for this and needs the solution, this works:

var AnimateCamera = pc.createScript('animateCamera'); 

AnimateCamera.prototype.initialize = function () {
  var node = this.app.root.findByName("BlenderCamera");
            var camera = this.app.root.findByName("Camera");
            camera.reparent(node);
};


AnimateCamera.prototype.update = function (dt) {
       // Called every frame, dt is time in seconds since last update
        AnimateCamera.prototype.update = function (dt) {
        };
};
11

Probably a typo but this:

should be

AnimateCamera.prototype.update = function (dt) {
};
12

My mistake! Thanks again

13

Here is a great place to learn JavaScript: https://www.codecademy.com/learn/learn-javascript