# Event in Spine example

**URL:** <https://phaser.discourse.group/t/event-in-spine-example/4926>\
**Category:** Phaser 3\
**Created:** [January 18, 2020, 12:15am UTC](https://phaser.discourse.group/t/event-in-spine-example/4926 "2020-01-18T00:15:37Z")\
**Posts on this page:** 4\
**Page:** 1

<div class="post-metadata">

**Author:** ![rory](https://avatars.discourse-cdn.com/v4/letter/r/a183cd/32.png) [@rory](https://phaser.discourse.group/u/rory)\
**Post date:** [January 18, 2020, 12:15am UTC](https://phaser.discourse.group/t/event-in-spine-example/4926/1 "2020-01-18T00:15:37Z")

</div>

Hi everyone, I’m trying to make a shooting animation using Spine.  
The animation has multiple parts, I want to release the bullet at the right time somewhere in one of the parts. I think event in Spine is suitable for this, but I couldn’t find example on how to do this…  
My code:

> this.mySpine = this.scene.add.spine(0, 0, ‘mySpine’, ‘attack’, true);  
> this.add(this.mySpine);

I found guide on Spine website, but it’s not javascript, and I have no idea how to code it in javascript with my limited knowledge…

> **[Events - Spine User Guide](http://esotericsoftware.com/spine-events#Responding-to-events)**
>
> Use events to trigger sounds, special effects, and more during your animations.

Do you have any suggestion? Your help is much appreciated. 😇

---

<div class="post-metadata">

**Author:** ![rory](https://avatars.discourse-cdn.com/v4/letter/r/a183cd/32.png) [@rory](https://phaser.discourse.group/u/rory)\
**Post date:** [January 18, 2020, 5:42am UTC](https://phaser.discourse.group/t/event-in-spine-example/4926/2 "2020-01-18T05:42:16Z")

</div>

I think it has something to do with these [Phaser 3 API Documentation - Namespace: SpinePluginEvents](https://photonstorm.github.io/phaser3-docs/SpinePluginEvents.html)

I tried this and it works for the animation-complete event.

> this.mySpine.on(‘complete’, this.actionComplete, this);

But this doesn’t work for the custom event which I want to achieve:

> this.mySpine.on(‘event’, this.actionEvent, this);

It looks like Spine integration is still young with Phaser, or maybe I’m not good enough to make it work the way I want.  
I think I give it up here…

---

<div class="post-metadata">

**Author:** ![VaJoy](https://yyz2.discourse-cdn.com/free1/user_avatar/phaser.discourse.group/vajoy/32/7841_2.png) [@VaJoy](https://phaser.discourse.group/u/VaJoy)\
**Post date:** [November 15, 2023, 3:29am UTC](https://phaser.discourse.group/t/event-in-spine-example/4926/3 "2023-11-15T03:29:11Z")

</div>

It works for me:

```javascript
    create () {
      spineObj = this.add.spine(41, 650, 'bull', 'attack', true)
      spineObj.on('event', (ft: SpineEventFt, de: SpineEventDe) => {
        console.log(ft, de, de.data.name)
      }, this)
    }

```

---

<div class="post-metadata">

**Author:** ![nikfortgames](https://avatars.discourse-cdn.com/v4/letter/n/59ef9b/32.png) [@nikfortgames](https://phaser.discourse.group/u/nikfortgames)\
**Post date:** [September 20, 2024, 6:39am UTC](https://phaser.discourse.group/t/event-in-spine-example/4926/4 "2024-09-20T06:39:08Z")

</div>

```javascript
		this.spine.animationState.addListener({
			event: (trackEntry: TrackEntry, event: any) => {
				console.log("Event fired", event.data.name);
			}
		});

```