From f217200ed7187ab21c4f1d6ff4ba7951c82c39ea Mon Sep 17 00:00:00 2001 From: Eric Rowell Date: Wed, 4 Dec 2013 09:10:24 -0800 Subject: [PATCH] reverted factory methods but removed data type processing --- src/Factory.js | 229 +++++++++++++++++++++++++++-------------- src/Node.js | 12 +-- src/Shape.js | 34 ++---- src/shapes/Ellipse.js | 5 +- src/shapes/Image.js | 12 +-- test/unit/Node-test.js | 2 +- 6 files changed, 168 insertions(+), 126 deletions(-) diff --git a/src/Factory.js b/src/Factory.js index efdf1a21..ea9fd559 100644 --- a/src/Factory.js +++ b/src/Factory.js @@ -1,4 +1,4 @@ - (function() { +(function() { // CONSTANTS var ABSOLUTE_OPACITY = 'absoluteOpacity', ABSOLUTE_TRANSFORM = 'absoluteTransform', @@ -42,95 +42,41 @@ Y = 'y'; Kinetic.Factory = { + // getter setter adders addGetterSetter: function(constructor, attr, def) { this.addGetter(constructor, attr, def); this.addSetter(constructor, attr); }, - addGetter: function(constructor, attr, def) { - var method = GET + Kinetic.Util._capitalize(attr); - - constructor.prototype[method] = function() { - var val = this.attrs[attr]; - return val === undefined ? def : val; - }; - }, - addSetter: function(constructor, attr) { - var method = SET + Kinetic.Util._capitalize(attr); - - constructor.prototype[method] = function(val) { - this._setAttr(attr, val); - return this; - }; - }, - - // point - addPointGetterSetter: function(constructor, attr) { - this.addPointGetter(constructor, attr); + addPointGetterSetter: function(constructor, attr, def) { + this.addPointGetter(constructor, attr, def); this.addPointSetter(constructor, attr); - }, - addPointGetter: function(constructor, attr) { - var method = GET + Kinetic.Util._capitalize(attr), - getX = method + UPPER_X, - getY = method + UPPER_Y; - constructor.prototype[method] = function() { - return { - x: this[getX](), - y: this[getY]() - }; - }; + // add invdividual component getters and setters + this.addGetter(constructor, attr + UPPER_X, def); + this.addGetter(constructor, attr + UPPER_Y, def); + this.addSetter(constructor, attr + UPPER_X); + this.addSetter(constructor, attr + UPPER_Y); }, - addPointSetter: function(constructor, attr) { - var method = SET + Kinetic.Util._capitalize(attr), - setX = method + UPPER_X, - setY = method + UPPER_Y; - - constructor.prototype[method] = function(val) { - this[setX](val.x); - this[setY](val.y); - - return this; - }; - }, - - // box - addBoxGetterSetter: function(constructor, attr) { - this.addBoxGetter(constructor, attr); + addBoxGetterSetter: function(constructor, attr, def) { + this.addBoxGetter(constructor, attr, def); this.addBoxSetter(constructor, attr); + + // add invdividual component getters and setters + this.addGetter(constructor, attr + UPPER_X, def); + this.addGetter(constructor, attr + UPPER_Y, def); + this.addGetter(constructor, attr + UPPER_WIDTH, def); + this.addGetter(constructor, attr + UPPER_HEIGHT, def); + + this.addSetter(constructor, attr + UPPER_X); + this.addSetter(constructor, attr + UPPER_Y); + this.addSetter(constructor, attr + UPPER_WIDTH); + this.addSetter(constructor, attr + UPPER_HEIGHT); }, - addBoxGetter: function(constructor, attr) { - var method = GET + Kinetic.Util._capitalize(attr), - getX = method + UPPER_X, - getY = method + UPPER_Y, - getWidth = method + UPPER_WIDTH, - getHeight = method + UPPER_HEIGHT; - - constructor.prototype[method] = function() { - return { - x: this[getX](), - y: this[getY](), - width: this[getWidth](), - height: this[getHeight]() - }; - }; + addPointsGetterSetter: function(constructor, attr) { + this.addPointsGetter(constructor, attr); + this.addPointsSetter(constructor, attr); + this.addPointAdder(constructor, attr); }, - addBoxSetter: function(constructor, attr) { - var method = SET + Kinetic.Util._capitalize(attr), - setX = method + UPPER_X, - setY = method + UPPER_Y, - setWidth = method + UPPER_WIDTH, - setHeight = method + UPPER_HEIGHT; - - constructor.prototype[method] = function(val) { - this[setX](val.x); - this[setY](val.y); - this[setWidth](val.width); - this[setHeight](val.height); - return this; - }; - }, - - addRotationGetterSetter: function(constructor, attr, def) { this.addRotationGetter(constructor, attr, def); this.addRotationSetter(constructor, attr); @@ -167,7 +113,50 @@ return this[prefix + RGB]()[c]; }; }, + addPointsGetter: function(constructor, attr) { + var that = this, + method = GET + Kinetic.Util._capitalize(attr); + constructor.prototype[method] = function() { + var val = this.attrs[attr]; + return val === undefined ? [] : val; + }; + }, + addGetter: function(constructor, attr, def) { + var that = this, + method = GET + Kinetic.Util._capitalize(attr); + + constructor.prototype[method] = function() { + var val = this.attrs[attr]; + return val === undefined ? def : val; + }; + }, + addPointGetter: function(constructor, attr) { + var that = this, + baseMethod = GET + Kinetic.Util._capitalize(attr); + + constructor.prototype[baseMethod] = function() { + var that = this; + return { + x: that[baseMethod + UPPER_X](), + y: that[baseMethod + UPPER_Y]() + }; + }; + }, + addBoxGetter: function(constructor, attr) { + var that = this, + baseMethod = GET + Kinetic.Util._capitalize(attr); + + constructor.prototype[baseMethod] = function() { + var that = this; + return { + x: that[baseMethod + UPPER_X](), + y: that[baseMethod + UPPER_Y](), + width: that[baseMethod + UPPER_WIDTH](), + height: that[baseMethod + UPPER_HEIGHT]() + }; + }; + }, addRotationGetter: function(constructor, attr, def) { var that = this, method = GET + Kinetic.Util._capitalize(attr); @@ -212,7 +201,72 @@ this[prefix + RGB](obj); }; }, + addPointsSetter: function(constructor, attr) { + var method = SET + Kinetic.Util._capitalize(attr); + constructor.prototype[method] = function(val) { + this._setAttr('points', val); + }; + }, + addSetter: function(constructor, attr) { + var method = SET + Kinetic.Util._capitalize(attr); + constructor.prototype[method] = function(val) { + this._setAttr(attr, val); + }; + }, + addPointSetter: function(constructor, attr) { + var that = this, + baseMethod = SET + Kinetic.Util._capitalize(attr); + + constructor.prototype[baseMethod] = function(pos) { + var oldVal = this.attrs[attr], + x = 0, + y = 0; + + if (pos) { + x = pos.x; + y = pos.y; + + if (x !== undefined) { + this[baseMethod + UPPER_X](x); + } + if (y !== undefined) { + this[baseMethod + UPPER_Y](y); + } + this._fireChangeEvent(attr, oldVal, pos); + } + }; + }, + addBoxSetter: function(constructor, attr) { + var that = this, + baseMethod = SET + Kinetic.Util._capitalize(attr); + + constructor.prototype[baseMethod] = function(box) { + var oldVal = this.attrs[attr], + x, y, width, height; + + if (box) { + x = box.x; + y = box.y; + width = box.width; + height = box.height; + + if (x !== undefined) { + this[baseMethod + UPPER_X](x); + } + if (y !== undefined) { + this[baseMethod + UPPER_Y](y); + } + if (width !== undefined) { + this[baseMethod + UPPER_WIDTH](width); + } + if (height !== undefined) { + this[baseMethod + UPPER_HEIGHT](height); + } + this._fireChangeEvent(attr, oldVal, box); + } + }; + }, addRotationSetter: function(constructor, attr) { var that = this, method = SET + Kinetic.Util._capitalize(attr); @@ -225,6 +279,21 @@ constructor.prototype[method + DEG] = function(deg) { this._setAttr(attr, Kinetic.Util._degToRad(deg)); }; + }, + + // add adders + addPointAdder: function(constructor, attr) { + var that = this, + baseMethod = ADD + Kinetic.Util._removeLastLetter(Kinetic.Util._capitalize(attr)); + + constructor.prototype[baseMethod] = function(pos) { + var oldVal = this.attrs[attr]; + + if (pos) { + this.attrs[attr].push(pos); + this._fireChangeEvent(attr, oldVal, pos); + } + }; } }; })(); \ No newline at end of file diff --git a/src/Node.js b/src/Node.js index 2053f7dd..6d138518 100644 --- a/src/Node.js +++ b/src/Node.js @@ -1397,7 +1397,7 @@ * @memberof Kinetic.Node.prototype */ - Kinetic.Factory.addPointGetterSetter(Kinetic.Node, 'scale'); + Kinetic.Factory.addPointGetterSetter(Kinetic.Node, 'scale', 1); /** * set scale @@ -1422,7 +1422,6 @@ * @memberof Kinetic.Node.prototype */ - Kinetic.Factory.addGetterSetter(Kinetic.Node, 'scaleX', 1); /** * set scale x * @name setScaleX @@ -1438,7 +1437,6 @@ * @memberof Kinetic.Node.prototype */ - Kinetic.Factory.addGetterSetter(Kinetic.Node, 'scaleY', 1); /** * set scale y * @name setScaleY @@ -1454,7 +1452,7 @@ * @memberof Kinetic.Node.prototype */ - Kinetic.Factory.addPointGetterSetter(Kinetic.Node, 'skew'); + Kinetic.Factory.addPointGetterSetter(Kinetic.Node, 'skew', 0); /** * set skew @@ -1480,7 +1478,6 @@ * @returns {Object} */ - Kinetic.Factory.addGetterSetter(Kinetic.Node, 'skewX', 0); /** * set skew x * @name setSkewX @@ -1497,7 +1494,6 @@ * @returns {Number} */ - Kinetic.Factory.addGetterSetter(Kinetic.Node, 'skewY', 0); /** * set skew y * @name setSkewY @@ -1514,7 +1510,7 @@ * @returns {Number} */ - Kinetic.Factory.addPointGetterSetter(Kinetic.Node, 'offset'); + Kinetic.Factory.addPointGetterSetter(Kinetic.Node, 'offset', 0); /** * set offset. A node's offset defines the position and rotation point @@ -1539,7 +1535,6 @@ * @returns {Object} */ - Kinetic.Factory.addGetterSetter(Kinetic.Node, 'offsetX', 0); /** * set offset x * @name setOffsetX @@ -1556,7 +1551,6 @@ * @returns {Number} */ - Kinetic.Factory.addGetterSetter(Kinetic.Node, 'offsetY', 0); /** * set offset y * @name setOffsetY diff --git a/src/Shape.js b/src/Shape.js index 7003f64e..3644fdee 100644 --- a/src/Shape.js +++ b/src/Shape.js @@ -610,7 +610,7 @@ * @memberof Kinetic.Shape.prototype */ - Kinetic.Factory.addPointGetterSetter(Kinetic.Shape, 'shadowOffset'); + Kinetic.Factory.addPointGetterSetter(Kinetic.Shape, 'shadowOffset', 0); /** * set shadow offset @@ -636,8 +636,6 @@ * @returns {Object} */ - Kinetic.Factory.addGetterSetter(Kinetic.Shape, 'shadowOffsetX', 0); - /** * set shadow offset x * @name setShadowOffsetX @@ -653,8 +651,6 @@ * @memberof Kinetic.Shape.prototype */ - Kinetic.Factory.addGetterSetter(Kinetic.Shape, 'shadowOffsetY', 0); - /** * set shadow offset y * @name setShadowOffsetY @@ -669,7 +665,7 @@ * @method * @memberof Kinetic.Shape.prototype */ - + Kinetic.Factory.addGetterSetter(Kinetic.Shape, 'fillPatternImage'); /** @@ -993,7 +989,7 @@ * @memberof Kinetic.Shape.prototype */ - Kinetic.Factory.addPointGetterSetter(Kinetic.Shape, 'fillPatternOffset'); + Kinetic.Factory.addPointGetterSetter(Kinetic.Shape, 'fillPatternOffset', 0); /** * set fill pattern offset @@ -1019,7 +1015,6 @@ * @returns {Object} */ - Kinetic.Factory.addGetterSetter(Kinetic.Shape, 'fillPatternOffsetX', 0); /** * set fill pattern offset x * @name setFillPatternOffsetX @@ -1035,7 +1030,6 @@ * @memberof Kinetic.Shape.prototype */ - Kinetic.Factory.addGetterSetter(Kinetic.Shape, 'fillPatternOffsetY', 0); /** * set fill pattern offset y * @name setFillPatternOffsetY @@ -1051,7 +1045,7 @@ * @memberof Kinetic.Shape.prototype */ - Kinetic.Factory.addPointGetterSetter(Kinetic.Shape, 'fillPatternScale'); + Kinetic.Factory.addPointGetterSetter(Kinetic.Shape, 'fillPatternScale', 1); /** * set fill pattern scale @@ -1077,7 +1071,6 @@ * @returns {Object} */ - Kinetic.Factory.addGetterSetter(Kinetic.Shape, 'fillPatternScaleX', 0); /** * set fill pattern scale x * @name setFillPatternScaleX @@ -1094,7 +1087,6 @@ * @returns {Number} */ - Kinetic.Factory.addGetterSetter(Kinetic.Shape, 'fillPatternScaleY', 0); /** * set fill pattern scale y * @name setFillPatternScaleY @@ -1111,7 +1103,7 @@ * @returns {Number} */ - Kinetic.Factory.addPointGetterSetter(Kinetic.Shape, 'fillLinearGradientStartPoint'); + Kinetic.Factory.addPointGetterSetter(Kinetic.Shape, 'fillLinearGradientStartPoint', 0); /** * set fill linear gradient start point @@ -1137,7 +1129,6 @@ * @returns {Object} */ - Kinetic.Factory.addGetterSetter(Kinetic.Shape, 'fillLinearGradientStartPointX', 0); /** * set fill linear gradient start point x * @name setFillLinearGradientStartPointX @@ -1154,7 +1145,6 @@ * @returns {Number} */ - Kinetic.Factory.addGetterSetter(Kinetic.Shape, 'fillLinearGradientStartPointY', 0); /** * set fill linear gradient start point y * @name setFillLinearGradientStartPointY @@ -1171,7 +1161,7 @@ * @returns {Number} */ - Kinetic.Factory.addPointGetterSetter(Kinetic.Shape, 'fillLinearGradientEndPoint'); + Kinetic.Factory.addPointGetterSetter(Kinetic.Shape, 'fillLinearGradientEndPoint', 0); /** * set fill linear gradient end point @@ -1195,8 +1185,6 @@ * @returns {Object} */ - Kinetic.Factory.addGetterSetter(Kinetic.Shape, 'fillLinearGradientEndPointX', 0); - /** * set fill linear gradient end point x * @name setFillLinearGradientEndPointX @@ -1213,8 +1201,6 @@ * @returns {Number} */ - Kinetic.Factory.addGetterSetter(Kinetic.Shape, 'fillLinearGradientEndPointY', 0); - /** * set fill linear gradient end point y * @name setFillLinearGradientEndPointY @@ -1231,7 +1217,7 @@ * @returns {Number} */ - Kinetic.Factory.addGetterSetter(Kinetic.Shape, 'fillRadialGradientStartPoint', ['x', 'y']); + Kinetic.Factory.addGetterSetter(Kinetic.Shape, 'fillRadialGradientStartPoint', 0); /** * set fill radial gradient start point @@ -1257,7 +1243,6 @@ * @returns {Object} */ - Kinetic.Factory.addGetterSetter(Kinetic.Shape, 'fillRadialGradientStartPointX', 0); /** * set fill radial gradient start point x * @name setFillRadialGradientStartPointX @@ -1273,7 +1258,6 @@ * @memberof Kinetic.Shape.prototype */ - Kinetic.Factory.addGetterSetter(Kinetic.Shape, 'fillRadialGradientStartPointY', 0); /** * set fill radial gradient start point y * @name setFillRadialGradientStartPointY @@ -1289,7 +1273,7 @@ * @memberof Kinetic.Shape.prototype */ - Kinetic.Factory.addPointGetterSetter(Kinetic.Shape, 'fillRadialGradientEndPoint'); + Kinetic.Factory.addPointGetterSetter(Kinetic.Shape, 'fillRadialGradientEndPoint', 0); /** * set fill radial gradient end point @@ -1315,7 +1299,6 @@ * @returns {Object} */ - Kinetic.Factory.addGetterSetter(Kinetic.Shape, 'fillRadialGradientEndPointX', 0); /** * set fill radial gradient end point x * @name setFillRadialGradientEndPointX @@ -1331,7 +1314,6 @@ * @memberof Kinetic.Shape.prototype */ - Kinetic.Factory.addGetterSetter(Kinetic.Shape, 'fillRadialGradientEndPointY', 0); /** * set fill radial gradient end point y * @name setFillRadialGradientEndPointY diff --git a/src/shapes/Ellipse.js b/src/shapes/Ellipse.js index 87166ec4..349b5a88 100644 --- a/src/shapes/Ellipse.js +++ b/src/shapes/Ellipse.js @@ -61,7 +61,7 @@ Kinetic.Util.extend(Kinetic.Ellipse, Kinetic.Shape); // add getters setters - Kinetic.Factory.addPointGetterSetter(Kinetic.Ellipse, 'radius'); + Kinetic.Factory.addPointGetterSetter(Kinetic.Ellipse, 'radius', 0); /** * set radius @@ -80,7 +80,6 @@ * @memberof Kinetic.Ellipse.prototype * @returns {Object} */ - Kinetic.Factory.addGetterSetter(Kinetic.Ellipse, 'radiusX', 0); /** * set radius x @@ -98,8 +97,6 @@ * @returns {Number} */ - Kinetic.Factory.addGetterSetter(Kinetic.Ellipse, 'radiusY', 0); - /** * set radius y * @name setRadiusY diff --git a/src/shapes/Image.js b/src/shapes/Image.js index 60849c05..eed2bbd0 100644 --- a/src/shapes/Image.js +++ b/src/shapes/Image.js @@ -269,13 +269,17 @@ * @returns {ImageObject} */ - Kinetic.Factory.addBoxGetterSetter(Kinetic.Image, 'crop'); + Kinetic.Factory.addBoxGetterSetter(Kinetic.Image, 'crop', 0); /** * set crop * @method * @name setCrop * @memberof Kinetic.Image.prototype - * @param {Object} crop {x: x, y: y, width: width, height: height} + * @param {Object} crop + * @param {Number} crop.x + * @param {Number} crop.y + * @param {Number} crop.width + * @param {Number} crop.height * @example * // set crop x, y, width and height
* image.setCrop({
@@ -294,7 +298,6 @@ * @returns {Object} */ - Kinetic.Factory.addGetterSetter(Kinetic.Image, 'cropX', 0); /** * set crop x * @method @@ -311,7 +314,6 @@ * @returns {Number} */ - Kinetic.Factory.addGetterSetter(Kinetic.Image, 'cropY', 0); /** * set crop y * @name setCropY @@ -328,7 +330,6 @@ * @returns {Number} */ - Kinetic.Factory.addGetterSetter(Kinetic.Image, 'cropWidth', 0); /** * set cropWidth * @name setCropWidth @@ -345,7 +346,6 @@ * @returns {Number} */ - Kinetic.Factory.addGetterSetter(Kinetic.Image, 'cropHeight', 0); /** * set cropHeight * @name setCropHeight diff --git a/test/unit/Node-test.js b/test/unit/Node-test.js index d4100bd0..7293a83b 100644 --- a/test/unit/Node-test.js +++ b/test/unit/Node-test.js @@ -336,7 +336,7 @@ suite('Node', function() { }); // ====================================================== - test.only('test offset attr change', function() { + test('test offset attr change', function() { /* * the premise of this test to make sure that only * root level attributes trigger an attr change event.