2

In the docs for the aframe-alongpath-component it has a section on events and on state.

One of the states is "moveonpath" - The Entity currently moving along the path.

How would I hook into that so that whilst the entity is moving it plays a specific sound?

I'm also not clear from the docs how I could trigger the movement along the path to start in code from elsewhere. It appears to have an event you can listen to "movingstarted" but no play method I can call on the component.

The end goal I am trying to achieve is a rock being flung from a catapult.

When the catapult animation completes I want to trigger to rock the follow along a path for its trajectory and trigger a sound whilst moving and another when it reaches the end of the path (which will be in the ocean).

1 Answers1

1

checking the state is quite simple:

element.is("state");

getting the 'ended' event is even simpler:

element.addEventListener("movingended", (e)=>{})


now add the event listener in the init function, and check the state in the tick function in a component:
AFRAME.registerComponent('foo', {
  init: function() {
    this.el.addEventListener("movingended", (e) => {
      console.log("moving ended")
    })
  },
  tick: function() {
    console.log(this.el.is("moveonpath"));
  }
})

and attach the component:

<a-box foo></a-box>

check it out live here.

Piotr Adam Milewski
  • 14,150
  • 3
  • 21
  • 42
  • Thank you. I managed to suss the "movingended" event listener out before you answered but had no idea A-Frame entities had a local state that could be accessed via el.is("state"). I also discovered by looking into the components code that it does have a play method which I can access via element.components.alongpath.play() The only problem I have now is that it autoplays on load instead of waiting to be played but I could fork the component and add an isPaused state which the tick listens too so it doesn't move until I set it to false. – Adam Marc Williams Feb 18 '18 at 15:38