added new selector capability to .get() method. You can now select all nodes by type inside of a container, such as by Shape, Group, or Layer

This commit is contained in:
Eric Rowell 2012-04-27 22:54:39 -07:00
parent 2879c0763f
commit 192681374d
5 changed files with 115 additions and 2 deletions

31
dist/kinetic-core.js vendored
View File

@ -1056,6 +1056,9 @@ Kinetic.Container.prototype = {
else if(selector.charAt(0) === '.') {
arr = stage.names[key] !== undefined ? stage.names[key] : [];
}
else if(selector === 'Shape' || selector === 'Group' || selector === 'Layer') {
return this._getNodes(selector);
}
else {
return false;
}
@ -1090,6 +1093,27 @@ Kinetic.Container.prototype = {
return false;
},
/**
* get all shapes inside container
*/
_getNodes: function(sel) {
var arr = [];
function traverse(cont) {
var children = cont.getChildren();
for(var n = 0; n < children.length; n++) {
var child = children[n];
if(child.nodeType === sel) {
arr.push(child);
}
else if(child.nodeType !== 'Shape') {
traverse(child);
}
}
}
traverse(this);
return arr;
},
/**
* draw children
*/
@ -1514,6 +1538,13 @@ Kinetic.Stage.prototype = {
*/
getHeight: function() {
return this.attrs.height;
},
/**
* get shapes in point
* @param {Object} point
*/
getShapesInPoint: function(pos) {
},
/**
* detect event

File diff suppressed because one or more lines are too long

View File

@ -71,6 +71,9 @@ Kinetic.Container.prototype = {
else if(selector.charAt(0) === '.') {
arr = stage.names[key] !== undefined ? stage.names[key] : [];
}
else if(selector === 'Shape' || selector === 'Group' || selector === 'Layer') {
return this._getNodes(selector);
}
else {
return false;
}
@ -105,6 +108,27 @@ Kinetic.Container.prototype = {
return false;
},
/**
* get all shapes inside container
*/
_getNodes: function(sel) {
var arr = [];
function traverse(cont) {
var children = cont.getChildren();
for(var n = 0; n < children.length; n++) {
var child = children[n];
if(child.nodeType === sel) {
arr.push(child);
}
else if(child.nodeType !== 'Shape') {
traverse(child);
}
}
}
traverse(this);
return arr;
},
/**
* draw children
*/

View File

@ -349,6 +349,13 @@ Kinetic.Stage.prototype = {
*/
getHeight: function() {
return this.attrs.height;
},
/**
* get shapes in point
* @param {Object} point
*/
getShapesInPoint: function(pos) {
},
/**
* detect event

View File

@ -1348,6 +1348,57 @@ Test.prototype.tests = {
y: 151
}) === false, 'intersects with point in shape');
},
'STAGE - node type selector': function(containerId) {
var stage = new Kinetic.Stage({
container: containerId,
width: 578,
height: 200
});
var layer = new Kinetic.Layer();
var fooLayer = new Kinetic.Layer();
var group = new Kinetic.Group();
var blue = new Kinetic.Rect({
x: 200,
y: 100,
width: 100,
height: 50,
fill: 'blue'
});
var red = new Kinetic.Rect({
x: 250,
y: 100,
width: 100,
height: 50,
fill: 'red'
});
group.add(red);
layer.add(blue);
layer.add(group);
stage.add(layer);
stage.add(fooLayer);
test(stage.get('Shape').length === 2, 'stage should have 2 shapes');
test(layer.get('Shape').length === 2, 'layer should have 2 shapes');
test(group.get('Shape').length === 1, 'layer should have 2 shapes');
test(stage.get('Layer').length === 2, 'stage should have 2 layers');
test(stage.get('Group').length === 1, 'stage should have 1 group');
test(layer.get('Group').length === 1, 'layer should have 1 group');
test(layer.get('Shape').length === 2, 'layer should have 2 shapes');
test(layer.get('Layer').length === 0, 'layer should have 0 layers');
test(fooLayer.get('Group').length === 0, 'layer should have 0 groups');
test(fooLayer.get('Shape').length === 0, 'layer should have 0 shapes');
test(group.get('Shape').length === 1, 'group should have 1 shape');
test(group.get('Layer').length === 0, 'group should have 0 layers');
test(group.get('Group').length === 0, 'group should have 0 groups');
},
'Text - add text': function(containerId) {
var stage = new Kinetic.Stage({
container: containerId,