lsm/konva
1
0
Fork 0
mirror of https://github.com/konvajs/konva.git synced 2025-06-28 02:21:20 +08:00
Code Issues Actions Packages Projects Releases Wiki Activity

new getAttrs() method

Browse Source
This commit is contained in:
Eric Rowell 2012-04-07 18:50:53 -07:00
parent 0a94c75e22
commit d3b025254a
5 changed files with 69 additions and 11 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

16
dist/kinetic-core.js vendored
View File

@ -284,6 +284,12 @@ Kinetic.Node.prototype = {
}
}
},
/**
* get attrs
*/
getAttrs: function() {
return this.attrs;
},
/**
* show node
*/
@ -1113,7 +1119,7 @@ Kinetic.Stage.prototype = {
addLayer(0);
},
/**
* serialize stage and children as JSON object
* serialize stage and children as a JSON object
*/
toJSON: function() {
var go = Kinetic.GlobalObject;
@ -1140,7 +1146,13 @@ Kinetic.Stage.prototype = {
return JSON.stringify(addNode(this));
},
/**
* load stage with JSON string
* load stage with JSON string. De-serializtion does not generate custom
* shape drawing functions, images, or event handlers (this would make the
* serialized object huge). If your app uses custom shapes, images, and
* event handlers (it probably does), then you need to select the appropriate
* shapes after loading the stage and set these properties via on(), setDrawFunc(),
* and setImage()
* @param {String} JSON string
*/
load: function(json) {
function loadNode(node, obj) {

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

File diff suppressed because one or more lines are too long

6
src/Node.js
View File

@ -149,6 +149,12 @@ Kinetic.Node.prototype = {
}
}
},
/**
* get attrs
*/
getAttrs: function() {
return this.attrs;
},
/**
* show node
*/

10
src/Stage.js
View File

@ -183,7 +183,7 @@ Kinetic.Stage.prototype = {
addLayer(0);
},
/**
* serialize stage and children as JSON object
* serialize stage and children as a JSON object
*/
toJSON: function() {
var go = Kinetic.GlobalObject;
@ -210,7 +210,13 @@ Kinetic.Stage.prototype = {
return JSON.stringify(addNode(this));
},
/**
* load stage with JSON string
* load stage with JSON string. De-serializtion does not generate custom
* shape drawing functions, images, or event handlers (this would make the
* serialized object huge). If your app uses custom shapes, images, and
* event handlers (it probably does), then you need to select the appropriate
* shapes after loading the stage and set these properties via on(), setDrawFunc(),
* and setImage()
* @param {String} JSON string
*/
load: function(json) {
function loadNode(node, obj) {

44
tests/js/unitTests.js
View File

@ -94,6 +94,41 @@ Test.prototype.tests = {
var expectedJson = '{"attrs":{"width":578,"height":200,"visible":true,"listening":true,"alpha":1,"x":0,"y":0,"scale":{"x":1,"y":1},"rotation":0,"centerOffset":{"x":0,"y":0},"dragConstraint":"none","dragBounds":{},"draggable":false},"nodeType":"Stage","children":[{"attrs":{"visible":true,"listening":true,"alpha":1,"x":0,"y":0,"scale":{"x":1,"y":1},"rotation":0,"centerOffset":{"x":0,"y":0},"dragConstraint":"none","dragBounds":{},"draggable":false},"nodeType":"Layer","children":[{"attrs":{"visible":true,"listening":true,"alpha":1,"x":0,"y":0,"scale":{"x":1,"y":1},"rotation":0,"centerOffset":{"x":0,"y":0},"dragConstraint":"none","dragBounds":{},"draggable":false},"nodeType":"Group","children":[{"attrs":{"radius":70,"fill":"green","stroke":"black","strokeWidth":4,"detectionType":"path","visible":true,"listening":true,"name":"myCircle","alpha":1,"x":289,"y":100,"scale":{"x":1,"y":1},"rotation":0,"centerOffset":{"x":0,"y":0},"dragConstraint":"none","dragBounds":{},"draggable":true},"nodeType":"Shape","shapeType":"Circle"}]}]}]}';
test(stage.toJSON() === expectedJson, 'problem with serialization');
},
'STAGE - test getAttrs()': function(containerId) {
var stage = new Kinetic.Stage({
container: containerId,
width: 578,
height: 200
});
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
});
stage.add(layer);
layer.add(group);
group.add(circle);
layer.draw();
var attrs = circle.getAttrs();
test(attrs.x === 100, 'x attr should be 100');
test(attrs.y === 100, 'y attr should be 100');
test(attrs.radius === 70, 'radius attr should be radius');
test(attrs.fill === 'green', 'fill attr should be fill');
test(attrs.stroke === 'black', 'stroke attr should be stroke');
test(attrs.strokeWidth === 4, 'strokeWidth attr should be strokeWidth');
test(attrs.name === 'myCircle', 'name attr should be myCircle');
test(attrs.draggable === true, 'draggable attr should be true');
},
'STAGE - load stage using json': function(containerId) {
var stage = new Kinetic.Stage({
container: containerId,
@ -158,14 +193,13 @@ Test.prototype.tests = {
context.closePath();
this.fillStroke();
};
var json = '{"attrs":{"width":578,"height":200,"visible":true,"listening":true,"alpha":1,"x":0,"y":0,"scale":{"x":1,"y":1},"rotation":0,"centerOffset":{"x":0,"y":0},"dragConstraint":"none","dragBounds":{},"draggable":false},"nodeType":"Stage","children":[{"attrs":{"visible":true,"listening":true,"alpha":1,"x":0,"y":0,"scale":{"x":1,"y":1},"rotation":0,"centerOffset":{"x":0,"y":0},"dragConstraint":"none","dragBounds":{},"draggable":false},"nodeType":"Layer","children":[{"attrs":{"visible":true,"listening":true,"alpha":1,"x":0,"y":0,"scale":{"x":1,"y":1},"rotation":0,"centerOffset":{"x":0,"y":0},"dragConstraint":"none","dragBounds":{},"draggable":false},"nodeType":"Group","children":[{"attrs":{"fill":"#00D2FF","stroke":"black","strokeWidth":4,"detectionType":"path","visible":true,"listening":true,"alpha":1,"x":0,"y":0,"scale":{"x":1,"y":1},"rotation":0,"centerOffset":{"x":0,"y":0},"dragConstraint":"none","dragBounds":{},"draggable":false},"nodeType":"Shape"}]}]}]}';
stage.load(json);
var customShape = stage.getChildren()[0].getChildren()[0].getChildren()[0];
customShape.setDrawFunc(drawTriangle);
stage.draw();
//console.log(stage.toJSON());
@ -1164,7 +1198,7 @@ Test.prototype.tests = {
test(text.getTextSize().height > 0, 'text height should have a value');
test(text.getTextWidth() > 0, 'text width should have a value');
test(text.getTextHeight() > 0, 'text height should have a value');
},
'SHAPES - get shape name': function(containerId) {
var stage = new Kinetic.Stage({