[ts] Fixed SwirlEffect

spine-ts/build/spine-all.d.ts

@@ -962,6 +962,21 @@ declare module spine {
 		static signum(value: number): number;
 		static toInt(x: number): number;
 		static cbrt(x: number): number;
+		static randomTriangular(min: number, max: number): number;
+		static randomTriangularWith(min: number, max: number, mode: number): number;
+	}
+	abstract class Interpolation {
+		protected abstract applyInternal(a: number): number;
+		apply(start: number, end: number, a: number): number;
+	}
+	class Pow extends Interpolation {
+		protected power: number;
+		constructor(power: number);
+		applyInternal(a: number): number;
+	}
+	class PowOut extends Pow {
+		constructor(power: number);
+		applyInternal(a: number): number;
 	}
 	class Utils {
 		static SUPPORTS_TYPED_ARRAYS: boolean;
@@ -1019,6 +1034,13 @@ declare module spine {
 		getMean(): number;
 	}
 }
+declare module spine {
+	interface VertexEffect {
+		begin(skeleton: Skeleton): void;
+		transform(position: Vector2, uv: Vector2, light: Color, dark: Color): void;
+		end(): void;
+	}
+}
 declare module spine {
 	abstract class Attachment {
 		name: string;
@@ -1169,6 +1191,31 @@ declare module spine {
 		computeWorldVertices(bone: Bone, worldVertices: ArrayLike<number>, offset: number, stride: number): void;
 	}
 }
+declare module spine {
+	class JitterEffect implements VertexEffect {
+		jitterX: number;
+		jitterY: number;
+		constructor(jitterX: number, jitterY: number);
+		begin(skeleton: Skeleton): void;
+		transform(position: Vector2, uv: Vector2, light: Color, dark: Color): void;
+		end(): void;
+	}
+}
+declare module spine {
+	class SwirlEffect implements VertexEffect {
+		static interpolation: PowOut;
+		centerX: number;
+		centerY: number;
+		radius: number;
+		angle: number;
+		private worldX;
+		private worldY;
+		constructor(radius: number);
+		begin(skeleton: Skeleton): void;
+		transform(position: Vector2, uv: Vector2, light: Color, dark: Color): void;
+		end(): void;
+	}
+}
 declare module spine.canvas {
 	class AssetManager extends spine.AssetManager {
 		constructor(pathPrefix?: string);
@@ -1571,6 +1618,7 @@ declare module spine.webgl {
 	class SkeletonRenderer {
 		static QUAD_TRIANGLES: number[];
 		premultipliedAlpha: boolean;
+		vertexEffect: VertexEffect;
 		private tempColor;
 		private tempColor2;
 		private vertices;
@@ -1578,6 +1626,10 @@ declare module spine.webgl {
 		private twoColorTint;
 		private renderable;
 		private clipper;
+		private temp;
+		private temp2;
+		private temp3;
+		private temp4;
 		constructor(context: ManagedWebGLRenderingContext, twoColorTint?: boolean);
 		draw(batcher: PolygonBatcher, skeleton: Skeleton): void;
 	}

spine-ts/build/spine-all.js

@@ -5747,6 +5747,16 @@ var spine;
 			var y = Math.pow(Math.abs(x), 1 / 3);
 			return x < 0 ? -y : y;
 		};
+		MathUtils.randomTriangular = function (min, max) {
+			return MathUtils.randomTriangularWith(min, max, (min + max) * 0.5);
+		};
+		MathUtils.randomTriangularWith = function (min, max, mode) {
+			var u = Math.random();
+			var d = max - min;
+			if (u <= (mode - min) / d)
+				return min + Math.sqrt(u * d * (mode - min));
+			return max - Math.sqrt((1 - u) * d * (max - mode));
+		};
 		return MathUtils;
 	}());
 	MathUtils.PI = 3.1415927;
@@ -5756,6 +5766,42 @@ var spine;
 	MathUtils.degreesToRadians = MathUtils.PI / 180;
 	MathUtils.degRad = MathUtils.degreesToRadians;
 	spine.MathUtils = MathUtils;
+	var Interpolation = (function () {
+		function Interpolation() {
+		}
+		Interpolation.prototype.apply = function (start, end, a) {
+			return start + (end - start) * this.applyInternal(a);
+		};
+		return Interpolation;
+	}());
+	spine.Interpolation = Interpolation;
+	var Pow = (function (_super) {
+		__extends(Pow, _super);
+		function Pow(power) {
+			var _this = _super.call(this) || this;
+			_this.power = 2;
+			_this.power = power;
+			return _this;
+		}
+		Pow.prototype.applyInternal = function (a) {
+			if (a <= 0.5)
+				return Math.pow(a * 2, this.power) / 2;
+			return Math.pow((a - 1) * 2, this.power) / (this.power % 2 == 0 ? -2 : 2) + 1;
+		};
+		return Pow;
+	}(Interpolation));
+	spine.Pow = Pow;
+	var PowOut = (function (_super) {
+		__extends(PowOut, _super);
+		function PowOut(power) {
+			return _super.call(this, power) || this;
+		}
+		PowOut.prototype.applyInternal = function (a) {
+			return Math.pow(a - 1, this.power) * (this.power % 2 == 0 ? -1 : 1) + 1;
+		};
+		return PowOut;
+	}(Pow));
+	spine.PowOut = PowOut;
 	var Utils = (function () {
 		function Utils() {
 		}
@@ -6317,6 +6363,63 @@ var spine;
 	spine.RegionAttachment = RegionAttachment;
 })(spine || (spine = {}));
 var spine;
+(function (spine) {
+	var JitterEffect = (function () {
+		function JitterEffect(jitterX, jitterY) {
+			this.jitterX = 0;
+			this.jitterY = 0;
+			this.jitterX = jitterX;
+			this.jitterY = jitterY;
+		}
+		JitterEffect.prototype.begin = function (skeleton) {
+		};
+		JitterEffect.prototype.transform = function (position, uv, light, dark) {
+			position.x += spine.MathUtils.randomTriangular(-this.jitterX, this.jitterY);
+			position.y += spine.MathUtils.randomTriangular(-this.jitterX, this.jitterY);
+		};
+		JitterEffect.prototype.end = function () {
+		};
+		return JitterEffect;
+	}());
+	spine.JitterEffect = JitterEffect;
+})(spine || (spine = {}));
+var spine;
+(function (spine) {
+	var SwirlEffect = (function () {
+		function SwirlEffect(radius) {
+			this.centerX = 0;
+			this.centerY = 0;
+			this.radius = 0;
+			this.angle = 0;
+			this.worldX = 0;
+			this.worldY = 0;
+			this.radius = radius;
+		}
+		SwirlEffect.prototype.begin = function (skeleton) {
+			this.worldX = skeleton.x + this.centerX;
+			this.worldY = skeleton.y + this.centerY;
+		};
+		SwirlEffect.prototype.transform = function (position, uv, light, dark) {
+			var radAngle = this.angle * spine.MathUtils.degreesToRadians;
+			var x = position.x - this.worldX;
+			var y = position.y - this.worldY;
+			var dist = Math.sqrt(x * x + y * y);
+			if (dist < this.radius) {
+				var theta = SwirlEffect.interpolation.apply(0, radAngle, (this.radius - dist) / this.radius);
+				var cos = Math.cos(theta);
+				var sin = Math.sin(theta);
+				position.x = cos * x - sin * y + this.worldX;
+				position.y = sin * x + cos * y + this.worldY;
+			}
+		};
+		SwirlEffect.prototype.end = function () {
+		};
+		return SwirlEffect;
+	}());
+	SwirlEffect.interpolation = new spine.PowOut(2);
+	spine.SwirlEffect = SwirlEffect;
+})(spine || (spine = {}));
+var spine;
 (function (spine) {
 	var canvas;
 	(function (canvas) {
@@ -8674,12 +8777,17 @@ var spine;
 			function SkeletonRenderer(context, twoColorTint) {
 				if (twoColorTint === void 0) { twoColorTint = true; }
 				this.premultipliedAlpha = false;
+				this.vertexEffect = null;
 				this.tempColor = new spine.Color();
 				this.tempColor2 = new spine.Color();
 				this.vertexSize = 2 + 2 + 4;
 				this.twoColorTint = false;
 				this.renderable = new Renderable(null, 0, 0);
 				this.clipper = new spine.SkeletonClipping();
+				this.temp = new spine.Vector2();
+				this.temp2 = new spine.Vector2();
+				this.temp3 = new spine.Color();
+				this.temp4 = new spine.Color();
 				this.twoColorTint = twoColorTint;
 				if (twoColorTint)
 					this.vertexSize += 4;
@@ -8690,6 +8798,10 @@ var spine;
 				var premultipliedAlpha = this.premultipliedAlpha;
 				var twoColorTint = this.twoColorTint;
 				var blendMode = null;
+				var tempPos = this.temp;
+				var tempUv = this.temp2;
+				var tempLight = this.temp3;
+				var tempDark = this.temp4;
 				var renderable = this.renderable;
 				var uvs = null;
 				var triangles = null;
@@ -8764,28 +8876,75 @@ var spine;
 						}
 						else {
 							var verts = renderable.vertices;
-							if (!twoColorTint) {
+							if (this.vertexEffect != null) {
-								for (var v = 2, u = 0, n_3 = renderable.numFloats; v < n_3; v += vertexSize, u += 2) {
+								var vertexEffect = this.vertexEffect;
-									verts[v] = finalColor.r;
+								if (!twoColorTint) {
-									verts[v + 1] = finalColor.g;
+									for (var v = 0, u = 0, n_3 = renderable.numFloats; v < n_3; v += vertexSize, u += 2) {
-									verts[v + 2] = finalColor.b;
+										tempPos.x = verts[v];
-									verts[v + 3] = finalColor.a;
+										tempPos.y = verts[v + 1];
-									verts[v + 4] = uvs[u];
+										tempUv.x = uvs[u];
-									verts[v + 5] = uvs[u + 1];
+										tempUv.y = uvs[u + 1];
+										tempLight.setFromColor(finalColor);
+										tempDark.set(0, 0, 0, 0);
+										vertexEffect.transform(tempPos, tempUv, tempLight, tempDark);
+										verts[v] = tempPos.x;
+										verts[v + 1] = tempPos.y;
+										verts[v + 2] = tempLight.r;
+										verts[v + 3] = tempLight.g;
+										verts[v + 4] = tempLight.b;
+										verts[v + 5] = tempLight.a;
+										verts[v + 6] = tempUv.x;
+										verts[v + 7] = tempUv.y;
+									}
+								}
+								else {
+									for (var v = 0, u = 0, n_4 = renderable.numFloats; v < n_4; v += vertexSize, u += 2) {
+										tempPos.x = verts[v];
+										tempPos.y = verts[v + 1];
+										tempUv.x = uvs[u];
+										tempUv.y = uvs[u + 1];
+										tempLight.setFromColor(finalColor);
+										tempDark.setFromColor(darkColor);
+										vertexEffect.transform(tempPos, tempUv, tempLight, tempDark);
+										verts[v] = tempPos.x;
+										verts[v + 1] = tempPos.y;
+										verts[v + 2] = tempLight.r;
+										verts[v + 3] = tempLight.g;
+										verts[v + 4] = tempLight.b;
+										verts[v + 5] = tempLight.a;
+										verts[v + 6] = tempUv.x;
+										verts[v + 7] = tempUv.y;
+										verts[v + 8] = tempDark.r;
+										verts[v + 9] = tempDark.g;
+										verts[v + 10] = tempDark.b;
+										verts[v + 11] = tempDark.a;
+									}
 								}
 							}
 							else {
-								for (var v = 2, u = 0, n_4 = renderable.numFloats; v < n_4; v += vertexSize, u += 2) {
+								if (!twoColorTint) {
-									verts[v] = finalColor.r;
+									for (var v = 2, u = 0, n_5 = renderable.numFloats; v < n_5; v += vertexSize, u += 2) {
-									verts[v + 1] = finalColor.g;
+										verts[v] = finalColor.r;
-									verts[v + 2] = finalColor.b;
+										verts[v + 1] = finalColor.g;
-									verts[v + 3] = finalColor.a;
+										verts[v + 2] = finalColor.b;
-									verts[v + 4] = uvs[u];
+										verts[v + 3] = finalColor.a;
-									verts[v + 5] = uvs[u + 1];
+										verts[v + 4] = uvs[u];
-									verts[v + 6] = darkColor.r;
+										verts[v + 5] = uvs[u + 1];
-									verts[v + 7] = darkColor.g;
+									}
-									verts[v + 8] = darkColor.b;
+								}
-									verts[v + 9] = darkColor.a;
+								else {
+									for (var v = 2, u = 0, n_6 = renderable.numFloats; v < n_6; v += vertexSize, u += 2) {
+										verts[v] = finalColor.r;
+										verts[v + 1] = finalColor.g;
+										verts[v + 2] = finalColor.b;
+										verts[v + 3] = finalColor.a;
+										verts[v + 4] = uvs[u];
+										verts[v + 5] = uvs[u + 1];
+										verts[v + 6] = darkColor.r;
+										verts[v + 7] = darkColor.g;
+										verts[v + 8] = darkColor.b;
+										verts[v + 9] = darkColor.a;
+									}
 								}
 							}
 							var view = renderable.vertices.subarray(0, renderable.numFloats);
@@ -9153,7 +9312,7 @@ var spine;
 						}
 						else {
 							var verts = vertices;
-							for (var v = 2, u = 0, n_5 = numFloats; v < n_5; v += vertexSize, u += 2) {
+							for (var v = 2, u = 0, n_7 = numFloats; v < n_7; v += vertexSize, u += 2) {
 								verts[v] = color.r;
 								verts[v + 1] = color.g;
 								verts[v + 2] = color.b;

spine-ts/build/spine-canvas.d.ts

@@ -962,6 +962,21 @@ declare module spine {
 		static signum(value: number): number;
 		static toInt(x: number): number;
 		static cbrt(x: number): number;
+		static randomTriangular(min: number, max: number): number;
+		static randomTriangularWith(min: number, max: number, mode: number): number;
+	}
+	abstract class Interpolation {
+		protected abstract applyInternal(a: number): number;
+		apply(start: number, end: number, a: number): number;
+	}
+	class Pow extends Interpolation {
+		protected power: number;
+		constructor(power: number);
+		applyInternal(a: number): number;
+	}
+	class PowOut extends Pow {
+		constructor(power: number);
+		applyInternal(a: number): number;
 	}
 	class Utils {
 		static SUPPORTS_TYPED_ARRAYS: boolean;
@@ -1019,6 +1034,13 @@ declare module spine {
 		getMean(): number;
 	}
 }
+declare module spine {
+	interface VertexEffect {
+		begin(skeleton: Skeleton): void;
+		transform(position: Vector2, uv: Vector2, light: Color, dark: Color): void;
+		end(): void;
+	}
+}
 declare module spine {
 	abstract class Attachment {
 		name: string;
@@ -1169,6 +1191,31 @@ declare module spine {
 		computeWorldVertices(bone: Bone, worldVertices: ArrayLike<number>, offset: number, stride: number): void;
 	}
 }
+declare module spine {
+	class JitterEffect implements VertexEffect {
+		jitterX: number;
+		jitterY: number;
+		constructor(jitterX: number, jitterY: number);
+		begin(skeleton: Skeleton): void;
+		transform(position: Vector2, uv: Vector2, light: Color, dark: Color): void;
+		end(): void;
+	}
+}
+declare module spine {
+	class SwirlEffect implements VertexEffect {
+		static interpolation: PowOut;
+		centerX: number;
+		centerY: number;
+		radius: number;
+		angle: number;
+		private worldX;
+		private worldY;
+		constructor(radius: number);
+		begin(skeleton: Skeleton): void;
+		transform(position: Vector2, uv: Vector2, light: Color, dark: Color): void;
+		end(): void;
+	}
+}
 declare module spine.canvas {
 	class AssetManager extends spine.AssetManager {
 		constructor(pathPrefix?: string);

spine-ts/build/spine-canvas.js

@@ -5747,6 +5747,16 @@ var spine;
 			var y = Math.pow(Math.abs(x), 1 / 3);
 			return x < 0 ? -y : y;
 		};
+		MathUtils.randomTriangular = function (min, max) {
+			return MathUtils.randomTriangularWith(min, max, (min + max) * 0.5);
+		};
+		MathUtils.randomTriangularWith = function (min, max, mode) {
+			var u = Math.random();
+			var d = max - min;
+			if (u <= (mode - min) / d)
+				return min + Math.sqrt(u * d * (mode - min));
+			return max - Math.sqrt((1 - u) * d * (max - mode));
+		};
 		return MathUtils;
 	}());
 	MathUtils.PI = 3.1415927;
@@ -5756,6 +5766,42 @@ var spine;
 	MathUtils.degreesToRadians = MathUtils.PI / 180;
 	MathUtils.degRad = MathUtils.degreesToRadians;
 	spine.MathUtils = MathUtils;
+	var Interpolation = (function () {
+		function Interpolation() {
+		}
+		Interpolation.prototype.apply = function (start, end, a) {
+			return start + (end - start) * this.applyInternal(a);
+		};
+		return Interpolation;
+	}());
+	spine.Interpolation = Interpolation;
+	var Pow = (function (_super) {
+		__extends(Pow, _super);
+		function Pow(power) {
+			var _this = _super.call(this) || this;
+			_this.power = 2;
+			_this.power = power;
+			return _this;
+		}
+		Pow.prototype.applyInternal = function (a) {
+			if (a <= 0.5)
+				return Math.pow(a * 2, this.power) / 2;
+			return Math.pow((a - 1) * 2, this.power) / (this.power % 2 == 0 ? -2 : 2) + 1;
+		};
+		return Pow;
+	}(Interpolation));
+	spine.Pow = Pow;
+	var PowOut = (function (_super) {
+		__extends(PowOut, _super);
+		function PowOut(power) {
+			return _super.call(this, power) || this;
+		}
+		PowOut.prototype.applyInternal = function (a) {
+			return Math.pow(a - 1, this.power) * (this.power % 2 == 0 ? -1 : 1) + 1;
+		};
+		return PowOut;
+	}(Pow));
+	spine.PowOut = PowOut;
 	var Utils = (function () {
 		function Utils() {
 		}
@@ -6317,6 +6363,63 @@ var spine;
 	spine.RegionAttachment = RegionAttachment;
 })(spine || (spine = {}));
 var spine;
+(function (spine) {
+	var JitterEffect = (function () {
+		function JitterEffect(jitterX, jitterY) {
+			this.jitterX = 0;
+			this.jitterY = 0;
+			this.jitterX = jitterX;
+			this.jitterY = jitterY;
+		}
+		JitterEffect.prototype.begin = function (skeleton) {
+		};
+		JitterEffect.prototype.transform = function (position, uv, light, dark) {
+			position.x += spine.MathUtils.randomTriangular(-this.jitterX, this.jitterY);
+			position.y += spine.MathUtils.randomTriangular(-this.jitterX, this.jitterY);
+		};
+		JitterEffect.prototype.end = function () {
+		};
+		return JitterEffect;
+	}());
+	spine.JitterEffect = JitterEffect;
+})(spine || (spine = {}));
+var spine;
+(function (spine) {
+	var SwirlEffect = (function () {
+		function SwirlEffect(radius) {
+			this.centerX = 0;
+			this.centerY = 0;
+			this.radius = 0;
+			this.angle = 0;
+			this.worldX = 0;
+			this.worldY = 0;
+			this.radius = radius;
+		}
+		SwirlEffect.prototype.begin = function (skeleton) {
+			this.worldX = skeleton.x + this.centerX;
+			this.worldY = skeleton.y + this.centerY;
+		};
+		SwirlEffect.prototype.transform = function (position, uv, light, dark) {
+			var radAngle = this.angle * spine.MathUtils.degreesToRadians;
+			var x = position.x - this.worldX;
+			var y = position.y - this.worldY;
+			var dist = Math.sqrt(x * x + y * y);
+			if (dist < this.radius) {
+				var theta = SwirlEffect.interpolation.apply(0, radAngle, (this.radius - dist) / this.radius);
+				var cos = Math.cos(theta);
+				var sin = Math.sin(theta);
+				position.x = cos * x - sin * y + this.worldX;
+				position.y = sin * x + cos * y + this.worldY;
+			}
+		};
+		SwirlEffect.prototype.end = function () {
+		};
+		return SwirlEffect;
+	}());
+	SwirlEffect.interpolation = new spine.PowOut(2);
+	spine.SwirlEffect = SwirlEffect;
+})(spine || (spine = {}));
+var spine;
 (function (spine) {
 	var canvas;
 	(function (canvas) {

spine-ts/build/spine-core.d.ts

@@ -962,6 +962,21 @@ declare module spine {
 		static signum(value: number): number;
 		static toInt(x: number): number;
 		static cbrt(x: number): number;
+		static randomTriangular(min: number, max: number): number;
+		static randomTriangularWith(min: number, max: number, mode: number): number;
+	}
+	abstract class Interpolation {
+		protected abstract applyInternal(a: number): number;
+		apply(start: number, end: number, a: number): number;
+	}
+	class Pow extends Interpolation {
+		protected power: number;
+		constructor(power: number);
+		applyInternal(a: number): number;
+	}
+	class PowOut extends Pow {
+		constructor(power: number);
+		applyInternal(a: number): number;
 	}
 	class Utils {
 		static SUPPORTS_TYPED_ARRAYS: boolean;
@@ -1019,6 +1034,13 @@ declare module spine {
 		getMean(): number;
 	}
 }
+declare module spine {
+	interface VertexEffect {
+		begin(skeleton: Skeleton): void;
+		transform(position: Vector2, uv: Vector2, light: Color, dark: Color): void;
+		end(): void;
+	}
+}
 declare module spine {
 	abstract class Attachment {
 		name: string;
@@ -1169,3 +1191,28 @@ declare module spine {
 		computeWorldVertices(bone: Bone, worldVertices: ArrayLike<number>, offset: number, stride: number): void;
 	}
 }
+declare module spine {
+	class JitterEffect implements VertexEffect {
+		jitterX: number;
+		jitterY: number;
+		constructor(jitterX: number, jitterY: number);
+		begin(skeleton: Skeleton): void;
+		transform(position: Vector2, uv: Vector2, light: Color, dark: Color): void;
+		end(): void;
+	}
+}
+declare module spine {
+	class SwirlEffect implements VertexEffect {
+		static interpolation: PowOut;
+		centerX: number;
+		centerY: number;
+		radius: number;
+		angle: number;
+		private worldX;
+		private worldY;
+		constructor(radius: number);
+		begin(skeleton: Skeleton): void;
+		transform(position: Vector2, uv: Vector2, light: Color, dark: Color): void;
+		end(): void;
+	}
+}

spine-ts/build/spine-core.js

@@ -5747,6 +5747,16 @@ var spine;
 			var y = Math.pow(Math.abs(x), 1 / 3);
 			return x < 0 ? -y : y;
 		};
+		MathUtils.randomTriangular = function (min, max) {
+			return MathUtils.randomTriangularWith(min, max, (min + max) * 0.5);
+		};
+		MathUtils.randomTriangularWith = function (min, max, mode) {
+			var u = Math.random();
+			var d = max - min;
+			if (u <= (mode - min) / d)
+				return min + Math.sqrt(u * d * (mode - min));
+			return max - Math.sqrt((1 - u) * d * (max - mode));
+		};
 		return MathUtils;
 	}());
 	MathUtils.PI = 3.1415927;
@@ -5756,6 +5766,42 @@ var spine;
 	MathUtils.degreesToRadians = MathUtils.PI / 180;
 	MathUtils.degRad = MathUtils.degreesToRadians;
 	spine.MathUtils = MathUtils;
+	var Interpolation = (function () {
+		function Interpolation() {
+		}
+		Interpolation.prototype.apply = function (start, end, a) {
+			return start + (end - start) * this.applyInternal(a);
+		};
+		return Interpolation;
+	}());
+	spine.Interpolation = Interpolation;
+	var Pow = (function (_super) {
+		__extends(Pow, _super);
+		function Pow(power) {
+			var _this = _super.call(this) || this;
+			_this.power = 2;
+			_this.power = power;
+			return _this;
+		}
+		Pow.prototype.applyInternal = function (a) {
+			if (a <= 0.5)
+				return Math.pow(a * 2, this.power) / 2;
+			return Math.pow((a - 1) * 2, this.power) / (this.power % 2 == 0 ? -2 : 2) + 1;
+		};
+		return Pow;
+	}(Interpolation));
+	spine.Pow = Pow;
+	var PowOut = (function (_super) {
+		__extends(PowOut, _super);
+		function PowOut(power) {
+			return _super.call(this, power) || this;
+		}
+		PowOut.prototype.applyInternal = function (a) {
+			return Math.pow(a - 1, this.power) * (this.power % 2 == 0 ? -1 : 1) + 1;
+		};
+		return PowOut;
+	}(Pow));
+	spine.PowOut = PowOut;
 	var Utils = (function () {
 		function Utils() {
 		}
@@ -6316,4 +6362,61 @@ var spine;
 	RegionAttachment.V4 = 31;
 	spine.RegionAttachment = RegionAttachment;
 })(spine || (spine = {}));
+var spine;
+(function (spine) {
+	var JitterEffect = (function () {
+		function JitterEffect(jitterX, jitterY) {
+			this.jitterX = 0;
+			this.jitterY = 0;
+			this.jitterX = jitterX;
+			this.jitterY = jitterY;
+		}
+		JitterEffect.prototype.begin = function (skeleton) {
+		};
+		JitterEffect.prototype.transform = function (position, uv, light, dark) {
+			position.x += spine.MathUtils.randomTriangular(-this.jitterX, this.jitterY);
+			position.y += spine.MathUtils.randomTriangular(-this.jitterX, this.jitterY);
+		};
+		JitterEffect.prototype.end = function () {
+		};
+		return JitterEffect;
+	}());
+	spine.JitterEffect = JitterEffect;
+})(spine || (spine = {}));
+var spine;
+(function (spine) {
+	var SwirlEffect = (function () {
+		function SwirlEffect(radius) {
+			this.centerX = 0;
+			this.centerY = 0;
+			this.radius = 0;
+			this.angle = 0;
+			this.worldX = 0;
+			this.worldY = 0;
+			this.radius = radius;
+		}
+		SwirlEffect.prototype.begin = function (skeleton) {
+			this.worldX = skeleton.x + this.centerX;
+			this.worldY = skeleton.y + this.centerY;
+		};
+		SwirlEffect.prototype.transform = function (position, uv, light, dark) {
+			var radAngle = this.angle * spine.MathUtils.degreesToRadians;
+			var x = position.x - this.worldX;
+			var y = position.y - this.worldY;
+			var dist = Math.sqrt(x * x + y * y);
+			if (dist < this.radius) {
+				var theta = SwirlEffect.interpolation.apply(0, radAngle, (this.radius - dist) / this.radius);
+				var cos = Math.cos(theta);
+				var sin = Math.sin(theta);
+				position.x = cos * x - sin * y + this.worldX;
+				position.y = sin * x + cos * y + this.worldY;
+			}
+		};
+		SwirlEffect.prototype.end = function () {
+		};
+		return SwirlEffect;
+	}());
+	SwirlEffect.interpolation = new spine.PowOut(2);
+	spine.SwirlEffect = SwirlEffect;
+})(spine || (spine = {}));
 //# sourceMappingURL=spine-core.js.map

spine-ts/build/spine-threejs.d.ts

@@ -962,6 +962,21 @@ declare module spine {
 		static signum(value: number): number;
 		static toInt(x: number): number;
 		static cbrt(x: number): number;
+		static randomTriangular(min: number, max: number): number;
+		static randomTriangularWith(min: number, max: number, mode: number): number;
+	}
+	abstract class Interpolation {
+		protected abstract applyInternal(a: number): number;
+		apply(start: number, end: number, a: number): number;
+	}
+	class Pow extends Interpolation {
+		protected power: number;
+		constructor(power: number);
+		applyInternal(a: number): number;
+	}
+	class PowOut extends Pow {
+		constructor(power: number);
+		applyInternal(a: number): number;
 	}
 	class Utils {
 		static SUPPORTS_TYPED_ARRAYS: boolean;
@@ -1019,6 +1034,13 @@ declare module spine {
 		getMean(): number;
 	}
 }
+declare module spine {
+	interface VertexEffect {
+		begin(skeleton: Skeleton): void;
+		transform(position: Vector2, uv: Vector2, light: Color, dark: Color): void;
+		end(): void;
+	}
+}
 declare module spine {
 	abstract class Attachment {
 		name: string;
@@ -1169,6 +1191,31 @@ declare module spine {
 		computeWorldVertices(bone: Bone, worldVertices: ArrayLike<number>, offset: number, stride: number): void;
 	}
 }
+declare module spine {
+	class JitterEffect implements VertexEffect {
+		jitterX: number;
+		jitterY: number;
+		constructor(jitterX: number, jitterY: number);
+		begin(skeleton: Skeleton): void;
+		transform(position: Vector2, uv: Vector2, light: Color, dark: Color): void;
+		end(): void;
+	}
+}
+declare module spine {
+	class SwirlEffect implements VertexEffect {
+		static interpolation: PowOut;
+		centerX: number;
+		centerY: number;
+		radius: number;
+		angle: number;
+		private worldX;
+		private worldY;
+		constructor(radius: number);
+		begin(skeleton: Skeleton): void;
+		transform(position: Vector2, uv: Vector2, light: Color, dark: Color): void;
+		end(): void;
+	}
+}
 declare module spine.threejs {
 	class AssetManager extends spine.AssetManager {
 		constructor(pathPrefix?: string);

spine-ts/build/spine-threejs.js

@@ -5747,6 +5747,16 @@ var spine;
 			var y = Math.pow(Math.abs(x), 1 / 3);
 			return x < 0 ? -y : y;
 		};
+		MathUtils.randomTriangular = function (min, max) {
+			return MathUtils.randomTriangularWith(min, max, (min + max) * 0.5);
+		};
+		MathUtils.randomTriangularWith = function (min, max, mode) {
+			var u = Math.random();
+			var d = max - min;
+			if (u <= (mode - min) / d)
+				return min + Math.sqrt(u * d * (mode - min));
+			return max - Math.sqrt((1 - u) * d * (max - mode));
+		};
 		return MathUtils;
 	}());
 	MathUtils.PI = 3.1415927;
@@ -5756,6 +5766,42 @@ var spine;
 	MathUtils.degreesToRadians = MathUtils.PI / 180;
 	MathUtils.degRad = MathUtils.degreesToRadians;
 	spine.MathUtils = MathUtils;
+	var Interpolation = (function () {
+		function Interpolation() {
+		}
+		Interpolation.prototype.apply = function (start, end, a) {
+			return start + (end - start) * this.applyInternal(a);
+		};
+		return Interpolation;
+	}());
+	spine.Interpolation = Interpolation;
+	var Pow = (function (_super) {
+		__extends(Pow, _super);
+		function Pow(power) {
+			var _this = _super.call(this) || this;
+			_this.power = 2;
+			_this.power = power;
+			return _this;
+		}
+		Pow.prototype.applyInternal = function (a) {
+			if (a <= 0.5)
+				return Math.pow(a * 2, this.power) / 2;
+			return Math.pow((a - 1) * 2, this.power) / (this.power % 2 == 0 ? -2 : 2) + 1;
+		};
+		return Pow;
+	}(Interpolation));
+	spine.Pow = Pow;
+	var PowOut = (function (_super) {
+		__extends(PowOut, _super);
+		function PowOut(power) {
+			return _super.call(this, power) || this;
+		}
+		PowOut.prototype.applyInternal = function (a) {
+			return Math.pow(a - 1, this.power) * (this.power % 2 == 0 ? -1 : 1) + 1;
+		};
+		return PowOut;
+	}(Pow));
+	spine.PowOut = PowOut;
 	var Utils = (function () {
 		function Utils() {
 		}
@@ -6317,6 +6363,63 @@ var spine;
 	spine.RegionAttachment = RegionAttachment;
 })(spine || (spine = {}));
 var spine;
+(function (spine) {
+	var JitterEffect = (function () {
+		function JitterEffect(jitterX, jitterY) {
+			this.jitterX = 0;
+			this.jitterY = 0;
+			this.jitterX = jitterX;
+			this.jitterY = jitterY;
+		}
+		JitterEffect.prototype.begin = function (skeleton) {
+		};
+		JitterEffect.prototype.transform = function (position, uv, light, dark) {
+			position.x += spine.MathUtils.randomTriangular(-this.jitterX, this.jitterY);
+			position.y += spine.MathUtils.randomTriangular(-this.jitterX, this.jitterY);
+		};
+		JitterEffect.prototype.end = function () {
+		};
+		return JitterEffect;
+	}());
+	spine.JitterEffect = JitterEffect;
+})(spine || (spine = {}));
+var spine;
+(function (spine) {
+	var SwirlEffect = (function () {
+		function SwirlEffect(radius) {
+			this.centerX = 0;
+			this.centerY = 0;
+			this.radius = 0;
+			this.angle = 0;
+			this.worldX = 0;
+			this.worldY = 0;
+			this.radius = radius;
+		}
+		SwirlEffect.prototype.begin = function (skeleton) {
+			this.worldX = skeleton.x + this.centerX;
+			this.worldY = skeleton.y + this.centerY;
+		};
+		SwirlEffect.prototype.transform = function (position, uv, light, dark) {
+			var radAngle = this.angle * spine.MathUtils.degreesToRadians;
+			var x = position.x - this.worldX;
+			var y = position.y - this.worldY;
+			var dist = Math.sqrt(x * x + y * y);
+			if (dist < this.radius) {
+				var theta = SwirlEffect.interpolation.apply(0, radAngle, (this.radius - dist) / this.radius);
+				var cos = Math.cos(theta);
+				var sin = Math.sin(theta);
+				position.x = cos * x - sin * y + this.worldX;
+				position.y = sin * x + cos * y + this.worldY;
+			}
+		};
+		SwirlEffect.prototype.end = function () {
+		};
+		return SwirlEffect;
+	}());
+	SwirlEffect.interpolation = new spine.PowOut(2);
+	spine.SwirlEffect = SwirlEffect;
+})(spine || (spine = {}));
+var spine;
 (function (spine) {
 	var threejs;
 	(function (threejs) {

spine-ts/build/spine-widget.d.ts

@@ -962,6 +962,21 @@ declare module spine {
 		static signum(value: number): number;
 		static toInt(x: number): number;
 		static cbrt(x: number): number;
+		static randomTriangular(min: number, max: number): number;
+		static randomTriangularWith(min: number, max: number, mode: number): number;
+	}
+	abstract class Interpolation {
+		protected abstract applyInternal(a: number): number;
+		apply(start: number, end: number, a: number): number;
+	}
+	class Pow extends Interpolation {
+		protected power: number;
+		constructor(power: number);
+		applyInternal(a: number): number;
+	}
+	class PowOut extends Pow {
+		constructor(power: number);
+		applyInternal(a: number): number;
 	}
 	class Utils {
 		static SUPPORTS_TYPED_ARRAYS: boolean;
@@ -1019,6 +1034,13 @@ declare module spine {
 		getMean(): number;
 	}
 }
+declare module spine {
+	interface VertexEffect {
+		begin(skeleton: Skeleton): void;
+		transform(position: Vector2, uv: Vector2, light: Color, dark: Color): void;
+		end(): void;
+	}
+}
 declare module spine {
 	abstract class Attachment {
 		name: string;
@@ -1169,6 +1191,31 @@ declare module spine {
 		computeWorldVertices(bone: Bone, worldVertices: ArrayLike<number>, offset: number, stride: number): void;
 	}
 }
+declare module spine {
+	class JitterEffect implements VertexEffect {
+		jitterX: number;
+		jitterY: number;
+		constructor(jitterX: number, jitterY: number);
+		begin(skeleton: Skeleton): void;
+		transform(position: Vector2, uv: Vector2, light: Color, dark: Color): void;
+		end(): void;
+	}
+}
+declare module spine {
+	class SwirlEffect implements VertexEffect {
+		static interpolation: PowOut;
+		centerX: number;
+		centerY: number;
+		radius: number;
+		angle: number;
+		private worldX;
+		private worldY;
+		constructor(radius: number);
+		begin(skeleton: Skeleton): void;
+		transform(position: Vector2, uv: Vector2, light: Color, dark: Color): void;
+		end(): void;
+	}
+}
 declare module spine.webgl {
 	class AssetManager extends spine.AssetManager {
 		constructor(context: ManagedWebGLRenderingContext | WebGLRenderingContext, pathPrefix?: string);
@@ -1540,6 +1587,7 @@ declare module spine.webgl {
 	class SkeletonRenderer {
 		static QUAD_TRIANGLES: number[];
 		premultipliedAlpha: boolean;
+		vertexEffect: VertexEffect;
 		private tempColor;
 		private tempColor2;
 		private vertices;
@@ -1547,6 +1595,10 @@ declare module spine.webgl {
 		private twoColorTint;
 		private renderable;
 		private clipper;
+		private temp;
+		private temp2;
+		private temp3;
+		private temp4;
 		constructor(context: ManagedWebGLRenderingContext, twoColorTint?: boolean);
 		draw(batcher: PolygonBatcher, skeleton: Skeleton): void;
 	}

spine-ts/build/spine-widget.js

@@ -5747,6 +5747,16 @@ var spine;
 			var y = Math.pow(Math.abs(x), 1 / 3);
 			return x < 0 ? -y : y;
 		};
+		MathUtils.randomTriangular = function (min, max) {
+			return MathUtils.randomTriangularWith(min, max, (min + max) * 0.5);
+		};
+		MathUtils.randomTriangularWith = function (min, max, mode) {
+			var u = Math.random();
+			var d = max - min;
+			if (u <= (mode - min) / d)
+				return min + Math.sqrt(u * d * (mode - min));
+			return max - Math.sqrt((1 - u) * d * (max - mode));
+		};
 		return MathUtils;
 	}());
 	MathUtils.PI = 3.1415927;
@@ -5756,6 +5766,42 @@ var spine;
 	MathUtils.degreesToRadians = MathUtils.PI / 180;
 	MathUtils.degRad = MathUtils.degreesToRadians;
 	spine.MathUtils = MathUtils;
+	var Interpolation = (function () {
+		function Interpolation() {
+		}
+		Interpolation.prototype.apply = function (start, end, a) {
+			return start + (end - start) * this.applyInternal(a);
+		};
+		return Interpolation;
+	}());
+	spine.Interpolation = Interpolation;
+	var Pow = (function (_super) {
+		__extends(Pow, _super);
+		function Pow(power) {
+			var _this = _super.call(this) || this;
+			_this.power = 2;
+			_this.power = power;
+			return _this;
+		}
+		Pow.prototype.applyInternal = function (a) {
+			if (a <= 0.5)
+				return Math.pow(a * 2, this.power) / 2;
+			return Math.pow((a - 1) * 2, this.power) / (this.power % 2 == 0 ? -2 : 2) + 1;
+		};
+		return Pow;
+	}(Interpolation));
+	spine.Pow = Pow;
+	var PowOut = (function (_super) {
+		__extends(PowOut, _super);
+		function PowOut(power) {
+			return _super.call(this, power) || this;
+		}
+		PowOut.prototype.applyInternal = function (a) {
+			return Math.pow(a - 1, this.power) * (this.power % 2 == 0 ? -1 : 1) + 1;
+		};
+		return PowOut;
+	}(Pow));
+	spine.PowOut = PowOut;
 	var Utils = (function () {
 		function Utils() {
 		}
@@ -6317,6 +6363,63 @@ var spine;
 	spine.RegionAttachment = RegionAttachment;
 })(spine || (spine = {}));
 var spine;
+(function (spine) {
+	var JitterEffect = (function () {
+		function JitterEffect(jitterX, jitterY) {
+			this.jitterX = 0;
+			this.jitterY = 0;
+			this.jitterX = jitterX;
+			this.jitterY = jitterY;
+		}
+		JitterEffect.prototype.begin = function (skeleton) {
+		};
+		JitterEffect.prototype.transform = function (position, uv, light, dark) {
+			position.x += spine.MathUtils.randomTriangular(-this.jitterX, this.jitterY);
+			position.y += spine.MathUtils.randomTriangular(-this.jitterX, this.jitterY);
+		};
+		JitterEffect.prototype.end = function () {
+		};
+		return JitterEffect;
+	}());
+	spine.JitterEffect = JitterEffect;
+})(spine || (spine = {}));
+var spine;
+(function (spine) {
+	var SwirlEffect = (function () {
+		function SwirlEffect(radius) {
+			this.centerX = 0;
+			this.centerY = 0;
+			this.radius = 0;
+			this.angle = 0;
+			this.worldX = 0;
+			this.worldY = 0;
+			this.radius = radius;
+		}
+		SwirlEffect.prototype.begin = function (skeleton) {
+			this.worldX = skeleton.x + this.centerX;
+			this.worldY = skeleton.y + this.centerY;
+		};
+		SwirlEffect.prototype.transform = function (position, uv, light, dark) {
+			var radAngle = this.angle * spine.MathUtils.degreesToRadians;
+			var x = position.x - this.worldX;
+			var y = position.y - this.worldY;
+			var dist = Math.sqrt(x * x + y * y);
+			if (dist < this.radius) {
+				var theta = SwirlEffect.interpolation.apply(0, radAngle, (this.radius - dist) / this.radius);
+				var cos = Math.cos(theta);
+				var sin = Math.sin(theta);
+				position.x = cos * x - sin * y + this.worldX;
+				position.y = sin * x + cos * y + this.worldY;
+			}
+		};
+		SwirlEffect.prototype.end = function () {
+		};
+		return SwirlEffect;
+	}());
+	SwirlEffect.interpolation = new spine.PowOut(2);
+	spine.SwirlEffect = SwirlEffect;
+})(spine || (spine = {}));
+var spine;
 (function (spine) {
 	var webgl;
 	(function (webgl) {
@@ -8420,12 +8523,17 @@ var spine;
 			function SkeletonRenderer(context, twoColorTint) {
 				if (twoColorTint === void 0) { twoColorTint = true; }
 				this.premultipliedAlpha = false;
+				this.vertexEffect = null;
 				this.tempColor = new spine.Color();
 				this.tempColor2 = new spine.Color();
 				this.vertexSize = 2 + 2 + 4;
 				this.twoColorTint = false;
 				this.renderable = new Renderable(null, 0, 0);
 				this.clipper = new spine.SkeletonClipping();
+				this.temp = new spine.Vector2();
+				this.temp2 = new spine.Vector2();
+				this.temp3 = new spine.Color();
+				this.temp4 = new spine.Color();
 				this.twoColorTint = twoColorTint;
 				if (twoColorTint)
 					this.vertexSize += 4;
@@ -8436,6 +8544,10 @@ var spine;
 				var premultipliedAlpha = this.premultipliedAlpha;
 				var twoColorTint = this.twoColorTint;
 				var blendMode = null;
+				var tempPos = this.temp;
+				var tempUv = this.temp2;
+				var tempLight = this.temp3;
+				var tempDark = this.temp4;
 				var renderable = this.renderable;
 				var uvs = null;
 				var triangles = null;
@@ -8510,28 +8622,75 @@ var spine;
 						}
 						else {
 							var verts = renderable.vertices;
-							if (!twoColorTint) {
+							if (this.vertexEffect != null) {
-								for (var v = 2, u = 0, n_3 = renderable.numFloats; v < n_3; v += vertexSize, u += 2) {
+								var vertexEffect = this.vertexEffect;
-									verts[v] = finalColor.r;
+								if (!twoColorTint) {
-									verts[v + 1] = finalColor.g;
+									for (var v = 0, u = 0, n_3 = renderable.numFloats; v < n_3; v += vertexSize, u += 2) {
-									verts[v + 2] = finalColor.b;
+										tempPos.x = verts[v];
-									verts[v + 3] = finalColor.a;
+										tempPos.y = verts[v + 1];
-									verts[v + 4] = uvs[u];
+										tempUv.x = uvs[u];
-									verts[v + 5] = uvs[u + 1];
+										tempUv.y = uvs[u + 1];
+										tempLight.setFromColor(finalColor);
+										tempDark.set(0, 0, 0, 0);
+										vertexEffect.transform(tempPos, tempUv, tempLight, tempDark);
+										verts[v] = tempPos.x;
+										verts[v + 1] = tempPos.y;
+										verts[v + 2] = tempLight.r;
+										verts[v + 3] = tempLight.g;
+										verts[v + 4] = tempLight.b;
+										verts[v + 5] = tempLight.a;
+										verts[v + 6] = tempUv.x;
+										verts[v + 7] = tempUv.y;
+									}
+								}
+								else {
+									for (var v = 0, u = 0, n_4 = renderable.numFloats; v < n_4; v += vertexSize, u += 2) {
+										tempPos.x = verts[v];
+										tempPos.y = verts[v + 1];
+										tempUv.x = uvs[u];
+										tempUv.y = uvs[u + 1];
+										tempLight.setFromColor(finalColor);
+										tempDark.setFromColor(darkColor);
+										vertexEffect.transform(tempPos, tempUv, tempLight, tempDark);
+										verts[v] = tempPos.x;
+										verts[v + 1] = tempPos.y;
+										verts[v + 2] = tempLight.r;
+										verts[v + 3] = tempLight.g;
+										verts[v + 4] = tempLight.b;
+										verts[v + 5] = tempLight.a;
+										verts[v + 6] = tempUv.x;
+										verts[v + 7] = tempUv.y;
+										verts[v + 8] = tempDark.r;
+										verts[v + 9] = tempDark.g;
+										verts[v + 10] = tempDark.b;
+										verts[v + 11] = tempDark.a;
+									}
 								}
 							}
 							else {
-								for (var v = 2, u = 0, n_4 = renderable.numFloats; v < n_4; v += vertexSize, u += 2) {
+								if (!twoColorTint) {
-									verts[v] = finalColor.r;
+									for (var v = 2, u = 0, n_5 = renderable.numFloats; v < n_5; v += vertexSize, u += 2) {
-									verts[v + 1] = finalColor.g;
+										verts[v] = finalColor.r;
-									verts[v + 2] = finalColor.b;
+										verts[v + 1] = finalColor.g;
-									verts[v + 3] = finalColor.a;
+										verts[v + 2] = finalColor.b;
-									verts[v + 4] = uvs[u];
+										verts[v + 3] = finalColor.a;
-									verts[v + 5] = uvs[u + 1];
+										verts[v + 4] = uvs[u];
-									verts[v + 6] = darkColor.r;
+										verts[v + 5] = uvs[u + 1];
-									verts[v + 7] = darkColor.g;
+									}
-									verts[v + 8] = darkColor.b;
+								}
-									verts[v + 9] = darkColor.a;
+								else {
+									for (var v = 2, u = 0, n_6 = renderable.numFloats; v < n_6; v += vertexSize, u += 2) {
+										verts[v] = finalColor.r;
+										verts[v + 1] = finalColor.g;
+										verts[v + 2] = finalColor.b;
+										verts[v + 3] = finalColor.a;
+										verts[v + 4] = uvs[u];
+										verts[v + 5] = uvs[u + 1];
+										verts[v + 6] = darkColor.r;
+										verts[v + 7] = darkColor.g;
+										verts[v + 8] = darkColor.b;
+										verts[v + 9] = darkColor.a;
+									}
 								}
 							}
 							var view = renderable.vertices.subarray(0, renderable.numFloats);

spine-ts/core/src/Utils.ts

@@ -171,6 +171,37 @@ module spine {
 		}
 	}
 
+	export abstract class Interpolation {
+		protected abstract applyInternal (a: number): number;
+		apply(start: number, end: number, a: number): number {
+			return start + (end - start) * this.applyInternal(a);
+		}
+	}
+
+	export class Pow extends Interpolation {
+		protected power = 2;
+
+		constructor (power: number) {
+			super();
+			this.power = power;
+		}
+
+		applyInternal (a: number): number {
+			if (a <= 0.5) return Math.pow(a * 2, this.power) / 2;
+			return Math.pow((a - 1) * 2, this.power) / (this.power % 2 == 0 ? -2 : 2) + 1;
+		}
+	}
+
+	export class PowOut extends Pow {
+		constructor (power: number) {
+			super(power);
+		}
+
+		applyInternal (a: number) : number {
+			return Math.pow(a - 1, this.power) * (this.power % 2 == 0 ? -1 : 1) + 1;
+		}
+	}
+
 	export class Utils {
 		static SUPPORTS_TYPED_ARRAYS = typeof(Float32Array) !== "undefined";
 

spine-ts/core/src/vertexeffects/SwirlEffect.ts

@@ -30,7 +30,7 @@
 
 module spine {
 	export class SwirlEffect implements VertexEffect {
-
+		static interpolation = new PowOut(2);
 		centerX = 0;
 		centerY = 0;
 		radius = 0;
@@ -53,7 +53,7 @@ module spine {
 			let y = position.y - this.worldY;
 			let dist = Math.sqrt(x * x + y * y);
 			if (dist < this.radius) {
-				let theta = radAngle * (Math.pow(((this.radius - dist) / this.radius) - 1, 2) * (2 % 2 == 0 ? -1 : 1) + 1);
+				let theta = SwirlEffect.interpolation.apply(0, radAngle, (this.radius - dist) / this.radius);
 				let cos = Math.cos(theta);
 				let sin = Math.sin(theta);
 				position.x = cos * x - sin * y + this.worldX;

spine-ts/webgl/example/test.html

@@ -12,7 +12,7 @@
 </body>
 <script>
 
-var FILE = "raptor";
+var FILE = "raptor-pro";
 var ANIMATION = "walk";
 var NUM_SKELETONS = 1;
 var SCALE = 0.5;
@@ -23,6 +23,9 @@ var timeKeeper;
 var label = document.getElementById("label");
 var updateMean = new spine.WindowedMean();
 var renderMean = new spine.WindowedMean();
+var swirlEffect = new spine.SwirlEffect();
+var swirlTime = 0;
+var interpolation = new spine.Pow(2);
 
 function init() {
 	canvas = document.getElementById("canvas");
@@ -36,13 +39,18 @@ function init() {
 	renderer.skeletonDebugRenderer.drawMeshHull = false;
 	renderer.skeletonDebugRenderer.drawRegionAttachments = false;
 	renderer.skeletonDebugRenderer.drawBoundingBoxes = false;
+	renderer.skeletonRenderer.vertexEffect = swirlEffect;
+
+	swirlEffect.centerX = 0;
+	swirlEffect.centerY = 200;
+	swirlEffect.radius = 500;
 
 	assetManager = new spine.webgl.AssetManager(context, "assets/");
 	var textureLoader = function(img) { return new spine.webgl.GLTexture(gl, img); };
 	input = new spine.webgl.Input(canvas);
 
-	assetManager.loadTexture(FILE + ".png");
+	assetManager.loadTexture(FILE.replace("-pro", "").replace("-oss", "") + ".png");
-	assetManager.loadText(FILE + ".atlas");
+	assetManager.loadText(FILE.replace("-pro", "").replace("-oss", "") + ".atlas");
 	assetManager.loadText(FILE + ".json");
 
 	timeKeeper = new spine.TimeKeeper();
@@ -52,7 +60,7 @@ function init() {
 function load() {
 	timeKeeper.update();
 	if (assetManager.isLoadingComplete()) {
-		var atlas = new spine.TextureAtlas(assetManager.get(FILE + ".atlas"), function(path) {
+		var atlas = new spine.TextureAtlas(assetManager.get(FILE.replace("-pro", "").replace("-oss", "") + ".atlas"), function(path) {
 			return assetManager.get(path);
 		});
 		var atlasLoader = new spine.AtlasAttachmentLoader(atlas);
@@ -89,6 +97,11 @@ function render() {
 	var delta = timeKeeper.delta;
 	delta = 0.016;
 
+	swirlTime += delta;
+	var percent = swirlTime % 2;
+	if (percent > 1) percent = 1 - (percent - 1);
+	swirlEffect.angle = interpolation.apply(-60, 60, percent);
+
 	for (var i = 0; i < skeletons.length; i++) {
 		var state = skeletons[i].state;
 		var skeleton = skeletons[i].skeleton;