From 658606f3e0200e29cddb3df59fbddbaafe996caa Mon Sep 17 00:00:00 2001
From: sairaj mote <sairajmote3@gmail.com>
Date: Sun, 30 Apr 2023 00:27:28 +0530
Subject: [PATCH] Bug fixes

---
 index.html | 88 +++++++++++++++++++++++++++++-------------------------
 1 file changed, 47 insertions(+), 41 deletions(-)

diff --git a/index.html b/index.html
index 58c382f..cb41817 100644
--- a/index.html
+++ b/index.html
@@ -61,9 +61,11 @@
 
 	<!-- Set urls for token and flo Apis -->
 	<script>
-		let floGlobals = {}
-		tokenApiUrl = 'https://ranchimallflov2.ranchimall.net'
-		floApiUrl = 'https://flosight.ranchimall.net'
+		let floGlobals = {
+			blockchain: "FLO",
+			tokenApiUrl: 'https://ranchimallflov2.ranchimall.net',
+			floApiUrl: 'https://flosight.ranchimall.net',
+		}
 	</script>
 	<script>
 		/*jshint esversion: 8 */
@@ -485,9 +487,11 @@
 			let allTxs = await getAllTxs();
 			getRef("page_title").textContent = "All Transactions";
 			renderElem(getRef("page_container"), html`
-						<div id="all_transactions_page" class="page transaction-container"> </div>
+						<div id="all_transactions_page" class="page"> 
+							<ul id="all_transaction_list" class="transaction-container"></ul>	
+						</div>
 					`)
-			renderTransactions('all_transactions_page', allTxs)
+			renderTransactions('all_transaction_list', allTxs)
 		})
 		router.addRoute('transaction', async state => {
 			try {
@@ -665,7 +669,7 @@
 								<h3>Recent transactions</h3>
 								<a id='all_trans_btn' href=${`#/transactions`} class="button button--small button--colored">View all</a>
 							</header>
-							<div id="top_transaction_container" class="transaction-container"> </div>
+							<ul id="top_transaction_container" class="transaction-container"> </ul>
 						</section>
 						<section id="latest_blocks_section">
 							<header class="flex align-center space-between">
@@ -896,10 +900,12 @@
 							` : ''}
 							${payeeAddress ? html`
 								<div class="flex info-row">
-									<h5 class="label">Payee Address</h5>
-									${Object.keys(payeeAddress).map(address => html`
-										<a href=${`#/address/${address}`} class="address wrap-around">${address}</a>
-									`)}
+									<h5 class="label">Payee Addresses</h5>
+									<div class="grid gap-0-5">
+										${Object.keys(payeeAddress).map(address => html`
+											<a href=${`#/address/${address}`} class="address wrap-around">${address}</a>
+										`)}
+									</div>
 								</div>
 							`: ''}
 							${minAmount ? html`
@@ -1066,7 +1072,7 @@
 			contractTransferCard(obj) {
 				const { hash, token, sender, receiver, amount, contractName, userChoice, time } = obj;
 				return html`
-					<div id=${hash} class="transaction token-transfer">
+					<li id=${hash} class="transaction token-transfer">
 						<svg class="icon" viewBox="0 0 64 64"> <title>contract</title> <path d="M4.75,49.27A8,8,0,0,0,4.2,61.14a7.82,7.82,0,0,0,4.34,2.24,7.42,7.42,0,0,0,1.34.12H47.41a8.06,8.06,0,0,0,8.05-8V7.87"/> <path d="M8.54,56.13V8.54a8.06,8.06,0,0,1,8.05-8H54.12a7.42,7.42,0,0,1,1.34.12A7.82,7.82,0,0,1,59.8,2.86a8,8,0,0,1-.55,11.87"/> <line x1="17.93" y1="22.62" x2="46.07" y2="22.62"/> <line x1="17.93" y1="32" x2="46.07" y2="32"/> <line x1="17.93" y1="41.38" x2="38.03" y2="41.38"/> </svg>
 						<div class="contract-type">
 							<h5 class="label">Smart Contract Transfer</h5>
@@ -1090,7 +1096,7 @@
 								<a href=${`#/transaction/${hash}`} class="button button--small button--colored">View details</a>
 							</div>
 						</div>
-					</div>`;
+					</li>`;
 			},
 			tokenTransferCard(obj) {
 				const { hash, blockHeight, token, sender, receiver, amount, type, time } = obj;
@@ -1098,7 +1104,7 @@
 				if (type === 'nfttransfer')
 					title = 'NFT transfer';
 				return html`
-					<div id=${hash} class="transaction token-transfer">
+					<li id=${hash} class="transaction token-transfer">
 						<svg class="icon" viewBox="0 0 64 64"> <title>transfer</title> <polyline points="17.04 35.97 14.57 33.5 40.15 7.9 32.75 0.5 55.52 0.5 55.52 23.28 48.12 15.87 23.86 40.14 15.88 48.13 8.48 40.72 8.48 63.5 31.25 63.5 23.85 56.1 49.43 30.5 46.96 28.03"/> </svg>
 						<div class="contract-type">
 							<h5 class="label">${title}</h5>
@@ -1128,7 +1134,7 @@
 								<a href=${`#/transaction/${hash}`} class="button button--small button--colored">View details</a>
 							</div>
 						</div>
-					</div>
+					</li>
 				`;
 			},
 			tokenCreationCard(obj) {
@@ -1137,7 +1143,7 @@
 				if (type === 'nftincorp')
 					title = 'NFT creation';
 				return html`
-					<div id=${hash} class="transaction token-creation">
+					<li id=${hash} class="transaction token-creation">
 						<svg class="icon" viewBox="0 0 64 64"> <title>token</title> <circle cx="32" cy="32" r="31"/> <circle cx="32" cy="32" r="25.19"/> <line x1="37" y1="21.74" x2="43.14" y2="21.74"/> <path d="M20.86,21.74H32V43.23"/> </svg>
 						<div class="contract-type">
 							<h5 class="label">${title}</h5>
@@ -1170,12 +1176,12 @@
 								<a href=${`#/transaction/${hash}`} class="button button--small button--colored">View details</a>
 							</div>
 						</div>
-					</div>`;
+					</li>`;
 			},
 			contractTriggerCard(obj) {
 				const { hash, blockHeight, contractName, contractAddress, winningChoice, committeeAddress, time } = obj;
 				return html`
-					<div id=${hash} class="transaction contract-trigger">
+					<li id=${hash} class="transaction contract-trigger">
 						<svg class="icon" viewBox="0 0 64 64"> <circle cx="32" cy="32" r="31"/> <polyline points="32 13.47 32 32 43.4 43.4"/> </svg>
 						<div class="contract-type">
 							<h5 class="label">smart contract </h5>
@@ -1207,14 +1213,14 @@
 								<a href=${`#/transaction/${hash}`} class="button button--small button--colored">View details</a>
 							</div>
 						</div>
-					</div>
+					</li>
 				`;
 			},
 			contractCreationCard(obj) {
 				const { hash, blockHeight, token, contractName, incAddress, contractType, expiration, participationFees, availableChoices, time } = obj;
 				console.log(obj);
 				return html`
-					<div id=${hash} class="transaction contract-creation">
+					<li id=${hash} class="transaction contract-creation">
 						<svg class="icon" viewBox="0 0 64 64"> <title>contract creation</title> <path d="M47.07,23.85V11"/> <path d="M3,47A7,7,0,0,0,.48,52.39a6.89,6.89,0,0,0,2.05,4.93,6.78,6.78,0,0,0,3.78,2,6.34,6.34,0,0,0,1.16.1H40.09a7,7,0,0,0,7-7V44"/> <path d="M6.31,53V11.61a7,7,0,0,1,7-7H45.91a6.26,6.26,0,0,1,1.16.1,6.74,6.74,0,0,1,3.78,1.95A7,7,0,0,1,50.37,17"/> <line x1="14.46" y1="23.85" x2="38.92" y2="23.85"/> <line x1="14.46" y1="32" x2="38.92" y2="32"/> <line x1="14.46" y1="40.15" x2="31.93" y2="40.15"/> <path d="M57.79,24.44l-2.88-2.9,3.79-3.79a1,1,0,0,1,1.39,0l3.11,3.11a1,1,0,0,1,0,1.39L40.34,45.1a1,1,0,0,1-.52.28L36,46A1,1,0,0,1,34.9,44.9l.67-3.77a1,1,0,0,1,.27-.52L52.65,23.8"/> </svg>
 						<div class="contract-type">
 							<h5 class="label">Smart Contract creation</h5>
@@ -1255,7 +1261,7 @@
 								<a href=${`#/transaction/${hash}`} class="button button--small button--colored">View details</a>
 							</div>
 						</div>
-					</div>`;
+					</li>`;
 			},
 			blockCard(blockDetails) {
 				const { height, tx, time } = blockDetails;
@@ -1323,7 +1329,7 @@
 			renderElem(getRef('suggestions'), html`${renderedSuggestions}`)
 		}, 100))
 		async function getBannerData() {
-			const { systemTransactionCount, systemAddressCount } = await fetchJson(`${tokenApiUrl}/api/v2/info`)
+			const { systemTransactionCount, systemAddressCount } = await fetchJson(`${floGlobals.tokenApiUrl}/api/v2/info`)
 			return {
 				topToken: "RMT",
 				totalTransactions: systemTransactionCount,
@@ -1340,7 +1346,7 @@
 
 		function getLatestTxs() {
 			return new Promise((resolve, reject) => {
-				fetchJson(`${tokenApiUrl}/api/v2/latestTransactionDetails?limit=4`)
+				fetchJson(`${floGlobals.tokenApiUrl}/api/v2/latestTransactionDetails?limit=4`)
 					.then(function (latestTxs) {
 						resolve(latestTxs.latestTransactions)
 					}).catch((err) => {
@@ -1352,7 +1358,7 @@
 		function getTokenInfo(thisToken) {
 			return new Promise((resolve, reject) => {
 				fetchJson(
-					`${tokenApiUrl}/api/v2/tokenInfo/${thisToken.toLowerCase()}`
+					`${floGlobals.tokenApiUrl}/api/v2/tokenInfo/${thisToken.toLowerCase()}`
 				).then(function (tokenInfo) {
 					if (tokenInfo.result === "error")
 						reject(tokenInfo.description);
@@ -1374,17 +1380,17 @@
 		}
 
 		async function getTokenBalances(tokenName) {
-			const tokenDetails = await fetchJson(`${tokenApiUrl}/api/v2/tokenBalances/` + tokenName)
+			const tokenDetails = await fetchJson(`${floGlobals.tokenApiUrl}/api/v2/tokenBalances/` + tokenName)
 			return tokenDetails.balances
 		}
 
 		async function getTokenTransactions(tokenName) {
-			const transactions = await fetchJson(`${tokenApiUrl}/api/v2/tokenTransactions/` + tokenName)
+			const transactions = await fetchJson(`${floGlobals.tokenApiUrl}/api/v2/tokenTransactions/` + tokenName)
 			return transactions.transactions
 		}
 
 		async function getBlockInfo(thisBlock) {
-			const info = await fetchJson(`${tokenApiUrl}/api/v2/blockDetails/${thisBlock}`);
+			const info = await fetchJson(`${floGlobals.tokenApiUrl}/api/v2/blockDetails/${thisBlock}`);
 			const { height, size, reward, hash, difficulty, nonce, tx } = info.blockDetails
 			return {
 				blockHeight: height,
@@ -1398,12 +1404,12 @@
 		}
 
 		async function getBlockTransactions(thisBlock) {
-			const blockTransactions = await fetchJson(`${tokenApiUrl}/api/v2/blockTransactions/${thisBlock}`)
+			const blockTransactions = await fetchJson(`${floGlobals.tokenApiUrl}/api/v2/blockTransactions/${thisBlock}`)
 			return blockTransactions.transactions
 		}
 
 		async function getContractInfo(contract) {
-			const info = await fetchJson(`${tokenApiUrl}/api/v2/smartContractInfo?contractName=${contract.name}&contractAddress=${contract.address}`);
+			const info = await fetchJson(`${floGlobals.tokenApiUrl}/api/v2/smartContractInfo?contractName=${contract.name}&contractAddress=${contract.address}`);
 			console.log(info, contract)
 			const {
 				contractInfo: {
@@ -1455,18 +1461,18 @@
 		}
 
 		async function getContractParticipants(contract) {
-			const participants = await fetchJson(`${tokenApiUrl}/api/v2/smartContractParticipants?contractName=${contract.name}&contractAddress=${contract.address}`)
+			const participants = await fetchJson(`${floGlobals.tokenApiUrl}/api/v2/smartContractParticipants?contractName=${contract.name}&contractAddress=${contract.address}`)
 			return participants.participantInfo
 		}
 
 		async function getContractTransactions(contract) {
-			const transactions = await fetchJson(`${tokenApiUrl}/api/v2/smartContractTransactions?contractName=${contract.name}&contractAddress=${contract.address}`)
+			const transactions = await fetchJson(`${floGlobals.tokenApiUrl}/api/v2/smartContractTransactions?contractName=${contract.name}&contractAddress=${contract.address}`)
 			return transactions.contractTransactions
 		}
 
 		async function getContractDeposits(contract) {
-			console.log(`${tokenApiUrl}/api/v2/smartContractDeposits?contractName=${contract.name}&contractAddress=${contract.address}`)
-			const deposits = await fetchJson(`${tokenApiUrl}/api/v2/smartContractDeposits?contractName=${contract.name}&contractAddress=${contract.address}`)
+			console.log(`${floGlobals.tokenApiUrl}/api/v2/smartContractDeposits?contractName=${contract.name}&contractAddress=${contract.address}`)
+			const deposits = await fetchJson(`${floGlobals.tokenApiUrl}/api/v2/smartContractDeposits?contractName=${contract.name}&contractAddress=${contract.address}`)
 			return deposits.depositInfo
 		}
 
@@ -1605,32 +1611,32 @@
 		}
 
 		async function getAllBlocks(number) {
-			const allBlocks = await fetchJson(`${tokenApiUrl}/api/v2/latestBlockDetails${number ? `?limit=${number}` : ''}`)
+			const allBlocks = await fetchJson(`${floGlobals.tokenApiUrl}/api/v2/latestBlockDetails${number ? `?limit=${number}` : ''}`)
 			return Object.values(allBlocks.latestBlocks).sort((a, b) => b.height - a.height)
 		}
 
 		async function getAllTxs() {
-			const allTxs = await fetchJson(`${tokenApiUrl}/api/v2/latestTransactionDetails?limit=200`)
+			const allTxs = await fetchJson(`${floGlobals.tokenApiUrl}/api/v2/latestTransactionDetails?limit=200`)
 			return allTxs.latestTransactions
 		}
 
 		async function getAddressInfo(floAddress) {
-			const addressInfo = await fetchJson(`${tokenApiUrl}/api/v2/floAddressInfo/${floAddress}`)
+			const addressInfo = await fetchJson(`${floGlobals.tokenApiUrl}/api/v2/floAddressInfo/${floAddress}`)
 			return addressInfo.floAddressBalances
 		}
 
 		async function getAddressBalance(floAddress) {
-			return await fetchJson(`${floApiUrl}/api/addr/${floAddress}/balance`)
+			return await fetchJson(`${floGlobals.floApiUrl}/api/addr/${floAddress}/balance`)
 		}
 
 		async function getAddressTxs(floAddress) {
-			const transactions = await fetchJson(`${tokenApiUrl}/api/v2/floAddressTransactions/${floAddress}`)
+			const transactions = await fetchJson(`${floGlobals.tokenApiUrl}/api/v2/floAddressTransactions/${floAddress}`)
 			return transactions.transactions
 		}
 
 		async function getTxInfo(thisTx) {
 			try {
-				const transaction = await fetchJson(`${tokenApiUrl}/api/v2/transactionDetails/${thisTx}`)
+				const transaction = await fetchJson(`${floGlobals.tokenApiUrl}/api/v2/transactionDetails/${thisTx}`)
 				if (transaction.result === 'error') {
 					return [false, transaction.description]
 				} else {
@@ -1717,9 +1723,9 @@
 					location.href = `#/contract/${text}`
 					resolve('contract')
 				} else if (text.length == 64 && returnHexNumber(text)) {
-					fetchJson(`${window.tokenApiUrl}/api/v2/categoriseString/` + text)
+					fetchJson(`${floGlobals.tokenApiUrl}/api/v2/categoriseString/` + text)
 						.then(function (myJson) {
-							console.log(`${window.tokenApiUrl}/api/v2/categoriseString/` + text)
+							console.log(`${floGlobals.tokenApiUrl}/api/v2/categoriseString/` + text)
 							if (myJson['type'] == 'transaction') {
 								//console.log('data entered is a transaction hash');
 								location.href = `#/transaction/${text}`
@@ -1753,7 +1759,7 @@
 		async function getAllSuggestions() {
 			window.allSuggestions = [];
 			window.ranchimallFlo = {};
-			let { tokens, smartContracts } = await fetchJson(`${window.tokenApiUrl}/api/v2/tokenSmartContractList`);
+			let { tokens, smartContracts } = await fetchJson(`${floGlobals.tokenApiUrl}/api/v2/tokenSmartContractList`);
 			//console.log('first line of the fetch result');
 			ranchimallFlo.tokenList = tokens;
 			ranchimallFlo.smartContractList = smartContracts;