[ts] Ported Animation State changes, see #908

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

@@ -231,6 +231,7 @@ declare module spine {
 		static SUBSEQUENT: number;
 		static FIRST: number;
 		static DIP: number;
+		static DIP_MIX: number;
 		data: AnimationStateData;
 		tracks: TrackEntry[];
 		events: Event[];
@@ -243,7 +244,7 @@ declare module spine {
 		trackEntryPool: Pool<TrackEntry>;
 		constructor(data: AnimationStateData);
 		update(delta: number): void;
-		updateMixingFrom(entry: TrackEntry, delta: number, animationCount: number): boolean;
+		updateMixingFrom(to: TrackEntry, delta: number): boolean;
 		apply(skeleton: Skeleton): void;
 		applyMixingFrom(to: TrackEntry, skeleton: Skeleton): number;
 		applyRotateTimeline(timeline: Timeline, skeleton: Skeleton, time: number, alpha: number, setupPose: boolean, timelinesRotation: Array<number>, i: number, firstFrame: boolean): void;
@@ -292,6 +293,7 @@ declare module spine {
 		mixTime: number;
 		mixDuration: number;
 		interruptAlpha: number;
+		totalAlpha: number;
 		timelineData: number[];
 		timelineDipMix: TrackEntry[];
 		timelinesRotation: number[];

spine-ts/build/spine-all.js

@@ -1100,7 +1100,7 @@ var spine;
 					this.disposeNext(current);
 					continue;
 				}
-				if (current.mixingFrom != null && this.updateMixingFrom(current, delta, 2)) {
+				if (current.mixingFrom != null && this.updateMixingFrom(current, delta)) {
 					var from = current.mixingFrom;
 					current.mixingFrom = null;
 					while (from != null) {
@@ -1112,25 +1112,23 @@ var spine;
 			}
 			this.queue.drain();
 		};
-		AnimationState.prototype.updateMixingFrom = function (entry, delta, animationCount) {
+		AnimationState.prototype.updateMixingFrom = function (to, delta) {
-			var from = entry.mixingFrom;
+			var from = to.mixingFrom;
 			if (from == null)
 				return true;
-			var finished = this.updateMixingFrom(from, delta, animationCount + 1);
+			var finished = this.updateMixingFrom(from, delta);
-			if (entry.mixTime > 0 && (entry.mixTime >= entry.mixDuration || entry.timeScale == 0)) {
+			if (to.mixTime > 0 && (to.mixTime >= to.mixDuration || to.timeScale == 0)) {
-				if (animationCount > 5 && from.mixingFrom == null) {
+				if (from.totalAlpha == 0) {
-					entry.interruptAlpha = Math.max(0, entry.interruptAlpha - delta * 0.66);
+					to.mixingFrom = from.mixingFrom;
-					if (entry.interruptAlpha <= 0) {
+					to.interruptAlpha = from.interruptAlpha;
-						entry.mixingFrom = null;
 					this.queue.end(from);
 				}
-				}
 				return finished;
 			}
 			from.animationLast = from.nextAnimationLast;
 			from.trackLast = from.nextTrackLast;
 			from.trackTime += delta * from.timeScale;
-			entry.mixTime += delta * entry.timeScale;
+			to.mixTime += delta * to.timeScale;
 			return false;
 		};
 		AnimationState.prototype.apply = function (skeleton) {
@@ -1165,10 +1163,10 @@ var spine;
 					for (var ii = 0; ii < timelineCount; ii++) {
 						var timeline = timelines[ii];
 						if (timeline instanceof spine.RotateTimeline) {
-							this.applyRotateTimeline(timeline, skeleton, animationTime, mix, timelineData[ii] > 0, timelinesRotation, ii << 1, firstFrame);
+							this.applyRotateTimeline(timeline, skeleton, animationTime, mix, timelineData[ii] >= AnimationState.FIRST, timelinesRotation, ii << 1, firstFrame);
 						}
 						else
-							timeline.apply(skeleton, animationLast, animationTime, events, mix, timelineData[ii] > 0, false);
+							timeline.apply(skeleton, animationLast, animationTime, events, mix, timelineData[ii] >= AnimationState.FIRST, false);
 					}
 				}
 				this.queueEvents(current, animationTime);
@@ -1203,6 +1201,7 @@ var spine;
 			var timelinesRotation = from.timelinesRotation;
 			var first = false;
 			var alphaDip = from.alpha * to.interruptAlpha, alphaMix = alphaDip * (1 - mix), alpha;
+			from.totalAlpha = 0;
 			for (var i = 0; i < timelineCount; i++) {
 				var timeline = timelines[i];
 				switch (timelineData[i]) {
@@ -1214,14 +1213,18 @@ var spine;
 						first = true;
 						alpha = alphaMix;
 						break;
+					case AnimationState.DIP:
+						first = true;
+						alpha = alphaDip;
+						break;
 					default:
 						first = true;
 						alpha = alphaDip;
 						var dipMix = timelineDipMix[i];
-						if (dipMix != null)
 						alpha *= Math.max(0, 1 - dipMix.mixTime / dipMix.mixDuration);
 						break;
 				}
+				from.totalAlpha += alpha;
 				if (timeline instanceof spine.RotateTimeline)
 					this.applyRotateTimeline(timeline, skeleton, animationTime, alpha, first, timelinesRotation, i << 1, firstFrame);
 				else {
@@ -1533,6 +1536,7 @@ var spine;
 	AnimationState.SUBSEQUENT = 0;
 	AnimationState.FIRST = 1;
 	AnimationState.DIP = 2;
+	AnimationState.DIP_MIX = 3;
 	spine.AnimationState = AnimationState;
 	var TrackEntry = (function () {
 		function TrackEntry() {
@@ -1560,6 +1564,7 @@ var spine;
 			var timelines = this.animation.timelines;
 			var timelinesCount = this.animation.timelines.length;
 			var timelineData = spine.Utils.setArraySize(this.timelineData, timelinesCount);
+			this.timelineDipMix.length = 0;
 			var timelineDipMix = spine.Utils.setArraySize(this.timelineDipMix, timelinesCount);
 			outer: for (var i = 0; i < timelinesCount; i++) {
 				var id = timelines[i].getPropertyId();
@@ -1568,16 +1573,17 @@ var spine;
 				else if (to == null || !to.hasTimeline(id))
 					timelineData[i] = AnimationState.FIRST;
 				else {
-					timelineData[i] = AnimationState.DIP;
 					for (var ii = mixingToLast; ii >= 0; ii--) {
 						var entry = mixingTo[ii];
 						if (!entry.hasTimeline(id)) {
-							if (entry.mixDuration > 0)
+							if (entry.mixDuration > 0) {
+								timelineData[i] = AnimationState.DIP_MIX;
 								timelineDipMix[i] = entry;
 								continue outer;
 							}
 						}
-					timelineDipMix[i] = null;
+					}
+					timelineData[i] = AnimationState.DIP;
 				}
 			}
 			return lastEntry;

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

@@ -231,6 +231,7 @@ declare module spine {
 		static SUBSEQUENT: number;
 		static FIRST: number;
 		static DIP: number;
+		static DIP_MIX: number;
 		data: AnimationStateData;
 		tracks: TrackEntry[];
 		events: Event[];
@@ -243,7 +244,7 @@ declare module spine {
 		trackEntryPool: Pool<TrackEntry>;
 		constructor(data: AnimationStateData);
 		update(delta: number): void;
-		updateMixingFrom(entry: TrackEntry, delta: number, animationCount: number): boolean;
+		updateMixingFrom(to: TrackEntry, delta: number): boolean;
 		apply(skeleton: Skeleton): void;
 		applyMixingFrom(to: TrackEntry, skeleton: Skeleton): number;
 		applyRotateTimeline(timeline: Timeline, skeleton: Skeleton, time: number, alpha: number, setupPose: boolean, timelinesRotation: Array<number>, i: number, firstFrame: boolean): void;
@@ -292,6 +293,7 @@ declare module spine {
 		mixTime: number;
 		mixDuration: number;
 		interruptAlpha: number;
+		totalAlpha: number;
 		timelineData: number[];
 		timelineDipMix: TrackEntry[];
 		timelinesRotation: number[];

spine-ts/build/spine-canvas.js

@@ -1100,7 +1100,7 @@ var spine;
 					this.disposeNext(current);
 					continue;
 				}
-				if (current.mixingFrom != null && this.updateMixingFrom(current, delta, 2)) {
+				if (current.mixingFrom != null && this.updateMixingFrom(current, delta)) {
 					var from = current.mixingFrom;
 					current.mixingFrom = null;
 					while (from != null) {
@@ -1112,25 +1112,23 @@ var spine;
 			}
 			this.queue.drain();
 		};
-		AnimationState.prototype.updateMixingFrom = function (entry, delta, animationCount) {
+		AnimationState.prototype.updateMixingFrom = function (to, delta) {
-			var from = entry.mixingFrom;
+			var from = to.mixingFrom;
 			if (from == null)
 				return true;
-			var finished = this.updateMixingFrom(from, delta, animationCount + 1);
+			var finished = this.updateMixingFrom(from, delta);
-			if (entry.mixTime > 0 && (entry.mixTime >= entry.mixDuration || entry.timeScale == 0)) {
+			if (to.mixTime > 0 && (to.mixTime >= to.mixDuration || to.timeScale == 0)) {
-				if (animationCount > 5 && from.mixingFrom == null) {
+				if (from.totalAlpha == 0) {
-					entry.interruptAlpha = Math.max(0, entry.interruptAlpha - delta * 0.66);
+					to.mixingFrom = from.mixingFrom;
-					if (entry.interruptAlpha <= 0) {
+					to.interruptAlpha = from.interruptAlpha;
-						entry.mixingFrom = null;
 					this.queue.end(from);
 				}
-				}
 				return finished;
 			}
 			from.animationLast = from.nextAnimationLast;
 			from.trackLast = from.nextTrackLast;
 			from.trackTime += delta * from.timeScale;
-			entry.mixTime += delta * entry.timeScale;
+			to.mixTime += delta * to.timeScale;
 			return false;
 		};
 		AnimationState.prototype.apply = function (skeleton) {
@@ -1165,10 +1163,10 @@ var spine;
 					for (var ii = 0; ii < timelineCount; ii++) {
 						var timeline = timelines[ii];
 						if (timeline instanceof spine.RotateTimeline) {
-							this.applyRotateTimeline(timeline, skeleton, animationTime, mix, timelineData[ii] > 0, timelinesRotation, ii << 1, firstFrame);
+							this.applyRotateTimeline(timeline, skeleton, animationTime, mix, timelineData[ii] >= AnimationState.FIRST, timelinesRotation, ii << 1, firstFrame);
 						}
 						else
-							timeline.apply(skeleton, animationLast, animationTime, events, mix, timelineData[ii] > 0, false);
+							timeline.apply(skeleton, animationLast, animationTime, events, mix, timelineData[ii] >= AnimationState.FIRST, false);
 					}
 				}
 				this.queueEvents(current, animationTime);
@@ -1203,6 +1201,7 @@ var spine;
 			var timelinesRotation = from.timelinesRotation;
 			var first = false;
 			var alphaDip = from.alpha * to.interruptAlpha, alphaMix = alphaDip * (1 - mix), alpha;
+			from.totalAlpha = 0;
 			for (var i = 0; i < timelineCount; i++) {
 				var timeline = timelines[i];
 				switch (timelineData[i]) {
@@ -1214,14 +1213,18 @@ var spine;
 						first = true;
 						alpha = alphaMix;
 						break;
+					case AnimationState.DIP:
+						first = true;
+						alpha = alphaDip;
+						break;
 					default:
 						first = true;
 						alpha = alphaDip;
 						var dipMix = timelineDipMix[i];
-						if (dipMix != null)
 						alpha *= Math.max(0, 1 - dipMix.mixTime / dipMix.mixDuration);
 						break;
 				}
+				from.totalAlpha += alpha;
 				if (timeline instanceof spine.RotateTimeline)
 					this.applyRotateTimeline(timeline, skeleton, animationTime, alpha, first, timelinesRotation, i << 1, firstFrame);
 				else {
@@ -1533,6 +1536,7 @@ var spine;
 	AnimationState.SUBSEQUENT = 0;
 	AnimationState.FIRST = 1;
 	AnimationState.DIP = 2;
+	AnimationState.DIP_MIX = 3;
 	spine.AnimationState = AnimationState;
 	var TrackEntry = (function () {
 		function TrackEntry() {
@@ -1560,6 +1564,7 @@ var spine;
 			var timelines = this.animation.timelines;
 			var timelinesCount = this.animation.timelines.length;
 			var timelineData = spine.Utils.setArraySize(this.timelineData, timelinesCount);
+			this.timelineDipMix.length = 0;
 			var timelineDipMix = spine.Utils.setArraySize(this.timelineDipMix, timelinesCount);
 			outer: for (var i = 0; i < timelinesCount; i++) {
 				var id = timelines[i].getPropertyId();
@@ -1568,16 +1573,17 @@ var spine;
 				else if (to == null || !to.hasTimeline(id))
 					timelineData[i] = AnimationState.FIRST;
 				else {
-					timelineData[i] = AnimationState.DIP;
 					for (var ii = mixingToLast; ii >= 0; ii--) {
 						var entry = mixingTo[ii];
 						if (!entry.hasTimeline(id)) {
-							if (entry.mixDuration > 0)
+							if (entry.mixDuration > 0) {
+								timelineData[i] = AnimationState.DIP_MIX;
 								timelineDipMix[i] = entry;
 								continue outer;
 							}
 						}
-					timelineDipMix[i] = null;
+					}
+					timelineData[i] = AnimationState.DIP;
 				}
 			}
 			return lastEntry;

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

@@ -231,6 +231,7 @@ declare module spine {
 		static SUBSEQUENT: number;
 		static FIRST: number;
 		static DIP: number;
+		static DIP_MIX: number;
 		data: AnimationStateData;
 		tracks: TrackEntry[];
 		events: Event[];
@@ -243,7 +244,7 @@ declare module spine {
 		trackEntryPool: Pool<TrackEntry>;
 		constructor(data: AnimationStateData);
 		update(delta: number): void;
-		updateMixingFrom(entry: TrackEntry, delta: number, animationCount: number): boolean;
+		updateMixingFrom(to: TrackEntry, delta: number): boolean;
 		apply(skeleton: Skeleton): void;
 		applyMixingFrom(to: TrackEntry, skeleton: Skeleton): number;
 		applyRotateTimeline(timeline: Timeline, skeleton: Skeleton, time: number, alpha: number, setupPose: boolean, timelinesRotation: Array<number>, i: number, firstFrame: boolean): void;
@@ -292,6 +293,7 @@ declare module spine {
 		mixTime: number;
 		mixDuration: number;
 		interruptAlpha: number;
+		totalAlpha: number;
 		timelineData: number[];
 		timelineDipMix: TrackEntry[];
 		timelinesRotation: number[];

spine-ts/build/spine-core.js

@@ -1100,7 +1100,7 @@ var spine;
 					this.disposeNext(current);
 					continue;
 				}
-				if (current.mixingFrom != null && this.updateMixingFrom(current, delta, 2)) {
+				if (current.mixingFrom != null && this.updateMixingFrom(current, delta)) {
 					var from = current.mixingFrom;
 					current.mixingFrom = null;
 					while (from != null) {
@@ -1112,25 +1112,23 @@ var spine;
 			}
 			this.queue.drain();
 		};
-		AnimationState.prototype.updateMixingFrom = function (entry, delta, animationCount) {
+		AnimationState.prototype.updateMixingFrom = function (to, delta) {
-			var from = entry.mixingFrom;
+			var from = to.mixingFrom;
 			if (from == null)
 				return true;
-			var finished = this.updateMixingFrom(from, delta, animationCount + 1);
+			var finished = this.updateMixingFrom(from, delta);
-			if (entry.mixTime > 0 && (entry.mixTime >= entry.mixDuration || entry.timeScale == 0)) {
+			if (to.mixTime > 0 && (to.mixTime >= to.mixDuration || to.timeScale == 0)) {
-				if (animationCount > 5 && from.mixingFrom == null) {
+				if (from.totalAlpha == 0) {
-					entry.interruptAlpha = Math.max(0, entry.interruptAlpha - delta * 0.66);
+					to.mixingFrom = from.mixingFrom;
-					if (entry.interruptAlpha <= 0) {
+					to.interruptAlpha = from.interruptAlpha;
-						entry.mixingFrom = null;
 					this.queue.end(from);
 				}
-				}
 				return finished;
 			}
 			from.animationLast = from.nextAnimationLast;
 			from.trackLast = from.nextTrackLast;
 			from.trackTime += delta * from.timeScale;
-			entry.mixTime += delta * entry.timeScale;
+			to.mixTime += delta * to.timeScale;
 			return false;
 		};
 		AnimationState.prototype.apply = function (skeleton) {
@@ -1165,10 +1163,10 @@ var spine;
 					for (var ii = 0; ii < timelineCount; ii++) {
 						var timeline = timelines[ii];
 						if (timeline instanceof spine.RotateTimeline) {
-							this.applyRotateTimeline(timeline, skeleton, animationTime, mix, timelineData[ii] > 0, timelinesRotation, ii << 1, firstFrame);
+							this.applyRotateTimeline(timeline, skeleton, animationTime, mix, timelineData[ii] >= AnimationState.FIRST, timelinesRotation, ii << 1, firstFrame);
 						}
 						else
-							timeline.apply(skeleton, animationLast, animationTime, events, mix, timelineData[ii] > 0, false);
+							timeline.apply(skeleton, animationLast, animationTime, events, mix, timelineData[ii] >= AnimationState.FIRST, false);
 					}
 				}
 				this.queueEvents(current, animationTime);
@@ -1203,6 +1201,7 @@ var spine;
 			var timelinesRotation = from.timelinesRotation;
 			var first = false;
 			var alphaDip = from.alpha * to.interruptAlpha, alphaMix = alphaDip * (1 - mix), alpha;
+			from.totalAlpha = 0;
 			for (var i = 0; i < timelineCount; i++) {
 				var timeline = timelines[i];
 				switch (timelineData[i]) {
@@ -1214,14 +1213,18 @@ var spine;
 						first = true;
 						alpha = alphaMix;
 						break;
+					case AnimationState.DIP:
+						first = true;
+						alpha = alphaDip;
+						break;
 					default:
 						first = true;
 						alpha = alphaDip;
 						var dipMix = timelineDipMix[i];
-						if (dipMix != null)
 						alpha *= Math.max(0, 1 - dipMix.mixTime / dipMix.mixDuration);
 						break;
 				}
+				from.totalAlpha += alpha;
 				if (timeline instanceof spine.RotateTimeline)
 					this.applyRotateTimeline(timeline, skeleton, animationTime, alpha, first, timelinesRotation, i << 1, firstFrame);
 				else {
@@ -1533,6 +1536,7 @@ var spine;
 	AnimationState.SUBSEQUENT = 0;
 	AnimationState.FIRST = 1;
 	AnimationState.DIP = 2;
+	AnimationState.DIP_MIX = 3;
 	spine.AnimationState = AnimationState;
 	var TrackEntry = (function () {
 		function TrackEntry() {
@@ -1560,6 +1564,7 @@ var spine;
 			var timelines = this.animation.timelines;
 			var timelinesCount = this.animation.timelines.length;
 			var timelineData = spine.Utils.setArraySize(this.timelineData, timelinesCount);
+			this.timelineDipMix.length = 0;
 			var timelineDipMix = spine.Utils.setArraySize(this.timelineDipMix, timelinesCount);
 			outer: for (var i = 0; i < timelinesCount; i++) {
 				var id = timelines[i].getPropertyId();
@@ -1568,16 +1573,17 @@ var spine;
 				else if (to == null || !to.hasTimeline(id))
 					timelineData[i] = AnimationState.FIRST;
 				else {
-					timelineData[i] = AnimationState.DIP;
 					for (var ii = mixingToLast; ii >= 0; ii--) {
 						var entry = mixingTo[ii];
 						if (!entry.hasTimeline(id)) {
-							if (entry.mixDuration > 0)
+							if (entry.mixDuration > 0) {
+								timelineData[i] = AnimationState.DIP_MIX;
 								timelineDipMix[i] = entry;
 								continue outer;
 							}
 						}
-					timelineDipMix[i] = null;
+					}
+					timelineData[i] = AnimationState.DIP;
 				}
 			}
 			return lastEntry;

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

@@ -231,6 +231,7 @@ declare module spine {
 		static SUBSEQUENT: number;
 		static FIRST: number;
 		static DIP: number;
+		static DIP_MIX: number;
 		data: AnimationStateData;
 		tracks: TrackEntry[];
 		events: Event[];
@@ -243,7 +244,7 @@ declare module spine {
 		trackEntryPool: Pool<TrackEntry>;
 		constructor(data: AnimationStateData);
 		update(delta: number): void;
-		updateMixingFrom(entry: TrackEntry, delta: number, animationCount: number): boolean;
+		updateMixingFrom(to: TrackEntry, delta: number): boolean;
 		apply(skeleton: Skeleton): void;
 		applyMixingFrom(to: TrackEntry, skeleton: Skeleton): number;
 		applyRotateTimeline(timeline: Timeline, skeleton: Skeleton, time: number, alpha: number, setupPose: boolean, timelinesRotation: Array<number>, i: number, firstFrame: boolean): void;
@@ -292,6 +293,7 @@ declare module spine {
 		mixTime: number;
 		mixDuration: number;
 		interruptAlpha: number;
+		totalAlpha: number;
 		timelineData: number[];
 		timelineDipMix: TrackEntry[];
 		timelinesRotation: number[];

spine-ts/build/spine-threejs.js

@@ -1100,7 +1100,7 @@ var spine;
 					this.disposeNext(current);
 					continue;
 				}
-				if (current.mixingFrom != null && this.updateMixingFrom(current, delta, 2)) {
+				if (current.mixingFrom != null && this.updateMixingFrom(current, delta)) {
 					var from = current.mixingFrom;
 					current.mixingFrom = null;
 					while (from != null) {
@@ -1112,25 +1112,23 @@ var spine;
 			}
 			this.queue.drain();
 		};
-		AnimationState.prototype.updateMixingFrom = function (entry, delta, animationCount) {
+		AnimationState.prototype.updateMixingFrom = function (to, delta) {
-			var from = entry.mixingFrom;
+			var from = to.mixingFrom;
 			if (from == null)
 				return true;
-			var finished = this.updateMixingFrom(from, delta, animationCount + 1);
+			var finished = this.updateMixingFrom(from, delta);
-			if (entry.mixTime > 0 && (entry.mixTime >= entry.mixDuration || entry.timeScale == 0)) {
+			if (to.mixTime > 0 && (to.mixTime >= to.mixDuration || to.timeScale == 0)) {
-				if (animationCount > 5 && from.mixingFrom == null) {
+				if (from.totalAlpha == 0) {
-					entry.interruptAlpha = Math.max(0, entry.interruptAlpha - delta * 0.66);
+					to.mixingFrom = from.mixingFrom;
-					if (entry.interruptAlpha <= 0) {
+					to.interruptAlpha = from.interruptAlpha;
-						entry.mixingFrom = null;
 					this.queue.end(from);
 				}
-				}
 				return finished;
 			}
 			from.animationLast = from.nextAnimationLast;
 			from.trackLast = from.nextTrackLast;
 			from.trackTime += delta * from.timeScale;
-			entry.mixTime += delta * entry.timeScale;
+			to.mixTime += delta * to.timeScale;
 			return false;
 		};
 		AnimationState.prototype.apply = function (skeleton) {
@@ -1165,10 +1163,10 @@ var spine;
 					for (var ii = 0; ii < timelineCount; ii++) {
 						var timeline = timelines[ii];
 						if (timeline instanceof spine.RotateTimeline) {
-							this.applyRotateTimeline(timeline, skeleton, animationTime, mix, timelineData[ii] > 0, timelinesRotation, ii << 1, firstFrame);
+							this.applyRotateTimeline(timeline, skeleton, animationTime, mix, timelineData[ii] >= AnimationState.FIRST, timelinesRotation, ii << 1, firstFrame);
 						}
 						else
-							timeline.apply(skeleton, animationLast, animationTime, events, mix, timelineData[ii] > 0, false);
+							timeline.apply(skeleton, animationLast, animationTime, events, mix, timelineData[ii] >= AnimationState.FIRST, false);
 					}
 				}
 				this.queueEvents(current, animationTime);
@@ -1203,6 +1201,7 @@ var spine;
 			var timelinesRotation = from.timelinesRotation;
 			var first = false;
 			var alphaDip = from.alpha * to.interruptAlpha, alphaMix = alphaDip * (1 - mix), alpha;
+			from.totalAlpha = 0;
 			for (var i = 0; i < timelineCount; i++) {
 				var timeline = timelines[i];
 				switch (timelineData[i]) {
@@ -1214,14 +1213,18 @@ var spine;
 						first = true;
 						alpha = alphaMix;
 						break;
+					case AnimationState.DIP:
+						first = true;
+						alpha = alphaDip;
+						break;
 					default:
 						first = true;
 						alpha = alphaDip;
 						var dipMix = timelineDipMix[i];
-						if (dipMix != null)
 						alpha *= Math.max(0, 1 - dipMix.mixTime / dipMix.mixDuration);
 						break;
 				}
+				from.totalAlpha += alpha;
 				if (timeline instanceof spine.RotateTimeline)
 					this.applyRotateTimeline(timeline, skeleton, animationTime, alpha, first, timelinesRotation, i << 1, firstFrame);
 				else {
@@ -1533,6 +1536,7 @@ var spine;
 	AnimationState.SUBSEQUENT = 0;
 	AnimationState.FIRST = 1;
 	AnimationState.DIP = 2;
+	AnimationState.DIP_MIX = 3;
 	spine.AnimationState = AnimationState;
 	var TrackEntry = (function () {
 		function TrackEntry() {
@@ -1560,6 +1564,7 @@ var spine;
 			var timelines = this.animation.timelines;
 			var timelinesCount = this.animation.timelines.length;
 			var timelineData = spine.Utils.setArraySize(this.timelineData, timelinesCount);
+			this.timelineDipMix.length = 0;
 			var timelineDipMix = spine.Utils.setArraySize(this.timelineDipMix, timelinesCount);
 			outer: for (var i = 0; i < timelinesCount; i++) {
 				var id = timelines[i].getPropertyId();
@@ -1568,16 +1573,17 @@ var spine;
 				else if (to == null || !to.hasTimeline(id))
 					timelineData[i] = AnimationState.FIRST;
 				else {
-					timelineData[i] = AnimationState.DIP;
 					for (var ii = mixingToLast; ii >= 0; ii--) {
 						var entry = mixingTo[ii];
 						if (!entry.hasTimeline(id)) {
-							if (entry.mixDuration > 0)
+							if (entry.mixDuration > 0) {
+								timelineData[i] = AnimationState.DIP_MIX;
 								timelineDipMix[i] = entry;
 								continue outer;
 							}
 						}
-					timelineDipMix[i] = null;
+					}
+					timelineData[i] = AnimationState.DIP;
 				}
 			}
 			return lastEntry;

spine-ts/build/spine-webgl.d.ts

@@ -231,6 +231,7 @@ declare module spine {
 		static SUBSEQUENT: number;
 		static FIRST: number;
 		static DIP: number;
+		static DIP_MIX: number;
 		data: AnimationStateData;
 		tracks: TrackEntry[];
 		events: Event[];
@@ -243,7 +244,7 @@ declare module spine {
 		trackEntryPool: Pool<TrackEntry>;
 		constructor(data: AnimationStateData);
 		update(delta: number): void;
-		updateMixingFrom(entry: TrackEntry, delta: number, animationCount: number): boolean;
+		updateMixingFrom(to: TrackEntry, delta: number): boolean;
 		apply(skeleton: Skeleton): void;
 		applyMixingFrom(to: TrackEntry, skeleton: Skeleton): number;
 		applyRotateTimeline(timeline: Timeline, skeleton: Skeleton, time: number, alpha: number, setupPose: boolean, timelinesRotation: Array<number>, i: number, firstFrame: boolean): void;
@@ -292,6 +293,7 @@ declare module spine {
 		mixTime: number;
 		mixDuration: number;
 		interruptAlpha: number;
+		totalAlpha: number;
 		timelineData: number[];
 		timelineDipMix: TrackEntry[];
 		timelinesRotation: number[];

spine-ts/build/spine-webgl.js

@@ -1100,7 +1100,7 @@ var spine;
 					this.disposeNext(current);
 					continue;
 				}
-				if (current.mixingFrom != null && this.updateMixingFrom(current, delta, 2)) {
+				if (current.mixingFrom != null && this.updateMixingFrom(current, delta)) {
 					var from = current.mixingFrom;
 					current.mixingFrom = null;
 					while (from != null) {
@@ -1112,25 +1112,23 @@ var spine;
 			}
 			this.queue.drain();
 		};
-		AnimationState.prototype.updateMixingFrom = function (entry, delta, animationCount) {
+		AnimationState.prototype.updateMixingFrom = function (to, delta) {
-			var from = entry.mixingFrom;
+			var from = to.mixingFrom;
 			if (from == null)
 				return true;
-			var finished = this.updateMixingFrom(from, delta, animationCount + 1);
+			var finished = this.updateMixingFrom(from, delta);
-			if (entry.mixTime > 0 && (entry.mixTime >= entry.mixDuration || entry.timeScale == 0)) {
+			if (to.mixTime > 0 && (to.mixTime >= to.mixDuration || to.timeScale == 0)) {
-				if (animationCount > 5 && from.mixingFrom == null) {
+				if (from.totalAlpha == 0) {
-					entry.interruptAlpha = Math.max(0, entry.interruptAlpha - delta * 0.66);
+					to.mixingFrom = from.mixingFrom;
-					if (entry.interruptAlpha <= 0) {
+					to.interruptAlpha = from.interruptAlpha;
-						entry.mixingFrom = null;
 					this.queue.end(from);
 				}
-				}
 				return finished;
 			}
 			from.animationLast = from.nextAnimationLast;
 			from.trackLast = from.nextTrackLast;
 			from.trackTime += delta * from.timeScale;
-			entry.mixTime += delta * entry.timeScale;
+			to.mixTime += delta * to.timeScale;
 			return false;
 		};
 		AnimationState.prototype.apply = function (skeleton) {
@@ -1165,10 +1163,10 @@ var spine;
 					for (var ii = 0; ii < timelineCount; ii++) {
 						var timeline = timelines[ii];
 						if (timeline instanceof spine.RotateTimeline) {
-							this.applyRotateTimeline(timeline, skeleton, animationTime, mix, timelineData[ii] > 0, timelinesRotation, ii << 1, firstFrame);
+							this.applyRotateTimeline(timeline, skeleton, animationTime, mix, timelineData[ii] >= AnimationState.FIRST, timelinesRotation, ii << 1, firstFrame);
 						}
 						else
-							timeline.apply(skeleton, animationLast, animationTime, events, mix, timelineData[ii] > 0, false);
+							timeline.apply(skeleton, animationLast, animationTime, events, mix, timelineData[ii] >= AnimationState.FIRST, false);
 					}
 				}
 				this.queueEvents(current, animationTime);
@@ -1203,6 +1201,7 @@ var spine;
 			var timelinesRotation = from.timelinesRotation;
 			var first = false;
 			var alphaDip = from.alpha * to.interruptAlpha, alphaMix = alphaDip * (1 - mix), alpha;
+			from.totalAlpha = 0;
 			for (var i = 0; i < timelineCount; i++) {
 				var timeline = timelines[i];
 				switch (timelineData[i]) {
@@ -1214,14 +1213,18 @@ var spine;
 						first = true;
 						alpha = alphaMix;
 						break;
+					case AnimationState.DIP:
+						first = true;
+						alpha = alphaDip;
+						break;
 					default:
 						first = true;
 						alpha = alphaDip;
 						var dipMix = timelineDipMix[i];
-						if (dipMix != null)
 						alpha *= Math.max(0, 1 - dipMix.mixTime / dipMix.mixDuration);
 						break;
 				}
+				from.totalAlpha += alpha;
 				if (timeline instanceof spine.RotateTimeline)
 					this.applyRotateTimeline(timeline, skeleton, animationTime, alpha, first, timelinesRotation, i << 1, firstFrame);
 				else {
@@ -1533,6 +1536,7 @@ var spine;
 	AnimationState.SUBSEQUENT = 0;
 	AnimationState.FIRST = 1;
 	AnimationState.DIP = 2;
+	AnimationState.DIP_MIX = 3;
 	spine.AnimationState = AnimationState;
 	var TrackEntry = (function () {
 		function TrackEntry() {
@@ -1560,6 +1564,7 @@ var spine;
 			var timelines = this.animation.timelines;
 			var timelinesCount = this.animation.timelines.length;
 			var timelineData = spine.Utils.setArraySize(this.timelineData, timelinesCount);
+			this.timelineDipMix.length = 0;
 			var timelineDipMix = spine.Utils.setArraySize(this.timelineDipMix, timelinesCount);
 			outer: for (var i = 0; i < timelinesCount; i++) {
 				var id = timelines[i].getPropertyId();
@@ -1568,16 +1573,17 @@ var spine;
 				else if (to == null || !to.hasTimeline(id))
 					timelineData[i] = AnimationState.FIRST;
 				else {
-					timelineData[i] = AnimationState.DIP;
 					for (var ii = mixingToLast; ii >= 0; ii--) {
 						var entry = mixingTo[ii];
 						if (!entry.hasTimeline(id)) {
-							if (entry.mixDuration > 0)
+							if (entry.mixDuration > 0) {
+								timelineData[i] = AnimationState.DIP_MIX;
 								timelineDipMix[i] = entry;
 								continue outer;
 							}
 						}
-					timelineDipMix[i] = null;
+					}
+					timelineData[i] = AnimationState.DIP;
 				}
 			}
 			return lastEntry;

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

@@ -231,6 +231,7 @@ declare module spine {
 		static SUBSEQUENT: number;
 		static FIRST: number;
 		static DIP: number;
+		static DIP_MIX: number;
 		data: AnimationStateData;
 		tracks: TrackEntry[];
 		events: Event[];
@@ -243,7 +244,7 @@ declare module spine {
 		trackEntryPool: Pool<TrackEntry>;
 		constructor(data: AnimationStateData);
 		update(delta: number): void;
-		updateMixingFrom(entry: TrackEntry, delta: number, animationCount: number): boolean;
+		updateMixingFrom(to: TrackEntry, delta: number): boolean;
 		apply(skeleton: Skeleton): void;
 		applyMixingFrom(to: TrackEntry, skeleton: Skeleton): number;
 		applyRotateTimeline(timeline: Timeline, skeleton: Skeleton, time: number, alpha: number, setupPose: boolean, timelinesRotation: Array<number>, i: number, firstFrame: boolean): void;
@@ -292,6 +293,7 @@ declare module spine {
 		mixTime: number;
 		mixDuration: number;
 		interruptAlpha: number;
+		totalAlpha: number;
 		timelineData: number[];
 		timelineDipMix: TrackEntry[];
 		timelinesRotation: number[];

spine-ts/build/spine-widget.js

@@ -1100,7 +1100,7 @@ var spine;
 					this.disposeNext(current);
 					continue;
 				}
-				if (current.mixingFrom != null && this.updateMixingFrom(current, delta, 2)) {
+				if (current.mixingFrom != null && this.updateMixingFrom(current, delta)) {
 					var from = current.mixingFrom;
 					current.mixingFrom = null;
 					while (from != null) {
@@ -1112,25 +1112,23 @@ var spine;
 			}
 			this.queue.drain();
 		};
-		AnimationState.prototype.updateMixingFrom = function (entry, delta, animationCount) {
+		AnimationState.prototype.updateMixingFrom = function (to, delta) {
-			var from = entry.mixingFrom;
+			var from = to.mixingFrom;
 			if (from == null)
 				return true;
-			var finished = this.updateMixingFrom(from, delta, animationCount + 1);
+			var finished = this.updateMixingFrom(from, delta);
-			if (entry.mixTime > 0 && (entry.mixTime >= entry.mixDuration || entry.timeScale == 0)) {
+			if (to.mixTime > 0 && (to.mixTime >= to.mixDuration || to.timeScale == 0)) {
-				if (animationCount > 5 && from.mixingFrom == null) {
+				if (from.totalAlpha == 0) {
-					entry.interruptAlpha = Math.max(0, entry.interruptAlpha - delta * 0.66);
+					to.mixingFrom = from.mixingFrom;
-					if (entry.interruptAlpha <= 0) {
+					to.interruptAlpha = from.interruptAlpha;
-						entry.mixingFrom = null;
 					this.queue.end(from);
 				}
-				}
 				return finished;
 			}
 			from.animationLast = from.nextAnimationLast;
 			from.trackLast = from.nextTrackLast;
 			from.trackTime += delta * from.timeScale;
-			entry.mixTime += delta * entry.timeScale;
+			to.mixTime += delta * to.timeScale;
 			return false;
 		};
 		AnimationState.prototype.apply = function (skeleton) {
@@ -1165,10 +1163,10 @@ var spine;
 					for (var ii = 0; ii < timelineCount; ii++) {
 						var timeline = timelines[ii];
 						if (timeline instanceof spine.RotateTimeline) {
-							this.applyRotateTimeline(timeline, skeleton, animationTime, mix, timelineData[ii] > 0, timelinesRotation, ii << 1, firstFrame);
+							this.applyRotateTimeline(timeline, skeleton, animationTime, mix, timelineData[ii] >= AnimationState.FIRST, timelinesRotation, ii << 1, firstFrame);
 						}
 						else
-							timeline.apply(skeleton, animationLast, animationTime, events, mix, timelineData[ii] > 0, false);
+							timeline.apply(skeleton, animationLast, animationTime, events, mix, timelineData[ii] >= AnimationState.FIRST, false);
 					}
 				}
 				this.queueEvents(current, animationTime);
@@ -1203,6 +1201,7 @@ var spine;
 			var timelinesRotation = from.timelinesRotation;
 			var first = false;
 			var alphaDip = from.alpha * to.interruptAlpha, alphaMix = alphaDip * (1 - mix), alpha;
+			from.totalAlpha = 0;
 			for (var i = 0; i < timelineCount; i++) {
 				var timeline = timelines[i];
 				switch (timelineData[i]) {
@@ -1214,14 +1213,18 @@ var spine;
 						first = true;
 						alpha = alphaMix;
 						break;
+					case AnimationState.DIP:
+						first = true;
+						alpha = alphaDip;
+						break;
 					default:
 						first = true;
 						alpha = alphaDip;
 						var dipMix = timelineDipMix[i];
-						if (dipMix != null)
 						alpha *= Math.max(0, 1 - dipMix.mixTime / dipMix.mixDuration);
 						break;
 				}
+				from.totalAlpha += alpha;
 				if (timeline instanceof spine.RotateTimeline)
 					this.applyRotateTimeline(timeline, skeleton, animationTime, alpha, first, timelinesRotation, i << 1, firstFrame);
 				else {
@@ -1533,6 +1536,7 @@ var spine;
 	AnimationState.SUBSEQUENT = 0;
 	AnimationState.FIRST = 1;
 	AnimationState.DIP = 2;
+	AnimationState.DIP_MIX = 3;
 	spine.AnimationState = AnimationState;
 	var TrackEntry = (function () {
 		function TrackEntry() {
@@ -1560,6 +1564,7 @@ var spine;
 			var timelines = this.animation.timelines;
 			var timelinesCount = this.animation.timelines.length;
 			var timelineData = spine.Utils.setArraySize(this.timelineData, timelinesCount);
+			this.timelineDipMix.length = 0;
 			var timelineDipMix = spine.Utils.setArraySize(this.timelineDipMix, timelinesCount);
 			outer: for (var i = 0; i < timelinesCount; i++) {
 				var id = timelines[i].getPropertyId();
@@ -1568,16 +1573,17 @@ var spine;
 				else if (to == null || !to.hasTimeline(id))
 					timelineData[i] = AnimationState.FIRST;
 				else {
-					timelineData[i] = AnimationState.DIP;
 					for (var ii = mixingToLast; ii >= 0; ii--) {
 						var entry = mixingTo[ii];
 						if (!entry.hasTimeline(id)) {
-							if (entry.mixDuration > 0)
+							if (entry.mixDuration > 0) {
+								timelineData[i] = AnimationState.DIP_MIX;
 								timelineDipMix[i] = entry;
 								continue outer;
 							}
 						}
-					timelineDipMix[i] = null;
+					}
+					timelineData[i] = AnimationState.DIP;
 				}
 			}
 			return lastEntry;

spine-ts/core/src/AnimationState.ts

@@ -34,6 +34,7 @@ module spine {
 		static SUBSEQUENT = 0;
 		static FIRST = 1;
 		static DIP = 2;
+		static DIP_MIX = 3;
 
 		data: AnimationStateData;
 		tracks = new Array<TrackEntry>();
@@ -91,7 +92,7 @@ module spine {
 					this.disposeNext(current);
 					continue;
 				}
-				if (current.mixingFrom != null && this.updateMixingFrom(current, delta, 2)) {
+				if (current.mixingFrom != null && this.updateMixingFrom(current, delta)) {
 					// End mixing from entries once all have completed.
 					let from = current.mixingFrom;
 					current.mixingFrom = null;
@@ -107,29 +108,26 @@ module spine {
 			this.queue.drain();
 		}
 
-		updateMixingFrom (entry: TrackEntry, delta: number, animationCount: number): boolean {
+		updateMixingFrom (to: TrackEntry, delta: number): boolean {
-			let from = entry.mixingFrom;
+			let from = to.mixingFrom;
 			if (from == null) return true;
 
-			let finished = this.updateMixingFrom(from, delta, animationCount + 1);
+			let finished = this.updateMixingFrom(from, delta);
 
 			// Require mixTime > 0 to ensure the mixing from entry was applied at least once.
-			if (entry.mixTime > 0 && (entry.mixTime >= entry.mixDuration || entry.timeScale == 0)) {
+			if (to.mixTime > 0 && (to.mixTime >= to.mixDuration || to.timeScale == 0)) {
-				if (animationCount > 5 && from.mixingFrom == null) {
+				if (from.totalAlpha == 0) {
-					// Limit linked list by speeding up and removing old entries.
+					to.mixingFrom = from.mixingFrom;
-					entry.interruptAlpha = Math.max(0, entry.interruptAlpha - delta * 0.66);
+					to.interruptAlpha = from.interruptAlpha;
-					if (entry.interruptAlpha <= 0) {
-						entry.mixingFrom = null;
 					this.queue.end(from);
 				}
-				}
 				return finished;
 			}
 
 			from.animationLast = from.nextAnimationLast;
 			from.trackLast = from.nextTrackLast;
 			from.trackTime += delta * from.timeScale;
-			entry.mixTime += delta * entry.timeScale;
+			to.mixTime += delta * to.timeScale;
 			return false;
 		}
 
@@ -168,10 +166,10 @@ module spine {
 					for (let ii = 0; ii < timelineCount; ii++) {
 						let timeline = timelines[ii];
 						if (timeline instanceof RotateTimeline) {
-							this.applyRotateTimeline(timeline, skeleton, animationTime, mix, timelineData[ii] > 0, timelinesRotation, ii << 1,
+							this.applyRotateTimeline(timeline, skeleton, animationTime, mix, timelineData[ii] >= AnimationState.FIRST, timelinesRotation, ii << 1,
 								firstFrame);
 						} else
-							timeline.apply(skeleton, animationLast, animationTime, events, mix, timelineData[ii] > 0, false);
+							timeline.apply(skeleton, animationLast, animationTime, events, mix, timelineData[ii] >= AnimationState.FIRST, false);
 					}
 				}
 				this.queueEvents(current, animationTime);
@@ -209,6 +207,7 @@ module spine {
 
 			let first = false;
 			let alphaDip = from.alpha * to.interruptAlpha, alphaMix = alphaDip * (1 - mix), alpha;
+			from.totalAlpha = 0;
 			for (var i = 0; i < timelineCount; i++) {
 				let timeline = timelines[i];
 				switch (timelineData[i]) {
@@ -220,13 +219,18 @@ module spine {
 					first = true;
 					alpha = alphaMix;
 					break;
+				case AnimationState.DIP:
+					first = true;
+					alpha = alphaDip;
+					break;
 				default:
 					first = true;
 					alpha = alphaDip;
 					let dipMix = timelineDipMix[i];
-					if (dipMix != null) alpha *= Math.max(0, 1 - dipMix.mixTime / dipMix.mixDuration);
+					alpha *= Math.max(0, 1 - dipMix.mixTime / dipMix.mixDuration);
 					break;
 				}
+				from.totalAlpha += alpha;
 				if (timeline instanceof RotateTimeline)
 					this.applyRotateTimeline(timeline, skeleton, animationTime, alpha, first, timelinesRotation, i << 1, firstFrame);
 				else {
@@ -578,7 +582,7 @@ module spine {
 		eventThreshold: number; attachmentThreshold: number; drawOrderThreshold: number;
 		animationStart: number; animationEnd: number; animationLast: number; nextAnimationLast: number;
 		delay: number; trackTime: number; trackLast: number; nextTrackLast: number; trackEnd: number; timeScale: number;
-		alpha: number; mixTime: number; mixDuration: number; interruptAlpha: number;
+		alpha: number; mixTime: number; mixDuration: number; interruptAlpha: number; totalAlpha: number;
 		timelineData = new Array<number>();
 		timelineDipMix = new Array<TrackEntry>();
 		timelinesRotation = new Array<number>();
@@ -603,6 +607,7 @@ module spine {
 			let timelines = this.animation.timelines;
 			let timelinesCount = this.animation.timelines.length;
 			let timelineData = Utils.setArraySize(this.timelineData, timelinesCount);
+			this.timelineDipMix.length = 0;
 			let timelineDipMix = Utils.setArraySize(this.timelineDipMix, timelinesCount);
 
 			outer:
@@ -613,15 +618,17 @@ module spine {
 				else if (to == null || !to.hasTimeline(id))
 					timelineData[i] = AnimationState.FIRST;
 				else {
-					timelineData[i] = AnimationState.DIP;
 					for (var ii = mixingToLast; ii >= 0; ii--) {
 						let entry = mixingTo[ii];
 						if (!entry.hasTimeline(id)) {
-							if (entry.mixDuration > 0) timelineDipMix[i] = entry;
+							if (entry.mixDuration > 0) {
+								timelineData[i] = AnimationState.DIP_MIX;
+								timelineDipMix[i] = entry;
 								continue outer;
 							}
 						}
-					timelineDipMix[i] = null;
+					}
+					timelineData[i] = AnimationState.DIP;
 				}
 			}
 			return lastEntry;