fixed set fill attr bug which occurred when instantiating the fill with a string color and then setting it later to a fill object such as a gradient or pattern. The fix will apply to any attr which can be a string or object

dist/kinetic-core.js

@@ -3,7 +3,7 @@
  * http://www.kineticjs.com/
  * Copyright 2012, Eric Rowell
  * Licensed under the MIT or GPL Version 2 licenses.
- * Date: Jun 10 2012
+ * Date: Jun 12 2012
  *
  * Copyright (C) 2011 - 2012 by Eric Rowell
  *
@@ -172,7 +172,8 @@ Kinetic.GlobalObject = {
         //return Object.prototype.toString.call(obj) == '[object Array]';
     },
     _isObject: function(obj) {
-        return obj === Object(obj);
+        return ( typeof obj == 'object');
+        //return obj === Object(obj);
     },
     _isNumber: function(obj) {
         return Object.prototype.toString.call(obj) == '[object Number]';
@@ -566,9 +567,16 @@ Kinetic.Node.prototype = {
                      * to the node and then traverse
                      */
                     if(go._isObject(val) && !go._isArray(val) && !go._isElement(val) && !go._hasMethods(val)) {
-                        if(obj[key] === undefined) {
+                        /*
+                         * since some properties can be strings or objects, e.g.
+                         * fill, we need to first check that obj is an object
+                         * before setting properties.  If it's not an object,
+                         * overwrite obj with an object literal
+                         */
+                        if(!Kinetic.GlobalObject._isObject(obj[key])) {
                             obj[key] = {};
                         }
+
                         setAttrs(obj[key], val, level + 1);
                     }
                     /*
@@ -2800,6 +2808,7 @@ Kinetic.Shape.prototype = {
         context.save();
 
         var fill = this.attrs.fill;
+        
         if(!!fill) {
             if(!this.appliedShadow) {
                 appliedShadow = this._applyShadow();

src/GlobalObject.js

@@ -144,7 +144,8 @@ Kinetic.GlobalObject = {
         //return Object.prototype.toString.call(obj) == '[object Array]';
     },
     _isObject: function(obj) {
-        return obj === Object(obj);
+        return ( typeof obj == 'object');
+        //return obj === Object(obj);
     },
     _isNumber: function(obj) {
         return Object.prototype.toString.call(obj) == '[object Number]';

src/Node.js

@@ -183,9 +183,16 @@ Kinetic.Node.prototype = {
                      * to the node and then traverse
                      */
                     if(go._isObject(val) && !go._isArray(val) && !go._isElement(val) && !go._hasMethods(val)) {
-                        if(obj[key] === undefined) {
+                        /*
+                         * since some properties can be strings or objects, e.g.
+                         * fill, we need to first check that obj is an object
+                         * before setting properties.  If it's not an object,
+                         * overwrite obj with an object literal
+                         */
+                        if(!Kinetic.GlobalObject._isObject(obj[key])) {
                             obj[key] = {};
                         }
+
                         setAttrs(obj[key], val, level + 1);
                     }
                     /*

src/Shape.js

@@ -104,6 +104,7 @@ Kinetic.Shape.prototype = {
         context.save();
 
         var fill = this.attrs.fill;
+        
         if(!!fill) {
             if(!this.appliedShadow) {
                 appliedShadow = this._applyShadow();

tests/js/unitTests.js

@@ -1840,6 +1840,42 @@ Test.prototype.tests = {
         };
         imageObj.src = '../darth-vader.jpg';
     },
+    'SHAPE - set image fill to color then image': function(containerId) {
+        var imageObj = new Image();
+        imageObj.onload = function() {
+            var stage = new Kinetic.Stage({
+                container: containerId,
+                width: 578,
+                height: 200
+            });
+            var layer = new Kinetic.Layer();
+            circle = new Kinetic.Circle({
+                x: 200,
+                y: 60,
+                radius: 50,
+                fill: 'blue'
+            });
+
+            layer.add(circle);
+            stage.add(layer);
+
+            test(circle.getFill() === 'blue', 'circle fill should be blue');
+
+            circle.setFill({
+                image: imageObj,
+                repeat: 'no-repeat',
+                offset: [-200, -70]
+            });
+
+            test(circle.getFill().image !== undefined, 'circle fill image should be defined');
+            test(circle.getFill().repeat === 'no-repeat', 'circle fill repeat should be no-repeat');
+            test(circle.getFill().offset.x === -200, 'circle fill offset x should be -200');
+            test(circle.getFill().offset.y === -70, 'circle fill offset y should be -70');
+
+            layer.draw();
+        };
+        imageObj.src = '../darth-vader.jpg';
+    },
     'SHAPE - add sprite': function(containerId) {
         var imageObj = new Image();
         imageObj.onload = function() {