silphscope 1.0.1 → 1.1.0

package/README.md

@@ -1,5 +1,9 @@
 still a WIP however hopefully with some more work I can get this into a workable state...
 
+(Newer!) Update:
+
+still a WIP :p but erm you can extract more graphics!
+
 Update:
 
 so the project is semi-usable now you can download it as a npm package via:
@@ -10,12 +14,39 @@ so the project is semi-usable now you can download it as a npm package via:
 general use is something like this:
 ```JavaScript
 import fs from "fs";
-import { renderAllMons } from "silphscope"; // this is cool...
+import { renderAllGraphics } from "silphscope"; // this is cool...
 
 const rom = fs.readFileSync("pokefirered.gba"); // replace with path to your own firered rom
+await renderAllGraphics(rom, {
+    outputMonDir: "./Assets/monImages", // must I explain?
+    outputIconDir: "./Assets/Icons", // same thing here :p
+});
+```
+
+Of course though the above is for extracting all graphics (which is kinda a lie... In reality it only extracts mon images and item icons... but like I said this is a WIP :p so wait a bit please!).
+
+But if you want say just the mon images or item icons refer below:
+
+mon images extraction:
+```JavaScript
+import fs from "fs";
+import { renderAllMons } from "silphscope"; // never gets old :p
+
+const rom = fs.readFileSync("pokefirered.gba")// once again replace with the path to your own firered rom
 await renderAllMons(rom, {
-    outputDir: "./Assets/monImages", // must I explain?
-    icon: true, // you should probably leave these two alone
-    footprint: true // unless you don't want everything generated?
+    outputDir: "./Assets/monImages", // do I actually have to explain?
+    icon: true, // set to false if you don't want icons I guess...
+    footprint: true, // same as the above...
+});
+```
+
+item icon extraction:
+```JavaScript
+import fs from "fs";
+import { renderAllIcons } from "silphscope" // :D
+
+const rom = fs.readFileSync("pokefirered.gba")// find your own rom and so on :l
+await renderAllIcons(rom, {
+    outputDir: "./Assets/Icons" // no comment (wait... that was a comment :p)
 });
 ```

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "silphscope",
-  "version": "1.0.1",
+  "version": "1.1.0",
   "description": "A firered/leafgreen ROM asset extractor for use in web applications",
   "main": "main.js",
   "exports": {

package/src/graphics/graphics-extractor-main.js

@@ -5,6 +5,7 @@ import fs from "fs";
 import path from "path";
 import { fileURLToPath } from "url";
 import { renderMon } from "./render-mons.js";
+import { renderIcon } from "./icons/render-icons.js";
 
 const currentDir = path.dirname(fileURLToPath(import.meta.url));
 
@@ -15,6 +16,7 @@ function loadDefaultJson(relativePath) {
 
 const assets = loadDefaultJson("../graphics-maps/fr-graphic-map.json");
 const mons = loadDefaultJson("../mon-data/monData.json");
+const icons = loadDefaultJson("../item-data/itemData.json");
 
 export async function renderAllMons(rom, options = {}) {
     if (!rom || !(rom instanceof Uint8Array || Buffer.isBuffer(rom))) {
@@ -64,6 +66,46 @@ export async function renderAllMons(rom, options = {}) {
     }
 }
 
+export async function renderAllIcons(rom, options = {}) {
+    if (!rom || !(rom instanceof Uint8Array || Buffer.isBuffer(rom))) {
+        throw new TypeError("renderAllIcons(rom, options) requires rom Buffer/Uint8Array as first argument");
+    }
+
+    const {
+        assets: providedAssets = assets,
+        icons: providedIcons = icons,
+        outputDir = "./out",
+    } = options;
+
+    fs.mkdirSync(outputDir, { recursive: true });
+
+    for (const itemName of Object.keys(providedIcons)) {
+        await renderIcon(itemName, providedIcons, providedAssets, rom, { outputDir });
+        console.log(`Done: ${itemName}`);
+    }
+}
+
+export async function renderAllGraphics(rom, options = {}) { // eventually I will speed this up instead of doing it sequentially :p but for now its fine I guess
+    if (!rom || !(rom instanceof Uint8Array || Buffer.isBuffer(rom))) {
+        throw new TypeError("renderAllGraphics(rom, options) requires rom Buffer/Uint8Array as first argument");
+    }
+
+    const {
+        outputMonDir = "./out/mons",
+        outputIconDir = "./out/icons",
+    } = options;
+
+    await renderAllMons(rom, {
+        outputDir: outputMonDir,
+        icon: true,
+        footprint: true,
+    });
+    
+    await renderAllIcons(rom, {
+        outputDir: outputIconDir,
+    });
+}
+
 export function loadDefaultRom() {
     const romPath = path.resolve(process.cwd(), "../../pokefirered.gba");
     return fs.readFileSync(romPath);

package/src/graphics/icons/render-icons.js

@@ -0,0 +1,53 @@
+// Copyright (c) 2026 chickenPoo
+// Licensed under the MIT License. See LICENSE file in project root.
+
+import { extract } from "../extract.js";
+import { PNG } from "pngjs";
+import fs from "fs";
+import { render4bppImage } from "../render-4bpp-image.js";
+
+const streamToBuffer = (stream) => new Promise((resolve, reject) => {
+    const chunks = [];
+    stream.on("data", chunk => chunks.push(chunk));
+    stream.on("end", () => resolve(Buffer.concat(chunks)));
+    stream.on("error", reject);
+});
+
+export async function renderIcon(itemName, items, assets, rom, options = {}) {
+    const { outputDir = null } = options;
+
+    if (!rom || !(rom instanceof Uint8Array || Buffer.isBuffer(rom))) {
+        throw new TypeError("renderIcon(..., rom) requires a ROM Buffer/Uint8Array");
+    }
+
+    const item = items[itemName];
+    if (!item) {
+        throw new Error(`Missing Item: ${itemName}`);
+    }
+
+    const iconPal = assets.find(a => a.name === item.palette);
+    const iconPic = assets.find(a => a.name === item.icon);
+    if (!iconPal || !iconPic) {
+        throw new Error(`Missing assets for: ${itemName}`);
+    }
+
+    const iconImageData = extract(iconPic, rom);
+    const rawIconPalData = extract(iconPal, rom);
+    const width = 24;
+    const height = 24;
+
+    const image = render4bppImage(iconImageData, rawIconPalData, width, height);
+
+    const png = new PNG({ width, height });
+    png.data = image;
+    const pngBuffer = await streamToBuffer(png.pack());
+
+    if (outputDir) {
+        const dir = `${outputDir}/${itemName}`;
+        if (!fs.existsSync(dir)) fs.mkdirSync(dir, { recursive: true });
+        const fileName = `${dir}/icon.png`;
+        fs.writeFileSync(fileName, pngBuffer);
+    }
+
+    return pngBuffer;
+}

package/src/graphics/render-4bpp-image.js

@@ -0,0 +1,46 @@
+// Copyright (c) 2026 chickenPoo
+// Licensed under the MIT License. See LICENSE file in project root.
+
+import { decode4bppTile } from "./decode-4bpp.js";
+import { decodePalette } from "./decode-palette.js";
+
+export function render4bppImage({ tileData, paletteData, width, height, paletteOffset = 0, paletteSize = null }) {
+    const tileSize = 32;
+    const numTiles = tileData.length / tileSize;
+    const tilesPerRow = width / 8;
+    let finalPaletteData = paletteData;
+    if (paletteSize !== null) {
+        finalPaletteData = paletteData.slice(
+            paletteOffset,
+            paletteOffset + paletteSize
+        );
+    }
+    const palette = decodePalette(finalPaletteData);
+    const tiles = [];
+    for (let i = 0; i < numTiles; i++) {
+        const start = i * tileSize;
+        const tileBytes = tileData.slice(start, start + tileSize);
+        tiles.push(decode4bppTile(tileBytes));
+    }
+    const image = new Uint8ClampedArray(width * height * 4);
+    for (let t = 0; t < tiles.length; t++) {
+        const tile = tiles[t];
+        const tileX = t % tilesPerRow;
+        const tileY = Math.floor(t / tilesPerRow);
+        for (let py = 0; py < 8; py++) {
+            for (let px = 0; px < 8; px++) {
+                const pixelIndex = py * 8 + px;
+                const colorIndex = tile[pixelIndex];
+                const x = tileX * 8 + px;
+                const y = tileY * 8 + py;
+                const outIndex = (y * width + x) * 4;
+                const [r, g, b] = palette[colorIndex] || [0, 0, 0];
+                image[outIndex] = r;
+                image[outIndex + 1] = g;
+                image[outIndex + 2] = b;
+                image[outIndex + 3] = colorIndex === 0 ? 0 : 255;
+            }
+        }
+    }
+    return image;
+}

package/src/graphics/render-mon-icon.js

@@ -1,11 +1,10 @@
 // Copyright (c) 2026 chickenPoo
 // Licensed under the MIT License. See LICENSE file in project root.
 
-import { decode4bppTile } from "./decode-4bpp.js";
-import { decodePalette } from "./decode-palette.js";
 import { extract } from "./extract.js";
 import { PNG } from "pngjs";
 import fs from "fs";
+import { render4bppImage } from "./render-4bpp-image.js";
 
 const streamToBuffer = (stream) => new Promise((resolve, reject) => {
     const chunks = [];
@@ -32,45 +31,11 @@ export async function renderMonIcon(monName, mons, assets, iconPalettes, rom, op
     const iconData = extract(iconAsset, rom);
     const palIndex = Number(mon.iconPalIndex);
     const palSize = 32;
-    const palStart = palIndex * palSize;
-    const palEnd = palStart + palSize;
     const rawIconPalData = extract(iconPalettes, rom);
-    const slicedPalData = rawIconPalData.data.slice(palStart, palEnd);
-    const palette = decodePalette(slicedPalData);
-
-    const tileSize = 32;
-    const numTiles = iconData.data.length / tileSize;
     const width = 32;
     const height = 64;
-    const tilesPerRow = width / 8;
-
-    const tiles = [];
-    for (let i = 0; i < numTiles; i++) {
-        const start = i * tileSize;
-        const tileBytes = iconData.data.slice(start, start + tileSize);
-        tiles.push(decode4bppTile(tileBytes));
-    }
 
-    const image = new Uint8ClampedArray(width * height * 4);
-    for (let t = 0; t < tiles.length; t++) {
-        const tile = tiles[t];
-        const tileX = t % tilesPerRow;
-        const tileY = Math.floor(t / tilesPerRow);
-        for (let py = 0; py < 8; py++) {
-            for (let px = 0; px < 8; px++) {
-                const pixelIndex = py * 8 + px;
-                const colorIndex = tile[pixelIndex];
-                const x = tileX * 8 + px;
-                const y = tileY * 8 + py;
-                const outIndex = (y * width + x) * 4;
-                const [r, g, b] = palette[colorIndex] || [0, 0, 0];
-                image[outIndex] = r;
-                image[outIndex + 1] = g;
-                image[outIndex + 2] = b;
-                image[outIndex + 3] = colorIndex === 0 ? 0 : 255;
-            }
-        }
-    }
+    image = render4bppImage(iconData, rawIconPalData, width, height, palIndex * palSize, palSize);
 
     const frameHeight = 32;
     const frameSize = width * frameHeight * 4;

package/src/graphics/render-mons.js

@@ -3,8 +3,6 @@
 
 import { PNG } from "pngjs";
 import fs from "fs";
-import { decode4bppTile } from "./decode-4bpp.js";
-import { decodePalette } from "./decode-palette.js";
 import { extract } from "./extract.js";
 import { renderMonIcon } from "./render-mon-icon.js";
 import { renderMonFoot } from "./render-mon-foot.js";
@@ -54,40 +52,10 @@ export async function renderMon(monName, mons, assets, rom, options = {}) {
 
     const monImageData = extract(monPic, rom);
     const rawMonPalData = extract(monPal, rom);
-    const tileSize = 32;
-    const numTiles = monImageData.data.length / tileSize;
     const width = 64;
     const height = 64;
-    const tilesPerRow = width / 8;
-    const monPalData = decodePalette(rawMonPalData.data);
 
-    const tiles = [];
-    for (let i = 0; i < numTiles; i++) {
-        const start = i * tileSize;
-        const tileBytes = monImageData.data.slice(start, start + tileSize);
-        tiles.push(decode4bppTile(tileBytes));
-    }
-
-    const image = new Uint8ClampedArray(width * height * 4);
-    for (let t = 0; t < tiles.length; t++) {
-        const tile = tiles[t];
-        const tileX = t % tilesPerRow;
-        const tileY = Math.floor(t / tilesPerRow);
-        for (let py = 0; py < 8; py++) {
-            for (let px = 0; px < 8; px++) {
-                const pixelIndex = py * 8 + px;
-                const colorIndex = tile[pixelIndex];
-                const x = tileX * 8 + px;
-                const y = tileY * 8 + py;
-                const outIndex = (y * width + x) * 4;
-                const [r, g, b] = monPalData[colorIndex] || [0, 0, 0];
-                image[outIndex] = r;
-                image[outIndex + 1] = g;
-                image[outIndex + 2] = b;
-                image[outIndex + 3] = colorIndex === 0 ? 0 : 255;
-            }
-        }
-    }
+    const image = render4bppImage(monImageData, rawMonPalData, width, height, );
 
     const png = new PNG({ width, height });
     png.data = image;

package/src/icon-data-parser.js

@@ -0,0 +1,25 @@
+import fs from "fs";
+import path from "path";
+
+const itemIconDataMap = path.resolve("../item_graphics/item_icon_table.h");
+const iconDataLines = fs.readFileSync(itemIconDataMap, "utf-8").split("\n");
+
+const itemData = {};
+
+for (let i = 0; i < iconDataLines.length; i++) {
+    const match = iconDataLines[i].match(/\[(ITEMS?_[A-Z0-9_]+)\]\s*=\s*\{\s*([^,]+),\s*([^}]+)\}/);
+    if (match) {
+        let itemName = match[1]
+            .replace("ITEM_", "")
+            .replace("ITEMS_", "");
+        const icon = match[2].trim();
+        const palette = match[3].trim();
+        if (!itemData[itemName]) {
+            itemData[itemName] = {};
+        }
+        itemData[itemName]["icon"] = icon;
+        itemData[itemName]["palette"] = palette;
+    }
+}
+
+fs.writeFileSync("../item-data/itemData.json", JSON.stringify(itemData, null, 2));