]> zoso.dev Git - nemo-wallet.git/commitdiff
Add lots of features to test out in reference page.
authorChris Duncan <chris@zoso.dev>
Mon, 14 Oct 2024 21:19:40 +0000 (14:19 -0700)
committerChris Duncan <chris@zoso.dev>
Mon, 14 Oct 2024 21:19:40 +0000 (14:19 -0700)
app/pages/nemo-wallet.html

index f92c95edb02407873dadf9a264abe762a2a3cfe8..620f4047bbd66f495ac9f008054580503386eaf9 100644 (file)
@@ -3,36 +3,48 @@
 <head>
   <meta lang="en">
   <script>
-    let Bip44Wallet
-    let Xel
+    let Account, Bip44Wallet, Blake2bWallet, LedgerWallet, SendBlock, ReceiveBlock, ChangeBlock, rpc, Rolodex, Xel
     function load () {
-      loadUi().then(loadNemo)
+      loadUi().then(loadNemo).then(() => { console.log('done') })
     }
     async function loadUi () {
       console.log('loading xel')
       Xel = await import('https://unpkg.com/xel@latest')
       await Xel.whenThemeReady
       setTimeout(() => {
-        document.getElementById('main').style.visibility = 'visible'
-      }, 0)
+        document.getElementsByTagName('body')[0].style.visibility = 'visible'
+      }, 250)
       console.log('loaded xel')
     }
     async function loadNemo () {
       console.log('loading libnemo')
-      const libnemo = await import('https://unpkg.com/libnemo@latest')
-      Bip44Wallet = libnemo.Bip44Wallet
+      await ({ Account, Bip44Wallet, Blake2bWallet, LedgerWallet, SendBlock, ReceiveBlock, ChangeBlock, Node: rpc, Rolodex } = await import('https://unpkg.com/libnemo@latest'))
       console.log('loaded libnemo')
     }
-    async function createWallet () {
+    async function createBip44Wallet () {
       const wallet = await Bip44Wallet.create('password')
-      const bip44WalletIds = JSON.parse(sessionStorage.getItem('Bip44Wallets') ?? '[]')
-      bip44WalletIds.push(wallet.id)
-      sessionStorage.setItem('Bip44Wallets', JSON.stringify(bip44WalletIds))
+      addToStorage('Bip44Wallets', wallet.id)
+      return wallet
+    }
+    async function createBlake2bWallet () {
+      const wallet = await Blake2bWallet.create('password')
+      addToStorage('Blake2bWallets', wallet.id)
       return wallet
     }
+    async function addToStorage (key, value) {
+      if (typeof value !== 'string') {
+        throw new TypeError(`Cannot add ${typeof value} to storage`)
+      }
+      const item = JSON.parse(sessionStorage.getItem(key) ?? '[]')
+      if (!Array.isArray(item)) {
+        throw new TypeError(`Storage item is not an array`)
+      }
+      item.push(value)
+      sessionStorage.setItem(key, JSON.stringify(item))
+    }
     async function showWallets () {
       console.log(`showWallets()`)
-      const card = document.getElementById('wallet')
+      const card = document.getElementById('wallets')
       const bip44WalletIds = JSON.parse(sessionStorage.getItem('Bip44Wallets') ?? '[]')
       console.log(`bip44WalletIds: ${bip44WalletIds}`)
       for (const id of bip44WalletIds) {
     async function clearStorage () {
       console.log('clear()')
       sessionStorage.clear()
+      notify.info('Session storage cleared')
+    }
+    const notify = {
+      show: (msg, color) => {
+        const notification = document.createElement('x-notification')
+        notification.timeout = "5000"
+        notification.style.backgroundColor = color ?? notification.style.backgroundColor
+        notification.innerText = msg
+        notification.opened = true
+        console.log(notification)
+        const notifications = document.getElementById('notifications')
+        notifications.appendChild(notification)
+      },
+      info: (msg) => notify.show(msg),
+      ok: (msg) => notify.show(msg, 'green'),
+      warn: (msg) => notify.show(msg, 'yellow'),
+      error: (msg) => notify.show(msg, 'red')
     }
   </script>
   <script src="" type="module"></script>
   <meta name="xel-icons" content="https://unpkg.com/xel@latest/icons/fluent-outlined.svg">
 </head>
 
-<body onload="load()">
-  <x-box id="main" style="visibility:hidden;">
-    <x-button onclick="createWallet().then(w => { console.log(w);showWallets() })">
-      <x-label>Create</x-label>
+<body onload="load()" style="visibility:hidden;">
+  <x-box id="main">
+    <x-box id="notifications"></x-box>
+    <x-button onclick="createBip44Wallet().then(w => { console.log(w);showWallets() })">
+      <x-label>Create BIP-44 Wallet</x-label>
     </x-button>
-    <x-card id="wallet">
+    <x-card id="wallets">
     </x-card>
     <x-button onclick="clearStorage()">
-      <x-label>Clear</x-label>
+      <x-label>Clear Storage</x-label>
     </x-button>
   </x-box>
 </body>