# How to use Actions/Skill and Animation Events

## How to play a animation without coding

You can play animations without code with the **Simple Play Motion** component in just two steps:

1- Create a Animation State on a Custom Action Layer and assign an animation:

<div align="left"><figure><img src="/files/bxG3y8oL4fbo5aQ5yQsr" alt=""><figcaption></figcaption></figure></div>

{% hint style="info" %}
It is recommended to create a copy of the default animator controller to edit it, so if you make a mistake in some edition you can easily return to the original file.
{% endhint %}

2- Add Simple Play Motion component to your JU Character and configure it:

<div align="left"><figure><img src="/files/RR0JQlFAJHGalsLHVJRQ" alt=""><figcaption></figcaption></figure></div>

<table><thead><tr><th width="273">Simple Play Motion Properties</th><th>Description</th></tr></thead><tbody><tr><td>Action Duration</td><td>Motion duration</td></tr><tr><td>Enter Transition Speed</td><td>Enter animation state speed</td></tr><tr><td>Exit Transition Speed</td><td>Exit animation state speed</td></tr><tr><td>Target Layer</td><td>Body part to play animation, if you look at the Custom Action Layers of the default Animator Controller, each layer controls a different body part</td></tr><tr><td>Animator State Name</td><td>Animation state name</td></tr><tr><td>Start Motion At</td><td>You can cut the beginning of the animation with this option</td></tr><tr><td>Input To Call Action</td><td>Input to start action</td></tr><tr><td>Force Fire Mode</td><td>While the action is playing, set FireMode to true</td></tr><tr><td>Force No Fire Mode</td><td>While the action is playing, set FireMode to false</td></tr><tr><td>Block Character Locomotion</td><td>While the action is playing, the character does not move</td></tr><tr><td>Start Action Even State Is Playing</td><td>With this option it is possible to start the action even if it is already playing</td></tr></tbody></table>

Result:

<div align="center"><figure><img src="/files/cQyD07yc79EUzUi3aPQ0" alt=""><figcaption><p>✅ Animation state running every time I press the G key</p></figcaption></figure></div>

## How to create a Action/Skill script

JU TPS has classes and scripts to create actions, emotes or abilities.

The `JUTPSAction` class is made to interact with the JU Characters system, it has references of **JU Character Controller**, **Animator**, **Rigidbody**, **Collider** and **Camera**.

`JUTPSAnimatedAction` is made for actions involving animations, and has functions to interact with the default JU TPS Animator Controller.

To use these classes you need to make your skill script inherit the classes:

<div align="left"><figure><img src="/files/nlh7h0NcxTnNIwXzPGAD" alt=""><figcaption></figcaption></figure></div>

See sample code below:

<pre class="language-csharp" data-title="SkillExample.cs" data-line-numbers><code class="lang-csharp">using UnityEngine;
// > Import JU Input System Lib
using JUInputSystem;

// > inherit the JUTPSAnimatedAction class
public class SkillExample : JUTPSActions.JUTPSAnimatedAction
{
    [Header("Skill Variables")]
    public string AnimationStateName;

    void Start() { SwitchAnimationLayer(ActionPart.FullBody); }

    //Called every frame
    public override void ActionCondition()
    {
<strong>        if (JUInput.GetButtonDown(JUInput.Buttons.AimingButton) &#x26;&#x26; IsActionPlaying == false)
</strong>        {
            //Start action and play animation
            StartAction();
            PlayAnimation(AnimationStateName);
        }
    }
    //Called every frame while action is playing
    public override void OnActionIsPlaying()
    {
        //Force NO FiringMode
        TPSCharacter.FiringMode = false;
        //Make character fly
        rb.velocity = transform.up * 4;
        //Make the character look in front of the camera
        TPSCharacter.transform.LookAt(cam.transform.forward * 100);
    }

    //Called on action start
    public override void OnActionStarted()
    {
        //Store current item in use
        SetCurrentItemIndexToLastUsedItem();
        //Disable Item
        DisableItemOnHand();
    }
    //Called on action end
    public override void OnActionEnded()
    {
        //Re-equip last used item
        EnableLastUsedItem();
    }
    
    // >> Function to be called by JU Animation Event Receiver &#x3C;&#x3C;
    public void MagicAttack()
    {
        Vector3 spawnPos = anim.GetBoneTransform(HumanBodyBones.RightHand).position + transform.forward * 0.3f;
        GameObject magic_attack = Instantiate(MagicAttackParticle, spawnPos, transform.rotation, transform);
        Destroy(magic_attack, 10);
    }
}
</code></pre>

This code plays in an animation (line 16 to 21) and makes the character fly and look in front of the camera (line 26 to 31), it also unequips items when the action starts and equips the last used item when the action ends (line 35 to 47). See the result:

<figure><img src="/files/ef0oOJcMqwZHjjYtqBL7" alt=""><figcaption></figcaption></figure>

<figure><img src="/files/nNZtUTisQYBu3OCweDLz" alt=""><figcaption></figcaption></figure>

The code also has a function to spawn a magic attack at character hand position, but it won't do anything by itself, to make the magic spell attack work, let's go to the [next topic](#animation-event-system).

## Animation Event System

It is possible to invoke functions through Animator easily without having to create animation events directly in animations.

1- Add the <mark style="color:purple;">**JU Animation Event**</mark> to your animation state and give your event a name, and configure at what time the component will call your event(Duration propertie)

<div align="left"><figure><img src="/files/gJOzqe3xQYErXbh27xV2" alt=""><figcaption></figcaption></figure></div>

2- Add the <mark style="color:yellow;">**JU Animation Event Receiver**</mark>, create an event with the same name you put in the <mark style="color:purple;">**JU Animation Event**</mark>, and in the Event call the function you want:

<div align="left"><figure><img src="/files/1otfQpSlOXaTq2FMzZqG" alt=""><figcaption></figcaption></figure></div>

See the result:

<figure><img src="/files/0Eb8bQZ5Way31YwQ07cr" alt=""><figcaption></figcaption></figure>


---

# Agent Instructions: Querying This Documentation

If you need additional information that is not directly available in this page, you can query the documentation dynamically by asking a question.

Perform an HTTP GET request on the current page URL with the `ask` query parameter:

```
GET https://julhiecio.gitbook.io/ju-tps-documentation/game-development/how-to-use-actions-skill-and-animation-events.md?ask=<question>
```

The question should be specific, self-contained, and written in natural language.
The response will contain a direct answer to the question and relevant excerpts and sources from the documentation.

Use this mechanism when the answer is not explicitly present in the current page, you need clarification or additional context, or you want to retrieve related documentation sections.
