diff --git a/docs/index.html b/docs/index.html
index 08466dd..e2540a2 100644
--- a/docs/index.html
+++ b/docs/index.html
@@ -172,7 +172,7 @@
Deposit BTC to exchange to purchase assets.
-
+
Tradable assets
@@ -450,10 +450,7 @@
d="M11 7h2v2h-2zm0 4h2v6h-2zm1-9C6.48 2 2 6.48 2 12s4.48 10 10 10 10-4.48 10-10S17.52 2 12 2zm0 18c-4.41 0-8-3.59-8-8s3.59-8 8-8 8 3.59 8 8-3.59 8-8 8z" />
- You need to have rupee tokens in your FLO ID to purchase assets, which then can
- be
- deposited
- to your exchange account.
+ You need to have BTC in your portfolio to purchase assets.
@@ -1206,7 +1203,7 @@
getRef('chart_asset').textContent = `${params.asset}/INR`
getRef('traded_asset').textContent = `Trade ${params.asset}`
getRef('trade_button').textContent = `${tradeType} ${params.asset}`
- getRef('quantity_type').textContent = tradeType === 'buy' ? formatAmount(allTokens.FLO.net, true) : `${parseFloat(allTokens[params.asset].net.toFixed(4))} ${params.asset}`
+ getRef('quantity_type').textContent = `${parseFloat(allTokens[tradeType === 'buy' ? 'BTC' : params.asset].net.toFixed(4))} ${tradeType === 'buy' ? 'BTC' : params.asset}`
updateTooltip(params.asset, tradeType)
}
const animOptions = {
@@ -1260,6 +1257,11 @@
getRef('asset_list_wrapper').classList.remove('hide-on-mobile')
}
}
+ getLastTradePrice().then(price => {
+ getRef('set_price').value = price
+ }).catch(err => {
+ console.error(err)
+ })
} else {
getRef('login_section').classList.remove('hidden')
if (subPageId1 === 'generate') {
@@ -1283,7 +1285,7 @@
if (params.asset) {
getRef('portfolio_asset__name').textContent = params.asset
const { net, locked } = allTokens[params.asset]
- const lockedBalance = params.asset === 'rupee' ? formatAmount(locked, true) : toFixed(locked)
+ const lockedBalance = params.asset === 'rupee' ? formatAmount(locked) : toFixed(locked)
showChildElement('portfolio', 1, {
entry: slideInLeft,
exit: slideOutLeft,
@@ -1291,7 +1293,7 @@
renderElem(getRef('portfolio_asset__balance'), html`
Available
- ${params.asset === 'rupee' ? formatAmount(net, true) : toFixed(net)}
+ ${params.asset === 'rupee' ? formatAmount(net) : toFixed(net)}
${params.asset !== 'rupee' ? html`₹${toFixed(net, 2)}` : ''}
${locked ? html`
@@ -1595,8 +1597,8 @@
return listedAssets.hasOwnProperty(asset) ? listedAssets[asset].icon : listedAssets.default.icon;
}
- function formatAmount(amount = 0,) {
- return amount.toLocaleString(`en-US`, { style: 'currency', currency: 'USD', maximumFractionDigits: 8 })
+ function formatAmount(amount = 0, currency = 'BTC') {
+ return amount.toLocaleString(`en-US`, { style: 'currency', currency, minimumFractionDigits: 0, maximumFractionDigits: 8 })
}
// remove digitals after specified decimal places without rounding
@@ -1628,16 +1630,17 @@
const render = {
orderCard(orderDetails = {}) {
console.log(orderDetails)
- const { id, asset, quantity, price, time_placed, type } = orderDetails
+ const { id, asset, quantity, price, time_placed, type, maxPrice } = orderDetails
const card = getRef('order_template').content.cloneNode(true).firstElementChild
+ const unitValue = price || maxPrice
card.dataset.id = id
card.dataset.type = type
card.querySelector('.order-card__type').textContent = type
card.querySelector('.order-card__quantity').textContent = `${quantity} ${asset}`
card.querySelector('.order-card__price-type').textContent = 'Price'
- card.querySelector('.order-card__price').textContent = formatAmount(price)
+ card.querySelector('.order-card__price').textContent = formatAmount(unitValue)
card.querySelector('.order-card__amount-type').textContent = 'Amount'
- card.querySelector('.order-card__amount').textContent = formatAmount(price * quantity, true)
+ card.querySelector('.order-card__amount').textContent = formatAmount(unitValue * quantity)
card.querySelector('.order-card__time').textContent = relativeTime.from(new Date(time_placed))
return card
},
@@ -1649,7 +1652,7 @@
card.querySelector('.completed-trade__quantity').textContent = `${quantity} ${asset}`
card.querySelector('.completed-trade__time').textContent = getFormattedTime(time)
card.querySelector('.completed-trade__price').textContent = formatAmount(unitValue)
- card.querySelector('.completed-trade__total').textContent = formatAmount(parseFloat(unitValue * quantity), true)
+ card.querySelector('.completed-trade__total').textContent = formatAmount(parseFloat(unitValue * quantity))
card.querySelector('.more-info').dataset.buyer = buyer
card.querySelector('.more-info').dataset.seller = seller
card.querySelector('.more-info').dataset.other = other
@@ -1662,7 +1665,7 @@
card.classList.add(`transaction-card--${type}`)
card.querySelector('.transaction-card__quantity').textContent = `${quantity} ${asset}`
card.querySelector('.transaction-card__price').textContent = formatAmount(price)
- card.querySelector('.transaction-card__total').textContent = formatAmount(parseFloat(price * quantity), true)
+ card.querySelector('.transaction-card__total').textContent = formatAmount(parseFloat(price * quantity))
card.querySelector('.more-info').dataset.time = time_placed
card.querySelector('.more-info').dataset.buyer = type === 'buy' ? floID : undefined
card.querySelector('.more-info').dataset.seller = type === 'sell' ? floID : undefined
@@ -1675,7 +1678,7 @@
card.querySelector('.completed-trade__quantity').textContent = `${quantity} ${asset}`
card.querySelector('.completed-trade__time').textContent = getFormattedTime(time)
card.querySelector('.completed-trade__price').textContent = `₹${unitValue}`
- card.querySelector('.completed-trade__total').textContent = formatAmount(parseFloat(unitValue * quantity), true)
+ card.querySelector('.completed-trade__total').textContent = formatAmount(parseFloat(unitValue * quantity))
card.querySelector('.more-info').dataset.buyer = buyer
card.querySelector('.more-info').dataset.seller = seller
return card
@@ -1689,8 +1692,8 @@
card.querySelector('.balance-card__icon').innerHTML = getIcon(asset)
const templateToClone = locked ? 'locked_balance_template' : 'net_balance_template';
const assetBalance = getRef(templateToClone).content.cloneNode(true)
- const availableBalance = asset === 'rupee' ? formatAmount(net, true) : `${toFixed(net)}`
- const lockedBalance = asset === 'rupee' ? formatAmount(locked, true) : toFixed(locked)
+ const availableBalance = asset === 'rupee' ? formatAmount(net) : `${toFixed(net)}`
+ const lockedBalance = asset === 'rupee' ? formatAmount(locked) : toFixed(locked)
assetBalance.querySelector('.available-balance').innerHTML = availableBalance
if (locked) {
assetBalance.querySelector('.locked-balance').textContent = lockedBalance
@@ -1906,7 +1909,7 @@
function updateTooltip(asset, tradeType) {
getRef('quantity_selector').querySelectorAll('.button').forEach(button => {
if (tradeType === 'buy') {
- button.title = `Buy ${asset} worth ${button.textContent} of total rupee`
+ button.title = `Buy ${asset} worth ${button.textContent} of total ${floGlobals.currency}`
} else {
button.title = `Sell ${button.textContent} of total ${asset}`
}
@@ -1930,20 +1933,26 @@
tradeType = e.target.value
const selectedAsset = pagesData.params.asset
getRef('trade_button').textContent = `${tradeType} ${selectedAsset}`
- getRef('quantity_type').textContent = tradeType === 'buy' ? formatAmount(allTokens.FLO.net, true) : `${parseFloat(allTokens[selectedAsset].net.toFixed(4))} ${selectedAsset}`
+ getRef('quantity_type').textContent = `${parseFloat(allTokens[tradeType === 'buy' ? 'BTC' : selectedAsset].net.toFixed(4))} ${tradeType === 'buy' ? 'BTC' : selectedAsset}`
updateTooltip(selectedAsset, tradeType)
})
getRef('price_duration_selector').addEventListener('change', e => {
render.chart(pagesData.params.asset)
})
- function getSuggestedPrice() {
- return 0.001;
+ function getLastTradePrice() {
+ return new Promise((resolve, reject) => {
+ floTradeAPI.getTradeList().then(tradeList => {
+ floGlobals.lastTradePrice = tradeList[0].unitValue || 0;
+ getRef('flo_exchange_rate').textContent = `${floGlobals.lastTradePrice} ${floGlobals.currency}`
+ resolve(floGlobals.lastTradePrice)
+ }).catch(reject)
+ })
}
async function tradeAsset() {
closePopup()
const asset = pagesData.params.asset;
const quantity = parseFloat(getRef('get_quantity').value)
- const price = getSuggestedPrice()
+ const price = getLastTradePrice()
if (tradeType === 'buy' && accountDetails.sellOrders.some(order => order.asset === asset)) {
closePopup()
return notify('You have an open sell order for this asset. Please close it before buying.', 'error')
@@ -1986,15 +1995,12 @@
}
getRef('quantity_selector').addEventListener('click', e => {
if (e.target.closest('button')) {
- const selectedAsset = pagesData.params.asset
+ const selectedAsset = pagesData.params.asset;
+ if (!selectedAsset) return notify('Please select an asset to trade', 'error')
const target = e.target.closest('button')
const fraction = parseFloat(target.value)
- if (tradeType === 'buy') {
- getRef('get_quantity').value = toFixed((allTokens['FLO'].net * fraction))
- } else {
- getRef('get_quantity').value = toFixed(allTokens[selectedAsset].net * fraction)
-
- }
+ const price = parseFloat(getRef('set_price').value.trim()) || floGlobals.lastTradePrice || 0
+ getRef('get_quantity').value = toFixed((allTokens[selectedAsset].net / price) * fraction)
}
})
@@ -2012,7 +2018,7 @@
const type = target.value
const asset = pagesData.params.asset
- getRef('portfolio_quantity_type').textContent = getRef('quantity_type').textContent = asset === 'rupee' ? formatAmount(allTokens.FLO.net, true) : `${toFixed(allTokens[asset].net)} ${asset}`
+ getRef('portfolio_quantity_type').textContent = getRef('quantity_type').textContent = `${toFixed(allTokens[type === 'buy' ? 'BTC' : asset].net)} ${asset}`
getRef('portfolio_popup__cta').textContent = `${type} ${asset}`
getRef('portfolio_popup__cta').setAttribute('value', type)
getRef('portfolio_popup__title').textContent = `${type} ${asset}`
@@ -2383,7 +2389,7 @@