diff --git a/v3/src/components/experimental-Transform-2.js b/v3/src/components/experimental-Transform-2.js index dd98a0b36..f41758d2e 100644 --- a/v3/src/components/experimental-Transform-2.js +++ b/v3/src/components/experimental-Transform-2.js @@ -61,26 +61,34 @@ function Transform(gameObject, root) // Only valid if you are the root. // This probably needs to be on State and not here. this.flatChildrenArray = []; + this.flatRenderArray = []; this.transformStack = []; this.childStack = []; this.childCount = 0; + this.renderCount = 0; this.dirty = false; this.root = root || this; this.gameObject = gameObject; } // this must be called only once on the root of the tree. Never on children -Transform.prototype.flattenTree = function (children, flatChildrenArray, childCount) +Transform.prototype.flattenTree = function (children, flatRenderArray, flatChildrenArray, childCount, renderCount) { for (var index = 0, length = children.length; index < length; ++index) { - flatChildrenArray[childCount++] = children[index]; + var child = children[index]; + // we need a rendering list since we avoid iterating over + // repeating children used as tags for the applying transformations. + flatRenderArray[renderCount++] = child; + flatChildrenArray[childCount++] = child; if (children[index].children.length > 0) { - childCount = this.flattenTree(children[index].children, flatChildrenArray, childCount); + var counts = this.flattenTree(children[index].children, flatChildrenArray, childCount); + childCount = counts[0]; + renderCount = counts[1]; flatChildrenArray[childCount++] = children[index]; // add ending tag } } - return childCount; + return [childCount, renderCount]; }; Transform.prototype.add = function (transform) { @@ -117,7 +125,9 @@ Transform.prototype.updateRoot = function () var childrenArray = this.flatChildrenArray; if (this.dirty) { - this.childCount = this.flattenTree(this.children, childrenArray, 0); + var counts = this.flattenTree(this.children, this.flatRenderArray, childrenArray, 0, 0); + this.childCount = counts[0]; + this.renderCount = counts[1]; this.dirty = false; } this.updateLocal(); @@ -148,8 +158,9 @@ Transform.prototype.update = function (parentTransformMatrix) var parent = parentTransformMatrix.matrix; var world = this.worldMatrix.matrix; var localm = this.localMatrix.loadIdentity(); + var rotation = this.rotation; localm.translate(this.positionX, this.positionY); - localm.rotate(this.rotation); + if (rotation !== 0) localm.rotate(this.rotation); var local = localm.scale(this.scaleX, this.scaleY).matrix; world[0] = parent[0] * local[0] + parent[1] * local[2]; diff --git a/v3/src/gameobjects/GameObject.js b/v3/src/gameobjects/GameObject.js index 149380c2d..8474658c5 100644 --- a/v3/src/gameobjects/GameObject.js +++ b/v3/src/gameobjects/GameObject.js @@ -40,7 +40,8 @@ var GameObject = function (state, x, y, texture, frame, parent) // All GameObjects have the following components, always: this.transform = new Component.Transform(this, this.state.sys.transform); - this.transform.localMatrix.translate(x, y); + this.transform.positionX = x; + this.transform.positionY = y; // Optional? Maybe set on a per GO basis? this.data = new Component.Data(this); diff --git a/v3/src/renderer/canvas/utils/DrawImage.js b/v3/src/renderer/canvas/utils/DrawImage.js index 0792fe914..7e8beaae2 100644 --- a/v3/src/renderer/canvas/utils/DrawImage.js +++ b/v3/src/renderer/canvas/utils/DrawImage.js @@ -32,7 +32,7 @@ var DrawImage = function (frame, blendMode, transform, alpha, tint, bg) // var dy = frame.y - (transform.anchorY * frame.height); var dx = frame.x; var dy = frame.y; - var wt = transform.worldMatrix; + var wt = transform.worldMatrix.matrix; ctx.setTransform(wt[0], wt[1], wt[2], wt[3], wt[4], wt[5]); diff --git a/v3/src/state/Systems.js b/v3/src/state/Systems.js index 99f09b26f..d86aa9069 100644 --- a/v3/src/state/Systems.js +++ b/v3/src/state/Systems.js @@ -129,7 +129,7 @@ Systems.prototype = { // Now what? :) - renderer.render(this.state, this.transform.flatChildrenArray, interpolation); + renderer.render(this.state, this.transform.flatRenderArray, interpolation); this.state.render(interpolation); },