added TileInfo.frame for cleaner animation support

dist/littlejs.d.ts

@@ -1011,11 +1011,16 @@ declare module "littlejs.esm" {
         size: Vector2;
         /** @property {Number} - Texture index to use */
         textureIndex: number;
-        /** Returns an offset copy of this tile, useful for animation
+        /** Returns a copy of this tile offset by a vector
         *  @param {Vector2} offset - Offset to apply in pixels
         *  @return {TileInfo}
         */
         offset(offset: Vector2): TileInfo;
+        /** Returns a copy of this tile offset by a number of animation frames
+        *  @param {Number} frame - Offset to apply in animation frames
+        *  @return {TileInfo}
+        */
+        frame(frame: number): TileInfo;
         /** Returns the texture info for this tile
         *  @return {TextureInfo}
         */

dist/littlejs.esm.js

@@ -2141,13 +2141,23 @@ class TileInfo
         this.textureIndex = textureIndex;
     }
 
-    /** Returns an offset copy of this tile, useful for animation
+    /** Returns a copy of this tile offset by a vector
     *  @param {Vector2} offset - Offset to apply in pixels
     *  @return {TileInfo}
     */
     offset(offset)
     { return new TileInfo(this.pos.add(offset), this.size, this.textureIndex); }
 
+    /** Returns a copy of this tile offset by a number of animation frames
+    *  @param {Number} frame - Offset to apply in animation frames
+    *  @return {TileInfo}
+    */
+    frame(frame)
+    {
+        ASSERT(typeof frame == 'number');
+        return this.offset(vec2(frame*this.size.x, 0));
+    }
+
     /** Returns the texture info for this tile
     *  @return {TextureInfo}
     */

dist/littlejs.js

@@ -2141,13 +2141,23 @@ class TileInfo
         this.textureIndex = textureIndex;
     }
 
-    /** Returns an offset copy of this tile, useful for animation
+    /** Returns a copy of this tile offset by a vector
     *  @param {Vector2} offset - Offset to apply in pixels
     *  @return {TileInfo}
     */
     offset(offset)
     { return new TileInfo(this.pos.add(offset), this.size, this.textureIndex); }
 
+    /** Returns a copy of this tile offset by a number of animation frames
+    *  @param {Number} frame - Offset to apply in animation frames
+    *  @return {TileInfo}
+    */
+    frame(frame)
+    {
+        ASSERT(typeof frame == 'number');
+        return this.offset(vec2(frame*this.size.x, 0));
+    }
+
     /** Returns the texture info for this tile
     *  @return {TextureInfo}
     */

dist/littlejs.release.js

@@ -1755,13 +1755,23 @@ class TileInfo
         this.textureIndex = textureIndex;
     }
 
-    /** Returns an offset copy of this tile, useful for animation
+    /** Returns a copy of this tile offset by a vector
     *  @param {Vector2} offset - Offset to apply in pixels
     *  @return {TileInfo}
     */
     offset(offset)
     { return new TileInfo(this.pos.add(offset), this.size, this.textureIndex); }
 
+    /** Returns a copy of this tile offset by a number of animation frames
+    *  @param {Number} frame - Offset to apply in animation frames
+    *  @return {TileInfo}
+    */
+    frame(frame)
+    {
+        ASSERT(typeof frame == 'number');
+        return this.offset(vec2(frame*this.size.x, 0));
+    }
+
     /** Returns the texture info for this tile
     *  @return {TextureInfo}
     */

examples/platformer/gameCharacter.js

@@ -218,8 +218,7 @@ class Character extends GameObject
         const animationFrame = this.isDead() ? 0 :
             this.climbingLadder || this.groundTimer.active() ?
             2*this.walkCyclePercent|0 : 1;
-        const playerTile = spriteAtlas.player;
-        this.tileInfo.pos.x = playerTile.pos.x + playerTile.size.x*animationFrame;
+        this.tileInfo = spriteAtlas.player.frame(animationFrame);
 
         let bodyPos = this.pos;
         if (!this.isDead())

src/engineDraw.js

@@ -114,13 +114,23 @@ class TileInfo
         this.textureIndex = textureIndex;
     }
 
-    /** Returns an offset copy of this tile, useful for animation
+    /** Returns a copy of this tile offset by a vector
     *  @param {Vector2} offset - Offset to apply in pixels
     *  @return {TileInfo}
     */
     offset(offset)
     { return new TileInfo(this.pos.add(offset), this.size, this.textureIndex); }
 
+    /** Returns a copy of this tile offset by a number of animation frames
+    *  @param {Number} frame - Offset to apply in animation frames
+    *  @return {TileInfo}
+    */
+    frame(frame)
+    {
+        ASSERT(typeof frame == 'number');
+        return this.offset(vec2(frame*this.size.x, 0));
+    }
+
     /** Returns the texture info for this tile
     *  @return {TextureInfo}
     */