diff --git a/src/Context.js b/src/Context.js index 14a2211b..46a26c2f 100644 --- a/src/Context.js +++ b/src/Context.js @@ -227,14 +227,7 @@ var m; if (shape.isTransformsEnabled()) { - if (shape.isAncestorTransformsEnabled()) { - // poor performance - m = shape.getAbsoluteTransform().getMatrix(); - } - else { - // better performance - m = shape.getTransform().getMatrix(); - } + m = shape.getAbsoluteTransform().getMatrix(); this.transform(m[0], m[1], m[2], m[3], m[4], m[5]); } else { diff --git a/src/Node.js b/src/Node.js index 63d47327..f748c1e6 100644 --- a/src/Node.js +++ b/src/Node.js @@ -32,7 +32,8 @@ 'skewYChange.kinetic', 'rotationChange.kinetic', 'offsetXChange.kinetic', - 'offsetYChange.kinetic' + 'offsetYChange.kinetic', + 'transformsEnabledChange.kinetic' ].join(SPACE); Kinetic.Util.addMethods(Kinetic.Node, { @@ -974,8 +975,10 @@ m; this._eachAncestorReverse(function(node) { - m = node.getTransform(); - am.multiply(m); + if (node.isTransformsEnabled()) { + m = node.getTransform(); + am.multiply(m); + } }, true); return am; }, @@ -1365,26 +1368,6 @@ this.drawHit(); return this; }, - /** - * enable ancestor transforms - * @method - * @memberof Kinetic.Node.prototype - * @returns {Node} - */ - enableAncestorTransforms: function() { - this.setAncestorTransformsEnabled(true); - return this; - }, - /** - * disable ancestor transforms - * @method - * @memberof Kinetic.Node.prototype - * @returns {Node} - */ - disableAncestorTransforms: function() { - this.setAncestorTransformsEnabled(false); - return this; - }, /** * enable transforms * @method @@ -1803,27 +1786,6 @@ * @returns {Boolean} */ - Kinetic.Factory.addGetterSetter(Kinetic.Node, 'ancestorTransformsEnabled', true); - - /** - * enable/disable ancestor transforms - * @name setAncestorTransformsEnabled - * @method - * @memberof Kinetic.Node.prototype - * @param {Boolean} enabled - * @returns {Node} - */ - - /** - * determine if ancestor transforms are enabled - * @name getAncestorTransformsEnabled - * @method - * @memberof Kinetic.Node.prototype - * @returns {Boolean} - */ - - Kinetic.Node.prototype.isAncestorTransformsEnabled = Kinetic.Node.prototype.getAncestorTransformsEnabled; - Kinetic.Factory.addGetterSetter(Kinetic.Node, 'transformsEnabled', true); /** diff --git a/test/unit/Node-test.js b/test/unit/Node-test.js index f50b3ebf..f7e9f222 100644 --- a/test/unit/Node-test.js +++ b/test/unit/Node-test.js @@ -2649,43 +2649,10 @@ suite('Node', function() { assert.equal(rect.shouldDrawHit(), false); - }); - - // ====================================================== - test('ancestorTransformEnabled', function(){ - var stage = addStage(); - var layer = new Kinetic.Layer(); - var group = new Kinetic.Group(); - var circle = new Kinetic.Circle({ - x: 100, - y: 100, - radius: 70, - fill: 'green', - stroke: 'black', - strokeWidth: 4, - name: 'myCircle', - draggable: true - }); - - group.add(circle); - layer.add(group); - stage.add(layer); - - assert.equal(circle.isAncestorTransformsEnabled(), true); - - circle.disableAncestorTransforms(); - - assert.equal(circle.isAncestorTransformsEnabled(), false); - - circle.enableAncestorTransforms(); - - assert.equal(circle.isAncestorTransformsEnabled(), true); - - }); // ====================================================== - test('transformEnabled', function(){ + test('transformEnabled methods', function(){ var stage = addStage(); var layer = new Kinetic.Layer(); var group = new Kinetic.Group(); @@ -2719,6 +2686,58 @@ suite('Node', function() { }); + // ====================================================== + test('transformEnabled context tracing', function(){ + var stage = addStage(); + + stage.setX(100); + + var layer = new Kinetic.Layer({ + x: 100 + }); + var group = new Kinetic.Group({ + x: 100 + }); + var circle = new Kinetic.Circle({ + x: 100, + y: 100, + radius: 40, + fill: 'green', + stroke: 'black', + strokeWidth: 4, + name: 'myCircle', + draggable: true + }); + + group.add(circle); + layer.add(group); + stage.add(layer); + assert.equal(layer.getContext().getTrace(), 'clearRect(0,0,578,200);save();transform(1,0,0,1,400,100);beginPath();arc(0,0,40,0,6.283,false);closePath();fillStyle=green;fill();lineWidth=4;strokeStyle=black;stroke();restore();'); + + stage.disableTransforms(); + layer.getContext().clearTrace(); + stage.draw(); + assert.equal(layer.getContext().getTrace(), 'clearRect(0,0,578,200);save();transform(1,0,0,1,300,100);beginPath();arc(0,0,40,0,6.283,false);closePath();fillStyle=green;fill();lineWidth=4;strokeStyle=black;stroke();restore();'); + + layer.disableTransforms(); + layer.getContext().clearTrace(); + stage.draw(); + assert.equal(layer.getContext().getTrace(), 'clearRect(0,0,578,200);save();transform(1,0,0,1,200,100);beginPath();arc(0,0,40,0,6.283,false);closePath();fillStyle=green;fill();lineWidth=4;strokeStyle=black;stroke();restore();'); + + group.disableTransforms(); + layer.getContext().clearTrace(); + stage.draw(); + assert.equal(layer.getContext().getTrace(), 'clearRect(0,0,578,200);save();transform(1,0,0,1,100,100);beginPath();arc(0,0,40,0,6.283,false);closePath();fillStyle=green;fill();lineWidth=4;strokeStyle=black;stroke();restore();'); + + // disabling a shape transform disables all transforms but x and y. In this case, the Kinetic.Context uses translate instead of transform + circle.disableTransforms(); + layer.getContext().clearTrace(); + stage.draw(); + assert.equal(layer.getContext().getTrace(), 'clearRect(0,0,578,200);save();translate(100,100);beginPath();arc(0,0,40,0,6.283,false);closePath();fillStyle=green;fill();lineWidth=4;strokeStyle=black;stroke();restore();'); + + //console.log(layer.getContext().getTrace()); + + }); // ====================================================== test('isVisible', function(){