added new beforeDraw() and afterDraw() event handlers for Layer

dist/kinetic-core.js

@@ -2182,6 +2182,8 @@ Kinetic.Layer = function(config) {
 
     this.nodeType = 'Layer';
     this.lastDrawTime = 0;
+    this.beforeDrawFunc = undefined;
+    this.afterDrawFunc = undefined;
 
     this.canvas = document.createElement('canvas');
     this.context = this.canvas.getContext('2d');
@@ -2243,6 +2245,18 @@ Kinetic.Layer.prototype = {
     getThrottle: function() {
         return this.attrs.throttle;
     },
+    /**
+     * set before draw function handler
+     */
+    beforeDraw: function(func) {
+        this.beforeDrawFunc = func;
+    },
+    /**
+     * set after draw function handler
+     */
+    afterDraw: function(func) {
+        this.afterDrawFunc = func;
+    },
     /**
      * clears the canvas context tied to the layer.  Clearing
      *  a layer does not remove its children.  The nodes within
@@ -2285,10 +2299,20 @@ Kinetic.Layer.prototype = {
      * private draw children
      */
     _draw: function() {
+        // before draw  handler
+        if(this.beforeDrawFunc !== undefined) {
+            this.beforeDrawFunc();
+        }
+
         this.clear();
         if(this.attrs.visible) {
             this._drawChildren();
         }
+
+        // after draw  handler
+        if(this.afterDrawFunc !== undefined) {
+            this.afterDrawFunc();
+        }
     }
 };
 // Extend Container and Node

src/Layer.js

@@ -16,6 +16,8 @@ Kinetic.Layer = function(config) {
 
     this.nodeType = 'Layer';
     this.lastDrawTime = 0;
+    this.beforeDrawFunc = undefined;
+    this.afterDrawFunc = undefined;
 
     this.canvas = document.createElement('canvas');
     this.context = this.canvas.getContext('2d');
@@ -77,6 +79,18 @@ Kinetic.Layer.prototype = {
     getThrottle: function() {
         return this.attrs.throttle;
     },
+    /**
+     * set before draw function handler
+     */
+    beforeDraw: function(func) {
+        this.beforeDrawFunc = func;
+    },
+    /**
+     * set after draw function handler
+     */
+    afterDraw: function(func) {
+        this.afterDrawFunc = func;
+    },
     /**
      * clears the canvas context tied to the layer.  Clearing
      *  a layer does not remove its children.  The nodes within
@@ -119,10 +133,20 @@ Kinetic.Layer.prototype = {
      * private draw children
      */
     _draw: function() {
+        // before draw  handler
+        if(this.beforeDrawFunc !== undefined) {
+            this.beforeDrawFunc();
+        }
+
         this.clear();
         if(this.attrs.visible) {
             this._drawChildren();
         }
+
+        // after draw  handler
+        if(this.afterDrawFunc !== undefined) {
+            this.afterDrawFunc();
+        }
     }
 };
 // Extend Container and Node

tests/js/unitTests.js

@@ -587,6 +587,41 @@ Test.prototype.tests = {
         var layer = new Kinetic.Layer();
         stage.add(layer);
     },
+    'LAYERS - beforeDraw and afterDraw': function(containerId) {
+        var stage = new Kinetic.Stage({
+            container: containerId,
+            width: 578,
+            height: 200
+        });
+
+        var layer = new Kinetic.Layer();
+
+        var circle = new Kinetic.Circle({
+            x: 100,
+            y: stage.getHeight() / 2,
+            radius: 70,
+            fill: 'green',
+            stroke: 'black',
+            strokeWidth: 4
+        });
+
+        layer.add(circle);
+        stage.add(layer);
+
+        var counter = 0;
+
+        layer.beforeDraw(function() {
+            counter++;
+            test(counter === 1, 'counter should be 1');
+        });
+
+        layer.afterDraw(function() {
+            counter++;
+            test(counter === 2, 'counter should be 2');
+        });
+
+        layer.draw();
+    },
     'LAYERS - throttling': function(containerId) {
         var stage = new Kinetic.Stage({
             container: containerId,