return this from several methods. close #111

konva.js

@@ -3,7 +3,7 @@
  * Konva JavaScript Framework v0.11.0
  * http://konvajs.github.io/
  * Licensed under the MIT or GPL Version 2 licenses.
- * Date: Sun Nov 22 2015
+ * Date: Tue Dec 22 2015
  *
  * Original work Copyright (C) 2011 - 2013 by Eric Rowell (KineticJS)
  * Modified work Copyright (C) 2014 - 2015 by Anton Lavrenov (Konva)
@@ -2666,7 +2666,8 @@ var Konva = {};
          *   var newVal = evt.newVal;
          * });
          *
-         * // also event delegation works
+         * // get event targets
+         * // with event delegations
          * layer.on('click', 'Group', function(evt) {
          *   var shape = evt.target;
          *   var group = evtn.currentTarger;
@@ -2763,16 +2764,20 @@ var Konva = {};
               evt: evt
             };
             this.fire(evt.type, e);
+            return this;
         },
         addEventListener: function(type, handler) {
             // we have to pass native event to handler
             this.on(type, function(evt){
                 handler.call(this, evt.evt);
             });
+            return this;
         },
         removeEventListener: function(type) {
             this.off(type);
+            return this;
         },
+        // like node.on
         _delegate: function(event, selector, handler) {
             var stopNode = this;
             this.on(event, function(evt) {
@@ -2824,6 +2829,7 @@ var Konva = {};
             Konva._removeName(this.getName(), this._id);
 
             this.remove();
+            return this;
         },
         /**
          * get attr
@@ -3449,6 +3455,7 @@ var Konva = {};
             }
             return res.concat(parent._findMatchers(selector, stopNode));
         },
+        // is current node match passed selector?
         _isMatch: function(selector) {
             var selectorArr = selector.replace(/ /g, '').split(','),
                 len = selectorArr.length,
@@ -3908,6 +3915,7 @@ var Konva = {};
                 names.splice(index, 1);
                 this.setName(names.join(' '));
             }
+            return this;
         },
         /**
          * set attr
@@ -4527,33 +4535,33 @@ var Konva = {};
     Konva.Collection.mapMethods(Konva.Node);
 })(Konva);
 
-(function() {
+(function() {
-    'use strict';
+    'use strict';
-    /**
+    /**
-    * Grayscale Filter
+    * Grayscale Filter
-    * @function
+    * @function
-    * @memberof Konva.Filters
+    * @memberof Konva.Filters
-    * @param {Object} imageData
+    * @param {Object} imageData
-    * @example
+    * @example
-    * node.cache();
+    * node.cache();
-    * node.filters([Konva.Filters.Grayscale]);
+    * node.filters([Konva.Filters.Grayscale]);
-    */
+    */
-    Konva.Filters.Grayscale = function(imageData) {
+    Konva.Filters.Grayscale = function(imageData) {
-        var data = imageData.data,
+        var data = imageData.data,
-            len = data.length,
+            len = data.length,
-            i, brightness;
+            i, brightness;
-
+
-        for(i = 0; i < len; i += 4) {
+        for(i = 0; i < len; i += 4) {
-            brightness = 0.34 * data[i] + 0.5 * data[i + 1] + 0.16 * data[i + 2];
+            brightness = 0.34 * data[i] + 0.5 * data[i + 1] + 0.16 * data[i + 2];
-            // red
+            // red
-            data[i] = brightness;
+            data[i] = brightness;
-            // green
+            // green
-            data[i + 1] = brightness;
+            data[i + 1] = brightness;
-            // blue
+            // blue
-            data[i + 2] = brightness;
+            data[i + 2] = brightness;
-        }
+        }
-    };
+    };
-})();
+})();
 
 (function() {
     'use strict';
@@ -4596,32 +4604,32 @@ var Konva = {};
 
 })();
 
-(function() {
+(function() {
-    'use strict';
+    'use strict';
-    /**
+    /**
-    * Invert Filter
+    * Invert Filter
-    * @function
+    * @function
-    * @memberof Konva.Filters
+    * @memberof Konva.Filters
-    * @param {Object} imageData
+    * @param {Object} imageData
-    * @example
+    * @example
-    * node.cache();
+    * node.cache();
-    * node.filters([Konva.Filters.Invert]);
+    * node.filters([Konva.Filters.Invert]);
-    */
+    */
-    Konva.Filters.Invert = function(imageData) {
+    Konva.Filters.Invert = function(imageData) {
-        var data = imageData.data,
+        var data = imageData.data,
-            len = data.length,
+            len = data.length,
-            i;
+            i;
-
+
-        for(i = 0; i < len; i += 4) {
+        for(i = 0; i < len; i += 4) {
-            // red
+            // red
-            data[i] = 255 - data[i];
+            data[i] = 255 - data[i];
-            // green
+            // green
-            data[i + 1] = 255 - data[i + 1];
+            data[i + 1] = 255 - data[i + 1];
-            // blue
+            // blue
-            data[i + 2] = 255 - data[i + 2];
+            data[i + 2] = 255 - data[i + 2];
-        }
+        }
-    };
+    };
-})();
+})();
 
 /*
  the Gauss filter
@@ -5906,181 +5914,181 @@ var Konva = {};
     */
 })();
 
-(function () {
+(function () {
-    'use strict';
+    'use strict';
+
+    /**
+     * Noise Filter. Randomly adds or substracts to the color channels
+     * @function
+     * @name Noise
+     * @memberof Konva.Filters
+     * @param {Object} imageData
+     * @author ippo615
+     * @example
+     * node.cache();
+     * node.filters([Konva.Filters.Noise]);
+     * node.noise(0.8);
+     */
+    Konva.Filters.Noise = function (imageData) {
+        var amount = this.noise() * 255,
+            data = imageData.data,
+            nPixels = data.length,
+            half = amount / 2,
+            i;
+
+        for (i = 0; i < nPixels; i += 4) {
+            data[i + 0] += half - 2 * half * Math.random();
+            data[i + 1] += half - 2 * half * Math.random();
+            data[i + 2] += half - 2 * half * Math.random();
+        }
+    };
+
+    Konva.Factory.addGetterSetter(Konva.Node, 'noise', 0.2, null, Konva.Factory.afterSetFilter);
+
+    /**
+    * get/set noise amount.  Must be a value between 0 and 1. Use with {@link Konva.Filters.Noise} filter.
+    * @name noise
+    * @method
+    * @memberof Konva.Node.prototype
+    * @param {Number} noise
+    * @returns {Number}
+    */
+})();
 
-    /**
+/*eslint-disable max-depth */
-     * Noise Filter. Randomly adds or substracts to the color channels
+(function () {
-     * @function
+    'use strict';
-     * @name Noise
+    /**
-     * @memberof Konva.Filters
+     * Pixelate Filter. Averages groups of pixels and redraws
-     * @param {Object} imageData
+     *  them as larger pixels
-     * @author ippo615
+     * @function
-     * @example
+     * @name Pixelate
-     * node.cache();
+     * @memberof Konva.Filters
-     * node.filters([Konva.Filters.Noise]);
+     * @param {Object} imageData
-     * node.noise(0.8);
+     * @author ippo615
-     */
+     * @example
-    Konva.Filters.Noise = function (imageData) {
+     * node.cache();
-        var amount = this.noise() * 255,
+     * node.filters([Konva.Filters.Pixelate]);
-            data = imageData.data,
+     * node.pixelSize(10);
-            nPixels = data.length,
+     */
-            half = amount / 2,
+
-            i;
+    Konva.Filters.Pixelate = function (imageData) {
+
+        var pixelSize = Math.ceil(this.pixelSize()),
+            width = imageData.width,
+            height = imageData.height,
+            x, y, i,
+            //pixelsPerBin = pixelSize * pixelSize,
+            red, green, blue, alpha,
+            nBinsX = Math.ceil(width / pixelSize),
+            nBinsY = Math.ceil(height / pixelSize),
+            xBinStart, xBinEnd, yBinStart, yBinEnd,
+            xBin, yBin, pixelsInBin;
+        imageData = imageData.data;
+
+        for (xBin = 0; xBin < nBinsX; xBin += 1) {
+            for (yBin = 0; yBin < nBinsY; yBin += 1) {
+
+                // Initialize the color accumlators to 0
+                red = 0;
+                green = 0;
+                blue = 0;
+                alpha = 0;
+
+                // Determine which pixels are included in this bin
+                xBinStart = xBin * pixelSize;
+                xBinEnd = xBinStart + pixelSize;
+                yBinStart = yBin * pixelSize;
+                yBinEnd = yBinStart + pixelSize;
+
+                // Add all of the pixels to this bin!
+                pixelsInBin = 0;
+                for (x = xBinStart; x < xBinEnd; x += 1) {
+                    if( x >= width ){ continue; }
+                    for (y = yBinStart; y < yBinEnd; y += 1) {
+                        if( y >= height ){ continue; }
+                        i = (width * y + x) * 4;
+                        red += imageData[i + 0];
+                        green += imageData[i + 1];
+                        blue += imageData[i + 2];
+                        alpha += imageData[i + 3];
+                        pixelsInBin += 1;
+                    }
+                }
+
+                // Make sure the channels are between 0-255
+                red = red / pixelsInBin;
+                green = green / pixelsInBin;
+                blue = blue / pixelsInBin;
+
+                // Draw this bin
+                for (x = xBinStart; x < xBinEnd; x += 1) {
+                    if( x >= width ){ continue; }
+                    for (y = yBinStart; y < yBinEnd; y += 1) {
+                        if( y >= height ){ continue; }
+                        i = (width * y + x) * 4;
+                        imageData[i + 0] = red;
+                        imageData[i + 1] = green;
+                        imageData[i + 2] = blue;
+                        imageData[i + 3] = alpha;
+                    }
+                }
+            }
+        }
+
+    };
+
+    Konva.Factory.addGetterSetter(Konva.Node, 'pixelSize', 8, null, Konva.Factory.afterSetFilter);
+
+    /**
+    * get/set pixel size. Use with {@link Konva.Filters.Pixelate} filter.
+    * @name pixelSize
+    * @method
+    * @memberof Konva.Node.prototype
+    * @param {Integer} pixelSize
+    * @returns {Integer}
+    */
+})();
 
-        for (i = 0; i < nPixels; i += 4) {
+(function () {
-            data[i + 0] += half - 2 * half * Math.random();
+    'use strict';
-            data[i + 1] += half - 2 * half * Math.random();
+    /**
-            data[i + 2] += half - 2 * half * Math.random();
+     * Threshold Filter. Pushes any value above the mid point to
-        }
+     *  the max and any value below the mid point to the min.
-    };
+     *  This affects the alpha channel.
-
+     * @function
-    Konva.Factory.addGetterSetter(Konva.Node, 'noise', 0.2, null, Konva.Factory.afterSetFilter);
+     * @name Threshold
-
+     * @memberof Konva.Filters
-    /**
+     * @param {Object} imageData
-    * get/set noise amount.  Must be a value between 0 and 1. Use with {@link Konva.Filters.Noise} filter.
+     * @author ippo615
-    * @name noise
+     * @example
-    * @method
+     * node.cache();
-    * @memberof Konva.Node.prototype
+     * node.filters([Konva.Filters.Threshold]);
-    * @param {Number} noise
+     * node.threshold(0.1);
-    * @returns {Number}
+     */
-    */
+
-})();
+    Konva.Filters.Threshold = function (imageData) {
-
+        var level = this.threshold() * 255,
-/*eslint-disable max-depth */
+            data = imageData.data,
-(function () {
+            len = data.length,
-    'use strict';
+            i;
-    /**
+
-     * Pixelate Filter. Averages groups of pixels and redraws
+        for (i = 0; i < len; i += 1) {
-     *  them as larger pixels
+            data[i] = data[i] < level ? 0 : 255;
-     * @function
+        }
-     * @name Pixelate
+    };
-     * @memberof Konva.Filters
+
-     * @param {Object} imageData
+    Konva.Factory.addGetterSetter(Konva.Node, 'threshold', 0.5, null, Konva.Factory.afterSetFilter);
-     * @author ippo615
+
-     * @example
+    /**
-     * node.cache();
+    * get/set threshold.  Must be a value between 0 and 1. Use with {@link Konva.Filters.Threshold} or {@link Konva.Filters.Mask} filter.
-     * node.filters([Konva.Filters.Pixelate]);
+    * @name threshold
-     * node.pixelSize(10);
+    * @method
-     */
+    * @memberof Konva.Node.prototype
-
+    * @param {Number} threshold
-    Konva.Filters.Pixelate = function (imageData) {
+    * @returns {Number}
-
+    */
-        var pixelSize = Math.ceil(this.pixelSize()),
+})();
-            width = imageData.width,
-            height = imageData.height,
-            x, y, i,
-            //pixelsPerBin = pixelSize * pixelSize,
-            red, green, blue, alpha,
-            nBinsX = Math.ceil(width / pixelSize),
-            nBinsY = Math.ceil(height / pixelSize),
-            xBinStart, xBinEnd, yBinStart, yBinEnd,
-            xBin, yBin, pixelsInBin;
-        imageData = imageData.data;
-
-        for (xBin = 0; xBin < nBinsX; xBin += 1) {
-            for (yBin = 0; yBin < nBinsY; yBin += 1) {
-
-                // Initialize the color accumlators to 0
-                red = 0;
-                green = 0;
-                blue = 0;
-                alpha = 0;
-
-                // Determine which pixels are included in this bin
-                xBinStart = xBin * pixelSize;
-                xBinEnd = xBinStart + pixelSize;
-                yBinStart = yBin * pixelSize;
-                yBinEnd = yBinStart + pixelSize;
-
-                // Add all of the pixels to this bin!
-                pixelsInBin = 0;
-                for (x = xBinStart; x < xBinEnd; x += 1) {
-                    if( x >= width ){ continue; }
-                    for (y = yBinStart; y < yBinEnd; y += 1) {
-                        if( y >= height ){ continue; }
-                        i = (width * y + x) * 4;
-                        red += imageData[i + 0];
-                        green += imageData[i + 1];
-                        blue += imageData[i + 2];
-                        alpha += imageData[i + 3];
-                        pixelsInBin += 1;
-                    }
-                }
-
-                // Make sure the channels are between 0-255
-                red = red / pixelsInBin;
-                green = green / pixelsInBin;
-                blue = blue / pixelsInBin;
-
-                // Draw this bin
-                for (x = xBinStart; x < xBinEnd; x += 1) {
-                    if( x >= width ){ continue; }
-                    for (y = yBinStart; y < yBinEnd; y += 1) {
-                        if( y >= height ){ continue; }
-                        i = (width * y + x) * 4;
-                        imageData[i + 0] = red;
-                        imageData[i + 1] = green;
-                        imageData[i + 2] = blue;
-                        imageData[i + 3] = alpha;
-                    }
-                }
-            }
-        }
-
-    };
-
-    Konva.Factory.addGetterSetter(Konva.Node, 'pixelSize', 8, null, Konva.Factory.afterSetFilter);
-
-    /**
-    * get/set pixel size. Use with {@link Konva.Filters.Pixelate} filter.
-    * @name pixelSize
-    * @method
-    * @memberof Konva.Node.prototype
-    * @param {Integer} pixelSize
-    * @returns {Integer}
-    */
-})();
-
-(function () {
-    'use strict';
-    /**
-     * Threshold Filter. Pushes any value above the mid point to
-     *  the max and any value below the mid point to the min.
-     *  This affects the alpha channel.
-     * @function
-     * @name Threshold
-     * @memberof Konva.Filters
-     * @param {Object} imageData
-     * @author ippo615
-     * @example
-     * node.cache();
-     * node.filters([Konva.Filters.Threshold]);
-     * node.threshold(0.1);
-     */
-
-    Konva.Filters.Threshold = function (imageData) {
-        var level = this.threshold() * 255,
-            data = imageData.data,
-            len = data.length,
-            i;
-
-        for (i = 0; i < len; i += 1) {
-            data[i] = data[i] < level ? 0 : 255;
-        }
-    };
-
-    Konva.Factory.addGetterSetter(Konva.Node, 'threshold', 0.5, null, Konva.Factory.afterSetFilter);
-
-    /**
-    * get/set threshold.  Must be a value between 0 and 1. Use with {@link Konva.Filters.Threshold} or {@link Konva.Filters.Mask} filter.
-    * @name threshold
-    * @method
-    * @memberof Konva.Node.prototype
-    * @param {Number} threshold
-    * @returns {Number}
-    */
-})();
 
 (function() {
     'use strict';
@@ -6614,6 +6622,7 @@ var Konva = {};
             }
             // then destroy self
             Konva.Node.prototype.destroy.call(this);
+            return this;
         },
         /**
          * return a {@link Konva.Collection} of nodes that match the selector.  Use '#' for id selections
@@ -7259,6 +7268,7 @@ var Konva = {};
         destroy: function() {
             Konva.Node.prototype.destroy.call(this);
             delete Konva.shapes[this.colorKey];
+            return this;
         },
         _useBufferCanvas: function(caching) {
             return !caching && (this.perfectDrawEnabled() && (this.getAbsoluteOpacity() !== 1) && this.hasFill() && this.hasStroke() && this.getStage()) ||
@@ -8708,6 +8718,7 @@ var Konva = {};
             if (index > -1) {
                 Konva.stages.splice(index, 1);
             }
+            return this;
         },
         /**
          * get pointer position which can be a touch position or mouse position
@@ -9175,7 +9186,6 @@ var Konva = {};
                 x = evt.clientX - contentPosition.left;
                 y = evt.clientY - contentPosition.top;
             }
-
             if (x !== null && y !== null) {
                 this.pointerPos = {
                     x: x,
@@ -9385,16 +9395,17 @@ var Konva = {};
                 stage.content.removeChild(this.getCanvas()._canvas);
                 stage.content.appendChild(this.getCanvas()._canvas);
             }
+            return this;
         },
         // extend Node.prototype.moveUp
         moveUp: function() {
             var moved = Konva.Node.prototype.moveUp.call(this);
             if (!moved){
-                return;
+                return this;
             }
             var stage = this.getStage();
             if(!stage) {
-                return;
+                return this;
             }
             stage.content.removeChild(this.getCanvas()._canvas);
 
@@ -9403,6 +9414,7 @@ var Konva = {};
             } else {
                 stage.content.appendChild(this.getCanvas()._canvas);
             }
+            return this;
         },
         // extend Node.prototype.moveDown
         moveDown: function() {
@@ -9414,6 +9426,7 @@ var Konva = {};
                     stage.content.insertBefore(this.getCanvas()._canvas, children[this.index + 1].getCanvas()._canvas);
                 }
             }
+            return this;
         },
         // extend Node.prototype.moveToBottom
         moveToBottom: function() {
@@ -9425,6 +9438,7 @@ var Konva = {};
                     stage.content.insertBefore(this.getCanvas()._canvas, children[1].getCanvas()._canvas);
                 }
             }
+            return this;
         },
         getLayer: function() {
             return this;
@@ -9444,6 +9458,7 @@ var Konva = {};
         },
         setSize: function(width, height) {
             this.canvas.setSize(width, height);
+            return this;
         },
         /**
          * get/set width of layer.getter return width of stage. setter doing nothing.
@@ -9771,6 +9786,7 @@ var Konva = {};
         setSize: function(width, height) {
             Konva.BaseLayer.prototype.setSize.call(this, width, height);
             this.hitCanvas.setSize(width, height);
+            return this;
         }
     });
     Konva.Util.extend(Konva.Layer, Konva.BaseLayer);
@@ -10212,11 +10228,6 @@ var Konva = {};
         }
     };
 
-    var moveTo = Konva.Node.prototype.moveTo;
-    Konva.Node.prototype.moveTo = function(container) {
-        moveTo.call(this, container);
-    };
-
     /**
      * batch draw
      * @method

src/Animation.js

@@ -268,11 +268,6 @@
         }
     };
 
-    var moveTo = Konva.Node.prototype.moveTo;
-    Konva.Node.prototype.moveTo = function(container) {
-        moveTo.call(this, container);
-    };
-
     /**
      * batch draw
      * @method

src/BaseLayer.js

@@ -98,16 +98,17 @@
                 stage.content.removeChild(this.getCanvas()._canvas);
                 stage.content.appendChild(this.getCanvas()._canvas);
             }
+            return this;
         },
         // extend Node.prototype.moveUp
         moveUp: function() {
             var moved = Konva.Node.prototype.moveUp.call(this);
             if (!moved){
-                return;
+                return this;
             }
             var stage = this.getStage();
             if(!stage) {
-                return;
+                return this;
             }
             stage.content.removeChild(this.getCanvas()._canvas);
 
@@ -116,6 +117,7 @@
             } else {
                 stage.content.appendChild(this.getCanvas()._canvas);
             }
+            return this;
         },
         // extend Node.prototype.moveDown
         moveDown: function() {
@@ -127,6 +129,7 @@
                     stage.content.insertBefore(this.getCanvas()._canvas, children[this.index + 1].getCanvas()._canvas);
                 }
             }
+            return this;
         },
         // extend Node.prototype.moveToBottom
         moveToBottom: function() {
@@ -138,6 +141,7 @@
                     stage.content.insertBefore(this.getCanvas()._canvas, children[1].getCanvas()._canvas);
                 }
             }
+            return this;
         },
         getLayer: function() {
             return this;
@@ -157,6 +161,7 @@
         },
         setSize: function(width, height) {
             this.canvas.setSize(width, height);
+            return this;
         },
         /**
          * get/set width of layer.getter return width of stage. setter doing nothing.

src/Container.js

@@ -141,6 +141,7 @@
             }
             // then destroy self
             Konva.Node.prototype.destroy.call(this);
+            return this;
         },
         /**
          * return a {@link Konva.Collection} of nodes that match the selector.  Use '#' for id selections

src/Layer.js

@@ -230,6 +230,7 @@
         setSize: function(width, height) {
             Konva.BaseLayer.prototype.setSize.call(this, width, height);
             this.hitCanvas.setSize(width, height);
+            return this;
         }
     });
     Konva.Util.extend(Konva.Layer, Konva.BaseLayer);

src/Node.js

@@ -516,15 +516,18 @@
               evt: evt
             };
             this.fire(evt.type, e);
+            return this;
         },
         addEventListener: function(type, handler) {
             // we have to pass native event to handler
             this.on(type, function(evt){
                 handler.call(this, evt.evt);
             });
+            return this;
         },
         removeEventListener: function(type) {
             this.off(type);
+            return this;
         },
         // like node.on
         _delegate: function(event, selector, handler) {
@@ -578,6 +581,7 @@
             Konva._removeName(this.getName(), this._id);
 
             this.remove();
+            return this;
         },
         /**
          * get attr
@@ -1663,6 +1667,7 @@
                 names.splice(index, 1);
                 this.setName(names.join(' '));
             }
+            return this;
         },
         /**
          * set attr

src/Shape.js

@@ -171,6 +171,7 @@
         destroy: function() {
             Konva.Node.prototype.destroy.call(this);
             delete Konva.shapes[this.colorKey];
+            return this;
         },
         _useBufferCanvas: function(caching) {
             return !caching && (this.perfectDrawEnabled() && (this.getAbsoluteOpacity() !== 1) && this.hasFill() && this.hasStroke() && this.getStage()) ||

src/Stage.js

@@ -186,6 +186,7 @@
             if (index > -1) {
                 Konva.stages.splice(index, 1);
             }
+            return this;
         },
         /**
          * get pointer position which can be a touch position or mouse position
@@ -653,7 +654,6 @@
                 x = evt.clientX - contentPosition.left;
                 y = evt.clientY - contentPosition.top;
             }
-
             if (x !== null && y !== null) {
                 this.pointerPos = {
                     x: x,