refactor: sprite default anchor to middle

packages/graphics/sprite.js

@@ -8,6 +8,7 @@ export class Sprite extends Renderable {
     super();
     this._image = image;
     this.sprite = new PIXI.Sprite(image.texture);
+    this.anchor = [0.5, 0.5];
   }
 
   destroy() {

packages/graphics/traits/pictured.trait.js

@@ -65,7 +65,6 @@ export class Pictured extends decorate(Trait) {
       const {uri} = this._images[key];
       const imagePromise = Image.load(uri).then((image) => {
         const sprite = this.sprites[key] = new Sprite(image);
-        sprite.anchor = [0.5, 0.5];
         // Calculate any offset.
         sprite.position = this.offsetFor(key);
         // Set current image upfront.

packages/timing/traits/animated.trait.js

@@ -107,7 +107,7 @@ class AnimatedBase extends Trait {
         this.animationViews[key] = new AnimationView(animation);
         // Calculate any offset.
         const animationView = this.animationViews[key];
-        animationView.position = this.viewPositionFor(key);
+        animationView.position = this.offsetFor(key);
         // Ensure animation is made visible upfront.
         const isCurrentAnimation = key === this.entity.currentAnimation;
         if (isCurrentAnimation) {
@@ -135,17 +135,6 @@ class AnimatedBase extends Trait {
     this.entity.container.addChild(animationView);
   }
 
-  viewPositionFor(key) {
-    const animation = this.animations[key];
-    if (!animation) {
-      return [0, 0];
-    }
-    const size = animation.frameSize;
-    const halfway = Vector.scale(size, -0.5);
-    const offset = this.offsetFor(key);
-    return Vector.add(halfway, offset);
-  }
-
   hooks() {
     return {
 
@@ -155,7 +144,7 @@ class AnimatedBase extends Trait {
         if (!animation) {
           return [0, 0, 0, 0];
         }
-        const viewPosition = this.viewPositionFor(key);
+        const viewPosition = this.offsetFor(key);
         const position = Vector.add(this.entity.position, viewPosition);
         return Rectangle.compose(position, animation.frameSize);
       },

packages/topdown/layer-view.js

@@ -72,6 +72,7 @@ export class LayerView extends Container {
     const tilesRenderer = new TilesRenderer(this.layer.tiles, this.layer.tileset);
     const chunk = tilesRenderer.renderChunk(this.renderer);
     const tilesSprite = new Sprite(chunk);
+    tilesSprite.anchor = [0, 0];
     this.layerContainer.addChild(tilesSprite);
   }
 

packages/topdown/tiles-renderer.js

@@ -30,6 +30,7 @@ export class TilesRenderer {
       const subimage = this.tileset.subimage(index);
       if (subimage) {
         const sprite = new Sprite(subimage);
+        sprite.anchor = [0, 0];
         sprite.position = position;
         container.addChild(sprite);
       }