diff --git a/public/js/controllers/header.js b/public/js/controllers/header.js
index 8b3b4f7e..ec3e878d 100755
--- a/public/js/controllers/header.js
+++ b/public/js/controllers/header.js
@@ -1,7 +1,7 @@
 'use strict';
 
 angular.module('insight.system').controller('HeaderController',
-  function ($scope, Global) {
+  function ($scope, get_socket, Global, Block) {
   $scope.global = Global;
 
   $scope.menu = [
@@ -15,5 +15,23 @@ angular.module('insight.system').controller('HeaderController',
     }
   ];
 
+  var socket = get_socket($scope);
+  socket.emit('subscribe', 'inv');
+
+  var getBlock = function(hash) {
+    Block.get({
+      blockHash: hash
+    }, function(res) {
+      $scope.totalBlocks = res.height;
+    });
+  };
+
+  socket.on('block', function(block) {
+    var blockHash = block.hash.toString();
+    console.log('Update Height');
+    getBlock(blockHash);
+  });
+
+
   $scope.isCollapsed = false;
 });
diff --git a/public/js/controllers/index.js b/public/js/controllers/index.js
index bd1cdcdb..7621cbff 100755
--- a/public/js/controllers/index.js
+++ b/public/js/controllers/index.js
@@ -3,9 +3,25 @@
 var TRANSACTION_DISPLAYED = 5;
 var BLOCKS_DISPLAYED = 5;
 angular.module('insight.system').controller('IndexController',
-  function($scope, $rootScope, Global, get_socket, Blocks, Transactions) {
+  function($scope, $rootScope, Global, get_socket, Blocks, Block, Transactions, Transaction) {
   $scope.global = Global;
 
+  var getTransaction = function(txid) {
+    Transaction.get({
+      txId: txid
+    }, function(res) {
+      $scope.txs.unshift(res);
+    });
+  };
+
+  var getBlock = function(hash) {
+    Block.get({
+      blockHash: hash
+    }, function(res) {
+      $scope.blocks.unshift(res);
+    });
+  };
+
   var socket = get_socket($scope);
   socket.emit('subscribe', 'inv');
 
@@ -13,19 +29,21 @@ angular.module('insight.system').controller('IndexController',
   $scope.flashMessage = $rootScope.flashMessage || null;
 
   socket.on('tx', function(tx) {
+    var txStr = tx.txid.toString();
     console.log('Transaction received! ' + JSON.stringify(tx));
     if ($scope.txs.length === TRANSACTION_DISPLAYED) {
       $scope.txs.pop();
     }
-    $scope.txs.unshift(tx);
+    getTransaction(txStr);
   });
 
   socket.on('block', function(block) {
+    var blockHash = block.hash.toString();
     console.log('Block received! ' + JSON.stringify(block));
-      if ($scope.blocks.length === BLOCKS_DISPLAYED) {
-        $scope.blocks.pop();
-      }
-    $scope.blocks.unshift(block);
+    if ($scope.blocks.length === BLOCKS_DISPLAYED) {
+      $scope.blocks.pop();
+    }
+    getBlock(blockHash);
   });
 
   $scope.human_since = function(time) {
@@ -38,6 +56,7 @@ angular.module('insight.system').controller('IndexController',
       limit: BLOCKS_DISPLAYED
     }, function(res) {
       $scope.blocks = res.blocks;
+      $scope.blocksLength = res.lenght;
     });
 
     Transactions.get({
diff --git a/public/views/blocks/list.html b/public/views/blocks/list.html
index abdcf856..40b90fc7 100644
--- a/public/views/blocks/list.html
+++ b/public/views/blocks/list.html
@@ -11,33 +11,47 @@
         <p class="lead text-center m20v">{{pagination.current}}</p>
 
         <div class="m50v">
-          <a class="btn btn-default" href="#!/blocks-date/{{pagination.prev}}"><small>&larr; {{pagination.prev}}</small></a>
+          <a class="btn btn-primary" href="#!/blocks-date/{{pagination.prev}}"><small>&larr; {{pagination.prev}}</small></a>
           <a class="btn btn-primary" href="#!/blocks-date/{{pagination.next}}"><small>{{pagination.next}} &rarr;</small></a>
         </div>
       </div>
     </div>
 
-    <div class="col-md-8">
+    <div class="col-md-9">
       <div class="page-header">
         <h1>
           Blocks
           <small>by date</small>
         </h1>
       </div>
-      <table class="table" data-ng-show="blocks || blocks.length">
+      <table class="table table-hover">
         <thead>
           <tr>
-            <th>Hash</th>
-            <th>Solved at</th>
+            <th>Height</th>
+            <th>Timestamp</th>
+            <th>Transactions</th>
+            <th>Size</th>
+            <th>Confirmations</th>
           </tr>
         </thead>
         <tbody>
-        <tr data-ng-repeat="block in blocks">
-          <td><a href="#!/block/{{block.hash}}">{{block.hash}}</a></td>
-          <td>{{block.time * 1000 | date:'medium'}}</td>
+        <tr data-ng-show="!blocks.length"><td colspan="5">Waiting for blocks...</td></tr>
+        <tr class="fader" data-ng-repeat='b in blocks'>
+          <td>
+            <a href="/#!/block/{{b.hash}}">{{b.height}}</a>
+          </td>
+          <td>{{b.time * 1000 | date:'medium'}}</td>
+          <td>{{b.tx.length}}</td>
+          <td>{{b.size}}</td>
+          <td>{{b.confirmations}}</td>
         </tr>
         </tbody>
       </table>
+      <ul class="pager" data-ng-show="blocks.length">
+        <li class="previous"><a href="#!/blocks-date/{{pagination.prev}}">&larr; {{pagination.prev}}</a></li>
+        <li class="disabled"><a href="#">{{pagination.current}}</a></li>
+        <li class="next"><a href="#!/blocks-date/{{pagination.next}}">{{pagination.next}} &rarr;</a></li>
+      </ul>
     </div>
   </div>
   <h2 class="text-center text-muted" data-ng-hide="!blocks || blocks.length">No blocks yet.</h2>
diff --git a/public/views/header.html b/public/views/header.html
index baf6f772..b9f2a51c 100755
--- a/public/views/header.html
+++ b/public/views/header.html
@@ -35,7 +35,7 @@
             <strong> Conn: </strong> {{info.connections}} 
           </i>
           <i class="small">
-            <strong>Height:</strong> {{info.blocks}}
+            <strong>Height:</strong> {{totalBlocks || info.blocks}}
           </i>
         </span>
       </div>
diff --git a/public/views/index.html b/public/views/index.html
index 7ae3dda1..6a3fdf13 100644
--- a/public/views/index.html
+++ b/public/views/index.html
@@ -17,7 +17,7 @@
             </tr>
           </thead>
           <tbody>
-          <tr data-ng-show="!blocks.length"><td colspan="5">Loading...</td></tr>
+          <tr data-ng-show="!blocks.length"><td colspan="5">Waiting for blocks...</td></tr>
           <tr class="fader" data-ng-repeat='b in blocks'>
             <td>
               <a href="/#!/block/{{b.hash}}">{{b.height}}</a>
@@ -29,7 +29,6 @@
           </tr>
           </tbody>
         </table>
-
       </div>
 
       <div class="col-md-5">
@@ -45,7 +44,7 @@
             </tr>
           </thead>
           <tbody>
-          <tr data-ng-show="!txs.length"><td colspan="5">Loading...</td></tr>
+          <tr data-ng-show="!txs.length"><td colspan="5">Waiting for transactions...</td></tr>
           <tr class="fader" data-ng-repeat='tx in txs'>
             <td>
               <a class="ellipsis" href="/#!/tx/{{tx.txid}}">{{tx.txid}}</a>