import { fetch } from "https://esm.town/v/std/fetch"; import process from "node:process"; import { DOMParser } from "https://deno.land/x/deno_dom/deno-dom-wasm.ts"; // I <3 ether.actor, very convenient for fetching on-chain data // it's a little slow - Alchemy or another RPC/API provider would be faster const url = `https://ether.actor/0x869ad3dfb0f9acb9094ba85228008981be6dbdde/tokenURI`; // example data: // const account = "0xf296178d553c8ec21a2fbd2c5dda8ca9ac905a00"; // const svg = ``; async function fetchAndParseSvgFromJson(account: string) { try { const response = await fetch(`${url}/${account}`); const dataUri = await response.text(); // Decode the JSON from the base64 encoded dataURI const base64Json = dataUri.split(",")[1]; const decodedJsonString = atob(base64Json); const json = JSON.parse(decodedJsonString); console.log({ json }); // Extract the SVG dataURI from the JSON's `image` field const svgDataUri = json.image; const base64Svg = svgDataUri.split(",")[1]; const decodedSvg = atob(base64Svg); console.log(decodedSvg); return decodedSvg; // or manipulate as needed } catch (error) { console.error("Error fetching or decoding SVG from JSON:", error); } } type SvgTextElement = { content: string; x: string; y: string; class: string; }; function parseElementsFromSvg(svgString: string): SvgTextElement[] { const parser = new DOMParser(); // deno-dom only supports HTML // https://deno.land/x/deno_dom@v0.1.45 // const doc = parser.parseFromString(svgString, "image/svg+xml"); const doc = parser.parseFromString(svgString, "text/html"); const elements = doc.querySelectorAll("text"); const parsedElements: SvgTextElement[] = []; elements.forEach((element) => { const content = element.textContent || ""; const x = element.getAttribute("x") || ""; const y = element.getAttribute("y") || ""; const className = element.getAttribute("class") || ""; parsedElements.push({ content, x, y, class: className }); }); return parsedElements; } export default async function(req: Request): Promise { const url = new URL(req.url); console.log(url.searchParams); const account = url.searchParams.get("account"); if (!account) { return Response.json({ ok: false, error: "you must specify an Ethereum address via ?account=" }); } const svg = await fetchAndParseSvgFromJson(account); const elements = parseElementsFromSvg(svg); // const elements = parseElementsFromSvgUsingRegex(svg); console.log(elements); const format = url.searchParams.get("format") ?? "json"; if (format == "json") { return Response.json({ ok: true, account, elements }); } else { const contents = elements.map((a) => a.content); return new Response(contents.join("\n")); } }

syntheticLoot