feat: assetish

src/actors/link.js

@@ -36,7 +36,7 @@ export function addLink(k, world, onLeave) {
   const link = k.add([
     ...visual(k, "link"),
     k.pos(p),
-    k.area({ collisionIgnore: ["player", "chicken"] }),
+    k.area({ collisionIgnore: ["player", "chicken"], scale: 0.5 }),
     k.body(),
     k.state("seek", ["seek", "throw", "cutGrass", "hitChicken", "flee", "leave"]),
     "link",

src/main.js

@@ -15,6 +15,25 @@ const k = kaplay({
 // No gravity: this is a top-down game.
 k.setGravity(0);
 
+// Actor sprites.
+k.loadSprite("link", "assets/link.png");
+
+// Background music. Browsers block autoplay until the user interacts, so start
+// looping on the first key/click and keep the handle across scene changes.
+k.loadSound("bg-music", "src/assets/bg-music.mp3");
+let music = null;
+let muted = false;
+function startMusic() {
+  if (music || muted) return;
+  music = k.play("bg-music", { loop: true, volume: 0.5 });
+}
+k.onKeyPress(startMusic);
+k.onMousePress(startMusic);
+k.onKeyPress("m", () => {
+  muted = !muted;
+  if (music) music.paused = muted;
+});
+
 registerGameScene(k);
 registerEndScenes(k);
 k.go("game");

src/sprites.js

@@ -13,7 +13,17 @@ const SPEC = {
   shard:    { shape: "rect", w: 12, h: 12, radius: 2, color: [212, 152, 90], outline: [132, 82, 40] },
 };
 
+// Kinds backed by a real loaded sprite (loadSprite name + render scale). Others
+// fall back to the placeholder shapes in SPEC.
+const SPRITES = {
+  link: { name: "link", scale: 0.44 },
+};
+
 export function visual(k, kind) {
+  const sp = SPRITES[kind];
+  if (sp) {
+    return [k.sprite(sp.name), k.anchor("center"), k.scale(sp.scale)];
+  }
   const s = SPEC[kind];
   const comps =
     s.shape === "circle"