+
+
-
-
-
-
-
-
-
-
- Rupee
-
-
-
-
-
-
-
- BUY
- FLO
-
-
-
+
+
+
Trade FLO
+
+ Buy
+ Sell
+
+
+
+
+
+
+
+
+
+
+ Rupee
+
+
+
+
+
+
+
+ BUY
+ FLO
+
+
+
+
${params.asset}/INR
${formatAmount(data[data.length - 1].value)}
`;
- }
- setLastBarText();
- chart.subscribeCrosshairMove(function (param) {
- if (param === undefined || param.time === undefined || param.point.x < 0 || param.point.x > width || param.point.y < 0 || param.point.y > height) {
- setLastBarText();
- } else {
- const price = param.seriesPrices.get(lineSeries);
- getRef('chart_asset').innerHTML = ` ${params.asset}/INR
${formatAmount(price)}
`;
- }
- });
- })
+ render.chart(params.asset)
} else {
+ getRef('main_header').classList.remove('hide-on-mobile')
getRef('asset_list_wrapper').classList.remove('hide-on-mobile')
- getRef('trade_form').classList.add('hide-on-mobile')
+ getRef('asset_page').classList.add('hide-on-mobile')
}
break;
case 'my_orders':
@@ -1217,6 +1203,36 @@
card.appendChild(assetBalance)
return card
},
+ chart(asset, duration = '48 weeks') {
+ floExchangeAPI.getRateHistory(asset, duration).then(data => {
+ data = data.map(({ time, rate }) => {
+ return {
+ time: new Date(time).getTime() / 1000,
+ value: rate
+ }
+ })
+ lineSeries.setData(data);
+ let width
+ let height
+ new ResizeObserver(entries => {
+ height = entries[0].contentRect.height;
+ width = entries[0].contentRect.width;
+ chart.applyOptions({ width, height });
+ }).observe(getRef('price_history_chart').parentNode);
+ function setLastBarText() {
+ getRef('chart_asset').innerHTML = ` ${asset}/INR
${formatAmount(data[data.length - 1].value)}
`;
+ }
+ setLastBarText();
+ chart.subscribeCrosshairMove(function (param) {
+ if (param === undefined || param.time === undefined || param.point.x < 0 || param.point.x > width || param.point.y < 0 || param.point.y > height) {
+ setLastBarText();
+ } else {
+ const price = param.seriesPrices.get(lineSeries);
+ getRef('chart_asset').innerHTML = ` ${asset}/INR
${formatAmount(price)}
`;
+ }
+ });
+ })
+ }
}
function showProcess(id) {
@@ -1229,6 +1245,17 @@
getRef(id).children[0].disabled = false
getRef(id).querySelector('sm-spinner')?.remove()
}
+
+ getRef('trading_view_switcher').addEventListener('change', e => {
+ if (e.target.value === 'trade') {
+ getRef('price_chart_wrapper').classList.add('hide-on-mobile')
+ getRef('trade_form').classList.remove('hide-on-mobile')
+ } else {
+ getRef('trade_form').classList.add('hide-on-mobile')
+ getRef('price_chart_wrapper').classList.remove('hide-on-mobile')
+ }
+ })
+
let tradeType = 'buy'
getRef('trade_type_selector').addEventListener('change', e => {
tradeType = e.detail.value
@@ -1245,6 +1272,9 @@
}
})
})
+ getRef('price_duration_selector').addEventListener('change', e => {
+ render.chart(pagesData.params.asset, e.detail.value === 'hour' ? '48 weeks' : 'all-time')
+ })
async function tradeFlo() {
const asset = pagesData.params.asset;
const quantity = parseFloat(getRef('get_quantity').value)