diff --git a/dist/kinetic-core.js b/dist/kinetic-core.js index 72b3b5af..1921e6ca 100644 --- a/dist/kinetic-core.js +++ b/dist/kinetic-core.js @@ -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; }, diff --git a/src/Stage.js b/src/Stage.js index e4182ce4..43273170 100644 --- a/src/Stage.js +++ b/src/Stage.js @@ -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 diff --git a/src/shapes/Image.js b/src/shapes/Image.js index 4c4dcb9e..20811cb1 100644 --- a/src/shapes/Image.js +++ b/src/shapes/Image.js @@ -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]); diff --git a/src/shapes/Polygon.js b/src/shapes/Polygon.js index 57512916..562bac89 100644 --- a/src/shapes/Polygon.js +++ b/src/shapes/Polygon.js @@ -15,7 +15,6 @@ Kinetic.Polygon = function(config) { this.attrs.points = {}; this.shapeType = "Polygon"; - config.drawFunc = function() { var context = this.getContext(); context.beginPath(); diff --git a/src/shapes/RegularPolygon.js b/src/shapes/RegularPolygon.js index 12532a86..d18bfc53 100644 --- a/src/shapes/RegularPolygon.js +++ b/src/shapes/RegularPolygon.js @@ -16,7 +16,6 @@ Kinetic.RegularPolygon = function(config) { this.attrs.sides = 0; this.shapeType = "RegularPolygon"; - config.drawFunc = function() { var context = this.getContext(); context.beginPath(); diff --git a/src/shapes/Text.js b/src/shapes/Text.js index b77b29ed..4981b36f 100644 --- a/src/shapes/Text.js +++ b/src/shapes/Text.js @@ -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; diff --git a/src/util/Transition.js b/src/util/Transition.js index df410ccf..69fe9139 100644 --- a/src/util/Transition.js +++ b/src/util/Transition.js @@ -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; }, diff --git a/tests/js/functionalTests.js b/tests/js/functionalTests.js index b0103ab1..86516321 100644 --- a/tests/js/functionalTests.js +++ b/tests/js/functionalTests.js @@ -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',