A JavaScript API for the Spriter SCML/SCON animation data format.
https://cdn.rawgit.com/flyover/spriter.js/master/demo/index.html
Supported Features
Basic animations
Bone animations
All curve types (Instant, Linear, Quadratic, Cubic, Quartic, Quintic, Bezier)
Points
Collision Rectangles
SubEntities
Events
Sounds
Variables
Tags
Character maps
Animation Blending
How to use it
In the initialization:
var scon = JSON.parse(scon_text); // read and parse SCON file
var data = new spriter.Data().load(scon); // create and load Spriter data from SCON file
var pose = new spriter.Pose(data); // create Spriter pose and attach data
pose.setEntity("player"); // set entity by name
pose.setAnim("idle"); // set animation by name
In the animation loop:
var dt = 1000 / 60; // time step in milliseconds
pose.update(dt); // accumulate time
pose.strike(); // process time slice
Refer to the demo for how to blend animations, draw images, play sounds and respond to events, access tags and variables, etc.
Ha! Yeah, that's me.
I've added support for attaching a group of layers to a bone.
This is the order it looks for a bone.
look for "bone_name" from layer name of the format "base_name bone(bone_name)"
look for layer name
look for "bone_name" from group name of the format "base_name bone(bone_name)"
look for group name
I've added an example to the project to demonstrate.
isaacburns got a reaction from RunnerPack in Spriter.JS JavaScript Implementation
isaacburns got a reaction from Alealokato in Photoshop to Spriter (Photoshop Plugin attached)