From ffc33a7676528f548de54921a64291ed42e7a660 Mon Sep 17 00:00:00 2001
From: Eric Rowell <erowell83@gmail.com>
Date: Thu, 6 Jun 2013 22:45:31 -0700
Subject: [PATCH] removeChildren now removes all descendants.  returned this
 for all applicable methods in Node, Layer, Stage, and Shape

---
 src/Container.js                | 25 +++++++++++++++++++--
 src/Layer.js                    |  6 +++++
 src/Node.js                     | 40 ++++++++++++++++++++++++++++++++-
 src/Shape.js                    | 19 ++++++++++++++++
 src/Stage.js                    |  6 +++++
 tests/js/unit/containerTests.js | 11 ++++++---
 6 files changed, 101 insertions(+), 6 deletions(-)

diff --git a/src/Container.js b/src/Container.js
index 9cf7f5e6..a80200e6 100644
--- a/src/Container.js
+++ b/src/Container.js
@@ -12,15 +12,32 @@
         getChildren: function() {
             return this.children;
         },
+        /**
+         * determine if node has children
+         * @method
+         * @memberof Kinetic.Container.prototype
+         */
+        hasChildren: function() {
+            return this.getChildren().length > 0;
+        },
         /**
          * remove all children
          * @method
          * @memberof Kinetic.Container.prototype
          */
         removeChildren: function() {
-            while(this.children.length > 0) {
-                this.children[0].remove();
+            var children = this.children,
+                child;
+
+            while(children.length > 0) {
+                var child = children[0];
+                if (child.hasChildren()) {
+                    child.removeChildren();
+                }
+                child.remove();
             }
+
+            return this;
         },
         /**
          * add node to container
@@ -214,6 +231,8 @@
                     canvas.getContext().restore();
                 }
             }
+
+            return this;
         },
         drawHit: function() {
             var clip = !!this.getClipFunc() && this.nodeType !== 'Stage',
@@ -238,6 +257,8 @@
                     hitCanvas.getContext().restore();
                 }
             }
+
+            return this;
         }
     });
 
diff --git a/src/Layer.js b/src/Layer.js
index ffc638fa..6073dd7f 100644
--- a/src/Layer.js
+++ b/src/Layer.js
@@ -52,6 +52,7 @@
             }
 
             Kinetic.Container.prototype.drawScene.call(this, canvas);
+            return this;
         },
         drawHit: function() {
             var layer = this.getLayer();
@@ -61,6 +62,7 @@
             }
 
             Kinetic.Container.prototype.drawHit.call(this);
+            return this;
         },
         /**
          * get layer canvas
@@ -93,6 +95,7 @@
          */
         clear: function() {
             this.getCanvas().clear();
+            return this;
         },
         // extenders
         setVisible: function(visible) {
@@ -105,6 +108,7 @@
                 this.getCanvas().element.style.display = 'none';
                 this.hitCanvas.element.style.display = 'none';
             }
+            return this;
         },
         setZIndex: function(index) {
             Kinetic.Node.prototype.setZIndex.call(this, index);
@@ -119,6 +123,7 @@
                     stage.content.appendChild(this.getCanvas().element);
                 }
             }
+            return this;
         },
         moveToTop: function() {
             Kinetic.Node.prototype.moveToTop.call(this);
@@ -173,6 +178,7 @@
             if(stage && canvas && Kinetic.Util._isInDocument(element)) {
                 stage.content.removeChild(element);
             }
+            return this;
         }
     });
     Kinetic.Util.extend(Kinetic.Layer, Kinetic.Container);
diff --git a/src/Node.js b/src/Node.js
index 6203b235..59ebb87e 100644
--- a/src/Node.js
+++ b/src/Node.js
@@ -169,6 +169,7 @@
                 parent._setChildrenIndices();
             }
             delete this.parent;
+            return this;
         },
         /**
          * remove and destroy self
@@ -195,6 +196,7 @@
             // TODO: stop transitions
  
             this.remove();
+            return this;
         },
         /**
          * get attr
@@ -237,6 +239,7 @@
             else {
                 this.attrs[attr] = args[0];
             }
+            return this;
         },
         /**
          * get attrs object literal
@@ -250,6 +253,7 @@
             if(this.attrs === undefined) {
                 this.attrs = {};
             }
+            return this;
         },
         
         /**
@@ -284,6 +288,7 @@
                     }
                 }
             }
+            return this;
         },
         /**
          * determine if node is visible or not.  Node is visible only
@@ -334,6 +339,7 @@
          */
         show: function() {
             this.setVisible(true);
+            return this;
         },
         /**
          * hide node.  Hidden nodes are no longer detectable
@@ -342,6 +348,7 @@
          */
         hide: function() {
             this.setVisible(false);
+            return this;
         },
         /**
          * get zIndex relative to the node's siblings who share the same parent
@@ -432,6 +439,7 @@
             var pos = Kinetic.Util._getXY([].slice.call(arguments));
             this.setX(pos.x);
             this.setY(pos.y);
+            return this;
         },
         /**
          * get node position relative to parent
@@ -486,6 +494,7 @@
 
             this.setPosition(pos.x, pos.y);
             this._setTransform(trans);
+            return this;
         },
         /**
          * move node by an amount relative to its current position
@@ -516,6 +525,7 @@
             }
 
             this.setPosition(x, y);
+            return this;
         },
         _eachAncestorReverse: function(func, includeSelf) {
             var family = [], 
@@ -544,6 +554,7 @@
          */
         rotate: function(theta) {
             this.setRotation(this.getRotation() + theta);
+            return this;
         },
         /**
          * rotate node by an amount in degrees relative to its current rotation
@@ -553,6 +564,7 @@
          */
         rotateDeg: function(deg) {
             this.setRotation(this.getRotation() + Kinetic.Util._degToRad(deg));
+            return this;
         },
         /**
          * move node to the top of its siblings
@@ -580,6 +592,7 @@
                 this.parent._setChildrenIndices();
                 return true;
             }
+            return false;
         },
         /**
          * move node down
@@ -594,6 +607,7 @@
                 this.parent._setChildrenIndices();
                 return true;
             }
+            return false;
         },
         /**
          * move node to the bottom of its siblings
@@ -608,6 +622,7 @@
                 this.parent._setChildrenIndices();
                 return true;
             }
+            return false;
         },
         /**
          * set zIndex relative to siblings
@@ -620,6 +635,7 @@
             this.parent.children.splice(index, 1);
             this.parent.children.splice(zIndex, 0, this);
             this.parent._setChildrenIndices();
+            return this;
         },
         /**
          * get absolute opacity
@@ -645,6 +661,7 @@
         moveTo: function(newContainer) {
             Kinetic.Node.prototype.remove.call(this);
             newContainer.add(this);
+            return this;
         },
         /**
          * convert Node into an object for serialization.  Returns an object.
@@ -739,6 +756,7 @@
             else {
                 this._fire(eventType, evt || {});
             }
+            return this;
         },
         /**
          * get absolute transform of the node which takes into
@@ -934,6 +952,7 @@
             var size = Kinetic.Util._getSize(Array.prototype.slice.call(arguments));
             this.setWidth(size.width);
             this.setHeight(size.height);
+            return this;
         },
         /**
          * get size
@@ -1057,6 +1076,7 @@
             go._removeId(oldId);
             go._addId(this, id);
             this._setAttr(ID, id);
+            return this;
         },
         /**
          * set name
@@ -1072,6 +1092,7 @@
             go._removeName(oldName, this._id);
             go._addName(this, name);
             this._setAttr(NAME, name);
+            return this;
         },
         _setAttr: function(key, val) {
             var oldVal;
@@ -1137,6 +1158,7 @@
             this.drawScene();
             this.drawHit();
             this._fire(DRAW, evt);
+            return this;
         },
         shouldDrawHit: function() { 
             return this.isVisible() && this.isListening() && !Kinetic.Global.isDragging(); 
@@ -1696,5 +1718,21 @@
      */
     Kinetic.Node.prototype.isVisible = Kinetic.Node.prototype.getVisible;
     
-    Kinetic.Collection.mapMethods(['on', 'off', 'draw']);
+    Kinetic.Collection.mapMethods([
+        'on', 
+        'off', 
+        'remove', 
+        'destroy', 
+        'show', 
+        'hide', 
+        'move', 
+        'rotate', 
+        'moveToTop', 
+        'moveUp', 
+        'moveDown', 
+        'moveToBottom',  
+        'moveTo', 
+        'fire', 
+        'draw'
+    ]);
 })();
diff --git a/src/Shape.js b/src/Shape.js
index 97825d20..601910e2 100644
--- a/src/Shape.js
+++ b/src/Shape.js
@@ -38,6 +38,12 @@
             // call super constructor
             Kinetic.Node.call(this, config);
         },
+        hasChildren: function() {
+            return false;
+        },
+        getChildren: function() {
+            return [];
+        },
         /**
          * get canvas context tied to the layer
          * @method
@@ -101,6 +107,7 @@
          */
         enableFill: function() {
             this._setAttr('fillEnabled', true);
+            return this;
         },
         /**
          * disable fill
@@ -109,6 +116,7 @@
          */
         disableFill: function() {
             this._setAttr('fillEnabled', false);
+            return this;
         },
         /**
          * enable stroke
@@ -117,6 +125,7 @@
          */
         enableStroke: function() {
             this._setAttr('strokeEnabled', true);
+            return this;
         },
         /**
          * disable stroke
@@ -125,6 +134,7 @@
          */
         disableStroke: function() {
             this._setAttr('strokeEnabled', false);
+            return this;
         },
         /**
          * enable stroke scale
@@ -133,6 +143,7 @@
          */
         enableStrokeScale: function() {
             this._setAttr('strokeScaleEnabled', true);
+            return this;
         },
         /**
          * disable stroke scale
@@ -141,6 +152,7 @@
          */
         disableStrokeScale: function() {
             this._setAttr('strokeScaleEnabled', false);
+            return this;
         },
         /**
          * enable shadow
@@ -149,6 +161,7 @@
          */
         enableShadow: function() {
             this._setAttr('shadowEnabled', true);
+            return this;
         },
         /**
          * disable shadow
@@ -157,6 +170,7 @@
          */
         disableShadow: function() {
             this._setAttr('shadowEnabled', false);
+            return this;
         },
         /**
          * enable dash array
@@ -165,6 +179,7 @@
          */
         enableDashArray: function() {
             this._setAttr('dashArrayEnabled', true);
+            return this;
         },
         /**
          * disable dash array
@@ -173,10 +188,12 @@
          */
         disableDashArray: function() {
             this._setAttr('dashArrayEnabled', false);
+            return this;
         },
         destroy: function() {
             Kinetic.Node.prototype.destroy.call(this);
             delete Kinetic.Global.shapes[this.colorKey];
+            return this;
         },
         drawScene: function(canvas) {
             canvas = canvas || this.getLayer().getCanvas();
@@ -192,6 +209,7 @@
                 drawFunc.call(this, canvas);
                 context.restore();
             }
+            return this;
         },
         drawHit: function() {
             var attrs = this.getAttrs(), 
@@ -207,6 +225,7 @@
                 drawFunc.call(this, canvas);
                 context.restore();
             }
+            return this;
         },
         _setDrawFuncs: function() {
             if(!this.attrs.drawFunc && this.drawFunc) {
diff --git a/src/Stage.js b/src/Stage.js
index ef69d47b..9920c3dc 100644
--- a/src/Stage.js
+++ b/src/Stage.js
@@ -59,6 +59,7 @@
                 container = document.getElementById(container);
             }
             this._setAttr(CONTAINER, container);
+            return this;
         },
         draw: function() {
             // clear children layers
@@ -75,6 +76,7 @@
             }
           
             Kinetic.Node.prototype.draw.call(this);
+            return this;
         },
         /**
          * draw layer scene graphs
@@ -99,6 +101,7 @@
         setHeight: function(height) {
             Kinetic.Node.prototype.setHeight.call(this, height);
             this._resizeDOM();
+            return this;
         },
         /**
          * set width
@@ -109,6 +112,7 @@
         setWidth: function(width) {
             Kinetic.Node.prototype.setWidth.call(this, width);
             this._resizeDOM();
+            return this;
         },
         /**
          * clear all layers
@@ -123,6 +127,7 @@
             for(n = 0; n < len; n++) {
                 layers[n].clear();
             }
+            return this;
         },
         /**
          * remove stage
@@ -136,6 +141,7 @@
             if(content && Kinetic.Util._isInDocument(content)) {
                 this.getContainer().removeChild(content);
             }
+            return this;
         },
         /**
          * get mouse position for desktop apps
diff --git a/tests/js/unit/containerTests.js b/tests/js/unit/containerTests.js
index afc7ab5c..be26bdc8 100644
--- a/tests/js/unit/containerTests.js
+++ b/tests/js/unit/containerTests.js
@@ -317,6 +317,7 @@ Test.Modules.CONTAINER = {
             height: 200
         });
         var layer = new Kinetic.Layer();
+        var group = new Kinetic.Group();
         var circle1 = new Kinetic.Circle({
             x: 100,
             y: stage.getHeight() / 2,
@@ -335,16 +336,19 @@ Test.Modules.CONTAINER = {
             strokeWidth: 4
         });
 
-        layer.add(circle1);
-        layer.add(circle2);
+        group.add(circle1);
+        group.add(circle2);
+        layer.add(group);
         stage.add(layer);
 
-        test(layer.children.length === 2, 'layer should have 2 children');
+        test(layer.children.length === 1, 'layer should have 1 children');
+        test(group.children.length === 2, 'group should have 2 children');
 
         layer.removeChildren();
         layer.draw();
 
         test(layer.children.length === 0, 'layer should have 0 children');
+        test(group.children.length === 0, 'group should have 0 children');
     },
     'add group': function(containerId) {
         var stage = new Kinetic.Stage({
@@ -1098,6 +1102,7 @@ Test.Modules.CONTAINER = {
         layer.add(bluecircle);
         stage.add(layer);
 
+
         test(layer.getZIndex() === 0, 'layer should have zindex of 0');
 
         layer.moveDown();