Currency page

Getting and displaying data for:
- Markets
- Governance
- Blockchain

_layouts/default.html

@@ -39,6 +39,16 @@
     <script src="{{ base }}/assets/js/full-menu.js"></script>
 
 <script>
+function formatNumber (num) {
+    return num.toString().replace(/(\d)(?=(\d{3})+(?!\d))/g, "$1,")
+}
+
+function formatCurrency (num,decimal) {
+    var _decimal;
+    _decimal = typeof decimal !== "undefined" ? decimal : 2;
+    return num.toFixed(_decimal).replace(/(\d)(?=(\d{3})+(?!\d))/g, "$1,")
+}
+
 function windowPopup(url, width, height) {
   // Calculate the position of the popup so
   // it’s centered on the screen.

currency/index.html

@@ -10,10 +10,38 @@ description: pages.currency.description
 	
 	<h2>{% t pages.currency.markets-heading %}</h2>
 
-	<div id="exchanges"></div>
+	<table>
+		<thead>
+			<tr>
+				<th>Exchange</th>
+				<th>Volume (24h)</th>
+				<th>Price</th>
+				<th>Volume (%)</th>
+			</tr>
+		</thead>
+		<tbody id="exchanges">
+			
+		</tbody>
+	</table>
 
 	<h2>{% t pages.currency.governance-heading %}</h2>
 
+	<table>
+		<thead>
+			<tr>
+				<th>Title</th>
+				<th>Owner</th>
+				<th>Votes (yes/no)</th>
+				<th>Votes Required</th>
+				<th>Monthly Amount</th>
+				<th>Will be Funded</th>
+			</tr>
+		</thead>
+		<tbody id="budgets">
+			
+		</tbody>
+	</table>
+
 	<h2>{% t pages.currency.network-heading %}</h2>
 
 	<div id="masternodes_count"></div>
@@ -21,6 +49,21 @@ description: pages.currency.description
 
 	<h2>{% t pages.currency.blockchain-heading %}</h2>
 
+	<table>
+		<thead>
+			<tr>
+				<th>Height</th>
+				<th>Age</th>
+				<th>Transactions</th>
+				<th>Value Out</th>
+				<th>Difficulty</th>
+			</tr>
+		</thead>
+		<tbody id="blocks">
+			
+		</tbody>
+	</table>
+
 </div>
 
 <script type="text/javascript">
@@ -36,27 +79,83 @@ $( document ).ready(function(){
 		}
 	})
 	.done(function(response){
-		console.log(response);
 		var exchanges = response; 
 
-		// for( i = 0; i < exchanges.length ; i++ ){
+		exchanges.map(function(exchange){
-		// 	$("#exchanges").prepend('<div>Exchange line item</div>')
+			if(exchange){
-		// }
+				console.log('exchange',exchange);
+				var name 	= exchange.exchange,
+					url 	= exchange.url
+					volume 	= "$" + formatCurrency(exchange.volume,0),
+					price 	= "$" + formatCurrency(exchange.price),
+					change 	= formatNumber(exchange.percent_change);
+
+				
+				$("#exchanges").append('<tr><td><a target="_blank" href="' + url + '">' + name + '</a></td><td>' + volume + '</td><td>' + price + '</td><td>' + change + '%</td></tr>');
+			}
+		});
 	});
 
+	
 	// Get the current number of masternodes.
 	$.ajax({
 		url: "{{ site.api }}/masternodes/stats/"
 	})
 	.done(function(response){
 		console.log('masternode stats', response.stats);
-		var masternodes_count = response.stats['count'].toFixed(0).replace(/(\d)(?=(\d{3})+\.)/g, '$1,');
+		var masternodes_count	= formatNumber(response.stats['count']),
-		var masternodes_max = response.stats['max'].toFixed(0).replace(/(\d)(?=(\d{3})+\.)/g, '$1,');
+			masternodes_max 	= formatNumber(response.stats['max']);
 
 		$("#masternodes_count").text(masternodes_count);
 		$("#masternodes_max").text(masternodes_max);
 	});
 
+	
+	// Get the budget proposals
+	$.ajax({
+		url: "{{ site.api }}/budgets/"
+	})
+	.done(function(response){
+		var proposals = response.proposals;
+
+		proposals.map(function(proposal){
+			var	title 			= proposal.title ? proposal.title : proposal.name,
+				url				= proposal.dw_url,
+				owner 			= proposal.owner_username,
+				votes_yes 		= proposal.yes, 
+				votes_no 		= proposal.no, 
+				required_votes 	= proposal.remaining_yes_votes_until_funding,
+				amount_monthly 	= formatCurrency(proposal.monthly_amount)
+				will_be_funded	= proposal.will_be_funded ? "yes" : "no";
+
+		
+
+			$("#budgets").append('<tr><td>' + title + '</td><td>' + owner + '</td><td>' + votes_yes + '/' + votes_no + '</td><td>' + required_votes + '</td><td>' + amount_monthly + '</td><td>' + will_be_funded + '</td></tr>');	
+			
+		});
+	});
+
+
+	// Get the blockchain info
+	$.ajax({
+		url: "{{ site.api }}/chain/latestBlocks/"
+	})
+	.done(function(response){
+		var blocks = response.blocks;
+
+		console.log(blocks);
+
+		blocks.map(function(block){
+			var height 		= block.height,
+				age 		= moment.unix(block.time).format("LLL"),
+				txs 		= block.txlength,
+				out 		= block.cbvalue,
+				difficulty 	= block.difficulty;
+
+			$("#blocks").append('<tr><td>' + height + '</td><td>' + age + '</td><td>' + txs + '</td><td>' + out + '</td><td>' + difficulty + '</td></tr>');
+		});
+	});
+
 
 });
 </script>