<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>