[ts] Finished porting new AnimationState, works as intended

spine-libgdx/spine-libgdx-tests/src/com/esotericsoftware/spine/Sandbox.java

@@ -44,15 +44,15 @@ import com.badlogic.gdx.graphics.g2d.TextureAtlas;
  * runtimes.
  */
 public class Sandbox extends ApplicationAdapter {
-	static final String ATLAS = "../../examples/tank/export/tank.atlas";
+	static final String ATLAS = "../../examples/raptor/export/raptor.atlas";
-	static final String JSON = "../../examples/tank/export/tank.json";
+	static final String JSON = "../../examples/raptor/export/raptor.json";
-	static final float scale = 0.3f;
+	static final float scale = 0.5f;
-	static final float X = 400;
+	static final float X = 0;
-	static final float Y = 500;
+	static final float Y = 0;
-	static final String ANIMATION = "drive";
+	static final String ANIMATION = "walk";
-	static final float ANIMATION_OFFSET = 0.5f;
+	static final float ANIMATION_OFFSET = 0.0f;
-	static final boolean ANIMATION_UPDATE = false;
+	static final boolean ANIMATION_UPDATE = true;
-	static final boolean Y_DOWN = true;
+	static final boolean Y_DOWN = false;
 	static final boolean DRAW_DEBUG = false;
 	
 	OrthographicCamera camera;
@@ -85,7 +85,11 @@ public class Sandbox extends ApplicationAdapter {
 
 		AnimationStateData stateData = new AnimationStateData(skeletonData);
 		state = new AnimationState(stateData);
-		if (ANIMATION != null) state.setAnimation(0, ANIMATION, true);
+		if (ANIMATION != null) {
+			stateData.setMix("walk", "Jump", 0.5f);
+			state.setAnimation(0, ANIMATION, true);
+			state.addAnimation(0, "Jump", false, 0);
+		}
 		if (ANIMATION_OFFSET != 0) {
 			state.update(ANIMATION_OFFSET);
 			state.apply(skeleton);
@@ -97,7 +101,9 @@ public class Sandbox extends ApplicationAdapter {
 		Gdx.gl.glClear(GL20.GL_COLOR_BUFFER_BIT);
 
 		if (ANIMATION_UPDATE) {
-			state.update(Gdx.graphics.getDeltaTime());
+			float delta = Gdx.graphics.getDeltaTime();
+			delta = 0.016f;
+			state.update(delta);
 			state.apply(skeleton);			
 		}
 		skeleton.updateWorldTransform();

spine-ts/build/spine-all.js

@@ -5286,7 +5286,7 @@ var spine;
 			return Math.sin(degrees * MathUtils.degRad);
 		};
 		MathUtils.signum = function (value) {
-			return value >= 0 ? 1 : -1;
+			return value > 0 ? 1 : value < 0 ? -1 : 0;
 		};
 		MathUtils.toInt = function (x) {
 			return x > 0 ? Math.floor(x) : Math.ceil(x);

spine-ts/build/spine-canvas.js

@@ -5286,7 +5286,7 @@ var spine;
 			return Math.sin(degrees * MathUtils.degRad);
 		};
 		MathUtils.signum = function (value) {
-			return value >= 0 ? 1 : -1;
+			return value > 0 ? 1 : value < 0 ? -1 : 0;
 		};
 		MathUtils.toInt = function (x) {
 			return x > 0 ? Math.floor(x) : Math.ceil(x);

spine-ts/build/spine-core.js

@@ -5109,7 +5109,7 @@ var spine;
 			return Math.sin(degrees * MathUtils.degRad);
 		};
 		MathUtils.signum = function (value) {
-			return value >= 0 ? 1 : -1;
+			return value > 0 ? 1 : value < 0 ? -1 : 0;
 		};
 		MathUtils.toInt = function (x) {
 			return x > 0 ? Math.floor(x) : Math.ceil(x);

spine-ts/build/spine-threejs.js

@@ -5109,7 +5109,7 @@ var spine;
 			return Math.sin(degrees * MathUtils.degRad);
 		};
 		MathUtils.signum = function (value) {
-			return value >= 0 ? 1 : -1;
+			return value > 0 ? 1 : value < 0 ? -1 : 0;
 		};
 		MathUtils.toInt = function (x) {
 			return x > 0 ? Math.floor(x) : Math.ceil(x);

spine-ts/build/spine-webgl.js

@@ -5109,7 +5109,7 @@ var spine;
 			return Math.sin(degrees * MathUtils.degRad);
 		};
 		MathUtils.signum = function (value) {
-			return value >= 0 ? 1 : -1;
+			return value > 0 ? 1 : value < 0 ? -1 : 0;
 		};
 		MathUtils.toInt = function (x) {
 			return x > 0 ? Math.floor(x) : Math.ceil(x);

spine-ts/build/spine-widget.js

@@ -5109,7 +5109,7 @@ var spine;
 			return Math.sin(degrees * MathUtils.degRad);
 		};
 		MathUtils.signum = function (value) {
-			return value >= 0 ? 1 : -1;
+			return value > 0 ? 1 : value < 0 ? -1 : 0;
 		};
 		MathUtils.toInt = function (x) {
 			return x > 0 ? Math.floor(x) : Math.ceil(x);

spine-ts/core/src/Utils.ts

@@ -143,7 +143,7 @@ module spine {
 		}
 
 		static signum (value: number): number {
-			return value >= 0 ? 1 : -1;
+			return value > 0 ? 1 : value < 0 ? -1 : 0;
 		}
 
 		static toInt (x: number) {

spine-ts/webgl/example/test.html

@@ -0,0 +1,81 @@
+<html>
+<script src="../../build/spine-webgl.js"></script>
+<script src="https://code.jquery.com/jquery-3.1.0.min.js"></script>
+<style>
+	* { margin: 0; padding: 0; }
+	body, html { height: 100% }
+	canvas { position: absolute; width: 100% ;height: 100%; }
+</style>
+<body>
+<canvas id="canvas"></canvas>
+</body>
+<script>
+
+var canvas, gl, renderer, input, assetManager;
+var skeleton, bounds, state;
+var timeKeeper;
+
+function init() {
+	canvas = document.getElementById("canvas");
+	canvas.width = canvas.clientWidth; canvas.height = canvas.clientHeight;
+	gl = canvas.getContext("webgl", { alpha: false }) || canvas.getContext("experimental-webgl", { alpha: false });
+
+	renderer = new spine.webgl.SceneRenderer(canvas, gl);
+	assetManager = new spine.webgl.AssetManager(gl, "assets/");
+	var textureLoader = function(img) { return new spine.webgl.GLTexture(gl, img); };
+	input = new spine.webgl.Input(canvas);
+	assetManager.loadTexture("raptor.png");
+	assetManager.loadText("raptor.atlas");
+	assetManager.loadText("raptor.json");
+	timeKeeper = new spine.TimeKeeper();
+	requestAnimationFrame(load);
+}
+
+function load() {
+	timeKeeper.update();
+	if (assetManager.isLoadingComplete()) {
+		var atlas = new spine.TextureAtlas(assetManager.get("raptor.atlas"), function(path) {
+			return assetManager.get(path);
+		});
+		var atlasLoader = new spine.AtlasAttachmentLoader(atlas);
+		var skeletonJson = new spine.SkeletonJson(atlasLoader);
+		skeletonJson.scale = 0.5;
+		var skeletonData = skeletonJson.readSkeletonData(JSON.parse(assetManager.get("raptor.json")));
+		skeleton = new spine.Skeleton(skeletonData);
+		var stateData = new spine.AnimationStateData(skeleton.data);
+		state = new spine.AnimationState(stateData);
+		stateData.setMix("walk", "Jump", 0.5);
+		state.setAnimation(0, "walk", false);
+		state.addAnimation(0, "Jump", false, 0);
+		state.apply(skeleton);
+		skeleton.updateWorldTransform();
+
+		requestAnimationFrame(render);
+	} else {
+		requestAnimationFrame(load);
+	}
+}
+
+function render() {
+	timeKeeper.update();
+	var delta = timeKeeper.delta;
+	delta = 0.016;
+
+	state.update(delta);
+	state.apply(skeleton);
+	skeleton.updateWorldTransform();
+
+	gl.clearColor(0, 0, 0, 1);
+	gl.clear(gl.COLOR_BUFFER_BIT);
+
+	renderer.resize(spine.webgl.ResizeMode.Fit);
+	renderer.begin();
+	renderer.drawSkeleton(skeleton);
+	renderer.end();
+
+	requestAnimationFrame(render)
+}
+
+init();
+</script>
+</html>