refactor: scale and anchor

app/create-homestead.js

@@ -45,7 +45,8 @@ export default async function createHomestead(Ecs) {
     Ecs: {},
     Position: {x: 100, y: 100},
     Sprite: {
-      anchor: {x: 0.5, y: 0.8},
+      anchorX: 0.5,
+      anchorY: 0.8,
       source: '/assets/shit-shack/shit-shack.json',
     },
     VisibleAabb: {},

app/create-player.js

@@ -45,7 +45,8 @@ export default async function createPlayer(id) {
     Speed: {speed: 100},
     Sound: {},
     Sprite: {
-      anchor: {x: 0.5, y: 0.8},
+      anchorX: 0.5,
+      anchorY: 0.8,
       animation: 'moving:down',
       frame: 0,
       frames: 8,

app/ecs-components/sprite.js

@@ -1,18 +1,28 @@
 import Component from '@/ecs/component.js';
 
-import vector2d from "./helpers/vector-2d";
-
 export default class Sprite extends Component {
+  instanceFromSchema() {
+    return class SpriteInstance extends super.instanceFromSchema() {
+      get anchor() {
+        return {x: this.anchorX, y: this.anchorY};
+      }
+      get scale() {
+        return {x: this.scaleX, y: this.scaleY};
+      }
+    };
+  }
   async load(instance) {
     instance.$$sourceJson = await this.ecs.readJson(instance.source);
   }
   static properties = {
-    anchor: vector2d('float32', {x: 0.5, y: 0.5}),
+    anchorX: {defaultValue: 0.5, type: 'float32'},
+    anchorY: {defaultValue: 0.5, type: 'float32'},
     animation: {type: 'string'},
     elapsed: {type: 'float32'},
     frame: {type: 'uint16'},
     frames: {type: 'uint16'},
-    scale: vector2d('float32', {x: 1, y: 1}),
+    scaleX: {defaultValue: 1, type: 'float32'},
+    scaleY: {defaultValue: 1, type: 'float32'},
     source: {type: 'string'},
     speed: {type: 'float32'},
   };

public/assets/tomato-seeds/start.js

@@ -30,7 +30,8 @@ if (projected?.length > 0) {
       stages: Array(5).fill(5),
     },
     Sprite: {
-      anchor: {x: 0.5, y: 0.75},
+      anchorX: 0.5,
+      anchorY: 0.75,
       animation: 'stage/0',
       frame: 0,
       frames: 1,