From 677c410e8104b79611e468f77ace495adf8921b2 Mon Sep 17 00:00:00 2001
From: Vivek Teega <vivek.teega@gmail.com>
Date: Thu, 13 Jun 2019 11:23:24 +0530
Subject: [PATCH] Addition of functionality on the token tab

---
 index2.html | 272 +++++++++++++++++++++++++++++-----------------------
 1 file changed, 153 insertions(+), 119 deletions(-)

diff --git a/index2.html b/index2.html
index c7aced5..e431b73 100644
--- a/index2.html
+++ b/index2.html
@@ -198,6 +198,11 @@
 						<h4 class="column__text">amphiphilic</h4>
 						<h4 class="column__text">neutrophil</h4>-->
 					</div>
+
+					<div id='token_data_display' class="column">
+						<h4 class="column__title">Display Box</h4>
+					</div>
+
 					<div id='token_column2' class="column">
 						<h3 class="column__title">Enter Address/Token name</h3>
 						<div>
@@ -222,7 +227,7 @@
 						<h4 class="column__text">neutrophil</h4>-->
 					</div>
 
-					<div id='data_display' class="column">
+					<div id='contract_data_display' class="column">
 						<h4 class="column__title">Display Box</h4>
 					</div>
 
@@ -251,7 +256,7 @@
 				submit: document.getElementById('addressName_submit')
         	};
 
-        				var tokenForm = {
+        	var tokenForm = {
 				tokenName: document.getElementById('tokenName'),
 				submit: document.getElementById('tokenName_submit')
         	};
@@ -265,6 +270,10 @@
 
 
 		<script>
+
+			var apiLocation = 'https://ranchimallflo.duckdns.org'
+			//var apiLocation = 'https://127.0.0.1:5010'
+
 			var topSmartContract = {};
 			topSmartContract = getTopSmartContract();
 
@@ -279,7 +288,7 @@
 			getSmartContractInfo(topSmartContract.name,topSmartContract.floAddress);
 
 			function getSmartContractInfo(contractName,contractAddress){
-				fetch(`https://ranchimallflo.duckdns.org/api/v1.0/getSmartContractInfo?contractName=${contractName}&contractAddress=${contractAddress}`)
+				fetch(`${apiLocation}/api/v1.0/getSmartContractInfo?contractName=${contractName}&contractAddress=${contractAddress}`)
 				.then(response => response.json())
 				.then((data) => {
 					showSmartContractInfo(data);
@@ -295,8 +304,11 @@
 			//Show Active Contracts in "Contracts" section
 			getSmartContractList();
 
+			//Show Active Tokens in "Track Tokens" section
+			getTokenList();
+
 			function getSmartContractList(){
-				fetch('https://ranchimallflo.duckdns.org/api/v1.0/getSmartContractList')
+				fetch(`${apiLocation}/api/v1.0/getSmartContractList`)
 				.then(response => response.json())
 				.then((data) => {
 					showSmartContractList(data);
@@ -321,19 +333,78 @@
 					}
 			}
 
+			function getTokenList(){
+			fetch(`${apiLocation}/api/v1.0/getTokenList`)
+			.then(response => response.json())
+			.then((data) => {
+				showTokenList(data);	
+			});
+			}
+
+			function showTokenList(data){
+					var token_column1 = document.getElementById('token_column1');
+					for (var i = 0; i < data['tokens'].length; i++) { 
+					token_column1.innerHTML = token_column1.innerHTML + '<h4 class="column__text" id="token_'+data['tokens'][i]+'">'+ data['tokens'][i] +'</h4>';
+					}
+
+					for (var i = 0; i < data['tokens'].length; i++) { 
+					document.getElementById('token_'+data['tokens'][i]).addEventListener("click",showMeTokenTransactions, false);
+				}
+			}
+
+
+			function showMeTokenTransactions(y){
+				var token = y.target.innerHTML;
+				getAllTokenTransactions(token);
+
+			}
+
+			function showAllTokens(data){
+
+				console.log(data);
+
+				var rows = data;
+
+				var html = '<table>';
+				html += '<tr>';
+				for( var j in rows[1] ) {
+				html += '<th>' + j + '</th>';
+				}
+				html += '</tr>';
+				for( var i = 1; i < Object.keys(rows).length; i++) {
+				html += '<tr>';
+				for( var j in rows[i] ) {
+					html += '<td>' + rows[i][j] + '</td>';
+				}
+				html += '</tr>';
+				}
+				html += '</table>';
+
+				console.log(html);
+				document.getElementById("token_data_display").innerHTML = html;
+				}
+
+			function getAllTokenTransactions(token){
+				fetch(`${apiLocation}/api/v1.0/getTokenTransactions?token=${token}`)
+				.then(response => response.json())
+				.then((data) => {
+					window.data = data;
+					//console.log(data);	
+					showAllParticipants(data.transactions);
+				});				
+			}
+
 
 			function showMeParticipants(y){
-				var name=y.target.innerHTML;
+				var name = y.target.innerHTML;
 				var address = y.target.dataset.contractaddress;
 				getAllParticipants(name,address);
 
 			}
 
-			//Show Active Tokens in "Track Tokens" section
-			getTokenList();
 
 			function getAllParticipants(contractName,contractAddress){
-				fetch(`https://ranchimallflo.duckdns.org/api/v1.0/getSmartContractParticipants?contractName=${contractName}&contractAddress=${contractAddress}`)
+				fetch(`${apiLocation}/api/v1.0/getSmartContractParticipants?contractName=${contractName}&contractAddress=${contractAddress}`)
 				.then(response => response.json())
 				.then((data) => {
 					window.data = data;
@@ -364,30 +435,14 @@
 				 html += '</table>';
 
 				 console.log(html);
-				 document.getElementById("data_display").innerHTML = html;
+				 document.getElementById("contract_data_display").innerHTML = html;
 			}
 
-			function getTokenList(){
-			fetch('https://ranchimallflo.duckdns.org/api/v1.0/getTokenList')
-			.then(response => response.json())
-			.then((data) => {
-				showTokenList(data);	
-			});
-			}
+			
 
-			function showTokenList(data){
-					var token_column1 = document.getElementById('token_column1');
-					for (var i = 0; i < data['tokens'].length; i++) { 
-					token_column1.innerHTML = token_column1.innerHTML + '<h4 class="column__text" id="token_'+data['tokens'][i]+'">'+ data['tokens'][i] +'</h4>';
-					}
-
-					for (var i = 0; i < data['tokens'].length; i++) { 
-					document.getElementById('token_'+data['tokens'][i]).addEventListener("click",function(){alert("Hello Rohit")});
-				}
-			}
+			
 
 			// Parsing of contract form data
-
 			function parseContractFormData(){
 				console.log('button press');
 				contractForm['addressName'] = document.getElementById('addressName');
@@ -396,7 +451,7 @@
 				console.log(contractForm['addressName'].value);
 
 				if (contractForm['addressName'].value.slice(0,1) == 'F' && contractForm['addressName'].value.length == 34){
-					fetch('https://ranchimallflo.duckdns.org/api/v1.0/getParticipantDetails?floAddress='+contractForm['addressName'].value )
+					fetch(`${apiLocation}/api/v1.0/getParticipantDetails?floAddress=${contractForm['addressName'].value}`)
 					.then(response => response.json())
 					.then((data) => {
 						showContractParticipantDetails(data);
@@ -404,7 +459,7 @@
 				}
 				else{
 					// Entered data is contract name
-					fetch(`https://ranchimallflo.duckdns.org/api/v1.0/getSmartContractList?contractName=${contractForm["addressName"].value}`)
+					fetch(`${apiLocation}/api/v1.0/getSmartContractList?contractName=${contractForm["addressName"].value}`)
 					.then(response => response.json())
 					.then((data) => {
 						showContractNameDetails(data);
@@ -413,95 +468,6 @@
 
 			}
 
-			// Parsing of token form data
-
-			function parseTokenFormData(){
-								// Find out if it is a contract name or FLO address 
-				//console.log(tokenForm['tokenName'].value);
-
-				console.log('button press');
-				tokenForm['tokenName'] = document.getElementById('tokenName');
-
-
-				if (tokenForm['tokenName'].value.slice(0,1) == 'F' && tokenForm['tokenName'].value.length == 34){
-					fetch(`https://ranchimallflo.duckdns.org/api/v1.0/getTokenInfo?floAddress=${tokenForm["tokenName"].value}`)
-					.then(response => response.json())
-					.then((data) => {
-
-						showTokenAddressInfo(data);
-						
-					});
-				}
-				else{
-					// Entered data is contract name
-					fetch(`https://ranchimallflo.duckdns.org/api/v1.0/getTokenInfo?token=${tokenForm["tokenName"].value}`)
-					.then(response => response.json())
-					.then((data) => {
-						
-						showTokenInfo(data);
-					});
-				}
-			}
-
-
-			function showTokenInfo(data){
-				//console.log(data);
-						tokenDetailColumn = document.getElementById('token_column2');
-			
-						tokenDetailColumn.innerHTML = tokenDetailColumn.innerHTML + '<h4 class="column__text">Token name: '+ data['token'] +'</h4>' ;
-						tokenDetailColumn.innerHTML = tokenDetailColumn.innerHTML + '<h4 class="column__text">Incorp address: '+ data['incorporationAddress'] +'</h4>' ;
-						tokenDetailColumn.innerHTML = tokenDetailColumn.innerHTML + '<h4 class="column__text">Active addresses:'+ data['activeAddress_no'] +'</h4>' ;
-						tokenDetailColumn.innerHTML = tokenDetailColumn.innerHTML + '<h4 class="column__text">Transaction hash:'+ data['transactionHash'] +'</h4>' ;
-						if (data['smartContracts'][0]['expiryDate']){
-							contractDetailColumn.innerHTML = contractDetailColumn.innerHTML + '<h4 class="column__text">Expiry time:'+ data['smartContracts'][0]['expiryDate'] +'</h4><br>' ;														
-							}
-
-			}
-			
-			function showTokenAddressInfo(data){
-				contractDetailColumn = document.getElementById('contract_column2');
-
-						// Check which type of address it is 
-						if (data['result']=='ok' && data['type']=='participant'){
-							for (i = 0; i < data['participatedContracts'].length; i++) {
-								contractDetailColumn.innerHTML = contractDetailColumn.innerHTML + '<h4 class="column__text">Contract name: '+ data['participatedContracts'][i]['contractName'] +'</h4>' ;
-								contractDetailColumn.innerHTML = contractDetailColumn.innerHTML + '<h4 class="column__text">Contract address: '+ data['participatedContracts'][i]['contractAddress'] +'</h4>' ;
-								contractDetailColumn.innerHTML = contractDetailColumn.innerHTML + '<h4 class="column__text">Token amount:'+ data['participatedContracts'][i]['tokenAmount'] +'</h4>' ;
-								contractDetailColumn.innerHTML = contractDetailColumn.innerHTML + '<h4 class="column__text">Transaction hash:'+ data['participatedContracts'][i]['transactionHash'] +'</h4><br>' ;
-								}
-						}
-						else if (data['result']=='ok' && data['type']=='contract'){
-							for (i = 0; i < data['contractInfo'].length; i++) {
-								contractDetailColumn.innerHTML = contractDetailColumn.innerHTML + '<h4 class="column__text">Contract name: '+ data['contractInfo'][i]['contractName'] +'</h4>' ;
-								contractDetailColumn.innerHTML = contractDetailColumn.innerHTML + '<h4 class="column__text">Contract address: '+ data['contractInfo'][i]['contractAddress'] +'</h4>' ;
-								contractDetailColumn.innerHTML = contractDetailColumn.innerHTML + '<h4 class="column__text">Type:'+ data['contractInfo'][i]['contractType'] +'</h4>' ;
-								contractDetailColumn.innerHTML = contractDetailColumn.innerHTML + '<h4 class="column__text">Expiry time:'+ data['contractInfo'][i]['expiryTime'] +'</h4><br>' ;
-								}														
-						}
-						else if (data['result'] == 'error'){
-							alert("error");
-						}
-
-			}
-
-			function showSmartContractList1(data){
-						contractDetailColumn = document.getElementById('contract_column2');
-						if (data['smartContracts'].length == 1){
-							contractDetailColumn.innerHTML = contractDetailColumn.innerHTML + '<h4 class="column__text">Contract name: '+ data['smartContracts'][0]['contractName'] +'</h4>' ;
-							contractDetailColumn.innerHTML = contractDetailColumn.innerHTML + '<h4 class="column__text">Contract address: '+ data['smartContracts'][0]['contractAddress'] +'</h4>' ;
-							contractDetailColumn.innerHTML = contractDetailColumn.innerHTML + '<h4 class="column__text">Status:'+ data['smartContracts'][0]['status'] +'</h4>' ;
-							if (data['smartContracts'][0]['expiryDate']){
-								contractDetailColumn.innerHTML = contractDetailColumn.innerHTML + '<h4 class="column__text">Expiry time:'+ data['smartContracts'][0]['expiryDate'] +'</h4><br>' ;														
-								}
-							}
-						else if (data['smartContracts'].length > 1){
-							for (i = 0; i < data['smartContracts'].length; i++) {
-								contractDetailColumn.innerHTML = contractDetailColumn.innerHTML + '<h4 class="column__text">Contract name: '+ data['smartContracts'][i]['contractName'] +'</h4>' ;
-								contractDetailColumn.innerHTML = contractDetailColumn.innerHTML + '<h4 class="column__text">Contract address: '+ data['smartContracts'][i]['contractAddress'] +'</h4>' ;
-								}										
-						}
-			}
-
 			function showContractParticipantDetails(data){
 						contractDetailColumn = document.getElementById('data_output');
 						contractDetailColumn.innerHTML = "";
@@ -544,9 +510,77 @@
 
 			}
 
+			// Parsing of token form data
+			function parseTokenFormData(){
+								// Find out if it is a contract name or FLO address 
+				//console.log(tokenForm['tokenName'].value);
+
+				console.log('button press');
+				tokenForm['tokenName'] = document.getElementById('tokenName');
+
+
+				if (tokenForm['tokenName'].value.slice(0,1) == 'F' && tokenForm['tokenName'].value.length == 34){
+					fetch(`${apiLocation}/api/v1.0/getTokenInfo?floAddress=${tokenForm["tokenName"].value}`)
+					.then(response => response.json())
+					.then((data) => {
+
+						showTokenAddressInfo(data);
+						
+					});
+				}
+				else{
+					// Entered data is contract name
+					fetch(`${apiLocation}/api/v1.0/getTokenInfo?token=${tokenForm["tokenName"].value}`)
+					.then(response => response.json())
+					.then((data) => {
+						
+						showTokenInfo(data);
+					});
+				}
+			}
+
+
+			function showTokenAddressInfo(data){
+				contractDetailColumn = document.getElementById('contract_column2');
+
+				// Check which type of address it is 
+				if (data['result']=='ok' && data['type']=='participant'){
+					for (i = 0; i < data['participatedContracts'].length; i++) {
+						contractDetailColumn.innerHTML = contractDetailColumn.innerHTML + '<h4 class="column__text">Contract name: '+ data['participatedContracts'][i]['contractName'] +'</h4>' ;
+						contractDetailColumn.innerHTML = contractDetailColumn.innerHTML + '<h4 class="column__text">Contract address: '+ data['participatedContracts'][i]['contractAddress'] +'</h4>' ;
+						contractDetailColumn.innerHTML = contractDetailColumn.innerHTML + '<h4 class="column__text">Token amount:'+ data['participatedContracts'][i]['tokenAmount'] +'</h4>' ;
+						contractDetailColumn.innerHTML = contractDetailColumn.innerHTML + '<h4 class="column__text">Transaction hash:'+ data['participatedContracts'][i]['transactionHash'] +'</h4><br>' ;
+						}
+				}
+				else if (data['result']=='ok' && data['type']=='contract'){
+					for (i = 0; i < data['contractInfo'].length; i++) {
+						contractDetailColumn.innerHTML = contractDetailColumn.innerHTML + '<h4 class="column__text">Contract name: '+ data['contractInfo'][i]['contractName'] +'</h4>' ;
+						contractDetailColumn.innerHTML = contractDetailColumn.innerHTML + '<h4 class="column__text">Contract address: '+ data['contractInfo'][i]['contractAddress'] +'</h4>' ;
+						contractDetailColumn.innerHTML = contractDetailColumn.innerHTML + '<h4 class="column__text">Type:'+ data['contractInfo'][i]['contractType'] +'</h4>' ;
+						contractDetailColumn.innerHTML = contractDetailColumn.innerHTML + '<h4 class="column__text">Expiry time:'+ data['contractInfo'][i]['expiryTime'] +'</h4><br>' ;
+						}														
+				}
+				else if (data['result'] == 'error'){
+					alert("error");
+				}
+			}
+
+
+			function showTokenInfo(data){
+				//console.log(data);
+				tokenDetailColumn = document.getElementById('token_column2');
+	
+				tokenDetailColumn.innerHTML = tokenDetailColumn.innerHTML + '<h4 class="column__text">Token name: '+ data['token'] +'</h4>' ;
+				tokenDetailColumn.innerHTML = tokenDetailColumn.innerHTML + '<h4 class="column__text">Incorp address: '+ data['incorporationAddress'] +'</h4>' ;
+				tokenDetailColumn.innerHTML = tokenDetailColumn.innerHTML + '<h4 class="column__text">Active addresses:'+ data['activeAddress_no'] +'</h4>' ;
+				tokenDetailColumn.innerHTML = tokenDetailColumn.innerHTML + '<h4 class="column__text">Transaction hash:'+ data['transactionHash'] +'</h4>' ;
+				if (data['smartContracts'][0]['expiryDate']){
+					contractDetailColumn.innerHTML = contractDetailColumn.innerHTML + '<h4 class="column__text">Expiry time:'+ data['smartContracts'][0]['expiryDate'] +'</h4><br>' ;														
+					}
+			}
 	
 			
-	/*		var es = new EventSource('https://ranchimallflo.duckdns.org/sse');
+	/*		var es = new EventSource('${apiLocation}/sse');
 			es.onmessage = function (event) {
 				console.log(event.data);
 			};*/