Merge branch '3.7-beta' into 3.7-beta-cpp

CHANGELOG.md

@@ -33,6 +33,7 @@
   * The spine-cocos2dx and spine-ue4 runtimes are now based on spine-cpp. See below for changes.
   * Skeleton `flipX/flipY` has been replaced with `scaleY/scaleY`. This cleans up applying transforms and is more powerful. Allows scaling a whole skeleton which has bones that disallow scale inheritance
   * Mix time is no longer affected by `TrackEntry#timeScale`. See https://github.com/EsotericSoftware/spine-runtimes/issues/1194
+  * `spMeshAttachment` has two new fields `regionTextureWith` and `regionTextureHeight`. These must be set in custom attachment loader. See `AtlasAttachmentLoader`.
 * **Additions**
   * Added support for local and relative transform constraint calculation, including additional fields in `spTransformConstraintData`.
   * `Animation#apply` and `Timeline#apply`` now take enums `MixPose` and `MixDirection` instead of booleans

spine-c/spine-c/include/spine/MeshAttachment.h

@@ -51,6 +51,7 @@ struct spMeshAttachment {
 	int regionOriginalWidth, regionOriginalHeight; /* Unrotated, unstripped pixel size. */
 	float regionU, regionV, regionU2, regionV2;
 	int/*bool*/regionRotate;
+	float regionTextureWidth, regionTextureHeight;
 
 	const char* path;
 

spine-c/spine-c/src/spine/AtlasAttachmentLoader.c

@@ -74,6 +74,8 @@ spAttachment* _spAtlasAttachmentLoader_createAttachment (spAttachmentLoader* loa
 		attachment->regionHeight = region->height;
 		attachment->regionOriginalWidth = region->originalWidth;
 		attachment->regionOriginalHeight = region->originalHeight;
+		attachment->regionTextureWidth = region->page->width;
+		attachment->regionTextureHeight = region->page->height;
 		return SUPER(SUPER(attachment));
 	}
 	case SP_ATTACHMENT_BOUNDING_BOX:

spine-c/spine-c/src/spine/MeshAttachment.c

@@ -54,20 +54,32 @@ spMeshAttachment* spMeshAttachment_create (const char* name) {
 }
 
 void spMeshAttachment_updateUVs (spMeshAttachment* self) {
-	int i;
+	int i, n;
-	float width = self->regionU2 - self->regionU, height = self->regionV2 - self->regionV;
+	float width, height;
 	int verticesLength = SUPER(self)->worldVerticesLength;
 	FREE(self->uvs);
 	self->uvs = MALLOC(float, verticesLength);
+
+	float textureWidth = self->regionTextureWidth;
+	float textureHeight = self->regionTextureHeight;
 	if (self->regionRotate) {
-		for (i = 0; i < verticesLength; i += 2) {
+		float u = self->regionU - (self->regionOriginalHeight - self->regionOffsetY - self->regionHeight) / textureWidth;
-			self->uvs[i] = self->regionU + self->regionUVs[i + 1] * width;
+		float v = self->regionV - (self->regionOriginalWidth - self->regionOffsetX - self->regionWidth) / textureHeight;
-			self->uvs[i + 1] = self->regionV + height - self->regionUVs[i] * height;
+		width = self->regionOriginalHeight / textureWidth;
+		height = self->regionOriginalWidth / textureHeight;
+		for (i = 0, n = verticesLength; i < n; i += 2) {
+			self->uvs[i] = u + self->regionUVs[i + 1] * width;
+			self->uvs[i + 1] = v + height - self->regionUVs[i] * height;
 		}
+		return;
 	} else {
-		for (i = 0; i < verticesLength; i += 2) {
+		float u = self->regionU - self->regionOffsetX / textureWidth;
-			self->uvs[i] = self->regionU + self->regionUVs[i] * width;
+		float v = self->regionV - (self->regionOriginalHeight - self->regionOffsetY - self->regionHeight) / textureHeight;
-			self->uvs[i + 1] = self->regionV + self->regionUVs[i + 1] * height;
+		width = self->regionOriginalWidth / textureWidth;
+		height = self->regionOriginalHeight / textureHeight;
+		for (i = 0, n = verticesLength; i < n; i += 2) {
+			self->uvs[i] = u + self->regionUVs[i] * width;
+			self->uvs[i + 1] = v + self->regionUVs[i + 1] * height;
 		}
 	}
 }

spine-cpp/spine-cpp/include/spine/MeshAttachment.h

@@ -119,7 +119,7 @@ namespace spine {
         void setHeight(float inValue);
 
     private:
-        float _regionOffsetX, _regionOffsetY, _regionWidth, _regionHeight, _regionOriginalWidth, _regionOriginalHeight;
+        float _regionOffsetX, _regionOffsetY, _regionWidth, _regionHeight, _regionOriginalWidth, _regionOriginalHeight, _regionTextureWidth, _regionTextureHeight;
         MeshAttachment* _parentMesh;
         Vector<float> _uvs;
         Vector<float> _regionUVs;

spine-cpp/spine-cpp/src/spine/AtlasAttachmentLoader.cpp

@@ -94,6 +94,8 @@ MeshAttachment *AtlasAttachmentLoader::newMeshAttachment(Skin &skin, const Strin
 	attachment._regionHeight = (float)region.height;
 	attachment._regionOriginalWidth = (float)region.originalWidth;
 	attachment._regionOriginalHeight = (float)region.originalHeight;
+	attachment._regionTextureWidth = (float)region.page->width;
+	attachment._regionTextureHeight = (float)region.page->height;
 
 	return attachmentP;
 }

spine-cpp/spine-cpp/src/spine/MeshAttachment.cpp

@@ -46,6 +46,8 @@ MeshAttachment::MeshAttachment(const String &name) : VertexAttachment(name), Has
 													 _regionHeight(0),
 													 _regionOriginalWidth(0),
 													 _regionOriginalHeight(0),
+													 _regionTextureWidth(0),
+													 _regionTextureHeight(0),
 													 _parentMesh(NULL),
 													 _path(),
 													 _regionU(0),
@@ -63,17 +65,24 @@ MeshAttachment::MeshAttachment(const String &name) : VertexAttachment(name), Has
 MeshAttachment::~MeshAttachment() {}
 
 void MeshAttachment::updateUVs() {
-	float u = _regionU, v = _regionV, width = _regionU2 - _regionU, height = _regionV2 - _regionV;
 	if (_uvs.size() != _regionUVs.size()) {
 		_uvs.setSize(_regionUVs.size(), 0);
 	}
 
 	if (_regionRotate) {
+		float u = _regionU - (_regionOriginalHeight - _regionOffsetY - _regionHeight) / _regionTextureWidth;
+		float v = _regionV - (_regionOriginalWidth - _regionOffsetX - _regionWidth) / _regionTextureHeight;
+		float width = _regionOriginalHeight / _regionTextureWidth;
+		float height = _regionOriginalWidth / _regionTextureHeight;
 		for (size_t i = 0, n = _uvs.size(); i < n; i += 2) {
 			_uvs[i] = u + _regionUVs[i + 1] * width;
 			_uvs[i + 1] = v + height - _regionUVs[i] * height;
 		}
 	} else {
+		float u = _regionU - _regionOffsetX / _regionTextureWidth;
+		float v = _regionV - (_regionOriginalHeight - _regionOffsetY - _regionHeight) / _regionTextureHeight;
+		float width = _regionOriginalWidth / _regionTextureWidth;
+		float height = _regionOriginalHeight / _regionTextureHeight;
 		for (size_t i = 0, n = _uvs.size(); i < n; i += 2) {
 			_uvs[i] = u + _regionUVs[i] * width;
 			_uvs[i + 1] = v + _regionUVs[i + 1] * height;

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

@@ -1791,7 +1791,6 @@ declare module spine {
 		defaultMix: number;
 		skin: string;
 		skins: string[];
-		controlBones: string[];
 		premultipliedAlpha: boolean;
 		showControls: boolean;
 		debug: {
@@ -1827,11 +1826,11 @@ declare module spine {
 			height: number;
 		};
 		fullScreenBackgroundColor: string;
+		controlBones: string[];
 		success: (widget: SpinePlayer) => void;
 		error: (widget: SpinePlayer, msg: string) => void;
 	}
 	class SpinePlayer {
-		parent: HTMLElement | string;
 		private config;
 		static HOVER_COLOR_INNER: Color;
 		static HOVER_COLOR_OUTER: Color;
@@ -1860,6 +1859,7 @@ declare module spine {
 		private previousViewport;
 		private viewportTransitionStart;
 		private selectedBones;
+		private parent;
 		constructor(parent: HTMLElement | string, config: SpinePlayerConfig);
 		validateConfig(config: SpinePlayerConfig): SpinePlayerConfig;
 		showError(error: string): void;
@@ -1881,3 +1881,19 @@ declare module spine {
 		private calculateAnimationViewport(animationName);
 	}
 }
+declare function CodeMirror(el: Element, config: any): void;
+declare module spine {
+	class SpinePlayerEditor {
+		private static DEFAULT_CODE;
+		private prefix;
+		private postfix;
+		private code;
+		private player;
+		constructor(parent: HTMLElement);
+		private render(parent);
+		setPreAndPostfix(prefix: string, postfix: string): void;
+		setCode(code: string): void;
+		private timerId;
+		startPlayer(): void;
+	}
+}

spine-ts/build/spine-all.js

@@ -6543,8 +6543,31 @@ var spine;
 			return _this;
 		}
 		MeshAttachment.prototype.updateUVs = function () {
+			var regionUVs = this.regionUVs;
+			if (this.uvs == null || this.uvs.length != regionUVs.length)
+				this.uvs = spine.Utils.newFloatArray(regionUVs.length);
+			var uvs = this.uvs;
 			var u = 0, v = 0, width = 0, height = 0;
-			if (this.region == null) {
+			if (this.region instanceof spine.TextureAtlasRegion) {
+				var region = this.region;
+				var textureWidth = region.texture.getImage().width, textureHeight = region.texture.getImage().height;
+				if (region.rotate) {
+					u = region.u - (region.originalHeight - region.offsetY - region.height) / textureWidth;
+					v = region.v - (region.originalWidth - region.offsetX - region.width) / textureHeight;
+					width = region.originalHeight / textureWidth;
+					height = region.originalWidth / textureHeight;
+					for (var i = 0, n = uvs.length; i < n; i += 2) {
+						uvs[i] = u + regionUVs[i + 1] * width;
+						uvs[i + 1] = v + height - regionUVs[i] * height;
+					}
+					return;
+				}
+				u = region.u - region.offsetX / textureWidth;
+				v = region.v - (region.originalHeight - region.offsetY - region.height) / textureHeight;
+				width = region.originalWidth / textureWidth;
+				height = region.originalHeight / textureHeight;
+			}
+			else if (this.region == null) {
 				u = v = 0;
 				width = height = 1;
 			}
@@ -6554,21 +6577,9 @@ var spine;
 				width = this.region.u2 - u;
 				height = this.region.v2 - v;
 			}
-			var regionUVs = this.regionUVs;
+			for (var i = 0, n = uvs.length; i < n; i += 2) {
-			if (this.uvs == null || this.uvs.length != regionUVs.length)
+				uvs[i] = u + regionUVs[i] * width;
-				this.uvs = spine.Utils.newFloatArray(regionUVs.length);
+				uvs[i + 1] = v + regionUVs[i + 1] * height;
-			var uvs = this.uvs;
-			if (this.region.rotate) {
-				for (var i = 0, n = uvs.length; i < n; i += 2) {
-					uvs[i] = u + regionUVs[i + 1] * width;
-					uvs[i + 1] = v + height - regionUVs[i] * height;
-				}
-			}
-			else {
-				for (var i = 0, n = uvs.length; i < n; i += 2) {
-					uvs[i] = u + regionUVs[i] * width;
-					uvs[i + 1] = v + regionUVs[i + 1] * height;
-				}
 			}
 		};
 		MeshAttachment.prototype.applyDeform = function (sourceAttachment) {
@@ -7465,7 +7476,7 @@ var spine;
 					return;
 				this.timeKeeper.update();
 				var a = Math.abs(Math.sin(this.timeKeeper.totalTime + 0.75));
-				this.angle -= this.timeKeeper.delta * 360 * (1 + 1.5 * Math.pow(a, 5));
+				this.angle -= this.timeKeeper.delta / 1.4 * 360 * (1 + 1.5 * Math.pow(a, 5));
 				var renderer = this.renderer;
 				var canvas = renderer.canvas;
 				var gl = renderer.context.gl;
@@ -10101,7 +10112,6 @@ var spine;
 		}
 		Popup.prototype.show = function (dismissedListener) {
 			var _this = this;
-			if (dismissedListener === void 0) { dismissedListener = function () { }; }
 			this.dom.classList.remove("spine-player-hidden");
 			var dismissed = false;
 			var resize = function () {
@@ -10225,7 +10235,6 @@ var spine;
 	}());
 	var SpinePlayer = (function () {
 		function SpinePlayer(parent, config) {
-			this.parent = parent;
 			this.config = config;
 			this.time = new spine.TimeKeeper();
 			this.paused = true;
@@ -10237,8 +10246,10 @@ var spine;
 			this.viewportTransitionStart = 0;
 			this.cancelId = 0;
 			if (typeof parent === "string")
-				parent = document.getElementById(parent);
+				this.parent = document.getElementById(parent);
-			parent.appendChild(this.render());
+			else
+				this.parent = parent;
+			this.parent.appendChild(this.render());
 		}
 		SpinePlayer.prototype.validateConfig = function (config) {
 			if (!config)
@@ -10253,8 +10264,8 @@ var spine;
 				config.backgroundColor = "#000000";
 			if (!config.fullScreenBackgroundColor)
 				config.fullScreenBackgroundColor = config.backgroundColor;
-			if (!config.premultipliedAlpha)
+			if (typeof config.premultipliedAlpha === "undefined")
-				config.premultipliedAlpha = false;
+				config.premultipliedAlpha = true;
 			if (!config.success)
 				config.success = function (widget) { };
 			if (!config.error)
@@ -10270,21 +10281,21 @@ var spine;
 					points: false,
 					hulls: false
 				};
-			if (!config.debug.bones)
+			if (typeof config.debug.bones === "undefined")
 				config.debug.bones = false;
-			if (!config.debug.bounds)
+			if (typeof config.debug.bounds === "undefined")
 				config.debug.bounds = false;
-			if (!config.debug.clipping)
+			if (typeof config.debug.clipping === "undefined")
 				config.debug.clipping = false;
-			if (!config.debug.hulls)
+			if (typeof config.debug.hulls === "undefined")
 				config.debug.hulls = false;
-			if (!config.debug.paths)
+			if (typeof config.debug.paths === "undefined")
 				config.debug.paths = false;
-			if (!config.debug.points)
+			if (typeof config.debug.points === "undefined")
 				config.debug.points = false;
-			if (!config.debug.regions)
+			if (typeof config.debug.regions === "undefined")
 				config.debug.regions = false;
-			if (!config.debug.meshes)
+			if (typeof config.debug.meshes === "undefined")
 				config.debug.meshes = false;
 			if (config.animations && config.animation) {
 				if (config.animations.indexOf(config.animation) < 0)
@@ -10440,6 +10451,8 @@ var spine;
 			speedButton.classList.add("spine-player-button-icon-speed-selected");
 			popup.show(function () {
 				speedButton.classList.remove("spine-player-button-icon-speed-selected");
+				popup.dom.remove();
+				_this.lastPopup = null;
 			});
 			this.lastPopup = popup;
 		};
@@ -10476,6 +10489,8 @@ var spine;
 			animationsButton.classList.add("spine-player-button-icon-animations-selected");
 			popup.show(function () {
 				animationsButton.classList.remove("spine-player-button-icon-animations-selected");
+				popup.dom.remove();
+				_this.lastPopup = null;
 			});
 			this.lastPopup = popup;
 		};
@@ -10512,6 +10527,8 @@ var spine;
 			skinButton.classList.add("spine-player-button-icon-skins-selected");
 			popup.show(function () {
 				skinButton.classList.remove("spine-player-button-icon-skins-selected");
+				popup.dom.remove();
+				_this.lastPopup = null;
 			});
 			this.lastPopup = popup;
 		};
@@ -10549,6 +10566,8 @@ var spine;
 			settingsButton.classList.add("spine-player-button-icon-settings-selected");
 			popup.show(function () {
 				settingsButton.classList.remove("spine-player-button-icon-settings-selected");
+				popup.dom.remove();
+				_this.lastPopup = null;
 			});
 			this.lastPopup = popup;
 		};
@@ -10838,33 +10857,45 @@ var spine;
 			});
 			var mouseOverControls = true;
 			var mouseOverCanvas = false;
-			parent.addEventListener("mousemove", function (ev) {
+			document.addEventListener("mousemove", function (ev) {
 				if (ev instanceof MouseEvent) {
-					if (!_this.config.showControls)
+					handleHover(ev.clientX, ev.clientY);
-						return;
+				}
-					var popup = findWithClass(_this.dom, "spine-player-popup");
+			});
-					mouseOverControls = overlap(ev, _this.playerControls.getBoundingClientRect());
+			document.addEventListener("touchmove", function (ev) {
-					mouseOverCanvas = overlap(ev, _this.canvas.getBoundingClientRect());
+				if (ev instanceof TouchEvent) {
-					clearTimeout(_this.cancelId);
+					var touches = ev.changedTouches;
-					var hide = popup.length == 0 && !mouseOverControls && !mouseOverCanvas && !_this.paused;
+					if (touches.length > 0) {
-					if (hide) {
+						var touch = touches[0];
-						_this.playerControls.classList.add("spine-player-controls-hidden");
+						handleHover(touch.clientX, touch.clientY);
-					}
-					else {
-						_this.playerControls.classList.remove("spine-player-controls-hidden");
-					}
-					if (!mouseOverControls && popup.length == 0 && !_this.paused) {
-						var remove = function () {
-							if (!_this.paused)
-								_this.playerControls.classList.add("spine-player-controls-hidden");
-						};
-						_this.cancelId = setTimeout(remove, 500);
 					}
 				}
 			});
-			var overlap = function (ev, rect) {
+			var handleHover = function (mouseX, mouseY) {
-				var x = ev.clientX - rect.left;
+				if (!_this.config.showControls)
-				var y = ev.clientY - rect.top;
+					return;
+				var popup = findWithClass(_this.dom, "spine-player-popup");
+				mouseOverControls = overlap(mouseX, mouseY, _this.playerControls.getBoundingClientRect());
+				mouseOverCanvas = overlap(mouseX, mouseY, _this.canvas.getBoundingClientRect());
+				clearTimeout(_this.cancelId);
+				var hide = popup.length == 0 && !mouseOverControls && !mouseOverCanvas && !_this.paused;
+				if (hide) {
+					_this.playerControls.classList.add("spine-player-controls-hidden");
+				}
+				else {
+					_this.playerControls.classList.remove("spine-player-controls-hidden");
+				}
+				if (!mouseOverControls && popup.length == 0 && !_this.paused) {
+					var remove = function () {
+						if (!_this.paused)
+							_this.playerControls.classList.add("spine-player-controls-hidden");
+					};
+					_this.cancelId = setTimeout(remove, 1000);
+				}
+			};
+			var overlap = function (mouseX, mouseY, rect) {
+				var x = mouseX - rect.left;
+				var y = mouseY - rect.top;
 				return x >= 0 && x <= rect.width && y >= 0 && y <= rect.height;
 			};
 		};
@@ -10875,7 +10906,7 @@ var spine;
 				if (!_this.paused)
 					_this.playerControls.classList.add("spine-player-controls-hidden");
 			};
-			this.cancelId = setTimeout(remove, 500);
+			this.cancelId = setTimeout(remove, 1000);
 			this.playButton.classList.remove("spine-player-button-icon-play");
 			this.playButton.classList.add("spine-player-button-icon-pause");
 			if (this.config.animation) {
@@ -11057,4 +11088,60 @@ var spine;
 			.replace(/'/g, "&#39;");
 	}
 })(spine || (spine = {}));
+var spine;
+(function (spine) {
+	var SpinePlayerEditor = (function () {
+		function SpinePlayerEditor(parent) {
+			this.prefix = "<html>\n<head>\n<style>\nbody {\n\tmargin: 0px;\n}\n</style>\n</head>\n<body>".trim();
+			this.postfix = "</body>";
+			this.timerId = 0;
+			this.render(parent);
+		}
+		SpinePlayerEditor.prototype.render = function (parent) {
+			var _this = this;
+			var dom = "\n\t\t\t\t<div class=\"spine-player-editor-container\">\n\t\t\t\t\t<div class=\"spine-player-editor-code\"></div>\n\t\t\t\t\t<iframe class=\"spine-player-editor-player\"></iframe>\n\t\t\t\t</div>\n\t\t\t";
+			parent.innerHTML = dom;
+			var codeElement = parent.getElementsByClassName("spine-player-editor-code")[0];
+			this.player = parent.getElementsByClassName("spine-player-editor-player")[0];
+			requestAnimationFrame(function () {
+				_this.code = CodeMirror(codeElement, {
+					lineNumbers: true,
+					tabSize: 3,
+					indentUnit: 3,
+					indentWithTabs: true,
+					scrollBarStyle: "native",
+					mode: "htmlmixed",
+					theme: "monokai"
+				});
+				_this.code.on("change", function () {
+					_this.startPlayer();
+				});
+				_this.setCode(SpinePlayerEditor.DEFAULT_CODE);
+			});
+		};
+		SpinePlayerEditor.prototype.setPreAndPostfix = function (prefix, postfix) {
+			this.prefix = prefix;
+			this.postfix = postfix;
+			this.startPlayer();
+		};
+		SpinePlayerEditor.prototype.setCode = function (code) {
+			this.code.setValue(code);
+			this.startPlayer();
+		};
+		SpinePlayerEditor.prototype.startPlayer = function () {
+			var _this = this;
+			clearTimeout(this.timerId);
+			this.timerId = setTimeout(function () {
+				var code = _this.code.getDoc().getValue();
+				code = _this.prefix + code + _this.postfix;
+				code = window.btoa(code);
+				_this.player.src = "";
+				_this.player.src = "data:text/html;base64," + code;
+			}, 500);
+		};
+		SpinePlayerEditor.DEFAULT_CODE = "\n<script src=\"https://esotericsoftware.com/files/spine-player/3.7/spine-player.js\"></script>\n<link rel=\"stylesheet\" href=\"https://esotericsoftware.com/files/spine-player/3.7/spine-player.css\">\n\n<div id=\"player-container\" style=\"width: 100%; height: 100vh;\"></div>\n\n<script>\nnew spine.SpinePlayer(\"player-container\", {\n\tjsonUrl: \"https://esotericsoftware.com/files/examples/spineboy/export/spineboy-pro.json\",\n\tatlasUrl: \"https://esotericsoftware.com/files/examples/spineboy/export/spineboy-pma.atlas\"\n});\n</script>\n\t\t".trim();
+		return SpinePlayerEditor;
+	}());
+	spine.SpinePlayerEditor = SpinePlayerEditor;
+})(spine || (spine = {}));
 //# sourceMappingURL=spine-all.js.map

spine-ts/build/spine-canvas.js

@@ -6543,8 +6543,31 @@ var spine;
 			return _this;
 		}
 		MeshAttachment.prototype.updateUVs = function () {
+			var regionUVs = this.regionUVs;
+			if (this.uvs == null || this.uvs.length != regionUVs.length)
+				this.uvs = spine.Utils.newFloatArray(regionUVs.length);
+			var uvs = this.uvs;
 			var u = 0, v = 0, width = 0, height = 0;
-			if (this.region == null) {
+			if (this.region instanceof spine.TextureAtlasRegion) {
+				var region = this.region;
+				var textureWidth = region.texture.getImage().width, textureHeight = region.texture.getImage().height;
+				if (region.rotate) {
+					u = region.u - (region.originalHeight - region.offsetY - region.height) / textureWidth;
+					v = region.v - (region.originalWidth - region.offsetX - region.width) / textureHeight;
+					width = region.originalHeight / textureWidth;
+					height = region.originalWidth / textureHeight;
+					for (var i = 0, n = uvs.length; i < n; i += 2) {
+						uvs[i] = u + regionUVs[i + 1] * width;
+						uvs[i + 1] = v + height - regionUVs[i] * height;
+					}
+					return;
+				}
+				u = region.u - region.offsetX / textureWidth;
+				v = region.v - (region.originalHeight - region.offsetY - region.height) / textureHeight;
+				width = region.originalWidth / textureWidth;
+				height = region.originalHeight / textureHeight;
+			}
+			else if (this.region == null) {
 				u = v = 0;
 				width = height = 1;
 			}
@@ -6554,21 +6577,9 @@ var spine;
 				width = this.region.u2 - u;
 				height = this.region.v2 - v;
 			}
-			var regionUVs = this.regionUVs;
+			for (var i = 0, n = uvs.length; i < n; i += 2) {
-			if (this.uvs == null || this.uvs.length != regionUVs.length)
+				uvs[i] = u + regionUVs[i] * width;
-				this.uvs = spine.Utils.newFloatArray(regionUVs.length);
+				uvs[i + 1] = v + regionUVs[i + 1] * height;
-			var uvs = this.uvs;
-			if (this.region.rotate) {
-				for (var i = 0, n = uvs.length; i < n; i += 2) {
-					uvs[i] = u + regionUVs[i + 1] * width;
-					uvs[i + 1] = v + height - regionUVs[i] * height;
-				}
-			}
-			else {
-				for (var i = 0, n = uvs.length; i < n; i += 2) {
-					uvs[i] = u + regionUVs[i] * width;
-					uvs[i + 1] = v + regionUVs[i + 1] * height;
-				}
 			}
 		};
 		MeshAttachment.prototype.applyDeform = function (sourceAttachment) {

spine-ts/build/spine-core.js

@@ -6543,8 +6543,31 @@ var spine;
 			return _this;
 		}
 		MeshAttachment.prototype.updateUVs = function () {
+			var regionUVs = this.regionUVs;
+			if (this.uvs == null || this.uvs.length != regionUVs.length)
+				this.uvs = spine.Utils.newFloatArray(regionUVs.length);
+			var uvs = this.uvs;
 			var u = 0, v = 0, width = 0, height = 0;
-			if (this.region == null) {
+			if (this.region instanceof spine.TextureAtlasRegion) {
+				var region = this.region;
+				var textureWidth = region.texture.getImage().width, textureHeight = region.texture.getImage().height;
+				if (region.rotate) {
+					u = region.u - (region.originalHeight - region.offsetY - region.height) / textureWidth;
+					v = region.v - (region.originalWidth - region.offsetX - region.width) / textureHeight;
+					width = region.originalHeight / textureWidth;
+					height = region.originalWidth / textureHeight;
+					for (var i = 0, n = uvs.length; i < n; i += 2) {
+						uvs[i] = u + regionUVs[i + 1] * width;
+						uvs[i + 1] = v + height - regionUVs[i] * height;
+					}
+					return;
+				}
+				u = region.u - region.offsetX / textureWidth;
+				v = region.v - (region.originalHeight - region.offsetY - region.height) / textureHeight;
+				width = region.originalWidth / textureWidth;
+				height = region.originalHeight / textureHeight;
+			}
+			else if (this.region == null) {
 				u = v = 0;
 				width = height = 1;
 			}
@@ -6554,21 +6577,9 @@ var spine;
 				width = this.region.u2 - u;
 				height = this.region.v2 - v;
 			}
-			var regionUVs = this.regionUVs;
+			for (var i = 0, n = uvs.length; i < n; i += 2) {
-			if (this.uvs == null || this.uvs.length != regionUVs.length)
+				uvs[i] = u + regionUVs[i] * width;
-				this.uvs = spine.Utils.newFloatArray(regionUVs.length);
+				uvs[i + 1] = v + regionUVs[i + 1] * height;
-			var uvs = this.uvs;
-			if (this.region.rotate) {
-				for (var i = 0, n = uvs.length; i < n; i += 2) {
-					uvs[i] = u + regionUVs[i + 1] * width;
-					uvs[i + 1] = v + height - regionUVs[i] * height;
-				}
-			}
-			else {
-				for (var i = 0, n = uvs.length; i < n; i += 2) {
-					uvs[i] = u + regionUVs[i] * width;
-					uvs[i + 1] = v + regionUVs[i + 1] * height;
-				}
 			}
 		};
 		MeshAttachment.prototype.applyDeform = function (sourceAttachment) {

spine-ts/build/spine-threejs.js

@@ -6543,8 +6543,31 @@ var spine;
 			return _this;
 		}
 		MeshAttachment.prototype.updateUVs = function () {
+			var regionUVs = this.regionUVs;
+			if (this.uvs == null || this.uvs.length != regionUVs.length)
+				this.uvs = spine.Utils.newFloatArray(regionUVs.length);
+			var uvs = this.uvs;
 			var u = 0, v = 0, width = 0, height = 0;
-			if (this.region == null) {
+			if (this.region instanceof spine.TextureAtlasRegion) {
+				var region = this.region;
+				var textureWidth = region.texture.getImage().width, textureHeight = region.texture.getImage().height;
+				if (region.rotate) {
+					u = region.u - (region.originalHeight - region.offsetY - region.height) / textureWidth;
+					v = region.v - (region.originalWidth - region.offsetX - region.width) / textureHeight;
+					width = region.originalHeight / textureWidth;
+					height = region.originalWidth / textureHeight;
+					for (var i = 0, n = uvs.length; i < n; i += 2) {
+						uvs[i] = u + regionUVs[i + 1] * width;
+						uvs[i + 1] = v + height - regionUVs[i] * height;
+					}
+					return;
+				}
+				u = region.u - region.offsetX / textureWidth;
+				v = region.v - (region.originalHeight - region.offsetY - region.height) / textureHeight;
+				width = region.originalWidth / textureWidth;
+				height = region.originalHeight / textureHeight;
+			}
+			else if (this.region == null) {
 				u = v = 0;
 				width = height = 1;
 			}
@@ -6554,21 +6577,9 @@ var spine;
 				width = this.region.u2 - u;
 				height = this.region.v2 - v;
 			}
-			var regionUVs = this.regionUVs;
+			for (var i = 0, n = uvs.length; i < n; i += 2) {
-			if (this.uvs == null || this.uvs.length != regionUVs.length)
+				uvs[i] = u + regionUVs[i] * width;
-				this.uvs = spine.Utils.newFloatArray(regionUVs.length);
+				uvs[i + 1] = v + regionUVs[i + 1] * height;
-			var uvs = this.uvs;
-			if (this.region.rotate) {
-				for (var i = 0, n = uvs.length; i < n; i += 2) {
-					uvs[i] = u + regionUVs[i + 1] * width;
-					uvs[i + 1] = v + height - regionUVs[i] * height;
-				}
-			}
-			else {
-				for (var i = 0, n = uvs.length; i < n; i += 2) {
-					uvs[i] = u + regionUVs[i] * width;
-					uvs[i + 1] = v + regionUVs[i + 1] * height;
-				}
 			}
 		};
 		MeshAttachment.prototype.applyDeform = function (sourceAttachment) {

spine-ts/build/spine-webgl.js

@@ -6543,8 +6543,31 @@ var spine;
 			return _this;
 		}
 		MeshAttachment.prototype.updateUVs = function () {
+			var regionUVs = this.regionUVs;
+			if (this.uvs == null || this.uvs.length != regionUVs.length)
+				this.uvs = spine.Utils.newFloatArray(regionUVs.length);
+			var uvs = this.uvs;
 			var u = 0, v = 0, width = 0, height = 0;
-			if (this.region == null) {
+			if (this.region instanceof spine.TextureAtlasRegion) {
+				var region = this.region;
+				var textureWidth = region.texture.getImage().width, textureHeight = region.texture.getImage().height;
+				if (region.rotate) {
+					u = region.u - (region.originalHeight - region.offsetY - region.height) / textureWidth;
+					v = region.v - (region.originalWidth - region.offsetX - region.width) / textureHeight;
+					width = region.originalHeight / textureWidth;
+					height = region.originalWidth / textureHeight;
+					for (var i = 0, n = uvs.length; i < n; i += 2) {
+						uvs[i] = u + regionUVs[i + 1] * width;
+						uvs[i + 1] = v + height - regionUVs[i] * height;
+					}
+					return;
+				}
+				u = region.u - region.offsetX / textureWidth;
+				v = region.v - (region.originalHeight - region.offsetY - region.height) / textureHeight;
+				width = region.originalWidth / textureWidth;
+				height = region.originalHeight / textureHeight;
+			}
+			else if (this.region == null) {
 				u = v = 0;
 				width = height = 1;
 			}
@@ -6554,21 +6577,9 @@ var spine;
 				width = this.region.u2 - u;
 				height = this.region.v2 - v;
 			}
-			var regionUVs = this.regionUVs;
+			for (var i = 0, n = uvs.length; i < n; i += 2) {
-			if (this.uvs == null || this.uvs.length != regionUVs.length)
+				uvs[i] = u + regionUVs[i] * width;
-				this.uvs = spine.Utils.newFloatArray(regionUVs.length);
+				uvs[i + 1] = v + regionUVs[i + 1] * height;
-			var uvs = this.uvs;
-			if (this.region.rotate) {
-				for (var i = 0, n = uvs.length; i < n; i += 2) {
-					uvs[i] = u + regionUVs[i + 1] * width;
-					uvs[i + 1] = v + height - regionUVs[i] * height;
-				}
-			}
-			else {
-				for (var i = 0, n = uvs.length; i < n; i += 2) {
-					uvs[i] = u + regionUVs[i] * width;
-					uvs[i + 1] = v + regionUVs[i + 1] * height;
-				}
 			}
 		};
 		MeshAttachment.prototype.applyDeform = function (sourceAttachment) {
@@ -7199,7 +7210,7 @@ var spine;
 					return;
 				this.timeKeeper.update();
 				var a = Math.abs(Math.sin(this.timeKeeper.totalTime + 0.75));
-				this.angle -= this.timeKeeper.delta * 360 * (1 + 1.5 * Math.pow(a, 5));
+				this.angle -= this.timeKeeper.delta / 1.4 * 360 * (1 + 1.5 * Math.pow(a, 5));
 				var renderer = this.renderer;
 				var canvas = renderer.canvas;
 				var gl = renderer.context.gl;

spine-ts/core/src/attachments/MeshAttachment.ts

@@ -45,6 +45,45 @@ module spine {
 		}
 
 		updateUVs () {
+			let regionUVs = this.regionUVs;
+			if (this.uvs == null || this.uvs.length != regionUVs.length) this.uvs = Utils.newFloatArray(regionUVs.length);
+			let uvs = this.uvs;
+			let u = 0, v = 0, width = 0, height = 0;
+			if (this.region instanceof TextureAtlasRegion) {
+				let region = this.region;
+				let textureWidth = region.texture.getImage().width, textureHeight = region.texture.getImage().height;
+				if (region.rotate) {
+					u = region.u - (region.originalHeight - region.offsetY - region.height) / textureWidth;
+					v = region.v - (region.originalWidth - region.offsetX - region.width) / textureHeight;
+					width = region.originalHeight / textureWidth;
+					height = region.originalWidth / textureHeight;
+					for (let i = 0, n = uvs.length; i < n; i += 2) {
+						uvs[i] = u + regionUVs[i + 1] * width;
+						uvs[i + 1] = v + height - regionUVs[i] * height;
+					}
+					return;
+				}
+				u = region.u - region.offsetX / textureWidth;
+				v = region.v - (region.originalHeight - region.offsetY - region.height) / textureHeight;
+				width = region.originalWidth / textureWidth;
+				height = region.originalHeight / textureHeight;
+			} else if (this.region == null) {
+				u = v = 0;
+				width = height = 1;
+			} else {
+				u = this.region.u;
+				v = this.region.v;
+				width = this.region.u2 - u;
+				height = this.region.v2 - v;
+			}
+
+			for (let i = 0, n = uvs.length; i < n; i += 2) {
+				uvs[i] = u + regionUVs[i] * width;
+				uvs[i + 1] = v + regionUVs[i + 1] * height;
+			}
+		}
+
+		/*updateUVs () {
 			let u = 0, v = 0, width = 0, height = 0;
 			if (this.region == null) {
 				u = v = 0;
@@ -69,7 +108,7 @@ module spine {
 					uvs[i + 1] = v + regionUVs[i + 1] * height;
 				}
 			}
-		}
+		}*/
 
 		applyDeform (sourceAttachment: VertexAttachment): boolean {
 			return this == sourceAttachment || (this.inheritDeform && this.parentMesh == sourceAttachment);

spine-ts/player/css/spine-player.css

@@ -121,6 +121,7 @@
 	display: flex;
 	flex-direction: row;
 	width: 6px;
+	min-width: 6px;
 	height: 6px;
 	border-radius: 50%;
 	background: #fff;

spine-ts/player/src/Player.ts

@@ -325,7 +325,7 @@
 			if (!config.alpha) config.alpha = false;
 			if (!config.backgroundColor) config.backgroundColor = "#000000";
 			if (!config.fullScreenBackgroundColor) config.fullScreenBackgroundColor = config.backgroundColor;
-			if (!config.premultipliedAlpha) config.premultipliedAlpha = true;
+			if (typeof config.premultipliedAlpha  === "undefined") config.premultipliedAlpha = true;
 			if (!config.success) config.success = (widget) => {};
 			if (!config.error) config.error = (widget, msg) => {};
 			if (!config.debug) config.debug = {
@@ -338,14 +338,14 @@
 				points: false,
 				hulls: false
 			}
-			if (!config.debug.bones) config.debug.bones = false;
+			if (typeof config.debug.bones === "undefined") config.debug.bones = false;
-			if (!config.debug.bounds) config.debug.bounds = false;
+			if (typeof config.debug.bounds === "undefined") config.debug.bounds = false;
-			if (!config.debug.clipping) config.debug.clipping = false;
+			if (typeof config.debug.clipping === "undefined") config.debug.clipping = false;
-			if (!config.debug.hulls) config.debug.hulls = false;
+			if (typeof config.debug.hulls === "undefined") config.debug.hulls = false;
-			if (!config.debug.paths) config.debug.paths = false;
+			if (typeof config.debug.paths === "undefined") config.debug.paths = false;
-			if (!config.debug.points) config.debug.points = false;
+			if (typeof config.debug.points === "undefined") config.debug.points = false;
-			if (!config.debug.regions) config.debug.regions = false;
+			if (typeof config.debug.regions === "undefined") config.debug.regions = false;
-			if (!config.debug.meshes) config.debug.meshes = false;
+			if (typeof config.debug.meshes === "undefined") config.debug.meshes = false;
 
 			if (config.animations && config.animation) {
 				if  (config.animations.indexOf(config.animation) < 0) throw new Error("Default animation '" +  config.animation + "' is not contained in the list of selectable animations " + escapeHtml(JSON.stringify(this.config.animations)) + ".");