lsm/konva
1
0
Fork 0
mirror of https://github.com/konvajs/konva.git synced 2025-10-14 11:44:55 +08:00
Code Issues Actions Packages Projects Releases Wiki Activity

implemented enableNestedTransforms flag which forces the rendering engine to skip nested transform calculations when they aren't needed

Browse Source
This commit is contained in:
Eric Rowell
2013-12-05 22:29:50 -08:00
parent 76285f59b0
commit 422a6b305b
6 changed files with 72 additions and 5 deletions
Download Patch File Download Diff File Expand all files Collapse all files

20
src/Container.js
View File

@@ -1,8 +1,28 @@
(function() {
var SPACE = '',
TRANSFORM_CHANGE_STR = [
'xChange.kinetic',
'yChange.kinetic',
'scaleXChange.kinetic',
'scaleYChange.kinetic',
'skewXChange.kinetic',
'skewYChange.kinetic',
'rotationChange.kinetic',
'offsetXChange.kinetic',
'offsetYChange.kinetic'
].join(SPACE);
Kinetic.Util.addMethods(Kinetic.Container, {
__init: function(config) {
this.children = new Kinetic.Collection();
Kinetic.Node.call(this, config);
this.on(TRANSFORM_CHANGE_STR, function() {
var stage = this.getStage();
if (stage) {
stage._enableNestedTransforms = true;
}
});
},
/**
* returns a {@link Kinetic.Collection} of direct descendant nodes

10
src/Context.js
View File

@@ -224,7 +224,15 @@
}
},
_applyAncestorTransforms: function(shape) {
var m = shape.getAbsoluteTransform().getMatrix();
var stage = shape.getStage(),
m;
if (stage && stage._enableNestedTransforms) {
m = shape.getAbsoluteTransform().getMatrix();
}
else {
m = shape.getTransform().getMatrix();
}
this.transform(m[0], m[1], m[2], m[3], m[4], m[5]);
},
_clip: function(container) {

2
src/Global.js
View File

@@ -42,7 +42,7 @@ var Kinetic = {};
shapes: {},
listenClickTap: false,
inDblClickWindow: false,
// configurations
enableTrace: false,
traceArrMax: 100,

5
src/Node.js
View File

@@ -42,7 +42,7 @@
X = 'x',
Y = 'y',
transformChangeStr = [
TRANSFORM_CHANGE_STR = [
'xChange.kinetic',
'yChange.kinetic',
'scaleXChange.kinetic',
@@ -64,7 +64,7 @@
this.setAttrs(config);
// event bindings for cache handling
this.on(transformChangeStr, function() {
this.on(TRANSFORM_CHANGE_STR, function() {
this._clearCache(TRANSFORM);
that._clearSelfAndChildrenCache(ABSOLUTE_TRANSFORM);
});
@@ -1251,7 +1251,6 @@
* @memberof Kinetic.Node.prototype
*/
getTransform: function() {
//return this._getTransform();
return this._getCache(TRANSFORM, this._getTransform);
}
});

1
src/Stage.js
View File

@@ -61,6 +61,7 @@
this._id = Kinetic.idCounter++;
this._buildDOM();
this._bindContentEvents();
this._enableNestedTransforms = false;
Kinetic.stages.push(this);
},
_validateAdd: function(child) {

39
test/unit/Container-test.js
View File

@@ -1354,4 +1354,43 @@ suite('Container', function() {
layer.draw();
});
// ======================================================
test.only('Kinetic.enableNestedTransforms flag', function(){
var stage = addStage();
var layer = new Kinetic.Layer();
var rect = new Kinetic.Rect({
x: 100,
y: 50,
width: 100,
height: 50,
fill: 'green',
stroke: 'blue'
});
layer.add(rect);
stage.add(layer);
assert.equal(rect.getX(), 100);
assert.equal(rect.getY(), 50);
var trace = layer.getContext().getTrace();
//console.log(trace);
assert.equal(trace, 'clearRect(0,0,578,200);save();transform(1,0,0,1,100,50);beginPath();rect(0,0,100,50);closePath();fillStyle=green;fill();lineWidth=2;strokeStyle=blue;stroke();restore();');
var relaxedTrace = layer.getContext().getTrace(true);
//console.log(relaxedTrace);
assert.equal(relaxedTrace, 'clearRect();save();transform();beginPath();rect();closePath();fillStyle;fill();lineWidth;strokeStyle;stroke();restore();');
assert.equal(stage._enableNestedTransforms, false, 'enableNestedTransforms should be false');
// changing any container transform property should permanately set the _enableNestedTransforms flag to true
layer.setX(1);
layer.setX(0);
assert.equal(stage._enableNestedTransforms, true, 'enableNestedTransforms should be true');
});
});