From a2a4c6df2b231e9c133e67a80f49a9ac420e2f33 Mon Sep 17 00:00:00 2001 From: Eric Rowell Date: Mon, 16 Sep 2013 22:05:28 -0700 Subject: [PATCH] promoted to v4.7.1, and improved Shape docs --- package.json | 2 +- src/Global.js | 5 ++--- src/shapes/Blob.js | 5 +++++ src/shapes/Circle.js | 7 +++++++ src/shapes/Ellipse.js | 11 +++++++++-- src/shapes/Image.js | 12 +++++++++++- src/shapes/Line.js | 3 +++ src/shapes/Polygon.js | 3 +++ src/shapes/Rect.js | 1 + src/shapes/Spline.js | 5 +++++ src/shapes/Sprite.js | 5 +++++ src/shapes/Text.js | 18 +++++++++++++++--- src/shapes/Wedge.js | 4 ++++ 13 files changed, 71 insertions(+), 10 deletions(-) diff --git a/package.json b/package.json index 703e4d15..9e65284a 100644 --- a/package.json +++ b/package.json @@ -1,6 +1,6 @@ { "name": "KineticJS", - "version": "4.7.0", + "version": "4.7.1", "devDependencies": { "grunt-contrib-jshint": "~0.5.4", "grunt-contrib-nodeunit": "~0.1.2", diff --git a/src/Global.js b/src/Global.js index 0bfee5f7..733c928d 100644 --- a/src/Global.js +++ b/src/Global.js @@ -100,14 +100,13 @@ var Kinetic = {}; * y: 10,
* fill: 'red',
* // a Kinetic.Canvas renderer is passed into the drawFunc function
- * drawFunc: function(canvas) {
- * var context = canvas.getContext();
+ * drawFunc: function(context) {
* context.beginPath();
* context.moveTo(200, 50);
* context.lineTo(420, 80);
* context.quadraticCurveTo(300, 100, 260, 170);
* context.closePath();
- * canvas.fillStroke(this);
+ * context.fillStrokeShape(this);
* }
*}); */ diff --git a/src/shapes/Blob.js b/src/shapes/Blob.js index 5b13098d..980be09c 100644 --- a/src/shapes/Blob.js +++ b/src/shapes/Blob.js @@ -97,10 +97,12 @@ * @name getTension * @method * @memberof Kinetic.Blob.prototype + * @returns {Number} */ /** * set tension + * @name setTension * @method * @memberof Kinetic.Blob.prototype * @param {Number} tension @@ -109,12 +111,15 @@ Kinetic.Factory.addPointsGetterSetter(Kinetic.Blob, 'points'); /** * get points array + * @name getPoints * @method * @memberof Kinetic.Blob.prototype + * @returns {Array} */ /** * set points array + * @name setPoints * @method * @memberof Kinetic.Blob.prototype * @param {Array} can be an array of point objects or an array diff --git a/src/shapes/Circle.js b/src/shapes/Circle.js index 8cab17ec..173ae7a4 100644 --- a/src/shapes/Circle.js +++ b/src/shapes/Circle.js @@ -47,16 +47,20 @@ context.closePath(); context.fillStrokeShape(this); }, + // implements Shape.prototype.getWidth() getWidth: function() { return this.getRadius() * 2; }, + // implements Shape.prototype.getHeight() getHeight: function() { return this.getRadius() * 2; }, + // implements Shape.prototype.setWidth() setWidth: function(width) { Kinetic.Node.prototype.setWidth.call(this, width); this.setRadius(width / 2); }, + // implements Shape.prototype.setHeight() setHeight: function(height) { Kinetic.Node.prototype.setHeight.call(this, height); this.setRadius(height / 2); @@ -69,6 +73,7 @@ /** * set radius + * @name setRadius * @method * @memberof Kinetic.Circle.prototype * @param {Number} radius @@ -76,7 +81,9 @@ /** * get radius + * @name getRadius * @method * @memberof Kinetic.Circle.prototype + * @returns {Number} */ })(); diff --git a/src/shapes/Ellipse.js b/src/shapes/Ellipse.js index e0aff401..76d731a2 100644 --- a/src/shapes/Ellipse.js +++ b/src/shapes/Ellipse.js @@ -35,18 +35,22 @@ context.closePath(); context.fillStrokeShape(this); }, + // implements Shape.prototype.getWidth() getWidth: function() { return this.getRadius().x * 2; }, + // implements Shape.prototype.getHeight() getHeight: function() { return this.getRadius().y * 2; }, + // implements Shape.prototype.setWidth() setWidth: function(width) { Kinetic.Node.prototype.setWidth.call(this, width); this.setRadius({ x: width / 2 }); }, + // implements Shape.prototype.setHeight() setHeight: function(height) { Kinetic.Node.prototype.setHeight.call(this, height); this.setRadius({ @@ -62,7 +66,8 @@ /** * set radius * @name setRadius - * @methodOf Kinetic.Ellipse.prototype + * @method + * @memberof Kinetic.Ellipse.prototype * @param {Object|Array} radius * radius can be a number, in which the ellipse becomes a circle, * it can be an object with an x and y component, or it @@ -75,6 +80,8 @@ /** * get radius * @name getRadius - * @methodOf Kinetic.Ellipse.prototype + * @method + * @memberof Kinetic.Ellipse.prototype + * @returns {Object} */ })(); \ No newline at end of file diff --git a/src/shapes/Image.js b/src/shapes/Image.js index 4411d96a..052ef0d0 100644 --- a/src/shapes/Image.js +++ b/src/shapes/Image.js @@ -160,6 +160,10 @@ * @memberof Kinetic.Image.prototype * @param {Function} [callback] callback function to be called once * the image hit region has been created + * @example + * image.createImageHitRegion(function() {
+ * layer.drawHit();
+ * }); */ createImageHitRegion: function(callback) { var that = this, @@ -252,6 +256,7 @@ * @name getImage * @method * @memberof Kinetic.Image.prototype + * @returns {ImageObject} */ Kinetic.Factory.addBoxGetterSetter(Kinetic.Image, 'crop'); @@ -311,7 +316,7 @@ * @name getCrop * @method * @memberof Kinetic.Image.prototype - * @return {Object} + * @returns {Object} */ /** @@ -319,6 +324,7 @@ * @name getCropX * @method * @memberof Kinetic.Image.prototype + * @returns {Number} */ /** @@ -326,6 +332,7 @@ * @name getCropY * @method * @memberof Kinetic.Image.prototype + * @returns {Number} */ /** @@ -333,6 +340,7 @@ * @name getCropWidth * @method * @memberof Kinetic.Image.prototype + * @returns {Number} */ /** @@ -340,6 +348,7 @@ * @name getCropHeight * @method * @memberof Kinetic.Image.prototype + * @returns {Number} */ Kinetic.Factory.addFilterGetterSetter(Kinetic.Image, 'filter'); @@ -357,5 +366,6 @@ * @name getFilter * @method * @memberof Kinetic.Image.prototype + * @returns {Function)} */ })(); diff --git a/src/shapes/Line.js b/src/shapes/Line.js index 46fe9a40..f7f54e12 100644 --- a/src/shapes/Line.js +++ b/src/shapes/Line.js @@ -62,6 +62,7 @@ Kinetic.Factory.addPointsGetterSetter(Kinetic.Line, 'points'); /** * set points array + * @name setPoints * @method * @memberof Kinetic.Line.prototype * @param {Array} can be an array of point objects or an array @@ -70,7 +71,9 @@ /** * get points array + * @name getPoints * @method * @memberof Kinetic.Line.prototype + * @returns {Array} */ })(); diff --git a/src/shapes/Polygon.js b/src/shapes/Polygon.js index f6011de5..8f77d033 100644 --- a/src/shapes/Polygon.js +++ b/src/shapes/Polygon.js @@ -45,6 +45,7 @@ Kinetic.Factory.addPointsGetterSetter(Kinetic.Polygon, 'points'); /** * set points array + * @name setPoints * @method * @memberof Kinetic.Polygon.prototype * @param {Array} can be an array of point objects or an array @@ -53,7 +54,9 @@ /** * get points array + * @name getPoints * @method * @memberof Kinetic.Polygon.prototype + * @returns {Array} */ })(); diff --git a/src/shapes/Rect.js b/src/shapes/Rect.js index 7db79edd..294265b6 100644 --- a/src/shapes/Rect.js +++ b/src/shapes/Rect.js @@ -71,6 +71,7 @@ * @name getCornerRadius * @method * @memberof Kinetic.Rect.prototype + * @returns {Number} */ })(); diff --git a/src/shapes/Spline.js b/src/shapes/Spline.js index 5be77fef..991add62 100644 --- a/src/shapes/Spline.js +++ b/src/shapes/Spline.js @@ -84,10 +84,12 @@ * @name getTension * @method * @memberof Kinetic.Spline.prototype + * @returns {Number} */ /** * set tension + * @name setTension * @method * @memberof Kinetic.Spline.prototype * @param {Number} tension @@ -96,12 +98,15 @@ Kinetic.Factory.addPointsGetterSetter(Kinetic.Spline, 'points'); /** * get points array + * @name getPoints * @method * @memberof Kinetic.Spline.prototype + * @returns {Array} */ /** * set points array + * @name setPoints * @method * @memberof Kinetic.Spline.prototype * @param {Array} can be an array of point objects or an array diff --git a/src/shapes/Sprite.js b/src/shapes/Sprite.js index 1002633e..abb7b5bb 100644 --- a/src/shapes/Sprite.js +++ b/src/shapes/Sprite.js @@ -185,6 +185,7 @@ * @name getAnimation * @method * @memberof Kinetic.Sprite.prototype + * @returns {String} */ Kinetic.Factory.addGetterSetter(Kinetic.Sprite, 'animations'); @@ -202,6 +203,7 @@ * @name getAnimations * @method * @memberof Kinetic.Sprite.prototype + * @returns {Object} */ Kinetic.Factory.addGetterSetter(Kinetic.Sprite, 'image'); @@ -219,6 +221,7 @@ * @name getImage * @method * @memberof Kinetic.Sprite.prototype + * @returns {ImageObject} */ Kinetic.Factory.addGetterSetter(Kinetic.Sprite, 'index', 0); @@ -236,6 +239,7 @@ * @name getIndex * @method * @memberof Kinetic.Sprite.prototype + * @returns {Integer} */ Kinetic.Factory.addGetterSetter(Kinetic.Sprite, 'frameRate', 17); @@ -254,6 +258,7 @@ * @name getFrameRate * @method * @memberof Kinetic.Sprite.prototype + * @returns {Number} */ })(); diff --git a/src/shapes/Text.js b/src/shapes/Text.js index e4f4dea1..52e5780d 100644 --- a/src/shapes/Text.js +++ b/src/shapes/Text.js @@ -150,17 +150,19 @@ this._setAttr(TEXT, str); }, /** - * get width + * get width of text area, which includes padding * @method * @memberof Kinetic.Text.prototype + * @returns {Number} */ getWidth: function() { return this.attrs.width === AUTO ? this.getTextWidth() + this.getPadding() * 2 : this.attrs.width; }, /** - * get the height of the text area, which takes into account multi-line text and padding + * get the height of the text area, which takes into account multi-line text, line heights, and padding * @method * @memberof Kinetic.Text.prototype + * @returns {Number} */ getHeight: function() { return this.attrs.height === AUTO ? (this.getTextHeight() * this.textArr.length * this.getLineHeight()) + this.getPadding() * 2 : this.attrs.height; @@ -169,6 +171,7 @@ * get text width * @method * @memberof Kinetic.Text.prototype + * @returns {Number} */ getTextWidth: function() { return this.textWidth; @@ -177,6 +180,7 @@ * get text height * @method * @memberof Kinetic.Text.prototype + * @returns {Number} */ getTextHeight: function() { return this.textHeight; @@ -330,6 +334,7 @@ * @name getFontFamily * @method * @memberof Kinetic.Text.prototype + * @returns {String} */ Kinetic.Factory.addGetterSetter(Kinetic.Text, 'fontSize', 12); @@ -339,7 +344,7 @@ * @name setFontSize * @method * @memberof Kinetic.Text.prototype - * @param {int} fontSize + * @param {Number} fontSize */ /** @@ -347,6 +352,7 @@ * @name getFontSize * @method * @memberof Kinetic.Text.prototype + * @returns {Number} */ Kinetic.Factory.addGetterSetter(Kinetic.Text, 'fontStyle', NORMAL); @@ -364,6 +370,7 @@ * @name getFontStyle * @method * @memberof Kinetic.Text.prototype + * @returns {String} */ Kinetic.Factory.addGetterSetter(Kinetic.Text, 'padding', 0); @@ -381,6 +388,7 @@ * @name getPadding * @method * @memberof Kinetic.Text.prototype + * @returns {Number} */ Kinetic.Factory.addGetterSetter(Kinetic.Text, 'align', LEFT); @@ -398,6 +406,7 @@ * @name getAlign * @method * @memberof Kinetic.Text.prototype + * @returns {String} */ Kinetic.Factory.addGetterSetter(Kinetic.Text, 'lineHeight', 1); @@ -415,6 +424,7 @@ * @name getLineHeight * @method * @memberof Kinetic.Text.prototype + * @returns {Number} */ Kinetic.Factory.addGetterSetter(Kinetic.Text, 'wrap', WORD); @@ -432,6 +442,7 @@ * @name getWrap * @method * @memberof Kinetic.Text.prototype + * @returns {String} */ Kinetic.Factory.addGetter(Kinetic.Text, TEXT, EMPTY_STRING); @@ -441,6 +452,7 @@ * @name getText * @method * @memberof Kinetic.Text.prototype + * @returns {String} */ Kinetic.Factory.addSetter(Kinetic.Text, 'width'); diff --git a/src/shapes/Wedge.js b/src/shapes/Wedge.js index c9dbf00f..0387cd5f 100644 --- a/src/shapes/Wedge.js +++ b/src/shapes/Wedge.js @@ -57,6 +57,7 @@ * @name getRadius * @method * @memberof Kinetic.Wedge.prototype + * @returns {Number} */ Kinetic.Factory.addRotationGetterSetter(Kinetic.Wedge, 'angle', 0); @@ -82,6 +83,7 @@ * @name getAngle * @method * @memberof Kinetic.Wedge.prototype + * @returns {Number} */ /** @@ -89,6 +91,7 @@ * @name getAngleDeg * @method * @memberof Kinetic.Wedge.prototype + * @returns {Number} */ Kinetic.Factory.addGetterSetter(Kinetic.Wedge, 'clockwise', false); @@ -107,5 +110,6 @@ * @name getClockwise * @method * @memberof Kinetic.Wedge.prototype + * @returns {Boolean} */ })();