lsm/konva
1
0
Fork 0
mirror of https://github.com/konvajs/konva.git synced 2025-12-04 19:08:24 +08:00
Code Issues Actions Packages Projects Releases Wiki Activity

added new getAbsoluteZIndex() and getLevel() methods to Node

Browse Source
This commit is contained in:
Eric Rowell
2012-03-31 15:17:36 -07:00
parent 99d9381411
commit 8398670a47
4 changed files with 154 additions and 1 deletions
Download Patch File Download Diff File Expand all files Collapse all files

46
dist/kinetic-core.js vendored
View File

@@ -396,6 +396,52 @@ Kinetic.Node.prototype = {
getZIndex: function() {
return this.index;
},
/**
* get absolute z-index by taking into account
* all parent and sibling indices
*/
getAbsoluteZIndex: function() {
var level = this.getLevel();
var stage = this.getStage();
var that = this;
var index = 0;
function addChildren(children) {
var nodes = [];
for(var n = 0; n < children.length; n++) {
var child = children[n];
index++;
if(child.className !== 'Shape') {
nodes = nodes.concat(child.getChildren());
}
if(child.id === that.id) {
n = children.length;
}
}
if(nodes.length > 0 && nodes[0].getLevel() <= level) {
addChildren(nodes);
}
}
if(that.className !== 'Stage') {
addChildren(that.getStage().getChildren());
}
return index;
},
/**
* get node level in node tree
*/
getLevel: function() {
var level = 0;
var parent = this.parent;
while(parent) {
level++;
parent = parent.parent;
}
return level;
},
/**
* set node scale. If only one parameter is passed in,
* then both scaleX and scaleY are set with that parameter

2
dist/kinetic-core.min.js vendored
View File

File diff suppressed because one or more lines are too long

46
src/Node.js
View File

@@ -149,6 +149,52 @@ Kinetic.Node.prototype = {
getZIndex: function() {
return this.index;
},
/**
* get absolute z-index by taking into account
* all parent and sibling indices
*/
getAbsoluteZIndex: function() {
var level = this.getLevel();
var stage = this.getStage();
var that = this;
var index = 0;
function addChildren(children) {
var nodes = [];
for(var n = 0; n < children.length; n++) {
var child = children[n];
index++;
if(child.className !== 'Shape') {
nodes = nodes.concat(child.getChildren());
}
if(child.id === that.id) {
n = children.length;
}
}
if(nodes.length > 0 && nodes[0].getLevel() <= level) {
addChildren(nodes);
}
}
if(that.className !== 'Stage') {
addChildren(that.getStage().getChildren());
}
return index;
},
/**
* get node level in node tree
*/
getLevel: function() {
var level = 0;
var parent = this.parent;
while(parent) {
level++;
parent = parent.parent;
}
return level;
},
/**
* set node scale. If only one parameter is passed in,
* then both scaleX and scaleY are set with that parameter

61
tests/js/unitTests.js
View File

@@ -1369,6 +1369,67 @@ Test.prototype.tests = {
// LAYERING tests
////////////////////////////////////////////////////////////////////////
'LAYERING - get absolute z index': function(containerId) {
var stage = new Kinetic.Stage({
container: containerId,
width: 578,
height: 200
});
var layer = new Kinetic.Layer();
var group1 = new Kinetic.Group();
var group2 = new Kinetic.Group();
var group3 = new Kinetic.Group();
var group4 = new Kinetic.Group();
var shape1 = new Kinetic.Circle({
x: 150,
y: stage.height / 2,
radius: 40,
fill: 'green'
});
var shape2 = new Kinetic.Circle({
x: 250,
y: stage.height / 2,
radius: 40,
fill: 'green'
});
/*
* Stage(0)
* |
* Layer(1)
* |
* +-----+-----+
* | |
* G1(2) G2(3)
* | |
* + +---+---+
* | | |
* S1(4) G3(5) G4(6)
* |
* +
* |
* S2(7)
*/
group1.add(shape1);
group2.add(group3);
group2.add(group4);
group3.add(shape2);
layer.add(group1);
layer.add(group2);
stage.add(layer);
test(stage.getAbsoluteZIndex() === 0, 'stage abs zindex should be 0');
test(layer.getAbsoluteZIndex() === 1, 'layer abs zindex should be 1');
test(group1.getAbsoluteZIndex() === 2, 'group1 abs zindex should be 2');
test(group2.getAbsoluteZIndex() === 3, 'group2 abs zindex should be 3');
test(shape1.getAbsoluteZIndex() === 4, 'shape1 abs zindex should be 4');
test(group3.getAbsoluteZIndex() === 5, 'group3 abs zindex should be 5');
test(group4.getAbsoluteZIndex() === 6, 'group4 abs zindex should be 6');
test(shape2.getAbsoluteZIndex() === 7, 'shape2 abs zindex should be 7');
},
'LAYERING - move blue circle on top of green circle with moveToTop': function(containerId) {
var stage = new Kinetic.Stage({
container: containerId,