fixes #362

src/plugins/Path.js

@@ -23,9 +23,9 @@
             this.shapeType = 'Path';
             this._setDrawFuncs();
 
-            this.dataArray = Kinetic.Path.parsePathData(this.attrs.data);
+            this.dataArray = Kinetic.Path.parsePathData(this.getData());
             this.on('dataChange', function() {
-                that.dataArray = Kinetic.Path.parsePathData(that.attrs.data);
+                that.dataArray = Kinetic.Path.parsePathData(this.getData());
             });
         },
         drawFunc: function(canvas) {
@@ -74,10 +74,6 @@
     };
     Kinetic.Global.extend(Kinetic.Path, Kinetic.Shape);
 
-    /*
-     * Utility methods written by jfollas to
-     * handle length and point measurements
-     */
     Kinetic.Path.getLineLength = function(x1, y1, x2, y2) {
         return Math.sqrt((x2 - x1) * (x2 - x1) + (y2 - y1) * (y2 - y1));
     };

src/shapes/Sprite.js

@@ -7,12 +7,13 @@
      * @param {String} config.animation animation key
      * @param {Object} config.animations animation map
      * @param {Integer} [config.index] animation index
+     * @param {Image} image image object
      * {{ShapeParams}}
      * {{NodeParams}}
      */
     Kinetic.Sprite = function(config) {
         this._initSprite(config);
-    };
+    }
 
     Kinetic.Sprite.prototype = {
         _initSprite: function(config) {
@@ -31,14 +32,21 @@
             });
         },
         drawFunc: function(canvas) {
-            var anim = this.attrs.animation, index = this.attrs.index, f = this.attrs.animations[anim][index], context = canvas.getContext(), image = this.attrs.image;
+            var anim = this.getAnimation(), 
+                index = this.getIndex(), 
+                f = this.getAnimations()[anim][index], 
+                context = canvas.getContext(), 
+                image = this.getImage();
 
             if(image) {
                 context.drawImage(image, f.x, f.y, f.width, f.height, 0, 0, f.width, f.height);
             }
         },
         drawHitFunc: function(canvas) {
-            var anim = this.attrs.animation, index = this.attrs.index, f = this.attrs.animations[anim][index], context = canvas.getContext();
+            var anim = this.getAnimation(), 
+                index = this.getIndex(), 
+                f = this.getAnimations()[anim][index], 
+                context = canvas.getContext();
 
             context.beginPath();
             context.rect(0, 0, f.width, f.height);
@@ -63,14 +71,14 @@
             this.anim.node = layer;
 
             this.interval = setInterval(function() {
-                var index = that.attrs.index;
+                var index = that.getIndex();
                 that._updateIndex();
                 if(that.afterFrameFunc && index === that.afterFrameIndex) {
                     that.afterFrameFunc();
                     delete that.afterFrameFunc;
                     delete that.afterFrameIndex;
                 }
-            }, 1000 / this.attrs.frameRate);
+            }, 1000 / this.getFrameRate());
 
             this.anim.start();
         },
@@ -95,13 +103,17 @@
             this.afterFrameFunc = func;
         },
         _updateIndex: function() {
-            var i = this.attrs.index;
-            var a = this.attrs.animation;
-            if(i < this.attrs.animations[a].length - 1) {
-                this.attrs.index++;
+            var index = this.getIndex(),
+                animation = this.getAnimation(),
+                animations = this.getAnimations(),
+                anim = animations[animation], 
+                len = anim.length;
+                 
+            if(index < len - 1) {
+                this.setIndex(index + 1);
             }
             else {
-                this.attrs.index = 0;
+                this.setIndex(0);
             }
         }
     };
@@ -110,6 +122,7 @@
     // add getters setters
     Kinetic.Node.addGetterSetter(Kinetic.Sprite, 'animation');
     Kinetic.Node.addGetterSetter(Kinetic.Sprite, 'animations');
+    Kinetic.Node.addGetterSetter(Kinetic.Sprite, 'image');
     Kinetic.Node.addGetterSetter(Kinetic.Sprite, 'index', 0);
     Kinetic.Node.addGetterSetter(Kinetic.Sprite, 'frameRate', 17);
 
@@ -127,6 +140,13 @@
      * @param {Object} animations
      */
 
+    /**
+     * set image 
+     * @name setImage
+     * @methodOf Kinetic.Sprite.prototype
+     * @param {Image} image 
+     */
+
     /**
      * set animation frame index
      * @name setIndex
@@ -146,6 +166,12 @@
      * @methodOf Kinetic.Sprite.prototype
      */
 
+    /**
+     * get image
+     * @name getImage
+     * @methodOf Kinetic.Sprite.prototype
+     */
+
     /**
      * get animation frame index
      * @name getIndex

tests/js/unit/shapes/spriteTests.js

@@ -84,7 +84,6 @@ Test.Modules.SPRITE = {
                 image: imageObj,
                 animation: 'standing',
                 animations: anims,
-                index: 0,
                 frameRate: Math.random() * 6 + 6,
                 frameRate: 10,
                 draggable: true,
@@ -114,6 +113,8 @@ Test.Modules.SPRITE = {
             //document.body.appendChild(layer.bufferCanvas.element)
             
             test(sprite.getShapeType() === 'Sprite', 'shape type should be Sprite');
+
+            test(sprite.getIndex() === 0, 'sprite index should default to 0');
         };
         imageObj.src = '../assets/scorpion-sprite.png';
     }