From cfe3065077e631b93b54f841cb762211fed69657 Mon Sep 17 00:00:00 2001
From: Colin McMillen <me@famicol.in>
Date: Thu, 3 Oct 2019 16:42:21 -0400
Subject: [PATCH] use spritesheet & metadata from bundle/ instead of
 hard-coding a few

---
 index.html |  6 +++---
 main.js    | 28 +++++++++++++---------------
 2 files changed, 16 insertions(+), 18 deletions(-)

diff --git a/index.html b/index.html
index ff27b56..c767c53 100644
--- a/index.html
+++ b/index.html
@@ -35,9 +35,9 @@
     <button id="6x">6x</button>
     <button id="7x">7x</button>
     <button id="8x">8x</button>
-    <img src="res/tf/atlantis/tf_atlantis_tiles.png" id="atlantis" style="display: none">
-    <img src="res/tf/halloween/ghost1.png" id="ghost" style="display: none">
-    <img src="res/tf/beasttribes/beast_tribe_2.png" id="cats" style="display: none">
+    <img src="bundle/tf_atlantis_tiles.png" id="atlantis" style="display: none">
+    <img src="bundle/spritesheet.png" id="spritesheet" style="display: none">
+    <script src="bundle/spritesheet.js"></script>
     <script src="main.js"></script>
   </body>
 </html>
diff --git a/main.js b/main.js
index d2d2d62..9b60a4b 100644
--- a/main.js
+++ b/main.js
@@ -338,8 +338,7 @@ class CharacterSprite {
 class Resources {
   constructor() {
     const atlantis = document.getElementById('atlantis');
-    const ghost = document.getElementById('ghost');
-    const cats = document.getElementById('cats');
+    const spritesheet = document.getElementById('spritesheet');
     const ts = 16;
     this.sprites = {
       'ground0':     new Sprite(atlantis, 2 * ts, 1 * ts, 16, 16),
@@ -357,16 +356,14 @@ class Resources {
       'seaweed1':    new Sprite(atlantis, 16 * ts, 2 * ts, 16, 32),
       'coral0':      new Sprite(atlantis, 15 * ts, 9 * ts, 32, 16),
       'rockpile0':   new Sprite(atlantis, 17 * ts, 10 * ts, 32, 32),
+    }
+
+    for (const key in spritesheet_json) {
+      const sprite_data = spritesheet_json[key];
 
-      'ghost': new CharacterSprite(ghost, 0, 0, 26, 36),
-      'cat0':  new CharacterSprite(cats, 0, 0, 26, 36),
-      'cat1':  new CharacterSprite(cats, 26 * 3, 0, 26, 36),
-      'cat2':  new CharacterSprite(cats, 26 * 6, 0, 26, 36),
-      'cat3':  new CharacterSprite(cats, 26 * 9, 0, 26, 36),
-      'cat4':  new CharacterSprite(cats, 0, 36 * 4, 26, 36),
-      'cat5':  new CharacterSprite(cats, 26 * 3, 36 * 4, 26, 36),
-      'cat6':  new CharacterSprite(cats, 26 * 6, 36 * 4, 26, 36),
-      'cat7':  new CharacterSprite(cats, 26 * 9, 36 * 4, 26, 36),
+      this.sprites[sprite_data['name']] = new CharacterSprite(
+          spritesheet, sprite_data['x'], sprite_data['y'],
+          sprite_data['width'] / 3, sprite_data['height'] / 4);
     }
   }
 }
@@ -377,10 +374,11 @@ class Player {
     this.x = (SNES_WIDTH - 26) / 2;
     this.y = (SNES_HEIGHT - 36) / 2;
     this.orientation = Orientation.DOWN;
-    this.spriteNames_ = [
-        'ghost', 'cat0', 'cat1', 'cat2', 'cat3', 'cat4', 'cat5', 'cat6',
-        'cat7'];
-    this.spriteNamesIdx_ = 3;
+    this.spriteNames_ = [];
+    for (const name in spritesheet_json) {
+      this.spriteNames_.push(name);
+    }
+    this.spriteNamesIdx_ = 8;
   }
 
   get spriteName() {