aframe

Aframe detecting when visibility is changed within a component


How can I detect when the visibility of an entity changes within a component? I'm writing a video player component, and I need the video player to remove its own clickable class when it's not visible, to avoid being able to click on an invisible element.

Right now I'm thinking about using the componentchanged event on the video player to listen to changes in the visibility component.


Solution

  • I ended up using componentchanged and listened for when the visible component changes.

    Ex.

        this.el.addEventListener('componentchanged', (e) => {
          if (e.detail.name === 'visible') this.updateClickable();
        });