Merge branch '3.6-beta' of https://github.com/EsotericSoftware/spine-runtimes into 3.6-beta

CHANGELOG.md

@@ -20,6 +20,7 @@
  * Fixed renderer to work with 3.6 changes.
  * Added support for two color tinting.
  * Added support for clipping.
+ * Added support for rotated regions in texture atlas loaded via StarlingAtlasAttachmentLoader.
 
 ## C
  * **Breaking changes**

spine-starling/spine-starling-example/src/spine/examples/CoinExample.as

@@ -65,7 +65,7 @@ package spine.examples {
 			var skeletonData : SkeletonData = json.readSkeletonData(new CoinJson());
 
 			this.x = 400;
-			this.y = 400;
+			this.y = 600;
 
 			skeleton = new SkeletonAnimation(skeletonData);
 			skeleton.state.setAnimationByName(0, "rotate", true);

spine-starling/spine-starling-example/src/spine/examples/Main.as

@@ -38,8 +38,7 @@ package spine.examples {
 		private var _starling : Starling;
 
 		public function Main() {
-			// _starling = new Starling(SpineboyExample, stage);
+			_starling = new Starling(SpineboyExample, stage);			
-			_starling = new Starling(RaptorExample, stage);
 			_starling.enableErrorChecking = true;
 			_starling.showStats = true;
 			_starling.skipUnchangedFrames = false;

spine-starling/spine-starling/src/spine/starling/StarlingAtlasAttachmentLoader.as

@@ -58,10 +58,11 @@ package spine.starling {
 		}
 
 		public function newRegionAttachment(skin : Skin, name : String, path : String) : RegionAttachment {
-			var texture : Texture = atlas.getTexture(path);
+			var texture : Texture = atlas.getTexture(path);			
 			if (texture == null)
 				throw new Error("Region not found in Starling atlas: " + path + " (region attachment: " + name + ")");
 			var attachment : RegionAttachment = new RegionAttachment(name);
+			var rotated : Boolean = atlas.getRotation(path);			
 			attachment.rendererObject = new Image(Texture.fromTexture(texture)); // Discard frame.
 			var frame : Rectangle = texture.frame;
 			attachment.regionOffsetX = frame ? -frame.x : 0;
@@ -70,20 +71,42 @@ package spine.starling {
 			attachment.regionHeight = texture.height;
 			attachment.regionOriginalWidth = frame ? frame.width : texture.width;
 			attachment.regionOriginalHeight = frame ? frame.height : texture.height;
+			if (rotated) {
+				var tmp : Number = attachment.regionOriginalWidth;
+				attachment.regionOriginalWidth = attachment.regionOriginalHeight;
+				attachment.regionOriginalHeight = tmp;
+				tmp = attachment.regionWidth;
+				attachment.regionWidth = attachment.regionHeight;
+				attachment.regionHeight = tmp;
+			}
 			var subTexture : SubTexture = texture as SubTexture;
 			if (subTexture) {
 				var root : Texture = subTexture.root;
-				var rectRegion : Rectangle = atlas.getRegion(path);
+				var rectRegion : Rectangle = atlas.getRegion(path);				
-				attachment["regionU"] = rectRegion.x / root.width;
+				if (!rotated) {
-				attachment["regionV"] = rectRegion.y / root.height;
+					attachment["regionU"] = rectRegion.x / root.width;
-				attachment["regionU2"] = (rectRegion.x + subTexture.width) / root.width;
+					attachment["regionV"] = rectRegion.y / root.height;
-				attachment["regionV2"] = (rectRegion.y + subTexture.height) / root.height;
+					attachment["regionU2"] = (rectRegion.x + subTexture.width) / root.width;
+					attachment["regionV2"] = (rectRegion.y + subTexture.height) / root.height;
+				} else {
+					attachment["regionU2"] = rectRegion.x / root.width;
+					attachment["regionV2"] = rectRegion.y / root.height;
+					attachment["regionU"] = (rectRegion.x + subTexture.width) / root.width;
+					attachment["regionV"] = (rectRegion.y + subTexture.height) / root.height;
+				}
 				attachment.setUVs(attachment["regionU"], attachment["regionV"], attachment["regionU2"], attachment["regionV2"], atlas.getRotation(path));
 			} else {
-				attachment["regionU"] = 0;
+				if (!rotated) {
-				attachment["regionV"] = 1;
+					attachment["regionU"] = 0;
-				attachment["regionU2"] = 1;
+					attachment["regionV"] = 1;
-				attachment["regionV2"] = 0;
+					attachment["regionU2"] = 1;
+					attachment["regionV2"] = 0;
+				} else {
+					attachment["regionU2"] = 0;
+					attachment["regionV2"] = 1;
+					attachment["regionU"] = 1;
+					attachment["regionV"] = 0;
+				}
 			}
 			return attachment;
 		}
@@ -92,22 +115,38 @@ package spine.starling {
 			var texture : Texture = atlas.getTexture(path);
 			if (texture == null)
 				throw new Error("Region not found in Starling atlas: " + path + " (mesh attachment: " + name + ")");
+			var rotated : Boolean = atlas.getRotation(path);
 			var attachment : MeshAttachment = new MeshAttachment(name);
+			attachment.regionRotate = rotated;
 			attachment.rendererObject = new Image(Texture.fromTexture(texture)); // Discard frame.
 			var subTexture : SubTexture = texture as SubTexture;
 			if (subTexture) {
 				var root : Texture = subTexture.root;
 				var rectRegion : Rectangle = atlas.getRegion(path);
-				attachment.regionU = rectRegion.x / root.width;
+				if (!rotated) {
-				attachment.regionV = rectRegion.y / root.height;
+					attachment.regionU = rectRegion.x / root.width;
-				attachment.regionU2 = (rectRegion.x + subTexture.width) / root.width;
+					attachment.regionV = rectRegion.y / root.height;
-				attachment.regionV2 = (rectRegion.y + subTexture.height) / root.height;
+					attachment.regionU2 = (rectRegion.x + subTexture.width) / root.width;
+					attachment.regionV2 = (rectRegion.y + subTexture.height) / root.height;
+				} else {
+					attachment.regionU2 = rectRegion.x / root.width;
+					attachment.regionV2 = rectRegion.y / root.height;
+					attachment.regionU = (rectRegion.x + subTexture.height) / root.width;
+					attachment.regionV = (rectRegion.y + subTexture.width) / root.height;
+				}
 				attachment.rendererObject = new Image(root);
 			} else {
-				attachment.regionU = 0;
+				if (!rotated) {
-				attachment.regionV = 1;
+					attachment.regionU = 0;
-				attachment.regionU2 = 1;
+					attachment.regionV = 1;
-				attachment.regionV2 = 0;
+					attachment.regionU2 = 1;
+					attachment.regionV2 = 0;
+				} else {
+					attachment.regionU2 = 0;
+					attachment.regionV2 = 1;
+					attachment.regionU = 1;
+					attachment.regionV = 0;
+				}
 			}
 			var frame : Rectangle = texture.frame;
 			attachment.regionOffsetX = frame ? -frame.x : 0;
@@ -116,6 +155,14 @@ package spine.starling {
 			attachment.regionHeight = texture.height;
 			attachment.regionOriginalWidth = frame ? frame.width : texture.width;
 			attachment.regionOriginalHeight = frame ? frame.height : texture.height;
+			if (rotated) {
+				var tmp : Number = attachment.regionOriginalWidth;
+				attachment.regionOriginalWidth = attachment.regionOriginalHeight;
+				attachment.regionOriginalHeight = tmp;
+				tmp = attachment.regionWidth;
+				attachment.regionWidth = attachment.regionHeight;
+				attachment.regionHeight = tmp;
+			}
 			return attachment;
 		}
 

spine-ts/widget/example/test.html

@@ -0,0 +1,58 @@
+<html>
+<script src="../../build/spine-widget.js"></script>
+<script src="https://code.jquery.com/jquery-3.1.0.min.js"></script>
+<body>
+<center>
+<!-- You can programmatically initialize a widget -->
+<button id="reload">Reload</button>
+</center>
+</body>
+
+<script>
+
+var numWidgets = 0;
+var spineWidgets = []
+
+function reload() {
+    // tear down old widgets if any
+    for (var i = 0; i < spineWidgets.length; i++) {
+        spineWidgets[i].pause();
+        var widgetDiv = document.getElementById("spine-widget-" + spineWidgets[i].id);
+        if (widgetDiv) widgetDiv.parentNode.removeChild(widgetDiv)
+    }
+
+    spineWidgets = []
+
+    for (var i = 0; i < 5; i++) {
+        var widgetDiv = document.createElement("div");
+        widgetDiv.id = "spine-widget-" + numWidgets;
+        widgetDiv.style = "margin-bottom: 20px; width: 640px; height: 480px;"
+        document.body.appendChild(widgetDiv)
+
+        spineWidget = new spine.SpineWidget("spine-widget-" + numWidgets, {
+            json: "assets/spineboy.json",
+            atlas: "assets/spineboy.atlas",
+            animation: "run",
+            backgroundColor: "#00000000",
+            debug: true,
+            success: function (widget) {
+                var animIndex = 0;
+                widget.canvas.onclick = function () {
+                    animIndex++;
+                    var animations = widget.skeleton.data.animations;
+                    if (animIndex >= animations.length) animIndex = 0;
+                    widget.setAnimation(animations[animIndex].name);
+                }
+            }
+        });
+        spineWidget.id = numWidgets++;
+        spineWidgets.push(spineWidget);
+    }
+}
+
+var reloadButton = document.getElementById("reload");
+reloadButton.onclick = reload;
+
+</script>
+</body>
+</html>