How to hide/activate an element using different script

Hi I’m trying to activate a button element on a different button click. There are 4 buttons in my project 3 of them changes color attached to changeColor.js, and also a 4th one for facebook CTA, attached to face.js . What I’m trying to do when user presses either one of the color change button it will activate the CTA button which will be hidden in default.

My scene: PlayCanvas | HTML5 Game Engine

Hi @sugarr!

You need some reference to the specific entity and then you can do things like below.

Enable button component:

entity.button.enabled = true;

Activate button component:

entity.button.active = true;

Alternatively, you can just disable the whole entity and enable it when you need it.

1 Like

For this you can use for example an attribute.

MyScript.attributes.add('buttonCTA', { type: 'entity' })
this.buttonCTA.enabled = true;

On the entity with the script you need parse the script first and than you can assign the CTA button entity to the slot of the attribute.

Alternatively, you can use for example findByName().

var buttonCTA = this.app.root.findByName('CTA');
buttonCTA.enabled = true;
1 Like

This is how I would do it https://playcanvas.com/project/1196638/overview/cta-on-click

2 Likes