How to move entities?

Help & Support
1

Project: https://playcanvas.com/editor/scene/636264

Script: https://playcanvas.com/editor/code/572229?tabs=22253531

Hi, I am trying to move these entities:
Digit 1, Digit 2, Digit 3

I want to move Digit 2 when Digit 1 is enabled so I can centre it.
I want to do the same when Digit 3 is enabled.

This is the code that I have tried:

Center.prototype.initialize = function() {
var app = this.app;   
    
var Digit2 = app.root.findByPath('Game Screen/Score/Digit 2');
var Digit1 = app.root.findByName('Game Screen/Score/Digit 1');
var Digit0 = app.root.findByName('Game Screen/Score/Digit 0');

// if digit 2 is enabled, move digit 2 and digit 1 so they are centered     
if (Digit1.enabled === true) {
    Digit2.setPosition(0.02, 0, 0);
    Digit1.setPosition(-0.02, 0, 0);
}

// if digit 3 is enabled, move digit 3, digit 2 and digit 1 so they are centered    
if (Digit0.enabled === true) {
    Digit0.setPosition(-0.025, 0, 0);
    Digit1.setPosition(0, 0, 0);
    Digit2.setPosition(0.025, 0, 0);
}
};

But this returns an error: TypeError: Cannot read property ‘enabled’ of null
But I do not know how to fix this error? Any help is appreciated :slightly_smiling_face:

2

I suspect it’s because you’re using findByName in place of findByPath. Presumably Digit1 and Digit0 is null and so accessing .enabled fails.

You should consider learning how to use the browser inspector to figure out such basic errors in your code. Doing so will result in you working quicker and better. For example you can check out https://developers.google.com/web/tools/chrome-devtools/javascript/

3

Also, you’re accessing app.root. It should be this.app.root.

Again, using a debugger will allow you figure out what issue is on your own. :+1:t3:

4

I have done what you have said and the error still returns
Here is the new code

Center.prototype.initialize = function() {
    
var Digit2 = this.app.root.findByPath('Game Screen/Score/Digit 2');
var Digit1 = this.app.root.findByPath('Game Screen/Score/Digit 1');
var Digit0 = this.app.root.findByPath('Game Screen/Score/Digit 0');

// if digit 2 is enabled, move digit 2 and digit 1 so they are centered     
if (Digit1.enabled === true) {
    Digit2.setPosition(0.02, 0, 0);
    Digit1.setPosition(-0.02, 0, 0);
}

// if digit 3 is enabled, move digit 3, digit 2 and digit 1 so they are centered    
if (Digit0.enabled === true) {
    Digit0.setPosition(-0.025, 0, 0);
    Digit1.setPosition(0, 0, 0);
    Digit2.setPosition(0.025, 0, 0);
}
};

The error says line 17 is incorrect
if (Digit1.enabled === true) {
is where the error is taking place. So I am assuming something I have written here is wrong

The console says

TypeError: Cannot read property 'enabled' of null
    at script.Center.initialize (Center.js?id=22253531&branchId=a60b7b9b-2d10-46c4-8e82-b2881795a032:17)
    at ScriptComponent._scriptMethod (playcanvas-stable.dbg.js:27170)
    at script.set (playcanvas-stable.dbg.js:22462)
    at ScriptComponent._checkState (playcanvas-stable.dbg.js:27138)
    at ScriptComponent.onEnable (playcanvas-stable.dbg.js:27088)
    at Entity._onHierarchyStateChanged (playcanvas-stable.dbg.js:38756)
    at Entity._notifyHierarchyStateChanged (playcanvas-stable.dbg.js:38728)
    at Entity._notifyHierarchyStateChanged (playcanvas-stable.dbg.js:38736)
    at Entity.set (playcanvas-stable.dbg.js:11447)
    at game.js?id=13958212&branchId=a60b7b9b-2d10-46c4-8e82-b2881795a032:79

as a beginner I do make ‘such basic errors’ and not knowing what any of the console log is supposed to mean does not help either

5

Hi @_Lio3LivioN

The entity reference path to the digits are incorrect. They should be ‘Root/UI/Game Screen/Score/Digit 2’. This makes sense if you look at the entity hierarchy in the editor: it starts with ‘Root’, and the ‘Game Screen’ is a child of ‘UI’, hence the path Root->UI->Game Screen.

To see this yourself, you can place a breakpoint in your Circle.js script, and then inspect pc.app.root directly and traverse through _children elements.

6

Just to add, app.root doesn’t refer to the entity named Root in the scene. app.root is the parent entity to the scene’s ‘root’ entity. (Yes, it is a little confusing).

7

@yaustar @codebon
thank you for your help :grinning: