From dfb949ab93fb3a57f0683bc2068f1cb3c7e3b45f Mon Sep 17 00:00:00 2001
From: Nicholas Jitkoff <nicholas@jitkoff.com>
Date: Thu, 17 Feb 2022 08:13:30 -0600
Subject: [PATCH] Create web3.html

---
 docs/web3.html | 75 ++++++++++++++++++++++++++++++++++++++++++++++++++
 1 file changed, 75 insertions(+)
 create mode 100644 docs/web3.html
diff --git a/docs/web3.html b/docs/web3.html
new file mode 100644
index 0000000..9f2ceac
--- /dev/null
+++ b/docs/web3.html
@@ -0,0 +1,75 @@
+<!DOCTYPE html>
+<meta name="viewport" content="width=device-width, viewport-fit=cover">
+<meta name="description" content="itty bitty things can be conveyed in a link.">
+<script src="https://cdnjs.cloudflare.com/ajax/libs/web3/1.7.1-rc.0/web3.min.js"></script>
+<script src="js/util.js"></script>
+<base target="_blank">
+<style>
+  body {
+    font-family:sans-serif;
+  }
+  img {
+    margin-bottom:0.5em;
+  }
+  .assets { 
+    display:flex;
+    flex-wrap: wrap;
+    gap: 1em;
+  }
+  a {
+    text-decoration:none;
+    display:block;
+    display:flex;
+    flex: 0 0 auto;
+    flex-direction: column;
+    color:black;
+    width:10em;
+  }
+  .collection {
+    font-size:10px;
+  }
+</style>
+<script type="module">
+
+window.onhashchange = function() {
+    window.location.reload()
+}
+  async function render() {
+    let address = location.hash.substring(1)
+    console.log("web3", Web3, address)
+    const web3 = new Web3(Web3.givenProvider)
+
+    if (!address.startsWith("0x")) address = await web3.eth.ens.getAddress(address);
+    document.body.appendChild(m("code", {}, address))
+
+    web3.eth.getBalance(address, (err, wei) => {
+      let balance = web3.utils.fromWei(wei, 'ether')
+      document.body.appendChild(m("div", {}, "Balance: " + (Math.round(balance * 1000) / 1000)))
+    
+      console.log("bal", balance);
+      fetchOpenSea(address);
+    })
+
+  }
+  window.onload = render
+
+
+function fetchOpenSea(owner) {
+  fetch("https://api.opensea.io/api/v1/assets?owner=" + owner)
+  .then(response => response.json())
+  .then(data => {
+    console.log(data)
+    document.body.appendChild(
+      m(".assets", data.assets.map((a) =>   
+        m("a", {className:"image", href:a.permalink}, 
+            m("img", {src: a.image_thumbnail_url} ),
+            m("span.name", a.name ),
+            m("span.collection", a.collection?.name )
+        )
+      )));
+
+  });
+}
+</script>
+
+</html>
