UI modifications & last 10 blocks hash display (+ ABE links)

README.md

@@ -1,4 +1,8 @@
 testnet
 =======
 
-Miniature http server to play with litecoin testnet.
+Miniature HTTP server to play with litecoin testnet (also acts as a faucet).
+
+To run a local instance, copy config/testnet.cfg to config/testnet.<your_hostname>.cfg
+and modify it with your local RPC settings.
+

testnet.js

@@ -117,6 +117,8 @@ function Application() {
     app.get('/block/:blockhash', function(req, res) {
         no_cache(res, true);
 
+        console.log("LOOKING FOR:",req.params.blockhash);
+
         if(!req.params.blockhash)
             return res.end(JSON.stringify({ error : "blockhash is required" }));
 
@@ -169,8 +171,34 @@ function Application() {
                             console.error("getBalance error:", err);
                         self.status.balance_1 = balance_1;
 
-                        dpc(config.daemon_poll_freq, update_status);
-
+                        self.status.last_blocks = [ ]
+
+                        var blocks = [ ]
+                        var n = info.blocks;
+                        for(var i = 0; i < 10; i++)
+                            blocks.push(n-i);
+
+                        get_block();
+
+                        function get_block() {
+
+                            var height = blocks.shift();
+
+                            if(!height)
+                                return dpc(config.daemon_poll_freq, update_status);
+
+                            self.client.getBlockHash(height, function(err, blockhash) {
+                                if(err)
+                                    console.error("getBlockHash error:", err);
+
+                                self.status.last_blocks.push({
+                                    height : height,
+                                    hash : blockhash
+                                });
+
+                                get_block();                               
+                            })
+                        }                        
                     })                
                 })                
             })

views/index.ejs

@@ -13,13 +13,20 @@
 		color: #000;
 		font-family: "Consolas";
 		font-size: 14px;
-		white-space: pre; 
+		xwhite-space: pre; 
 	}
 
+    .response { white-space: pre; }
+
+    a:link { text-decoration: none; color: #0051AD; }
+    a:visited { text-decoration: none; color: #0051AD; }
+    a:hover { text-decoration: none; color: #F04800; }
+
 	button, input { font-family: "Consolas"; }
     table { border-collapse: collapse; }
     td, th { padding: 8px; text-align: center; border: 1px solid #ccc; }
 
+    xfieldset { width : 700px; }
 
 </style>
 
@@ -50,9 +57,19 @@ function Application() {
                 var str = "";
                 // ---
 
+                _.each(response.last_blocks, function(o) {
+                    str += "<a href='http://testnet.litecointools.com:2750/block/"+o.hash+"' target='_blank'>"+o.height+" - "+o.hash+" <img src='link.gif'/></a><br/>";
+                });
+
+                $("#last_blocks").html(str);
+
+                // ---
+
                 str = "<table>"
                 _.each(response.info, function(v,n) {
-                    str += "<tr><td style='text-align:left;'>"+n+"</td><td style='text-align:left;'>"+v+"</td></tr>";
+                    str += "<tr><td style='text-align:left;'>"+n+"</td><td style='text-align:left;'>";
+                    str += v;
+                    str += "</td></tr>";
                 })
                 str += "</table>";
                 $("#info").html(str);
@@ -89,69 +106,54 @@ function Application() {
             $("#fee_response").html(jt(data));
         });
     })
-
-    $("#tx_lookup").click(function(){
-    	var txhash = $("#tx_input").val();
-
-    	$.getJSON("/tx/"+txhash, function(data) {
-    		$("#tx_info").html(jt(data));
-    	});
-    })
-
-    $("#block_lookup").click(function(){
-    	var blockhash = $("#tx_input").val();
-
-    	$.getJSON("/block/"+blockhash, function(data) {
-    		$("#block_info").html(jt(data));
-    	});
-    })
-
 }
 
-
 $(document).ready(function() {
 	window.app = new Application();
 });
 
 </script>
 
 </head>
-<body><div id='wrapper'><div id='content'>LITECOIN TESTNET NODE INTERFACE
+<body><div id='wrapper'><div id='content'>LITECOIN TESTNET NODE INTERFACE<p/>
 
---- WALLET ---
-WALLET ADDRESS: <span id='address'></span>
-BALANCE (0 confirms): <span id='balance_0'></span>
+<fieldset><legend>WALLET</legend>
+WALLET ADDRESS: <span id='address'></span><br/>
+BALANCE (0 confirms): <span id='balance_0'></span><br/>
 BALANCE (1 confirms): <span id='balance_1'></span>
-
---- SEND ---
+</fieldset>
+<br/>
+<fieldset><legend>SEND</legend>
 TO ADDRESS: <input id='send_address' type='text'  style='width:300px;'/>
 AMOUNT:     <input id='send_amount' type='text' />
 <button id='send'>SEND</button>
-
-RESPONSE:
-<span id='send_response'></span>
-
---- SET TX FEE ---
+<p>
+RESPONSE:<br/>
+<span id='send_response' class='response'></span>
+</p>
+</fieldset>
+<br/>
+<fieldset><legend>SET TX FEE</legend>
 FEE: <input id='fee_amount' type='text' />
 <button id='set_fee'>SET TX FEE</button>
-
-RESPONSE:
-<span id='fee_response'></span>
-
--------------------
-LOOKUP TX HASH: <input id='tx_input' type='text' style='width:400px;' /><button id='tx_lookup'>LOOKUP</button>
-<span id='tx_info'></span>
-
--------------------
-LOOKUP BLOCK HASH: <input id='block_input' type='text' style='width:400px;' /><button id='block_lookup'>LOOKUP</button>
-<span id='block_info'></span>
-
-INFO:
+<p>
+RESPONSE:<br/>
+<span id='fee_response' class='response'></span>
+</p>
+</fieldset>
+<br/>
+<fieldset><legend>LAST 10 BLOCKS</legend>
+<span id='last_blocks'></span>
+</fieldset>
+<br/>
+<fieldset><legend>INFO</legend>
 <span id='info'></span>
-
-CONNECTED PEERS:
+</fieldset>
+<br/>
+<fieldset><legend>CONNECTED PEERS</legend>
 <span id='peer_info'></span>
-
+</fieldset>
+<br/>
 	</div>
 </div>
 </body>