Sprite Animations

Sprite Animations adds a very simple mechanism to swap between a series of animated textures for a token. This can be helpful for playing attack or casting animations like you might see in a video game.

Sprite assets by chierit; background by Nidhoggn on OpenGameArt; video uses the Project FU system module

Installation

To install this module, copy and paste the following manifest URL into the module installation dialog in Foundry VTT

https://github.com/Unarekin/FoundryVTT-Sprite-Animations/releases/latest/download/module.json
Copy

Usage

Sprite Animations allows for two main methods of actually playing animations: A static interface, and an instance one. The functionality between the two is identical, but the instance interface does not necessitate specifying the token to animate on each call.

Configuration Format

Sprite Animations uses a very simple configuration format for animations.

interface AnimationConfig {
  name: string;     // Name of the animation to refer to it later
  src: string;      // Image URL of the animation
  loop?: boolean;   // Whether or not the animation is looped (optional, defaults to true)
}
Copy

[!NOTE]
When executing multiple animations in sequence via one of the playAnimations functions, the loop option will be ignored for any animations prior to the final one in the sequence.

Basic Usage

// Static:
await SpriteAnimator.playAnimations(token,
  { src: "images/attack.webm" },
  { src: "images/idle.webm", loop: true }
);
Copy

// Instance
const animator = new SpriteAnimator(token);
await animator.playAnimations(
  { src: "images/attack.webm" },
  { src: "images/idle.webm", loop: true }
)
Copy

[!NOTE]
Sprite Animations expects a Token or Token Document (or the id or UUID thereof) when playing animations.

A Token, Token Document, or Actor may be used when adding/removing named animations.

Named Animations

Animations can be pre-configured on a given actor and referred to later by their name. In the future, a GUI will be added to make this process simpler, but for now a code snippet such as the following will need to be executed once.

await SpriteAnimator.addAnimation(token, { name: "idle", src: "images/idle.webm", loop: true });
await SpriteAnimator.addAnimation(token, { name: "attack", src: "images/attack.webm" });
Copy

These named animations can be referred to in subsequent playAnimation(s) calls by name.

const animator = new SpriteAnimator(token);
await animator.playAnimations("attack", "idle");
Copy

Full Example

The following is an actual macro used when testing the module. Change the URL of the animations used to fit your own setup.

try {
  const token = await fromUuid("Scene.GYvGqIwzEK02pjsy.Token.ziUj6k7jI2z1LxaM");
  if (!(token instanceof TokenDocument)) throw new Error("Invalid token")

  await SpriteAnimator.playAnimations(token,
    { name: "idle", src: "uploads/images/sprites/Randi - Attack.webm", loop: false },
    { name: "attack", src: "uploads/images/sprites/Randi - Idle.webm", loop: true  }
  );
} catch (err) {
  ui.notifications.error(err.message);
}
Copy

API Documentation

API Documentation

Known Issues

• Currently does not support the Pixel Perfect module. Using both side-by-side will prevent the token's texture from updating when Sprite Animations does its thing.