const notification = document.getElementById('notification')
observer.observe(notification, { attributes: true })
}
- async function createBip44Wallet () {
- const wallet = await Bip44Wallet.create('password')
- try {
- addToStorage('Bip44Wallets', wallet.id)
- } catch (err) {
- notify.error(err.msg)
+ function getWalletType (type) {
+ switch (type) {
+ case 'blake2b': {
+ return Blake2bWallet
+ }
+ case 'bip44':
+ default: {
+ return Bip44Wallet
+ }
}
- return wallet
}
- async function createBlake2bWallet () {
- const wallet = await Blake2bWallet.create('password')
+ async function createWallet (el, type) {
+ const label = el.firstElementChild
+ const spinner = document.createElement('x-throbber')
+ spinner.size = 'small'
+ spinner.style.width = `${label.scrollWidth}px`
+ el.replaceChildren(spinner)
+ const walletType = getWalletType(type)
+ let wallet
try {
- addToStorage('Blake2bWallets', wallet.id)
+ wallet = await walletType.create('password')
+ const walletData = {
+ id: wallet.id,
+ type
+ }
+ addToStorage(`wallets`, JSON.stringify(walletData))
} catch (err) {
notify.error(err.msg)
+ } finally {
+ el.replaceChildren(label)
+ return wallet
}
- return wallet
}
- async function addToStorage (key, value) {
+ function addToStorage (key, value) {
if (typeof value !== 'string') {
throw new TypeError(`Cannot add ${typeof value} to storage`)
}
sessionStorage.setItem(key, JSON.stringify(item))
}
async function showWallets () {
- console.log(`showWallets()`)
- const card = document.getElementById('wallets')
- const bip44WalletIds = JSON.parse(sessionStorage.getItem('Bip44Wallets') ?? '[]')
- console.log(`bip44WalletIds: ${bip44WalletIds}`)
- for (const id of bip44WalletIds) {
- console.log(`id: ${id}`)
- const wallet = await Bip44Wallet.restore(id)
+ const card = document.getElementById('walletCard')
+ const storedWalletData = JSON.parse(sessionStorage.getItem('wallets') ?? '[]')
+ const wallets = []
+ for (const walletData of storedWalletData) {
+ const w = JSON.parse(walletData)
+ console.dir(w)
+ if (w.id && w.type) {
+ const walletType = getWalletType(w.type)
+ wallets.push(await walletType.restore(w.id))
+ }
+ }
+ const walletElements = []
+ for (const wallet of wallets) {
const walletElement = document.createElement('x-label')
await wallet.unlock('password')
- console.log(`wallet: ${wallet}`)
walletElement.innerText = wallet.mnemonic
- wallet.lock('password')
- card.appendChild(walletElement)
+ await wallet.lock('password')
+ walletElements.push(walletElement)
}
+ card.replaceChildren(...walletElements)
}
async function clearStorage () {
sessionStorage.clear()
<body onload="load()" style="visibility:hidden;">
<x-box id="main">
<x-notification id="notification"></x-notification>
- <x-button onclick="createBip44Wallet().then(w => { console.log(w);showWallets() })">
- <x-label>Create BIP-44 Wallet</x-label>
- </x-button>
- <x-card id="wallets">
+ <x-box id="wallets">
+ <x-button>
+ <x-label>Wallets</x-label>
+ <x-menu>
+ <x-menuitem>
+ <x-button>
+ <x-label>New</x-label>
+ <dialog>
+ <x-radios>
+ <x-label>Type</x-label>
+ <x-radio value="bip44" toggled><x-label>BIP-44</x-label></x-radio>
+ <x-radio value="blake2b"><x-label>BLAKE2b</x-label></x-radio>
+ </x-radios>
+ <x-input type="password" required="true">Password</x-input>
+ <x-button
+ onclick="createWallet(this, this.closest('dialog').querySelector('x-radios').value).then(w => { console.log(w);showWallets() })"></x-button>
+ </dialog>
+ </x-button>
+ </x-menuitem>
+ <x-menuitem>
+ <x-button>
+ <x-label>Import</x-label>
+ <dialog>
+ </dialog>
+ </x-button>
+ </x-menuitem>
+ </x-menu>
+ </x-button>
+ </x-box>
+ <x-card id="walletCard">
</x-card>
<x-button onclick="clearStorage()">
<x-label>Clear Storage</x-label>