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

unit tests and functional tests now passing. Next up, re-integrate serialization with new attrs structure

Browse Source
This commit is contained in:
Eric Rowell 2012-04-07 14:04:15 -07:00
parent 6d618b97b5
commit ff896a4946
8 changed files with 119 additions and 155 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

55
dist/kinetic-core.js vendored
View File

@ -3,7 +3,7 @@
* http://www.kineticjs.com/
* Copyright 2012, Eric Rowell
* Licensed under the MIT or GPL Version 2 licenses.
* Date: Apr 05 2012
* Date: Apr 07 2012
*
* Copyright (C) 2011 - 2012 by Eric Rowell
*
@ -967,6 +967,10 @@ Kinetic.Stage = function(config) {
config.container = document.getElementById(config.container);
}
// call super constructors
Kinetic.Container.apply(this, []);
Kinetic.Node.apply(this, [config]);
this.nodeType = 'Stage';
this.container = config.container;
this.content = document.createElement('div');
@ -998,10 +1002,6 @@ Kinetic.Stage = function(config) {
// add stage to global object
Kinetic.GlobalObject.stages.push(this);
// call super constructors
Kinetic.Container.apply(this, []);
Kinetic.Node.apply(this, [config]);
};
/*
* Stage methods
@ -1093,9 +1093,11 @@ Kinetic.Stage.prototype = {
var bufferLayer = this.bufferLayer;
var bufferContext = bufferLayer.getContext();
var layers = this.children;
var that = this;
function addLayer(n) {
var dataURL = layers[n].getCanvas().toDataURL();
console.log(dataURL);
var imageObj = new Image();
imageObj.onload = function() {
bufferContext.drawImage(this, 0, 0);
@ -1657,8 +1659,8 @@ Kinetic.Stage.prototype = {
// default
var newNodePos = {
x: pos.attrs.x - go.drag.offset.x,
y: pos.attrs.y - go.drag.offset.y
x: pos.x - go.drag.offset.x,
y: pos.y - go.drag.offset.y
};
// bounds overrides
@ -2299,30 +2301,22 @@ Kinetic.Image = function(config) {
if(this.attrs === undefined) {
this.attrs = {};
}
this.attrs.width = 0;
this.attrs.height = 0;
// special
this.image = config.image;
// defaults
if(config.width === undefined) {
config.width = config.image.width;
}
if(config.height === undefined) {
config.height = config.image.height;
}
this.shapeType = "Image";
config.drawFunc = function() {
var width = this.attrs.width !== undefined ? this.attrs.width : this.image.width;
var height = this.attrs.height !== undefined ? this.attrs.height : this.image.height;
var canvas = this.getCanvas();
var context = this.getContext();
context.beginPath();
this.applyLineJoin();
context.rect(0, 0, this.attrs.width, this.attrs.height);
context.rect(0, 0, width, height);
context.closePath();
this.fillStroke();
context.drawImage(this.image, 0, 0, this.attrs.width, this.attrs.height);
context.drawImage(this.image, 0, 0, width, height);
};
// call super constructor
Kinetic.Shape.apply(this, [config]);
@ -2409,7 +2403,6 @@ Kinetic.Polygon = function(config) {
this.attrs.points = {};
this.shapeType = "Polygon";
config.drawFunc = function() {
var context = this.getContext();
context.beginPath();
@ -2464,7 +2457,6 @@ Kinetic.RegularPolygon = function(config) {
this.attrs.sides = 0;
this.shapeType = "RegularPolygon";
config.drawFunc = function() {
var context = this.getContext();
context.beginPath();
@ -2618,6 +2610,7 @@ Kinetic.Text = function(config) {
this.attrs.fontFamily = '';
this.attrs.text = '';
this.attrs.fontSize = 12;
this.attrs.fill = undefined;
this.attrs.textStroke = undefined;
this.attrs.textStrokeWidth = undefined;
this.attrs.align = 'left';
@ -2627,18 +2620,6 @@ Kinetic.Text = function(config) {
this.shapeType = "Text";
/*
* special defaults
*/
if(config.textStroke !== undefined || config.textStrokeWidth !== undefined) {
if(config.textStroke === undefined) {
config.textStroke = 'black';
}
else if(config.textStrokeWidth === undefined) {
config.textStrokeWidth = 2;
}
}
config.drawFunc = function() {
var context = this.getContext();
context.font = this.attrs.fontStyle + ' ' + this.attrs.fontSize + 'pt ' + this.attrs.fontFamily;
@ -3067,8 +3048,8 @@ Kinetic.Transition.prototype = {
}
var tween = new Kinetic.Tween(node, function(i) {
node[key] = i;
}, Kinetic.Tweens[easing], node[key], config[key], config.duration);
node.attrs[key] = i;
}, Kinetic.Tweens[easing], node.attrs[key], config[key], config.duration);
return tween;
},
@ -3081,8 +3062,8 @@ Kinetic.Transition.prototype = {
}
var tween = new Kinetic.Tween(node, function(i) {
node[key][prop] = i;
}, Kinetic.Tweens[easing], node[key][prop], config[key][prop], config.duration);
node.attrs[key][prop] = i;
}, Kinetic.Tweens[easing], node.attrs[key][prop], config[key][prop], config.duration);
return tween;
},

14
src/Stage.js
View File

@ -27,6 +27,10 @@ Kinetic.Stage = function(config) {
config.container = document.getElementById(config.container);
}
// call super constructors
Kinetic.Container.apply(this, []);
Kinetic.Node.apply(this, [config]);
this.nodeType = 'Stage';
this.container = config.container;
this.content = document.createElement('div');
@ -58,10 +62,6 @@ Kinetic.Stage = function(config) {
// add stage to global object
Kinetic.GlobalObject.stages.push(this);
// call super constructors
Kinetic.Container.apply(this, []);
Kinetic.Node.apply(this, [config]);
};
/*
* Stage methods
@ -153,9 +153,11 @@ Kinetic.Stage.prototype = {
var bufferLayer = this.bufferLayer;
var bufferContext = bufferLayer.getContext();
var layers = this.children;
var that = this;
function addLayer(n) {
var dataURL = layers[n].getCanvas().toDataURL();
console.log(dataURL);
var imageObj = new Image();
imageObj.onload = function() {
bufferContext.drawImage(this, 0, 0);
@ -717,8 +719,8 @@ Kinetic.Stage.prototype = {
// default
var newNodePos = {
x: pos.attrs.x - go.drag.offset.x,
y: pos.attrs.y - go.drag.offset.y
x: pos.x - go.drag.offset.x,
y: pos.y - go.drag.offset.y
};
// bounds overrides

16
src/shapes/Image.js
View File

@ -12,30 +12,22 @@ Kinetic.Image = function(config) {
if(this.attrs === undefined) {
this.attrs = {};
}
this.attrs.width = 0;
this.attrs.height = 0;
// special
this.image = config.image;
// defaults
if(config.width === undefined) {
config.width = config.image.width;
}
if(config.height === undefined) {
config.height = config.image.height;
}
this.shapeType = "Image";
config.drawFunc = function() {
var width = this.attrs.width !== undefined ? this.attrs.width : this.image.width;
var height = this.attrs.height !== undefined ? this.attrs.height : this.image.height;
var canvas = this.getCanvas();
var context = this.getContext();
context.beginPath();
this.applyLineJoin();
context.rect(0, 0, this.attrs.width, this.attrs.height);
context.rect(0, 0, width, height);
context.closePath();
this.fillStroke();
context.drawImage(this.image, 0, 0, this.attrs.width, this.attrs.height);
context.drawImage(this.image, 0, 0, width, height);
};
// call super constructor
Kinetic.Shape.apply(this, [config]);

1
src/shapes/Polygon.js
View File

@ -15,7 +15,6 @@ Kinetic.Polygon = function(config) {
this.attrs.points = {};
this.shapeType = "Polygon";
config.drawFunc = function() {
var context = this.getContext();
context.beginPath();

1
src/shapes/RegularPolygon.js
View File

@ -16,7 +16,6 @@ Kinetic.RegularPolygon = function(config) {
this.attrs.sides = 0;
this.shapeType = "RegularPolygon";
config.drawFunc = function() {
var context = this.getContext();
context.beginPath();

13
src/shapes/Text.js
View File

@ -15,6 +15,7 @@ Kinetic.Text = function(config) {
this.attrs.fontFamily = '';
this.attrs.text = '';
this.attrs.fontSize = 12;
this.attrs.fill = undefined;
this.attrs.textStroke = undefined;
this.attrs.textStrokeWidth = undefined;
this.attrs.align = 'left';
@ -24,18 +25,6 @@ Kinetic.Text = function(config) {
this.shapeType = "Text";
/*
* special defaults
*/
if(config.textStroke !== undefined || config.textStrokeWidth !== undefined) {
if(config.textStroke === undefined) {
config.textStroke = 'black';
}
else if(config.textStrokeWidth === undefined) {
config.textStrokeWidth = 2;
}
}
config.drawFunc = function() {
var context = this.getContext();
context.font = this.attrs.fontStyle + ' ' + this.attrs.fontSize + 'pt ' + this.attrs.fontFamily;

8
src/util/Transition.js
View File

@ -84,8 +84,8 @@ Kinetic.Transition.prototype = {
}
var tween = new Kinetic.Tween(node, function(i) {
node[key] = i;
}, Kinetic.Tweens[easing], node[key], config[key], config.duration);
node.attrs[key] = i;
}, Kinetic.Tweens[easing], node.attrs[key], config[key], config.duration);
return tween;
},
@ -98,8 +98,8 @@ Kinetic.Transition.prototype = {
}
var tween = new Kinetic.Tween(node, function(i) {
node[key][prop] = i;
}, Kinetic.Tweens[easing], node[key][prop], config[key][prop], config.duration);
node.attrs[key][prop] = i;
}, Kinetic.Tweens[easing], node.attrs[key][prop], config[key][prop], config.duration);
return tween;
},

166
tests/js/functionalTests.js
View File

@ -27,6 +27,7 @@ Test.prototype.tests = {
easing: 'bounce-ease-out'
});
},
/*
'TRANSITION - all transition types': function(containerId) {
document.getElementById(containerId).style.height = '300px';
@ -60,6 +61,7 @@ Test.prototype.tests = {
stage.add(layer);
},
*/
'TRANSITION - transition callback': function(containerId) {
var stage = new Kinetic.Stage({
container: containerId,
@ -208,10 +210,10 @@ Test.prototype.tests = {
var amplitude = 150;
var period = 1000;
// in ms
var centerX = stage.width / 2 - 100 / 2;
var centerX = stage.getWidth() / 2 - 100 / 2;
stage.onFrame(function(frame) {
rect.x = amplitude * Math.sin(frame.time * 2 * Math.PI / period) + centerX;
rect.attrs.x = amplitude * Math.sin(frame.time * 2 * Math.PI / period) + centerX;
layer.draw();
});
@ -229,8 +231,8 @@ Test.prototype.tests = {
});
var layer = new Kinetic.Layer();
var rect = new Kinetic.Rect({
x: stage.width / 2 - 50,
y: stage.height / 2 - 25,
x: stage.getWidth() / 2 - 50,
y: stage.getHeight() / 2 - 25,
width: 100,
height: 50,
fill: 'green',
@ -274,8 +276,8 @@ Test.prototype.tests = {
});
var layer = new Kinetic.Layer();
var rect = new Kinetic.Rect({
x: stage.width / 2 - 50,
y: stage.height / 2 - 25,
x: stage.getWidth() / 2 - 50,
y: stage.getHeight() / 2 - 25,
width: 100,
height: 50,
fill: 'green',
@ -321,8 +323,8 @@ Test.prototype.tests = {
});
var layer = new Kinetic.Layer();
var rect = new Kinetic.Rect({
x: stage.width / 2 - 50,
y: stage.height / 2 - 25,
x: stage.getWidth() / 2 - 50,
y: stage.getHeight() / 2 - 25,
width: 100,
height: 50,
fill: 'green',
@ -368,8 +370,8 @@ Test.prototype.tests = {
});
var layer = new Kinetic.Layer();
var rect = new Kinetic.Rect({
x: stage.width / 2 - 50,
y: stage.height / 2 - 25,
x: stage.getWidth() / 2 - 50,
y: stage.getHeight(0) / 2 - 25,
width: 100,
height: 50,
fill: 'green',
@ -438,7 +440,7 @@ Test.prototype.tests = {
var layer = new Kinetic.Layer();
var greenBox = new Kinetic.Rect({
x: 50,
y: stage.height / 2 - 25,
y: stage.getHeight() / 2 - 25,
width: 100,
height: 50,
fill: 'green',
@ -451,8 +453,8 @@ Test.prototype.tests = {
});
var blueBox = new Kinetic.Rect({
x: stage.width / 2 - 50,
y: stage.height / 2 - 25,
x: stage.getWidth() / 2 - 50,
y: stage.getHeight() / 2 - 25,
width: 100,
height: 50,
fill: 'blue',
@ -466,7 +468,7 @@ Test.prototype.tests = {
var redBox = new Kinetic.Rect({
x: 428,
y: stage.height / 2 - 25,
y: stage.getHeight() / 2 - 25,
width: 100,
height: 50,
fill: 'red',
@ -495,8 +497,8 @@ Test.prototype.tests = {
});
var layer = new Kinetic.Layer();
var circle = new Kinetic.Circle({
x: stage.width / 2,
y: stage.height / 2,
x: stage.getWidth() / 2,
y: stage.getHeight() / 2,
radius: 70,
fill: 'red',
stroke: 'black',
@ -552,7 +554,7 @@ Test.prototype.tests = {
var layer = new Kinetic.Layer();
var circle = new Kinetic.Circle({
x: 380,
y: stage.height / 2,
y: stage.getHeight() / 2,
radius: 70,
strokeWidth: 4,
fill: 'red',
@ -740,7 +742,7 @@ Test.prototype.tests = {
var layer = new Kinetic.Layer();
var circle = new Kinetic.Circle({
x: 380,
y: stage.height / 2,
y: stage.getHeight() / 2,
radius: 70,
strokeWidth: 4,
fill: 'red',
@ -778,7 +780,7 @@ Test.prototype.tests = {
var redCircle = new Kinetic.Circle({
x: 200,
y: stage.height / 2,
y: stage.getHeight() / 2,
radius: 70,
strokeWidth: 4,
fill: 'red',
@ -793,7 +795,7 @@ Test.prototype.tests = {
});
var greenCircle = new Kinetic.Circle({
x: 280,
y: stage.height / 2,
y: stage.getHeight() / 2,
radius: 70,
strokeWidth: 4,
fill: 'green',
@ -824,7 +826,7 @@ Test.prototype.tests = {
var redCircle = new Kinetic.Circle({
x: 200,
y: stage.height / 2,
y: stage.getHeight() / 2,
radius: 70,
strokeWidth: 4,
fill: 'red',
@ -839,7 +841,7 @@ Test.prototype.tests = {
});
var greenCircle = new Kinetic.Circle({
x: 280,
y: stage.height / 2,
y: stage.getHeight() / 2,
radius: 70,
strokeWidth: 4,
fill: 'green',
@ -872,7 +874,7 @@ Test.prototype.tests = {
var redCircle = new Kinetic.Circle({
x: 200,
y: stage.height / 2,
y: stage.getHeight() / 2,
radius: 70,
strokeWidth: 4,
fill: 'red',
@ -887,7 +889,7 @@ Test.prototype.tests = {
});
var greenCircle = new Kinetic.Circle({
x: 280,
y: stage.height / 2,
y: stage.getHeight() / 2,
radius: 70,
strokeWidth: 4,
fill: 'green',
@ -919,7 +921,7 @@ Test.prototype.tests = {
var redCircle = new Kinetic.Circle({
x: 200,
y: stage.height / 2,
y: stage.getHeight() / 2,
radius: 70,
strokeWidth: 4,
fill: 'red',
@ -931,7 +933,7 @@ Test.prototype.tests = {
});
var greenCircle = new Kinetic.Circle({
x: 280,
y: stage.height / 2,
y: stage.getHeight() / 2,
radius: 70,
strokeWidth: 4,
fill: 'green',
@ -964,8 +966,8 @@ Test.prototype.tests = {
//console.log(this);
});
var redCircle = new Kinetic.Circle({
x: stage.width / 2,
y: stage.height / 2,
x: stage.getWidth() / 2,
y: stage.getHeight() / 2,
radius: 80,
strokeWidth: 4,
fill: 'red',
@ -974,8 +976,8 @@ Test.prototype.tests = {
});
var greenCircle = new Kinetic.Circle({
x: stage.width / 2,
y: stage.height / 2,
x: stage.getWidth() / 2,
y: stage.getHeight() / 2,
radius: 40,
strokeWidth: 4,
fill: 'green',
@ -1003,8 +1005,8 @@ Test.prototype.tests = {
//console.log(this);
});
var redCircle = new Kinetic.Circle({
x: stage.width / 2,
y: stage.height / 2,
x: stage.getWidth() / 2,
y: stage.getHeight() / 2,
radius: 80,
strokeWidth: 4,
fill: 'red',
@ -1012,8 +1014,8 @@ Test.prototype.tests = {
});
var greenCircle = new Kinetic.Circle({
x: stage.width / 2,
y: stage.height / 2,
x: stage.getWidth() / 2,
y: stage.getHeight() / 2,
radius: 40,
strokeWidth: 4,
fill: 'green',
@ -1045,8 +1047,8 @@ Test.prototype.tests = {
log('mouseout group');
});
var redCircle = new Kinetic.Circle({
x: stage.width / 2,
y: stage.height / 2,
x: stage.getWidth() / 2,
y: stage.getHeight() / 2,
radius: 80,
strokeWidth: 4,
fill: 'red',
@ -1055,8 +1057,8 @@ Test.prototype.tests = {
});
var greenCircle = new Kinetic.Circle({
x: stage.width / 2,
y: stage.height / 2,
x: stage.getWidth() / 2,
y: stage.getHeight() / 2,
radius: 40,
strokeWidth: 4,
fill: 'green',
@ -1088,8 +1090,8 @@ Test.prototype.tests = {
//console.log(this);
});
var redCircle = new Kinetic.Circle({
x: stage.width / 2,
y: stage.height / 2,
x: stage.getWidth() / 2,
y: stage.getHeight() / 2,
radius: 80,
strokeWidth: 4,
fill: 'red',
@ -1119,8 +1121,8 @@ Test.prototype.tests = {
});
var redCircle = new Kinetic.Circle({
x: stage.width / 2,
y: stage.height / 2,
x: stage.getWidth() / 2,
y: stage.getHeight() / 2,
radius: 80,
strokeWidth: 4,
fill: 'red',
@ -1142,7 +1144,7 @@ Test.prototype.tests = {
var redCircle = new Kinetic.Circle({
x: 550,
y: stage.height / 2,
y: stage.getHeight() / 2,
radius: 80,
strokeWidth: 4,
fill: 'red',
@ -1166,7 +1168,7 @@ Test.prototype.tests = {
var layer = new Kinetic.Layer();
var circle = new Kinetic.Circle({
x: 380,
y: stage.height / 2,
y: stage.getHeight() / 2,
radius: 70,
strokeWidth: 4,
fill: 'red',
@ -1208,7 +1210,7 @@ Test.prototype.tests = {
var layer = new Kinetic.Layer();
var circle = new Kinetic.Circle({
x: 380,
y: stage.height / 2,
y: stage.getHeight() / 2,
radius: 70,
strokeWidth: 4,
fill: 'red',
@ -1231,8 +1233,8 @@ Test.prototype.tests = {
});
var layer = new Kinetic.Layer();
var circle = new Kinetic.Circle({
x: stage.width / 2,
y: stage.height / 2,
x: stage.getWidth() / 2,
y: stage.getHeight() / 2,
radius: 70,
fill: 'red',
stroke: 'black',
@ -1252,8 +1254,8 @@ Test.prototype.tests = {
});
var layer = new Kinetic.Layer();
var circle = new Kinetic.Circle({
x: stage.width / 2,
y: stage.height / 2,
x: stage.getWidth() / 2,
y: stage.getHeight() / 2,
radius: 70,
fill: 'red',
stroke: 'black',
@ -1307,8 +1309,8 @@ Test.prototype.tests = {
});
var layer = new Kinetic.Layer();
var circle = new Kinetic.Circle({
x: stage.width / 2,
y: stage.height / 2,
x: stage.getWidth() / 2,
y: stage.getHeight() / 2,
radius: 70,
fill: 'red',
stroke: 'black',
@ -1329,8 +1331,8 @@ Test.prototype.tests = {
});
var layer = new Kinetic.Layer();
var circle = new Kinetic.Circle({
x: stage.width / 2,
y: stage.height / 2,
x: stage.getWidth() / 2,
y: stage.getHeight() / 2,
radius: 70,
fill: 'red',
stroke: 'black',
@ -1354,8 +1356,8 @@ Test.prototype.tests = {
});
var layer = new Kinetic.Layer();
var circle = new Kinetic.Circle({
x: stage.width / 2,
y: stage.height / 2,
x: stage.getWidth() / 2,
y: stage.getHeight() / 2,
radius: 70,
fill: 'red',
stroke: 'black',
@ -1377,8 +1379,8 @@ Test.prototype.tests = {
});
var layer = new Kinetic.Layer();
var circle1 = new Kinetic.Circle({
x: stage.width / 2,
y: stage.height / 2,
x: stage.getWidth() / 2,
y: stage.getHeight() / 2,
radius: 70,
fill: 'red',
stroke: 'black',
@ -1386,8 +1388,8 @@ Test.prototype.tests = {
});
var circle2 = new Kinetic.Circle({
x: stage.width / 2 + 50,
y: stage.height / 2,
x: stage.getWidth() / 2 + 50,
y: stage.getHeight() / 2,
radius: 70,
fill: 'green',
stroke: 'black',
@ -1416,8 +1418,8 @@ Test.prototype.tests = {
y: 10
});
var circle = new Kinetic.Circle({
x: stage.width / 2,
y: stage.height / 2,
x: stage.getWidth() / 2,
y: stage.getHeight() / 2,
radius: 70,
fill: 'red',
stroke: 'black',
@ -1438,8 +1440,8 @@ Test.prototype.tests = {
});
var layer = new Kinetic.Layer();
var circle = new Kinetic.Circle({
x: stage.width / 2,
y: stage.height / 2,
x: stage.getWidth() / 2,
y: stage.getHeight() / 2,
radius: 70,
fill: 'red',
stroke: 'black',
@ -1459,8 +1461,8 @@ Test.prototype.tests = {
});
var layer = new Kinetic.Layer();
var circle = new Kinetic.Circle({
x: stage.width / 2,
y: stage.height / 2,
x: stage.getWidth() / 2,
y: stage.getHeight() / 2,
radius: 70,
fill: 'red',
stroke: 'black',
@ -1480,8 +1482,8 @@ Test.prototype.tests = {
});
var layer = new Kinetic.Layer();
var circle = new Kinetic.Circle({
x: stage.width / 2,
y: stage.height / 2,
x: stage.getWidth() / 2,
y: stage.getHeight() / 2,
radius: 70,
fill: 'red',
stroke: 'black',
@ -1503,8 +1505,8 @@ Test.prototype.tests = {
});
var layer = new Kinetic.Layer();
var circle = new Kinetic.Circle({
x: stage.width / 2,
y: stage.height / 2,
x: stage.getWidth() / 2,
y: stage.getHeight() / 2,
radius: 70,
fill: 'red',
stroke: 'black',
@ -1526,8 +1528,8 @@ Test.prototype.tests = {
});
var layer = new Kinetic.Layer();
var circle = new Kinetic.Circle({
x: stage.width / 2,
y: stage.height / 2,
x: stage.getWidth() / 2,
y: stage.getHeight() / 2,
radius: 70,
fill: 'red',
stroke: 'black',
@ -1549,8 +1551,8 @@ Test.prototype.tests = {
});
var layer = new Kinetic.Layer();
var circle = new Kinetic.Circle({
x: stage.width / 2,
y: stage.height / 2,
x: stage.getWidth() / 2,
y: stage.getHeight() / 2,
radius: 70,
fill: 'red',
stroke: 'black',
@ -1572,8 +1574,8 @@ Test.prototype.tests = {
});
var layer = new Kinetic.Layer();
var circle = new Kinetic.Circle({
x: stage.width / 2,
y: stage.height / 2,
x: stage.getWidth() / 2,
y: stage.getHeight() / 2,
radius: 70,
fill: 'red',
stroke: 'black',
@ -1603,7 +1605,7 @@ Test.prototype.tests = {
var layer = new Kinetic.Layer();
var circle = new Kinetic.Circle({
x: stage.width / 2,
x: stage.getWidth() / 2,
y: 100,
radius: 50,
fill: 'blue',
@ -1681,8 +1683,8 @@ Test.prototype.tests = {
var layer = new Kinetic.Layer();
var circle = new Kinetic.Circle({
x: stage.width / 2,
y: stage.height / 2,
x: stage.getWidth() / 2,
y: stage.getHeight() / 2,
radius: 70,
fill: 'violet',
stroke: 'black',
@ -1712,8 +1714,8 @@ Test.prototype.tests = {
var layer = new Kinetic.Layer();
var circle = new Kinetic.Circle({
x: stage.width / 2,
y: stage.height / 2,
x: stage.getWidth() / 2,
y: stage.getHeight() / 2,
radius: 70,
fill: 'violet',
stroke: 'black',
@ -1743,8 +1745,8 @@ Test.prototype.tests = {
var layer = new Kinetic.Layer();
var circle = new Kinetic.Circle({
x: stage.width / 2,
y: stage.height / 2,
x: stage.getWidth() / 2,
y: stage.getHeight() / 2,
radius: 70,
fill: 'violet',
stroke: 'black',