fix incorrect shadow offset on rotation. fix #142

.gitignore

@@ -9,6 +9,7 @@ homedocs
 jsdoc-template
 api
 test/sandbox.html
+*.zip
 
 # Numerous always-ignore extensions
 *.diff
@@ -50,4 +51,3 @@ dwsync.xml
 intermediate
 publish
 .idea
-

CHANGELOG.md

@@ -4,6 +4,9 @@ This project adheres to [Semantic Versioning](http://semver.org/).
 
 ## [Not released][Not released]
 
+### Fixed
+- fix incorrect shadow offset on rotation
+
 ## [0.12.3][2016-04-07]
 
 ### Fixed

konva.js

@@ -3,7 +3,7 @@
  * Konva JavaScript Framework v0.12.3
  * http://konvajs.github.io/
  * Licensed under the MIT or GPL Version 2 licenses.
- * Date: Thu Apr 07 2016
+ * Date: Fri Apr 15 2016
  *
  * Original work Copyright (C) 2011 - 2013 by Eric Rowell (KineticJS)
  * Modified work Copyright (C) 2014 - 2015 by Anton Lavrenov (Konva)
@@ -2017,9 +2017,9 @@
                     x: 0,
                     y: 0
                 }),
-                m = shape.getAbsoluteTransform().m,
+                scale = shape.getAbsoluteScale(),
-                scaleX = m[0],
+                scaleX = scale.x,
-                scaleY = m[3];
+                scaleY = scale.y;
 
             this.setAttr('shadowColor', color);
             this.setAttr('shadowBlur', blur);
@@ -2217,6 +2217,7 @@
     // CONSTANTS
     var ABSOLUTE_OPACITY = 'absoluteOpacity',
         ABSOLUTE_TRANSFORM = 'absoluteTransform',
+        ABSOLUTE_SCALE = 'absoluteScale',
         CHANGE = 'Change',
         CHILDREN = 'children',
         DOT = '.',
@@ -2248,6 +2249,11 @@
             'offsetXChange.konva',
             'offsetYChange.konva',
             'transformsEnabledChange.konva'
+        ].join(SPACE),
+
+        SCALE_CHANGE_STR = [
+            'scaleXChange.konva',
+            'scaleYChange.konva'
         ].join(SPACE);
 
     /**
@@ -2297,6 +2303,11 @@
                 this._clearCache(TRANSFORM);
                 that._clearSelfAndDescendantCache(ABSOLUTE_TRANSFORM);
             });
+
+            this.on(SCALE_CHANGE_STR, function() {
+                that._clearSelfAndDescendantCache(ABSOLUTE_SCALE);
+            });
+
             this.on('visibleChange.konva', function() {
                 that._clearSelfAndDescendantCache(VISIBLE);
             });
@@ -3606,6 +3617,36 @@
             }, top);
             return at;
         },
+        /**
+         * get absolute scale of the node which takes into
+         *  account its ancestor scales
+         * @method
+         * @memberof Konva.Node.prototype
+         * @returns {Konva.Transform}
+         */
+        getAbsoluteScale: function(top) {
+            // if using an argument, we can't cache the result.
+            if (top) {
+                return this._getAbsoluteTransform(top);
+            }
+            // if no argument, we can cache the result
+            else {
+                return this._getCache(ABSOLUTE_SCALE, this._getAbsoluteScale);
+            }
+        },
+        _getAbsoluteScale: function(top) {
+            var scaleX = 1, scaleY = 1;
+
+            // start with stage and traverse downwards to self
+            this._eachAncestorReverse(function(node) {
+                scaleX *= node.scaleX();
+                scaleY *= node.scaleY();
+            }, top);
+            return {
+                x: scaleX,
+                y: scaleY
+            };
+        },
         /**
          * get transform of the node
          * @method

src/Context.js

@@ -572,9 +572,10 @@
                     x: 0,
                     y: 0
                 }),
-                m = shape.getAbsoluteTransform().m,
+                // TODO: get this info from transform??
-                scaleX = m[0],
+                scale = shape.getAbsoluteScale(),
-                scaleY = m[3];
+                scaleX = scale.x,
+                scaleY = scale.y;
 
             this.setAttr('shadowColor', color);
             this.setAttr('shadowBlur', blur);

src/Node.js

@@ -3,6 +3,7 @@
     // CONSTANTS
     var ABSOLUTE_OPACITY = 'absoluteOpacity',
         ABSOLUTE_TRANSFORM = 'absoluteTransform',
+        ABSOLUTE_SCALE = 'absoluteScale',
         CHANGE = 'Change',
         CHILDREN = 'children',
         DOT = '.',
@@ -34,6 +35,11 @@
             'offsetXChange.konva',
             'offsetYChange.konva',
             'transformsEnabledChange.konva'
+        ].join(SPACE),
+
+        SCALE_CHANGE_STR = [
+            'scaleXChange.konva',
+            'scaleYChange.konva'
         ].join(SPACE);
 
     /**
@@ -64,6 +70,11 @@
                 this._clearCache(TRANSFORM);
                 that._clearSelfAndDescendantCache(ABSOLUTE_TRANSFORM);
             });
+
+            this.on(SCALE_CHANGE_STR, function() {
+                that._clearSelfAndDescendantCache(ABSOLUTE_SCALE);
+            });
+
             this.on('visibleChange.konva', function() {
                 that._clearSelfAndDescendantCache(VISIBLE);
             });
@@ -1373,6 +1384,36 @@
             }, top);
             return at;
         },
+        /**
+         * get absolute scale of the node which takes into
+         *  account its ancestor scales
+         * @method
+         * @memberof Konva.Node.prototype
+         * @returns {Konva.Transform}
+         */
+        getAbsoluteScale: function(top) {
+            // if using an argument, we can't cache the result.
+            if (top) {
+                return this._getAbsoluteTransform(top);
+            }
+            // if no argument, we can cache the result
+            else {
+                return this._getCache(ABSOLUTE_SCALE, this._getAbsoluteScale);
+            }
+        },
+        _getAbsoluteScale: function(top) {
+            var scaleX = 1, scaleY = 1;
+
+            // start with stage and traverse downwards to self
+            this._eachAncestorReverse(function(node) {
+                scaleX *= node.scaleX();
+                scaleY *= node.scaleY();
+            }, top);
+            return {
+                x: scaleX,
+                y: scaleY
+            };
+        },
         /**
          * get transform of the node
          * @method