routing changes and code refactoring
This commit is contained in:
parent
c294b54444
commit
ae972d0778
52
index.html
52
index.html
@ -208,8 +208,8 @@
|
|||||||
</svg>
|
</svg>
|
||||||
</a>
|
</a>
|
||||||
<h4 id="flo_id_name"></h4>
|
<h4 id="flo_id_name"></h4>
|
||||||
<button class="icon-only" style="margin-left:auto"
|
<button class="icon-only" style="margin-left:auto" onclick="render.transactions()"
|
||||||
onclick="render.transactions(pagesData.params.id)">
|
title="Refresh">
|
||||||
<svg class="icon" xmlns="http://www.w3.org/2000/svg" height="24px" viewBox="0 0 24 24"
|
<svg class="icon" xmlns="http://www.w3.org/2000/svg" height="24px" viewBox="0 0 24 24"
|
||||||
width="24px" fill="#000000">
|
width="24px" fill="#000000">
|
||||||
<path d="M0 0h24v24H0z" fill="none" />
|
<path d="M0 0h24v24H0z" fill="none" />
|
||||||
@ -984,21 +984,14 @@
|
|||||||
let pageId
|
let pageId
|
||||||
let params = {}
|
let params = {}
|
||||||
let searchParams
|
let searchParams
|
||||||
|
let wildcards
|
||||||
if (targetPage === '') {
|
if (targetPage === '') {
|
||||||
pageId = 'home'
|
pageId = 'home'
|
||||||
} else {
|
} else {
|
||||||
if (targetPage.includes('/')) {
|
if (targetPage.includes('/')) {
|
||||||
if (targetPage.includes('?')) {
|
let path;
|
||||||
const splitAddress = targetPage.split('?')
|
[path, searchParams] = targetPage.split('?');
|
||||||
searchParams = splitAddress.pop()
|
[, pageId, ...wildcards] = path.split('/')
|
||||||
const pages = splitAddress.pop().split('/')
|
|
||||||
pageId = pages[1]
|
|
||||||
subPageId = pages[2]
|
|
||||||
} else {
|
|
||||||
const pages = targetPage.split('/')
|
|
||||||
pageId = pages[1]
|
|
||||||
subPageId = pages[2]
|
|
||||||
}
|
|
||||||
} else {
|
} else {
|
||||||
pageId = targetPage
|
pageId = targetPage
|
||||||
}
|
}
|
||||||
@ -1009,14 +1002,20 @@
|
|||||||
}
|
}
|
||||||
if (pagesData.lastPage !== pageId) {
|
if (pagesData.lastPage !== pageId) {
|
||||||
pagesData.lastPage = pageId
|
pagesData.lastPage = pageId
|
||||||
|
pagesData.wildcards = wildcards
|
||||||
}
|
}
|
||||||
if (params)
|
if (params)
|
||||||
pagesData.params = params
|
pagesData.params = params
|
||||||
switch (pageId) {
|
switch (pageId) {
|
||||||
case 'transactions':
|
case 'transactions':
|
||||||
render.transactions(params.id).then(() => {
|
const floId = wildcards[0]
|
||||||
scrollToTopObserver.observe(getRef('transactions_hero_section'))
|
if (floId && floCrypto.validateFloID(floId)) {
|
||||||
})
|
render.transactions(floId).then(() => {
|
||||||
|
scrollToTopObserver.observe(getRef('transactions_hero_section'))
|
||||||
|
})
|
||||||
|
} else {
|
||||||
|
|
||||||
|
}
|
||||||
break;
|
break;
|
||||||
default:
|
default:
|
||||||
getRef('transactions_list').innerHTML = ''
|
getRef('transactions_list').innerHTML = ''
|
||||||
@ -1287,12 +1286,12 @@
|
|||||||
clone.querySelector('.transaction__time').textContent = getFormattedTime(time * 1000)
|
clone.querySelector('.transaction__time').textContent = getFormattedTime(time * 1000)
|
||||||
return clone
|
return clone
|
||||||
},
|
},
|
||||||
async transactions(floID) {
|
async transactions(queriedFloId = pagesData.wildcards[0]) {
|
||||||
try {
|
try {
|
||||||
scrollToTopObserver.disconnect()
|
scrollToTopObserver.disconnect()
|
||||||
// retrieve tokens and render them
|
// retrieve tokens and render them
|
||||||
getRef('tokens').classList.add('hide')
|
getRef('tokens').classList.add('hide')
|
||||||
fetch(`https://ranchimallflo.duckdns.org/api/v1.0/getFloAddressBalance?floAddress=${floID}`).then(res => res.json()).then(({ floAddressBalances }) => {
|
fetch(`https://ranchimallflo.duckdns.org/api/v1.0/getFloAddressBalance?floAddress=${queriedFloId}`).then(res => res.json()).then(({ floAddressBalances }) => {
|
||||||
const frag = document.createDocumentFragment()
|
const frag = document.createDocumentFragment()
|
||||||
getRef('token_list').innerHTML = ''
|
getRef('token_list').innerHTML = ''
|
||||||
let hasTokens = false
|
let hasTokens = false
|
||||||
@ -1312,23 +1311,23 @@
|
|||||||
})
|
})
|
||||||
// retrieve FLO balance
|
// retrieve FLO balance
|
||||||
getRef('flo_balance').innerHTML = `<sm-spinner></sm-spinner>`;
|
getRef('flo_balance').innerHTML = `<sm-spinner></sm-spinner>`;
|
||||||
floWebWallet.getBalance(floID).then((retrievedBal) => {
|
floWebWallet.getBalance(queriedFloId).then((retrievedBal) => {
|
||||||
getRef('flo_balance').textContent = `${parseFloat(retrievedBal.toFixed(3))} FLO`;
|
getRef('flo_balance').textContent = `${parseFloat(retrievedBal.toFixed(3))} FLO`;
|
||||||
}).catch((error) => {
|
}).catch((error) => {
|
||||||
notify(error, 'error');
|
notify(error, 'error');
|
||||||
})
|
})
|
||||||
floWebWallet.getLabels().then(allLabels => {
|
floWebWallet.getLabels().then(allLabels => {
|
||||||
getRef('flo_id_name').textContent = allLabels.hasOwnProperty(floID) ? allLabels[floID] === 'Unknown' ? floID : allLabels[floID] : floID
|
getRef('flo_id_name').textContent = allLabels.hasOwnProperty(queriedFloId) ? allLabels[queriedFloId] === 'Unknown' ? queriedFloId : allLabels[queriedFloId] : queriedFloId
|
||||||
})
|
})
|
||||||
// render transactions
|
// render transactions
|
||||||
getRef('transactions_scroller').nextElementSibling.classList.remove('hide')
|
getRef('transactions_scroller').nextElementSibling.classList.remove('hide')
|
||||||
getRef('transactions_scroller').classList.add('hide')
|
getRef('transactions_scroller').classList.add('hide')
|
||||||
getRef('transactions_list').innerHTML = '';
|
getRef('transactions_list').innerHTML = '';
|
||||||
await floWebWallet.syncTransactions(floID);
|
await floWebWallet.syncTransactions(queriedFloId);
|
||||||
let allTransactions = (await floWebWallet.readTransactions(floID)).reverse();
|
let allTransactions = (await floWebWallet.readTransactions(queriedFloId)).reverse();
|
||||||
const filter = getRef('filter_selector').value;
|
const filter = getRef('filter_selector').value;
|
||||||
if (filter !== 'all') {
|
if (filter !== 'all') {
|
||||||
allTransactions = allTransactions.filter(t => filter === 'sent' ? t.sender === floID : t.receiver === floID)
|
allTransactions = allTransactions.filter(t => filter === 'sent' ? t.sender === queriedFloId : t.receiver === queriedFloId)
|
||||||
}
|
}
|
||||||
if (transactionsLazyLoader) {
|
if (transactionsLazyLoader) {
|
||||||
transactionsLazyLoader.update(allTransactions)
|
transactionsLazyLoader.update(allTransactions)
|
||||||
@ -1371,7 +1370,7 @@
|
|||||||
);
|
);
|
||||||
} else {
|
} else {
|
||||||
const target = e.target.closest('.saved-id');
|
const target = e.target.closest('.saved-id');
|
||||||
window.location.hash = `#/transactions?id=${target.dataset.floId}`
|
window.location.hash = `#/transactions/${target.dataset.floId}`
|
||||||
}
|
}
|
||||||
})
|
})
|
||||||
delegate(getRef('saved_ids_picker_list'), 'click', '.saved-id', e => {
|
delegate(getRef('saved_ids_picker_list'), 'click', '.saved-id', e => {
|
||||||
@ -1386,10 +1385,11 @@
|
|||||||
})
|
})
|
||||||
|
|
||||||
getRef('filter_selector').addEventListener('change', async e => {
|
getRef('filter_selector').addEventListener('change', async e => {
|
||||||
|
const queriedFloId = pagesData.wildcards[0]
|
||||||
const filter = e.target.value
|
const filter = e.target.value
|
||||||
let allTransactions = (await floWebWallet.readTransactions(pagesData.params.id)).reverse()
|
let allTransactions = (await floWebWallet.readTransactions(queriedFloId)).reverse()
|
||||||
if (filter !== 'all') {
|
if (filter !== 'all') {
|
||||||
allTransactions = allTransactions.filter(t => filter === 'sent' ? t.sender === pagesData.params.id : t.receiver === pagesData.params.id)
|
allTransactions = allTransactions.filter(t => filter === 'sent' ? t.sender === queriedFloId : t.receiver === queriedFloId)
|
||||||
}
|
}
|
||||||
transactionsLazyLoader.update(allTransactions)
|
transactionsLazyLoader.update(allTransactions)
|
||||||
})
|
})
|
||||||
|
|||||||
Loading…
Reference in New Issue
Block a user