Merge pull request #175 from colkito/feature/error-message-offline

added error message when the server is down, bitcoind is down or lost in...

app/views/includes/foot.jade

@@ -40,4 +40,5 @@ script(type='text/javascript', src='/js/controllers/address.js')
 script(type='text/javascript', src='/js/controllers/search.js')
 script(type='text/javascript', src='/js/controllers/status.js')
 script(type='text/javascript', src='/js/controllers/footer.js')
+script(type='text/javascript', src='/js/controllers/connection.js')
 script(type='text/javascript', src='/js/init.js')

app/views/index.jade

@@ -1,4 +1,11 @@
 extends layouts/default
 
 block content
+  .connection-status.container(data-ng-controller='ConnectionController')
+    .alert.alert-danger(data-ng-show='!serverOnline || !clienteOnline || !apiOnline', data-ng-init='getConnStatus()')
+        strong Error!
+        p(data-ng-show='!apiOnline') Can't connect to bitcoind.
+        p(data-ng-show='!serverOnline') Can't connect to server.
+        p(data-ng-show='!clienteOnline') Can't connect to internet. Please, check your connection.
+
   section.container(data-ng-view)

public/css/common.css

@@ -294,7 +294,7 @@ h1, h2, h3, h4, h5, h6, .h1, .h2, .h3, .h4, .h5, .h6 {
 -------------------------------------------------- */
 /* Not required for template or sticky footer method. */
 
-#wrap > .container { padding: 60px 15px 0; }
+#wrap > .container { padding: 0 15px; }
 
 .container .text-muted a { color: #eee; }
 
@@ -401,6 +401,9 @@ h1, h2, h3, h4, h5, h6, .h1, .h2, .h3, .h4, .h5, .h6 {
 .transaction-vin-vout .ellipsis { margin-bottom: 10px; }
 .transaction-vin-vout .btc-value { margin-left: 15px; }
 
+.connection-status { margin-top: 60px; }
+.page-header { margin-top: 0; }
+
 .block_hash {
   margin-left: 46px;
   text-align: center;

public/js/app.js

@@ -13,7 +13,8 @@ angular.module('insight',[
   'insight.transactions',
   'insight.address',
   'insight.search',
-  'insight.status'
+  'insight.status',
+  'insight.connection'
 ]);
 
 angular.module('insight.system', []);
@@ -23,3 +24,4 @@ angular.module('insight.transactions', []);
 angular.module('insight.address', []);
 angular.module('insight.search', []);
 angular.module('insight.status', []);
+angular.module('insight.connection', []);

public/js/controllers/connection.js

@@ -0,0 +1,50 @@
+'use strict';
+
+angular.module('insight.connection').controller('ConnectionController',
+function($scope, $window, Status, Sync, getSocket) {
+
+  // Set initial values
+  $scope.serverOnline = true;
+  $scope.clienteOnline = true;
+
+  var socket = getSocket($scope);
+
+  // Check for the node server connection
+  socket.on('disconnect', function() {
+    $scope.serverOnline = false;
+  });
+
+  socket.on('connect', function() {
+    $scope.serverOnline = true;
+  });
+
+  // Check for the  api connection
+  $scope.getConnStatus = function() {
+    Sync.get({},
+    function(sync) {
+      $scope.apiOnline = (sync.status !== 'aborted' && sync.status !== 'error') ? true : false;
+    },
+    function() {
+      $scope.apiOnline = false;
+    });
+  };
+
+  socket.emit('subscribe', 'sync');
+  socket.on('status', function(sync) {
+      $scope.apiOnline = (sync.status !== 'aborted' && sync.status !== 'error') ? true : false;
+  });
+
+  // Check for the client conneciton
+  $window.addEventListener('offline', function() {
+    $scope.$apply(function() {
+      $scope.clienteOnline = false;
+    });
+  }, true);
+
+  $window.addEventListener('online', function () {
+    $scope.$apply(function() {
+      $scope.clienteOnline = true;
+    });
+  }, true);
+
+});