c-frame / aframe-extras

Add-ons and helpers for A-Frame VR.
https://c-frame.github.io/aframe-extras/examples/
MIT License
972 stars 305 forks source link

Perform action as animation completes #431

Closed Fatima-Aslam closed 11 months ago

Fatima-Aslam commented 1 year ago

I want to remove the 3D model as its animation completes/finishes. I try to use the "animation-finished" event but it removes the 3D model before the animation completes. Is there any parameter that calls the animation-finished event after a specific time? Please help me to fix this issue.... I use this code:

const button = document.querySelector('#play_again')
      const player = document.querySelector('#btn-obj')
      sound.play()
      player.setAttribute('animation-mixer', {clip: '*', loop: 'once', clampWhenFinished: 'true'})
      button.setAttribute('visible', 'false')
      player.addEventListener('animation-finished', () => {
        player.setAttribute('visible', 'false') })

And in HTML

<a-entity
      id="btn-obj"
      gltf-model="#Virgo-glb"
      scale="0.6 0.6 0.6"
      rotation="0 0 0"
      position="0 -0.9 0.2"
      new="clip: EsqueletoAction"></a-entity>
dirkk0 commented 1 year ago

Would an additional setTimeout in the last line work?

Fatima-Aslam commented 1 year ago

Where to add setTimeout()?

On Sun, Oct 29, 2023, 11:39 PM Dirk Krause @.***> wrote:

Would an additional setTimeout in the last line work?

— Reply to this email directly, view it on GitHub https://github.com/c-frame/aframe-extras/issues/431#issuecomment-1784192913, or unsubscribe https://github.com/notifications/unsubscribe-auth/AUW4H5XWWQYHIMXCIVSOKDLYB2IENAVCNFSM6AAAAAA6U77RC2VHI2DSMVQWIX3LMV43OSLTON2WKQ3PNVWWK3TUHMYTOOBUGE4TEOJRGM . You are receiving this because you authored the thread.Message ID: @.***>

dirkk0 commented 1 year ago
player.addEventListener("animation-finished", () => {
  setTimeout(() => {
    player.setAttribute("visible", "false");
  }, "1000");
});