From 821138cc0aa1f21f1c05d20b979e64d9da13d4b0 Mon Sep 17 00:00:00 2001 From: Eric Rowell Date: Wed, 15 May 2013 22:03:52 -0700 Subject: [PATCH] more documenting --- src/Canvas.js | 79 ++++++++++------------- src/Global.js | 1 + src/Tween.js | 131 +++++++++++++++++++++++++++++++++++++++ src/Util.js | 46 +++++++++++--- src/filters/Blur.js | 2 +- src/filters/Brighten.js | 2 +- src/filters/Grayscale.js | 2 +- src/filters/Invert.js | 2 +- src/filters/Mask.js | 2 +- 9 files changed, 209 insertions(+), 58 deletions(-) diff --git a/src/Canvas.js b/src/Canvas.js index 20b332ea..d6eb3b36 100644 --- a/src/Canvas.js +++ b/src/Canvas.js @@ -13,6 +13,8 @@ /** * Canvas Renderer constructor * @constructor + * @abstract + * @memberof Kinetic * @param {Number} width * @param {Number} height */ @@ -39,24 +41,24 @@ }, /** * get canvas element - * @name getElement - * @methodOf Kinetic.Canvas.prototype + * @method + * @memberof Kinetic.Canvas.prototype */ getElement: function() { return this.element; }, /** * get canvas context - * @name getContext - * @methodOf Kinetic.Canvas.prototype + * @method + * @memberof Kinetic.Canvas.prototype */ getContext: function() { return this.context; }, /** * set width - * @name setWidth - * @methodOf Kinetic.Canvas.prototype + * @method + * @memberof Kinetic.Canvas.prototype * @param {Number} width */ setWidth: function(width) { @@ -66,8 +68,8 @@ }, /** * set height - * @name setHeight - * @methodOf Kinetic.Canvas.prototype + * @method + * @memberof Kinetic.Canvas.prototype * @param {Number} height */ setHeight: function(height) { @@ -77,48 +79,35 @@ }, /** * get width - * @name getWidth - * @methodOf Kinetic.Canvas.prototype + * @method + * @memberof Kinetic.Canvas.prototype */ getWidth: function() { return this.width; }, /** * get height - * @name getHeight - * @methodOf Kinetic.Canvas.prototype + * @method + * @memberof Kinetic.Canvas.prototype */ getHeight: function() { return this.height; }, /** * set size - * @name setSize - * @methodOf Kinetic.Canvas.prototype + * @method + * @memberof Kinetic.Canvas.prototype * @param {Number} width * @param {Number} height */ setSize: function(width, height) { this.setWidth(width); this.setHeight(height); - } - }; - - /** - * Canvas 2D Renderer constructor - * @constructor - * @param {Number} width - * @param {Number} height - */ - Kinetic.Canvas2D = function(config) { - Kinetic.Canvas.call(this, config); - }; - - Kinetic.Canvas2D.prototype = { + }, /** * clear canvas - * @name clear - * @methodOf Kinetic.Canvas.prototype + * @method + * @memberof Kinetic.Canvas.prototype */ clear: function() { var context = this.getContext(); @@ -127,8 +116,8 @@ }, /** * to data url - * @name toDataURL - * @methodOf Kinetic.Canvas2D.prototype + * @method + * @memberof Kinetic.Canvas.prototype * @param {String} mimeType * @param {Number} quality between 0 and 1 for jpg mime types */ @@ -150,8 +139,8 @@ }, /** * fill shape - * @name fill - * @methodOf Kinetic.Canvas2D.prototype + * @method + * @memberof Kinetic.Canvas.prototype * @param {Kinetic.Shape} shape */ fill: function(shape) { @@ -161,8 +150,8 @@ }, /** * stroke shape - * @name stroke - * @methodOf Kinetic.Canvas2D.prototype + * @method + * @memberof Kinetic.Canvas.prototype * @param {Kinetic.Shape} shape */ stroke: function(shape) { @@ -174,8 +163,8 @@ * fill, stroke, and apply shadows * will only be applied to either the fill or stroke.  Fill * is given priority over stroke. - * @name fillStroke - * @methodOf Kinetic.Canvas2D.prototype + * @method + * @memberof Kinetic.Canvas.prototype * @param {Kinetic.Shape} shape */ fillStroke: function(shape) { @@ -190,8 +179,8 @@ }, /** * apply shadow - * @name applyShadow - * @methodOf Kinetic.Canvas2D.prototype + * @method + * @memberof Kinetic.Canvas.prototype * @param {Kinetic.Shape} shape * @param {Function} drawFunc */ @@ -242,10 +231,8 @@ } }; - Kinetic.Util.extend(Kinetic.Canvas2D, Kinetic.Canvas); - Kinetic.SceneCanvas = function(config) { - Kinetic.Canvas2D.call(this, config); + Kinetic.Canvas.call(this, config); }; Kinetic.SceneCanvas.prototype = { @@ -427,10 +414,10 @@ } } }; - Kinetic.Util.extend(Kinetic.SceneCanvas, Kinetic.Canvas2D); + Kinetic.Util.extend(Kinetic.SceneCanvas, Kinetic.Canvas); Kinetic.HitCanvas = function(config) { - Kinetic.Canvas2D.call(this, config); + Kinetic.Canvas.call(this, config); }; Kinetic.HitCanvas.prototype = { @@ -456,6 +443,6 @@ } } }; - Kinetic.Util.extend(Kinetic.HitCanvas, Kinetic.Canvas2D); + Kinetic.Util.extend(Kinetic.HitCanvas, Kinetic.Canvas); })(); diff --git a/src/Global.js b/src/Global.js index d8f70c67..2153cddb 100644 --- a/src/Global.js +++ b/src/Global.js @@ -34,6 +34,7 @@ var Kinetic = {}; /** * @namespace Filters + * @memberof Kinetic */ Kinetic.Filters = {}; diff --git a/src/Tween.js b/src/Tween.js index 86a47354..a061bf86 100644 --- a/src/Tween.js +++ b/src/Tween.js @@ -18,6 +18,11 @@ }, easing, node['get' + Kinetic.Util._capitalize(key)](), end, duration * 1000, yoyo); } + /** + * Tween constructor. + * @constructor + * @memberof Kinetic + */ Kinetic.Tween = function(config) { var that = this, node = config.node, @@ -94,44 +99,85 @@ } }; }, + /** + * play + * @method + * @memberof Kinetic.Tween.prototype + */ play: function() { this._iterate(function(tween) { tween.play(); }); }, + /** + * reverse + * @method + * @memberof Kinetic.Tween.prototype + */ reverse: function() { this._iterate(function(tween) { tween.reverse(); }); }, + /** + * reset + * @method + * @memberof Kinetic.Tween.prototype + */ reset: function() { this._iterate(function(tween) { tween.reset(); }); this.node.getLayer().draw(); }, + /** + * seek + * @method + * @memberof Kinetic.Tween.prototype + * @param {Integer} t time in seconds between 0 and the duration + */ seek: function(t) { this._iterate(function(tween) { tween.seek(t * 1000); }); this.node.getLayer().draw(); }, + /** + * pause + * @method + * @memberof Kinetic.Tween.prototype + */ pause: function() { this._iterate(function(tween) { tween.pause(); }); }, + /** + * finish + * @method + * @memberof Kinetic.Tween.prototype + */ finish: function() { this._iterate(function(tween) { tween.finish(); }); this.node.getLayer().draw(); }, + /** + * define a function that's executed on each tween animation frame + * @method + * @memberof Kinetic.Tween.prototype + */ onEnterFrame: function() { this._iterate(function(tween) { tween.onEnterFrame(); }); }, + /** + * destroy + * @method + * @memberof Kinetic.Tween.prototype + */ destroy: function() { }, @@ -266,15 +312,35 @@ * These eases were ported from an Adobe Flash tweening library to JavaScript * by Xaric */ + + /** + * @namespace Easings + * @memberof Kinetic + */ Kinetic.Easings = { + /** + * back ease in + * @function + * @memberof Kinetic.Easings + */ 'BackEaseIn': function(t, b, c, d, a, p) { var s = 1.70158; return c * (t /= d) * t * ((s + 1) * t - s) + b; }, + /** + * back ease out + * @function + * @memberof Kinetic.Easings + */ 'BackEaseOut': function(t, b, c, d, a, p) { var s = 1.70158; return c * (( t = t / d - 1) * t * ((s + 1) * t + s) + 1) + b; }, + /** + * back ease in out + * @function + * @memberof Kinetic.Easings + */ 'BackEaseInOut': function(t, b, c, d, a, p) { var s = 1.70158; if((t /= d / 2) < 1) { @@ -282,6 +348,11 @@ } return c / 2 * ((t -= 2) * t * (((s *= (1.525)) + 1) * t + s) + 2) + b; }, + /** + * elastic ease in + * @function + * @memberof Kinetic.Easings + */ 'ElasticEaseIn': function(t, b, c, d, a, p) { // added s = 0 var s = 0; @@ -303,6 +374,11 @@ } return -(a * Math.pow(2, 10 * (t -= 1)) * Math.sin((t * d - s) * (2 * Math.PI) / p)) + b; }, + /** + * elastic ease out + * @function + * @memberof Kinetic.Easings + */ 'ElasticEaseOut': function(t, b, c, d, a, p) { // added s = 0 var s = 0; @@ -324,6 +400,11 @@ } return (a * Math.pow(2, -10 * t) * Math.sin((t * d - s) * (2 * Math.PI) / p) + c + b); }, + /** + * elastic ease in out + * @function + * @memberof Kinetic.Easings + */ 'ElasticEaseInOut': function(t, b, c, d, a, p) { // added s = 0 var s = 0; @@ -348,6 +429,11 @@ } return a * Math.pow(2, -10 * (t -= 1)) * Math.sin((t * d - s) * (2 * Math.PI) / p) * 0.5 + c + b; }, + /** + * bounce ease out + * @function + * @memberof Kinetic.Easings + */ 'BounceEaseOut': function(t, b, c, d) { if((t /= d) < (1 / 2.75)) { return c * (7.5625 * t * t) + b; @@ -362,9 +448,19 @@ return c * (7.5625 * (t -= (2.625 / 2.75)) * t + 0.984375) + b; } }, + /** + * bounce ease in + * @function + * @memberof Kinetic.Easings + */ 'BounceEaseIn': function(t, b, c, d) { return c - Kinetic.Easings.BounceEaseOut(d - t, 0, c, d) + b; }, + /** + * bounce ease in out + * @function + * @memberof Kinetic.Easings + */ 'BounceEaseInOut': function(t, b, c, d) { if(t < d / 2) { return Kinetic.Easings.BounceEaseIn(t * 2, 0, c, d) * 0.5 + b; @@ -373,30 +469,65 @@ return Kinetic.Easings.BounceEaseOut(t * 2 - d, 0, c, d) * 0.5 + c * 0.5 + b; } }, + /** + * ease in + * @function + * @memberof Kinetic.Easings + */ 'EaseIn': function(t, b, c, d) { return c * (t /= d) * t + b; }, + /** + * ease out + * @function + * @memberof Kinetic.Easings + */ 'EaseOut': function(t, b, c, d) { return -c * (t /= d) * (t - 2) + b; }, + /** + * ease in out + * @function + * @memberof Kinetic.Easings + */ 'EaseInOut': function(t, b, c, d) { if((t /= d / 2) < 1) { return c / 2 * t * t + b; } return -c / 2 * ((--t) * (t - 2) - 1) + b; }, + /** + * strong ease in + * @function + * @memberof Kinetic.Easings + */ 'StrongEaseIn': function(t, b, c, d) { return c * (t /= d) * t * t * t * t + b; }, + /** + * strong ease out + * @function + * @memberof Kinetic.Easings + */ 'StrongEaseOut': function(t, b, c, d) { return c * (( t = t / d - 1) * t * t * t * t + 1) + b; }, + /** + * strong ease in out + * @function + * @memberof Kinetic.Easings + */ 'StrongEaseInOut': function(t, b, c, d) { if((t /= d / 2) < 1) { return c / 2 * t * t * t * t * t + b; } return c / 2 * ((t -= 2) * t * t * t * t + 2) + b; }, + /** + * linear + * @function + * @memberof Kinetic.Easings + */ 'Linear': function(t, b, c, d) { return c * t / d + b; } diff --git a/src/Util.js b/src/Util.js index 1b47d1f0..9fb74c61 100644 --- a/src/Util.js +++ b/src/Util.js @@ -3,6 +3,7 @@ * Collection constructor. Collection extends * Array. This class is used in conjunction with get() * @constructor + * @memberof Kinetic */ Kinetic.Collection = function() { var args = [].slice.call(arguments), length = args.length, i = 0; @@ -15,9 +16,10 @@ } Kinetic.Collection.prototype = new Array(); /** - * iterate through node array - * @name each - * @methodOf Kinetic.Collection.prototype + * iterate through node array and run a function for each node. + * The node and index is passed into the function + * @method + * @memberof Kinetic.Collection.prototype * @param {Function} func */ Kinetic.Collection.prototype.each = function(func) { @@ -63,12 +65,13 @@ /* * The usage of this class was inspired by some of the work done by a forked * project, KineticJS-Ext by Wappworks, which is based on Simon's Transform - * class. + * class. Modified by Eric Rowell */ /** * Transform constructor * @constructor + * @memberof Kinetic */ Kinetic.Transform = function() { this.m = [1, 0, 0, 1, 0, 0]; @@ -77,6 +80,8 @@ Kinetic.Transform.prototype = { /** * Apply translation + * @method + * @memberof Kinetic.Transform.prototype * @param {Number} x * @param {Number} y */ @@ -86,6 +91,8 @@ }, /** * Apply scale + * @method + * @memberof Kinetic.Transform.prototype * @param {Number} sx * @param {Number} sy */ @@ -97,6 +104,8 @@ }, /** * Apply rotation + * @method + * @memberof Kinetic.Transform.prototype * @param {Number} rad Angle in radians */ rotate: function(rad) { @@ -113,6 +122,8 @@ }, /** * Returns the translation + * @method + * @memberof Kinetic.Transform.prototype * @returns {Object} 2D point(x, y) */ getTranslation: function() { @@ -123,6 +134,8 @@ }, /** * Apply skew + * @method + * @memberof Kinetic.Transform.prototype * @param {Number} sx * @param {Number} sy */ @@ -138,6 +151,8 @@ }, /** * Transform multiplication + * @method + * @memberof Kinetic.Transform.prototype * @param {Kinetic.Transform} matrix */ multiply: function(matrix) { @@ -159,6 +174,8 @@ }, /** * Invert the matrix + * @method + * @memberof Kinetic.Transform.prototype */ invert: function() { var d = 1 / (this.m[0] * this.m[3] - this.m[1] * this.m[2]); @@ -177,6 +194,8 @@ }, /** * return matrix + * @method + * @memberof Kinetic.Transform.prototype */ getMatrix: function() { return this.m; @@ -222,7 +241,8 @@ RGB_REGEX = /rgb\((\d{1,3}),(\d{1,3}),(\d{1,3})\)/; /** - * @namespace + * @namespace Util + * @memberof Kinetic */ Kinetic.Util = { /* @@ -504,6 +524,11 @@ b: bigint & 255 }; }, + /** + * get random color + * @method + * @memberof Kinetic.Util.prototype + */ getRandomColor: function() { var randColor = (Math.random() * 0xFFFFFF << 0).toString(16); while (randColor.length < 6) { @@ -511,6 +536,12 @@ } return randColor; }, + /** + * get RGB components of a color + * @method + * @memberof Kinetic.Util.prototype + * @param {String} color + */ getRGB: function(color) { var rgb; // color string @@ -596,8 +627,9 @@ } }, /** - * @method addMethods adds methods to a constructor prototype - * @methodOf Kinetic.Util + * adds methods to a constructor prototype + * @method + * @memberof Kinetic.Util.prototype * @param {Function} constructor * @param {Object} methods */ diff --git a/src/filters/Blur.js b/src/filters/Blur.js index 246442d2..54ae9df9 100644 --- a/src/filters/Blur.js +++ b/src/filters/Blur.js @@ -325,7 +325,7 @@ /** * Blur Filter * @function - * @memberOf Kinetic.Filters + * @memberof Kinetic.Filters * @param {Object} imageData */ Kinetic.Filters.Blur = function(imageData) { diff --git a/src/filters/Brighten.js b/src/filters/Brighten.js index 7d121d73..0cb06066 100644 --- a/src/filters/Brighten.js +++ b/src/filters/Brighten.js @@ -2,7 +2,7 @@ /** * Brighten Filter. * @function - * @memberOf Kinetic.Filters + * @memberof Kinetic.Filters * @param {Object} imageData */ Kinetic.Filters.Brighten = function(imageData) { diff --git a/src/filters/Grayscale.js b/src/filters/Grayscale.js index 85ae8a43..a6818337 100644 --- a/src/filters/Grayscale.js +++ b/src/filters/Grayscale.js @@ -2,7 +2,7 @@ /** * Grayscale Filter * @function - * @memberOf Kinetic.Filters + * @memberof Kinetic.Filters * @param {Object} imageData */ Kinetic.Filters.Grayscale = function(imageData) { diff --git a/src/filters/Invert.js b/src/filters/Invert.js index fdfe23ac..73662180 100644 --- a/src/filters/Invert.js +++ b/src/filters/Invert.js @@ -2,7 +2,7 @@ /** * Invert Filter * @function - * @memberOf Kinetic.Filters + * @memberof Kinetic.Filters * @param {Object} imageData */ Kinetic.Filters.Invert = function(imageData) { diff --git a/src/filters/Mask.js b/src/filters/Mask.js index 6b57961a..1a4d78a7 100644 --- a/src/filters/Mask.js +++ b/src/filters/Mask.js @@ -165,7 +165,7 @@ * Only crop unicolor background images for instance * * @function - * @memberOf Kinetic.Filters + * @memberof Kinetic.Filters * @param {Object} imageData */ Kinetic.Filters.Mask = function(idata) {