document.querySelector(newHash).classList.add('show')
}
}
- function getWalletType (type) {
- switch (type) {
+ function getWalletClass (algorithm) {
+ switch (algorithm) {
case 'blake2b': {
return Blake2bWallet
}
async function createWallet () {
const walletSelect = document.querySelector('#wallet')
- const form = document.querySelector('#wallet-form')
- const name = form.querySelector('#wallet-form-name x-input').value
+ const form = document.querySelector('#wallet-new')
+ const name = form.querySelector('#wallet-new-name x-input').value
if (name === '_ledger') {
- walletSelect.value = null
notify.warn(`Invalid wallet name "${name}".`)
return
}
- const type = form.querySelector('#wallet-form-wallet-type x-radios').value
- const walletType = getWalletType(type)
- const salt = form.querySelector('#wallet-form-salt x-input')?.value
- const password = form.querySelector('#wallet-form-password x-input')?.value
+ const algorithm = form.querySelector('#wallet-new-algorithm x-radios').value
+ const walletClass = getWalletClass(algorithm)
+ const salt = form.querySelector('#wallet-new-salt x-input')?.value
+ const password = form.querySelector('#wallet-new-password x-input')?.value
if (!password) {
- walletSelect.value = null
notify.error('Password is required')
return
}
let wallet
try {
- wallet = await walletType.create(password, salt)
+ wallet = await walletClass.create(password, salt)
const walletData = {
id: wallet.id,
name: name || wallet.id,
- type
+ algorithm
}
await addToStorage(`wallets`, JSON.stringify(walletData))
const menu = document.querySelector('#wallet > x-menu')
const menuitem = document.createElement('x-menuitem')
menuitem.value = walletData.id
- if (menu.childElementCount >= 0) {
- menu.appendChild(menuitem)
- }
+ menu.appendChild(menuitem)
const label = document.createElement('x-label')
label.innerText = walletData.name
menuitem.appendChild(label)
} catch (err) {
label?.remove()
menuitem?.remove()
- walletSelect.value = null
notify.error(err.msg)
} finally {
await form.close()
}
})
}
- function updateWalletForm () {
- const form = document.querySelector('#wallet-form')
- const walletTypeContainer = document.querySelector('#wallet-form-wallet-type')
- const walletType = walletTypeContainer.firstChild
- const importTypeContainer = document.querySelector('#wallet-form-import-type')
- const importType = importTypeContainer.firstChild
- const saltContainer = document.querySelector('#wallet-form-salt')
- if (walletType.value === 'bip44' && importType.value !== 'seed') {
+
+ function updateWalletForm (id) {
+ const form = document.querySelector(id)
+ if (!form) {
+ notify.error(`Form ID not found, contact developer`)
+ return
+ }
+ const algorithmContainer = document.querySelector(`${id}-algorithm`)
+ const algorithm = document.querySelector(`${id}-algorithm x-radios`)
+ const typeContainer = document.querySelector(`${id}-type`)
+ const type = document.querySelector(`${id}-type x-select`)
+ const saltContainer = document.querySelector(`${id}-salt`)
+ const salt = document.querySelector(`${id}-salt x-input`)
+ if (algorithm.value === 'bip44' && type?.value !== 'seed') {
saltContainer.classList.remove('hide')
} else {
saltContainer.classList.add('hide')
}
- document.querySelector('#wallet-form-import-value x-label').innerText = importType.value
+ const importValue = document.querySelector(`${id}-value x-input`)
+ const importValueLabel = document.querySelector(`${id}-value x-label`)
+ if (importValueLabel) {
+ importValueLabel.innerText = type.value
+ }
}
+
+ async function closeForm (id) {
+ const form = document.querySelector(id)
+ const inputs = form.querySelector('x-input')
+ for (const input of inputs) {
+ input.value = null
+ }
+ await form.close()
+ }
+
async function showWallets () {
const card = document.querySelector('#walletCard')
const storedWalletData = JSON.parse(sessionStorage.getItem('wallets') ?? '[]')
const w = JSON.parse(walletData)
console.dir(w)
if (w.id && w.name && w.type) {
- const walletType = getWalletType(w.type)
+ const walletType = getWalletClass(w.type)
wallets.push(await walletType.restore(w.id))
}
}
<!-- Wallet Select -->
<x-box id="wallets">
- <x-select id="wallet" style="width:100%;" onchange="updateWallet()">
+ <select id="wallet" style="width:100%;" onchange="updateWallet()">
<x-menu>
<x-menuitem value toggled style="display: none;"><x-label>Wallets</x-label></x-menuitem>
+
<x-button skin="nav" class="menubtn">
- <x-icon href="#wallet2"></x-icon>
+ <x-icon href="#folder-plus"></x-icon>
<x-label>New Wallet</x-label>
<!-- New Wallet Form -->
<x-label>Name</x-label>
<x-input type="text"></x-input>
</x-box>
- <x-box id="wallet-new-wallet-type">
- <x-radios required onchange="updateWalletForm()">
+ <x-box id="wallet-new-algorithm">
+ <x-label>Algorithm</x-label>
+ <x-radios required ontoggle="updateWalletForm('#wallet-new')">
<x-radio value="bip44"><x-label>BIP-44</x-label></x-radio>
<x-radio value="blake2b"><x-label>BLAKE2b</x-label></x-radio>
</x-radios>
</x-box>
<x-box>
<x-buttons>
- <x-button onclick="document.querySelector('#wallet-new').close()">
+ <x-button onclick="closeForm('#wallet-new')">
Cancel
</x-button>
<x-button onclick="createWallet().then(w => { console.log(w);showWallets() })">
</x-box>
</dialog>
</x-button>
+
<x-button skin="nav" class="menubtn">
<x-icon href="#box-arrow-down"></x-icon>
<x-label>Import Wallet</x-label>
<x-label>Name</x-label>
<x-input type="text"></x-input>
</x-box>
- <x-box id="wallet-import-wallet-type">
- <x-radios required onchange="updateWalletForm()">
+ <x-box id="wallet-import-algorithm">
+ <x-radios required onchange="updateWalletForm('#wallet-import')">
<x-radio value="bip44"><x-label>BIP-44</x-label></x-radio>
<x-radio value="blake2b"><x-label>BLAKE2b</x-label></x-radio>
</x-radios>
</x-box>
<x-box id="wallet-import-type" class="hide">
- <x-select onchange="updateWalletForm()">
+ <x-select onchange="updateWalletForm('#wallet-import')">
<x-menu>
<x-menuitem value="mnemonic"><x-label>Import mnemonic</x-label></x-menuitem>
<x-menuitem value="seed"><x-label>Import seed</x-label></x-menuitem>
</x-box>
<x-box>
<x-buttons>
- <x-button onclick="document.querySelector('#wallet-import').close()">
+ <x-button onclick="closeForm('#wallet-import')">
Cancel
</x-button>
<x-button onclick="importWallet().then(w => { console.log(w);showWallets() })">
</x-menuitem>
<hr />
</x-menu>
- </x-select>
+ </x-select>
</x-box>
<!-- Account Select -->
<x-icon href="#book-half"></x-icon>
</a>
<a href="#transact" id="xno">
- <svg width="0px" height="0px" viewBox="0 0 1080 1080" fill="none" xmlns="http://www.w3.org/2000/svg">
+ <svg width="0px" height="0px" viewBox="0 0 1080 1080" fill="none">
<circle cx="540" cy="540" r="540" fill="currentcolor" />
<path
d="M792.911 881H740.396L541.099 570.561L338.761 881H286.68L513.452 529.3L306.882 206.222H360.42L541.95 490.393L727.322 206.222H777.555L568.762 528.379L792.911 881Z"
projects / nemo-wallet.git / commitdiff