diff --git a/src/core/display/Container.js b/src/core/display/Container.js index d0abf1d..537c72c 100644 --- a/src/core/display/Container.js +++ b/src/core/display/Container.js @@ -104,13 +104,13 @@ /** * Adds a child to the container. - * + * * You can also add multple items like so: myContainer.addChild(thinkOne, thingTwo, thingThree) * @param child {PIXI.DisplayObject} The DisplayObject to add to the container * @return {PIXI.DisplayObject} The child that was added. */ Container.prototype.addChild = function (child) -{ +{ var argumentsLength = arguments.length; // if there is only one argument we can bypass looping through the them @@ -122,7 +122,7 @@ { this.addChild( arguments[i] ); } - } + } else { // if the child has a parent then lets remove it as Pixi objects can only exist in one place @@ -132,7 +132,7 @@ } child.parent = this; - + this.children.push(child); // TODO - lets either do all callbacks or all events.. not both! @@ -274,9 +274,9 @@ { this.removeChild( arguments[i] ); } - } + } else - { + { var index = this.children.indexOf(child); if (index === -1) @@ -368,7 +368,9 @@ return; } - this.transform.updateTransform(this.parent.transform); + this.transform = this.parent.transform.updateChildTransform(this.transform); + + //TODO: check render flags, how to process stuff here this.worldAlpha = this.alpha * this.parent.worldAlpha; for (var i = 0, j = this.children.length; i < j; ++i) @@ -489,7 +491,7 @@ // if the object is not visible or the alpha is 0 then no need to render this element if (!this.visible || this.worldAlpha <= 0 || !this.renderable) { - + return; } diff --git a/src/core/display/Container.js b/src/core/display/Container.js index d0abf1d..537c72c 100644 --- a/src/core/display/Container.js +++ b/src/core/display/Container.js @@ -104,13 +104,13 @@ /** * Adds a child to the container. - * + * * You can also add multple items like so: myContainer.addChild(thinkOne, thingTwo, thingThree) * @param child {PIXI.DisplayObject} The DisplayObject to add to the container * @return {PIXI.DisplayObject} The child that was added. */ Container.prototype.addChild = function (child) -{ +{ var argumentsLength = arguments.length; // if there is only one argument we can bypass looping through the them @@ -122,7 +122,7 @@ { this.addChild( arguments[i] ); } - } + } else { // if the child has a parent then lets remove it as Pixi objects can only exist in one place @@ -132,7 +132,7 @@ } child.parent = this; - + this.children.push(child); // TODO - lets either do all callbacks or all events.. not both! @@ -274,9 +274,9 @@ { this.removeChild( arguments[i] ); } - } + } else - { + { var index = this.children.indexOf(child); if (index === -1) @@ -368,7 +368,9 @@ return; } - this.transform.updateTransform(this.parent.transform); + this.transform = this.parent.transform.updateChildTransform(this.transform); + + //TODO: check render flags, how to process stuff here this.worldAlpha = this.alpha * this.parent.worldAlpha; for (var i = 0, j = this.children.length; i < j; ++i) @@ -489,7 +491,7 @@ // if the object is not visible or the alpha is 0 then no need to render this element if (!this.visible || this.worldAlpha <= 0 || !this.renderable) { - + return; } diff --git a/src/core/display/DisplayObject.js b/src/core/display/DisplayObject.js index d997925..97347be 100644 --- a/src/core/display/DisplayObject.js +++ b/src/core/display/DisplayObject.js @@ -18,45 +18,10 @@ { EventEmitter.call(this); + //TODO: need to create Transform from factory this.transform = new Transform(); /** - * The coordinate of the object relative to the local coordinates of the parent. - * - * @member {PIXI.Point} - */ - this.position = this.transform.position; - - /** - * The scale factor of the object. - * - * @member {PIXI.Point} - */ - this.scale = this.transform.scale; - - /** - * The pivot point of the displayObject that it rotates around - * - * @member {PIXI.Point} - */ - this.pivot = this.transform.pivot; - - - /** - * The skew factor for the object in radians. - * - * @member {PIXI.Point} - */ - this.skew = this.transform.skew; - - /** - * The rotation of the object in radians. - * - * @member {number} - */ - this._rotation = 0; - - /** * The opacity of the object. * * @member {number} @@ -96,15 +61,6 @@ this.worldAlpha = 1; /** - * Current transform of the object based on world (parent) factors - * - * @member {PIXI.Matrix} - * @readOnly - */ - this.worldTransform = this.transform.worldTransform; // short hand! - this.localTransform = this.transform.localTransform; - - /** * The area the filter is applied to. This is used as more of an optimisation * rather than figuring out the dimensions of the displayObject each frame you can set this rectangle * @@ -135,8 +91,6 @@ * @private */ this._mask = null; - - // this.dirtyTransform = true; } // constructor @@ -160,7 +114,6 @@ set: function (value) { this.position.x = value; - this.dirtyTransform = true; } }, @@ -178,21 +131,105 @@ set: function (value) { this.position.y = value; - this.dirtyTransform = true; } }, + /** + * Current transform of the object based on world (parent) factors + * + * @member {PIXI.Matrix} + * @readOnly + */ + worldTransform: { + get: function () + { + return this.transform.worldTransform; + } + }, + + /** + * Current transform of the object based on local factors: position, scale, other stuff + * + * @member {PIXI.Matrix} + * @readOnly + */ + localTransform: { + get: function () + { + return this.transform.localTransform; + } + }, + + /** + * The coordinate of the object relative to the local coordinates of the parent. + * + * @member {PIXI.Point} + */ + position: { + get: function() + { + return this.transform.position; + }, + set: function(value) { + this.transform.position = value; + } + }, + + /** + * The scale factor of the object. + * + * @member {PIXI.Point} + */ + scale: { + get: function() { + return this.transform.scale; + }, + set: function(value) { + this.transform.scale = value; + } + }, + + /** + * The pivot point of the displayObject that it rotates around + * + * @member {PIXI.Point} + */ + pivot: { + get: function() { + return this.transform.pivot; + }, + set: function(value) { + this.transform.pivot = value; + } + }, + + /** + * The skew factor for the object in radians. + * + * @member {PIXI.Point} + */ + skew: { + get: function() { + return this.transform.skew; + }, + set: function(value) { + this.transform.skew = value; + } + }, + + /** + * The rotation of the object in radians. + * + * @member {number} + */ rotation: { get: function () { - return this._rotation; + return this.transform.rotation; }, set: function (value) { - this._rotation = value; - this.transform.dirty = true; - this.transform._sr = Math.sin(value); - this.transform._cr = Math.cos(value); + this.transform.rotation = value; } }, @@ -280,8 +317,7 @@ */ DisplayObject.prototype.updateTransform = function () { - //if(this.transform.dirty || parent.transform.dirty) - this.transform.updateTransform(this.parent.transform); + this.transform = this.parent.transform.updateChildTransform(this.transform); // multiply the alphas.. this.worldAlpha = this.alpha * this.parent.worldAlpha; }; @@ -435,7 +471,6 @@ this.skew.y = skewY || 0; this.pivot.x = pivotX || 0; this.pivot.y = pivotY || 0; - this.dirtyTransform = true; return this; }; diff --git a/src/core/display/Container.js b/src/core/display/Container.js index d0abf1d..537c72c 100644 --- a/src/core/display/Container.js +++ b/src/core/display/Container.js @@ -104,13 +104,13 @@ /** * Adds a child to the container. - * + * * You can also add multple items like so: myContainer.addChild(thinkOne, thingTwo, thingThree) * @param child {PIXI.DisplayObject} The DisplayObject to add to the container * @return {PIXI.DisplayObject} The child that was added. */ Container.prototype.addChild = function (child) -{ +{ var argumentsLength = arguments.length; // if there is only one argument we can bypass looping through the them @@ -122,7 +122,7 @@ { this.addChild( arguments[i] ); } - } + } else { // if the child has a parent then lets remove it as Pixi objects can only exist in one place @@ -132,7 +132,7 @@ } child.parent = this; - + this.children.push(child); // TODO - lets either do all callbacks or all events.. not both! @@ -274,9 +274,9 @@ { this.removeChild( arguments[i] ); } - } + } else - { + { var index = this.children.indexOf(child); if (index === -1) @@ -368,7 +368,9 @@ return; } - this.transform.updateTransform(this.parent.transform); + this.transform = this.parent.transform.updateChildTransform(this.transform); + + //TODO: check render flags, how to process stuff here this.worldAlpha = this.alpha * this.parent.worldAlpha; for (var i = 0, j = this.children.length; i < j; ++i) @@ -489,7 +491,7 @@ // if the object is not visible or the alpha is 0 then no need to render this element if (!this.visible || this.worldAlpha <= 0 || !this.renderable) { - + return; } diff --git a/src/core/display/DisplayObject.js b/src/core/display/DisplayObject.js index d997925..97347be 100644 --- a/src/core/display/DisplayObject.js +++ b/src/core/display/DisplayObject.js @@ -18,45 +18,10 @@ { EventEmitter.call(this); + //TODO: need to create Transform from factory this.transform = new Transform(); /** - * The coordinate of the object relative to the local coordinates of the parent. - * - * @member {PIXI.Point} - */ - this.position = this.transform.position; - - /** - * The scale factor of the object. - * - * @member {PIXI.Point} - */ - this.scale = this.transform.scale; - - /** - * The pivot point of the displayObject that it rotates around - * - * @member {PIXI.Point} - */ - this.pivot = this.transform.pivot; - - - /** - * The skew factor for the object in radians. - * - * @member {PIXI.Point} - */ - this.skew = this.transform.skew; - - /** - * The rotation of the object in radians. - * - * @member {number} - */ - this._rotation = 0; - - /** * The opacity of the object. * * @member {number} @@ -96,15 +61,6 @@ this.worldAlpha = 1; /** - * Current transform of the object based on world (parent) factors - * - * @member {PIXI.Matrix} - * @readOnly - */ - this.worldTransform = this.transform.worldTransform; // short hand! - this.localTransform = this.transform.localTransform; - - /** * The area the filter is applied to. This is used as more of an optimisation * rather than figuring out the dimensions of the displayObject each frame you can set this rectangle * @@ -135,8 +91,6 @@ * @private */ this._mask = null; - - // this.dirtyTransform = true; } // constructor @@ -160,7 +114,6 @@ set: function (value) { this.position.x = value; - this.dirtyTransform = true; } }, @@ -178,21 +131,105 @@ set: function (value) { this.position.y = value; - this.dirtyTransform = true; } }, + /** + * Current transform of the object based on world (parent) factors + * + * @member {PIXI.Matrix} + * @readOnly + */ + worldTransform: { + get: function () + { + return this.transform.worldTransform; + } + }, + + /** + * Current transform of the object based on local factors: position, scale, other stuff + * + * @member {PIXI.Matrix} + * @readOnly + */ + localTransform: { + get: function () + { + return this.transform.localTransform; + } + }, + + /** + * The coordinate of the object relative to the local coordinates of the parent. + * + * @member {PIXI.Point} + */ + position: { + get: function() + { + return this.transform.position; + }, + set: function(value) { + this.transform.position = value; + } + }, + + /** + * The scale factor of the object. + * + * @member {PIXI.Point} + */ + scale: { + get: function() { + return this.transform.scale; + }, + set: function(value) { + this.transform.scale = value; + } + }, + + /** + * The pivot point of the displayObject that it rotates around + * + * @member {PIXI.Point} + */ + pivot: { + get: function() { + return this.transform.pivot; + }, + set: function(value) { + this.transform.pivot = value; + } + }, + + /** + * The skew factor for the object in radians. + * + * @member {PIXI.Point} + */ + skew: { + get: function() { + return this.transform.skew; + }, + set: function(value) { + this.transform.skew = value; + } + }, + + /** + * The rotation of the object in radians. + * + * @member {number} + */ rotation: { get: function () { - return this._rotation; + return this.transform.rotation; }, set: function (value) { - this._rotation = value; - this.transform.dirty = true; - this.transform._sr = Math.sin(value); - this.transform._cr = Math.cos(value); + this.transform.rotation = value; } }, @@ -280,8 +317,7 @@ */ DisplayObject.prototype.updateTransform = function () { - //if(this.transform.dirty || parent.transform.dirty) - this.transform.updateTransform(this.parent.transform); + this.transform = this.parent.transform.updateChildTransform(this.transform); // multiply the alphas.. this.worldAlpha = this.alpha * this.parent.worldAlpha; }; @@ -435,7 +471,6 @@ this.skew.y = skewY || 0; this.pivot.x = pivotX || 0; this.pivot.y = pivotY || 0; - this.dirtyTransform = true; return this; }; diff --git a/src/core/display/Transform.js b/src/core/display/Transform.js index c058a76..b355515 100644 --- a/src/core/display/Transform.js +++ b/src/core/display/Transform.js @@ -41,17 +41,10 @@ */ this.pivot = new math.Point(0.0); - - /** - * The rotation value of the object, in radians - * - * @member {Number} - */ - this.rotation = 0; + this._rotation = 0; this._sr = Math.sin(0); this._cr = Math.cos(0); - this.updated = true; } @@ -84,4 +77,28 @@ wt.ty = lt.tx * pt.b + lt.ty * pt.d + pt.ty; }; +Transform.prototype.updateChildTransform = function (childTransform) +{ + childTransform.updateTransform(this); + return childTransform; +}; + +Object.defineProperties(Transform.prototype, { + /** + * The rotation of the object in radians. + * + * @member {number} + */ + rotation: { + get: function () { + return this._rotation; + }, + set: function (value) { + this._rotation = value; + this._sr = Math.sin(value); + this._cr = Math.cos(value); + } + } +}); + module.exports = Transform; diff --git a/src/core/display/Container.js b/src/core/display/Container.js index d0abf1d..537c72c 100644 --- a/src/core/display/Container.js +++ b/src/core/display/Container.js @@ -104,13 +104,13 @@ /** * Adds a child to the container. - * + * * You can also add multple items like so: myContainer.addChild(thinkOne, thingTwo, thingThree) * @param child {PIXI.DisplayObject} The DisplayObject to add to the container * @return {PIXI.DisplayObject} The child that was added. */ Container.prototype.addChild = function (child) -{ +{ var argumentsLength = arguments.length; // if there is only one argument we can bypass looping through the them @@ -122,7 +122,7 @@ { this.addChild( arguments[i] ); } - } + } else { // if the child has a parent then lets remove it as Pixi objects can only exist in one place @@ -132,7 +132,7 @@ } child.parent = this; - + this.children.push(child); // TODO - lets either do all callbacks or all events.. not both! @@ -274,9 +274,9 @@ { this.removeChild( arguments[i] ); } - } + } else - { + { var index = this.children.indexOf(child); if (index === -1) @@ -368,7 +368,9 @@ return; } - this.transform.updateTransform(this.parent.transform); + this.transform = this.parent.transform.updateChildTransform(this.transform); + + //TODO: check render flags, how to process stuff here this.worldAlpha = this.alpha * this.parent.worldAlpha; for (var i = 0, j = this.children.length; i < j; ++i) @@ -489,7 +491,7 @@ // if the object is not visible or the alpha is 0 then no need to render this element if (!this.visible || this.worldAlpha <= 0 || !this.renderable) { - + return; } diff --git a/src/core/display/DisplayObject.js b/src/core/display/DisplayObject.js index d997925..97347be 100644 --- a/src/core/display/DisplayObject.js +++ b/src/core/display/DisplayObject.js @@ -18,45 +18,10 @@ { EventEmitter.call(this); + //TODO: need to create Transform from factory this.transform = new Transform(); /** - * The coordinate of the object relative to the local coordinates of the parent. - * - * @member {PIXI.Point} - */ - this.position = this.transform.position; - - /** - * The scale factor of the object. - * - * @member {PIXI.Point} - */ - this.scale = this.transform.scale; - - /** - * The pivot point of the displayObject that it rotates around - * - * @member {PIXI.Point} - */ - this.pivot = this.transform.pivot; - - - /** - * The skew factor for the object in radians. - * - * @member {PIXI.Point} - */ - this.skew = this.transform.skew; - - /** - * The rotation of the object in radians. - * - * @member {number} - */ - this._rotation = 0; - - /** * The opacity of the object. * * @member {number} @@ -96,15 +61,6 @@ this.worldAlpha = 1; /** - * Current transform of the object based on world (parent) factors - * - * @member {PIXI.Matrix} - * @readOnly - */ - this.worldTransform = this.transform.worldTransform; // short hand! - this.localTransform = this.transform.localTransform; - - /** * The area the filter is applied to. This is used as more of an optimisation * rather than figuring out the dimensions of the displayObject each frame you can set this rectangle * @@ -135,8 +91,6 @@ * @private */ this._mask = null; - - // this.dirtyTransform = true; } // constructor @@ -160,7 +114,6 @@ set: function (value) { this.position.x = value; - this.dirtyTransform = true; } }, @@ -178,21 +131,105 @@ set: function (value) { this.position.y = value; - this.dirtyTransform = true; } }, + /** + * Current transform of the object based on world (parent) factors + * + * @member {PIXI.Matrix} + * @readOnly + */ + worldTransform: { + get: function () + { + return this.transform.worldTransform; + } + }, + + /** + * Current transform of the object based on local factors: position, scale, other stuff + * + * @member {PIXI.Matrix} + * @readOnly + */ + localTransform: { + get: function () + { + return this.transform.localTransform; + } + }, + + /** + * The coordinate of the object relative to the local coordinates of the parent. + * + * @member {PIXI.Point} + */ + position: { + get: function() + { + return this.transform.position; + }, + set: function(value) { + this.transform.position = value; + } + }, + + /** + * The scale factor of the object. + * + * @member {PIXI.Point} + */ + scale: { + get: function() { + return this.transform.scale; + }, + set: function(value) { + this.transform.scale = value; + } + }, + + /** + * The pivot point of the displayObject that it rotates around + * + * @member {PIXI.Point} + */ + pivot: { + get: function() { + return this.transform.pivot; + }, + set: function(value) { + this.transform.pivot = value; + } + }, + + /** + * The skew factor for the object in radians. + * + * @member {PIXI.Point} + */ + skew: { + get: function() { + return this.transform.skew; + }, + set: function(value) { + this.transform.skew = value; + } + }, + + /** + * The rotation of the object in radians. + * + * @member {number} + */ rotation: { get: function () { - return this._rotation; + return this.transform.rotation; }, set: function (value) { - this._rotation = value; - this.transform.dirty = true; - this.transform._sr = Math.sin(value); - this.transform._cr = Math.cos(value); + this.transform.rotation = value; } }, @@ -280,8 +317,7 @@ */ DisplayObject.prototype.updateTransform = function () { - //if(this.transform.dirty || parent.transform.dirty) - this.transform.updateTransform(this.parent.transform); + this.transform = this.parent.transform.updateChildTransform(this.transform); // multiply the alphas.. this.worldAlpha = this.alpha * this.parent.worldAlpha; }; @@ -435,7 +471,6 @@ this.skew.y = skewY || 0; this.pivot.x = pivotX || 0; this.pivot.y = pivotY || 0; - this.dirtyTransform = true; return this; }; diff --git a/src/core/display/Transform.js b/src/core/display/Transform.js index c058a76..b355515 100644 --- a/src/core/display/Transform.js +++ b/src/core/display/Transform.js @@ -41,17 +41,10 @@ */ this.pivot = new math.Point(0.0); - - /** - * The rotation value of the object, in radians - * - * @member {Number} - */ - this.rotation = 0; + this._rotation = 0; this._sr = Math.sin(0); this._cr = Math.cos(0); - this.updated = true; } @@ -84,4 +77,28 @@ wt.ty = lt.tx * pt.b + lt.ty * pt.d + pt.ty; }; +Transform.prototype.updateChildTransform = function (childTransform) +{ + childTransform.updateTransform(this); + return childTransform; +}; + +Object.defineProperties(Transform.prototype, { + /** + * The rotation of the object in radians. + * + * @member {number} + */ + rotation: { + get: function () { + return this._rotation; + }, + set: function (value) { + this._rotation = value; + this._sr = Math.sin(value); + this._cr = Math.cos(value); + } + } +}); + module.exports = Transform; diff --git a/src/core/display/TransformStatic.js b/src/core/display/TransformStatic.js index 30d7823..d7c632d 100644 --- a/src/core/display/TransformStatic.js +++ b/src/core/display/TransformStatic.js @@ -50,13 +50,7 @@ */ this.skew = new ObservablePoint(this,0.0); - /** - * The rotation value of the object, in radians - * - * @member {Number} - */ - this.rotation = 0; - + this._rotation = 0; this._sr = Math.sin(0); this._cr = Math.cos(0); @@ -70,7 +64,6 @@ TransformStatic.prototype.constructor = TransformStatic; - /** * Updates the values of the object and applies the parent's transform. * @param parentTransform {PIXI.Transform} The transform of the parent of this object @@ -82,6 +75,7 @@ var wt = this.worldTransform; var lt = this.localTransform; + this.updated = false; if(this._dirtyLocal !== this._versionLocal || parentTransform._dirtyParentId !== parentTransform._transformId || parentTransform._dirtyParentVersion !== parentTransform._versionGlobal ) @@ -108,7 +102,32 @@ this._dirtyParentId = parentTransform._transformId; this._dirtyParentVersion = parentTransform._versionGlobal; this._versionGlobal++; + this.updated = true; } }; +TransformStatic.prototype.updateChildTransform = function (childTransform) +{ + childTransform.updateTransform(this); + return childTransform; +}; + +Object.defineProperties(TransformStatic.prototype, { + /** + * The rotation of the object in radians. + * + * @member {number} + */ + rotation: { + get: function () { + return this._rotation; + }, + set: function (value) { + this._rotation = value; + this._sr = Math.sin(value); + this._cr = Math.cos(value); + } + } +}); + module.exports = TransformStatic; diff --git a/src/core/display/Container.js b/src/core/display/Container.js index d0abf1d..537c72c 100644 --- a/src/core/display/Container.js +++ b/src/core/display/Container.js @@ -104,13 +104,13 @@ /** * Adds a child to the container. - * + * * You can also add multple items like so: myContainer.addChild(thinkOne, thingTwo, thingThree) * @param child {PIXI.DisplayObject} The DisplayObject to add to the container * @return {PIXI.DisplayObject} The child that was added. */ Container.prototype.addChild = function (child) -{ +{ var argumentsLength = arguments.length; // if there is only one argument we can bypass looping through the them @@ -122,7 +122,7 @@ { this.addChild( arguments[i] ); } - } + } else { // if the child has a parent then lets remove it as Pixi objects can only exist in one place @@ -132,7 +132,7 @@ } child.parent = this; - + this.children.push(child); // TODO - lets either do all callbacks or all events.. not both! @@ -274,9 +274,9 @@ { this.removeChild( arguments[i] ); } - } + } else - { + { var index = this.children.indexOf(child); if (index === -1) @@ -368,7 +368,9 @@ return; } - this.transform.updateTransform(this.parent.transform); + this.transform = this.parent.transform.updateChildTransform(this.transform); + + //TODO: check render flags, how to process stuff here this.worldAlpha = this.alpha * this.parent.worldAlpha; for (var i = 0, j = this.children.length; i < j; ++i) @@ -489,7 +491,7 @@ // if the object is not visible or the alpha is 0 then no need to render this element if (!this.visible || this.worldAlpha <= 0 || !this.renderable) { - + return; } diff --git a/src/core/display/DisplayObject.js b/src/core/display/DisplayObject.js index d997925..97347be 100644 --- a/src/core/display/DisplayObject.js +++ b/src/core/display/DisplayObject.js @@ -18,45 +18,10 @@ { EventEmitter.call(this); + //TODO: need to create Transform from factory this.transform = new Transform(); /** - * The coordinate of the object relative to the local coordinates of the parent. - * - * @member {PIXI.Point} - */ - this.position = this.transform.position; - - /** - * The scale factor of the object. - * - * @member {PIXI.Point} - */ - this.scale = this.transform.scale; - - /** - * The pivot point of the displayObject that it rotates around - * - * @member {PIXI.Point} - */ - this.pivot = this.transform.pivot; - - - /** - * The skew factor for the object in radians. - * - * @member {PIXI.Point} - */ - this.skew = this.transform.skew; - - /** - * The rotation of the object in radians. - * - * @member {number} - */ - this._rotation = 0; - - /** * The opacity of the object. * * @member {number} @@ -96,15 +61,6 @@ this.worldAlpha = 1; /** - * Current transform of the object based on world (parent) factors - * - * @member {PIXI.Matrix} - * @readOnly - */ - this.worldTransform = this.transform.worldTransform; // short hand! - this.localTransform = this.transform.localTransform; - - /** * The area the filter is applied to. This is used as more of an optimisation * rather than figuring out the dimensions of the displayObject each frame you can set this rectangle * @@ -135,8 +91,6 @@ * @private */ this._mask = null; - - // this.dirtyTransform = true; } // constructor @@ -160,7 +114,6 @@ set: function (value) { this.position.x = value; - this.dirtyTransform = true; } }, @@ -178,21 +131,105 @@ set: function (value) { this.position.y = value; - this.dirtyTransform = true; } }, + /** + * Current transform of the object based on world (parent) factors + * + * @member {PIXI.Matrix} + * @readOnly + */ + worldTransform: { + get: function () + { + return this.transform.worldTransform; + } + }, + + /** + * Current transform of the object based on local factors: position, scale, other stuff + * + * @member {PIXI.Matrix} + * @readOnly + */ + localTransform: { + get: function () + { + return this.transform.localTransform; + } + }, + + /** + * The coordinate of the object relative to the local coordinates of the parent. + * + * @member {PIXI.Point} + */ + position: { + get: function() + { + return this.transform.position; + }, + set: function(value) { + this.transform.position = value; + } + }, + + /** + * The scale factor of the object. + * + * @member {PIXI.Point} + */ + scale: { + get: function() { + return this.transform.scale; + }, + set: function(value) { + this.transform.scale = value; + } + }, + + /** + * The pivot point of the displayObject that it rotates around + * + * @member {PIXI.Point} + */ + pivot: { + get: function() { + return this.transform.pivot; + }, + set: function(value) { + this.transform.pivot = value; + } + }, + + /** + * The skew factor for the object in radians. + * + * @member {PIXI.Point} + */ + skew: { + get: function() { + return this.transform.skew; + }, + set: function(value) { + this.transform.skew = value; + } + }, + + /** + * The rotation of the object in radians. + * + * @member {number} + */ rotation: { get: function () { - return this._rotation; + return this.transform.rotation; }, set: function (value) { - this._rotation = value; - this.transform.dirty = true; - this.transform._sr = Math.sin(value); - this.transform._cr = Math.cos(value); + this.transform.rotation = value; } }, @@ -280,8 +317,7 @@ */ DisplayObject.prototype.updateTransform = function () { - //if(this.transform.dirty || parent.transform.dirty) - this.transform.updateTransform(this.parent.transform); + this.transform = this.parent.transform.updateChildTransform(this.transform); // multiply the alphas.. this.worldAlpha = this.alpha * this.parent.worldAlpha; }; @@ -435,7 +471,6 @@ this.skew.y = skewY || 0; this.pivot.x = pivotX || 0; this.pivot.y = pivotY || 0; - this.dirtyTransform = true; return this; }; diff --git a/src/core/display/Transform.js b/src/core/display/Transform.js index c058a76..b355515 100644 --- a/src/core/display/Transform.js +++ b/src/core/display/Transform.js @@ -41,17 +41,10 @@ */ this.pivot = new math.Point(0.0); - - /** - * The rotation value of the object, in radians - * - * @member {Number} - */ - this.rotation = 0; + this._rotation = 0; this._sr = Math.sin(0); this._cr = Math.cos(0); - this.updated = true; } @@ -84,4 +77,28 @@ wt.ty = lt.tx * pt.b + lt.ty * pt.d + pt.ty; }; +Transform.prototype.updateChildTransform = function (childTransform) +{ + childTransform.updateTransform(this); + return childTransform; +}; + +Object.defineProperties(Transform.prototype, { + /** + * The rotation of the object in radians. + * + * @member {number} + */ + rotation: { + get: function () { + return this._rotation; + }, + set: function (value) { + this._rotation = value; + this._sr = Math.sin(value); + this._cr = Math.cos(value); + } + } +}); + module.exports = Transform; diff --git a/src/core/display/TransformStatic.js b/src/core/display/TransformStatic.js index 30d7823..d7c632d 100644 --- a/src/core/display/TransformStatic.js +++ b/src/core/display/TransformStatic.js @@ -50,13 +50,7 @@ */ this.skew = new ObservablePoint(this,0.0); - /** - * The rotation value of the object, in radians - * - * @member {Number} - */ - this.rotation = 0; - + this._rotation = 0; this._sr = Math.sin(0); this._cr = Math.cos(0); @@ -70,7 +64,6 @@ TransformStatic.prototype.constructor = TransformStatic; - /** * Updates the values of the object and applies the parent's transform. * @param parentTransform {PIXI.Transform} The transform of the parent of this object @@ -82,6 +75,7 @@ var wt = this.worldTransform; var lt = this.localTransform; + this.updated = false; if(this._dirtyLocal !== this._versionLocal || parentTransform._dirtyParentId !== parentTransform._transformId || parentTransform._dirtyParentVersion !== parentTransform._versionGlobal ) @@ -108,7 +102,32 @@ this._dirtyParentId = parentTransform._transformId; this._dirtyParentVersion = parentTransform._versionGlobal; this._versionGlobal++; + this.updated = true; } }; +TransformStatic.prototype.updateChildTransform = function (childTransform) +{ + childTransform.updateTransform(this); + return childTransform; +}; + +Object.defineProperties(TransformStatic.prototype, { + /** + * The rotation of the object in radians. + * + * @member {number} + */ + rotation: { + get: function () { + return this._rotation; + }, + set: function (value) { + this._rotation = value; + this._sr = Math.sin(value); + this._cr = Math.cos(value); + } + } +}); + module.exports = TransformStatic; diff --git a/src/particles/webgl/ParticleRenderer.js b/src/particles/webgl/ParticleRenderer.js index 1b885cf..e7c3d87 100644 --- a/src/particles/webgl/ParticleRenderer.js +++ b/src/particles/webgl/ParticleRenderer.js @@ -41,7 +41,7 @@ this.properties = null; - this.tempMatrix = new core.math.Matrix(); + this.tempMatrix = new core.Matrix(); this.CONTEXT_UID = 0; }