Merge pull request #773 from maraoz/ui/unify-notifications

Unify notification systems

index.html

@@ -91,15 +91,6 @@
         </div>
       </div>
 
-      <div class="row" ng-if='$root.$flashMessage.message' notification>
-        <div class="small-8 large-centered columns">
-          <div data-alert class="alert-box radius {{$root.$flashMessage.type}}">
-            {{$root.$flashMessage.message}}
-            <a ng-click="clearFlashMessage()" class="close">&times;</a>
-          </div>
-        </div>
-      </div>
-
       <div ng-if='$root.wallet && !$root.wallet.isReady() && !loading'>
         <div class="row">
           <div class="large-12 medium-12 small-12 columns">

js/controllers/header.js

@@ -51,10 +51,7 @@ angular.module('copayApp.controllers').controller('HeaderController',
 
     $rootScope.$watch('insightError', function(status) {
       if (status === -1) {
-        $rootScope.$flashMessage = {
+        notification.success('Networking restored', 'Connection to insight restored');
-          type: 'success',
-          message: 'Networking Restored :)',
-        };
         $rootScope.insightError = 0;
       }
     });
@@ -98,7 +95,6 @@ angular.module('copayApp.controllers').controller('HeaderController',
 
     $scope.signout = function() {
       logout();
-      $scope.clearFlashMessage();
     };
 
     $scope.refresh = function() {
@@ -111,10 +107,6 @@ angular.module('copayApp.controllers').controller('HeaderController',
       }
     };
 
-    $scope.clearFlashMessage = function() {
-      $rootScope.$flashMessage = {};
-    };
-
     $rootScope.isCollapsed = true;
 
     $scope.toggleCollapse = function() {

js/controllers/import.js

@@ -1,7 +1,7 @@
 'use strict';
 
 angular.module('copayApp.controllers').controller('ImportController',
-  function($scope, $rootScope, walletFactory, controllerUtils, Passphrase) {
+  function($scope, $rootScope, walletFactory, controllerUtils, Passphrase, notification) {
     $scope.title = 'Import a backup';
     $scope.importStatus = 'Importing wallet - Reading backup...';
 
@@ -18,10 +18,7 @@ angular.module('copayApp.controllers').controller('ImportController',
         var w = walletFactory.import(encryptedObj, passphrase, function(err, w) {
           if (err) {
             $scope.loading = false;
-            $rootScope.$flashMessage = {
+            notification.error('Error', err.errMsg || 'Wrong password');
-              message: err.errMsg || 'Wrong password',
-              type: 'error'
-            };
             $rootScope.$digest();
             return;
           }
@@ -59,10 +56,7 @@ angular.module('copayApp.controllers').controller('ImportController',
     $scope.import = function(form) {
       if (form.$invalid) {
         $scope.loading = false;
-        $rootScope.$flashMessage = {
+        notification.error('Error', 'There is an error in the form.');
-          message: 'There is an error in the form. Please, try again',
-          type: 'error'
-        };
         return;
       }
 
@@ -72,10 +66,7 @@ angular.module('copayApp.controllers').controller('ImportController',
 
       if (!backupFile && !backupText) {
         $scope.loading = false;
-        $rootScope.$flashMessage = {
+        notification.error('Error', 'Please, select your backup file or paste the file contents');
-          message: 'Please, select your backup file or paste the text',
-          type: 'error'
-        };
         $scope.loading = false;
         return;
       }

js/controllers/send.js

@@ -2,7 +2,7 @@
 var bitcore = require('bitcore');
 
 angular.module('copayApp.controllers').controller('SendController',
-  function($scope, $rootScope, $window, $location, $timeout, $anchorScroll, $modal, isMobile) {
+  function($scope, $rootScope, $window, $location, $timeout, $anchorScroll, $modal, isMobile, notification) {
     $scope.title = 'Send';
     $scope.loading = false;
     var satToUnit = 1 / config.unitToSatoshi;
@@ -32,10 +32,8 @@ angular.module('copayApp.controllers').controller('SendController',
 
     $scope.submitForm = function(form) {
       if (form.$invalid) {
-        $rootScope.$flashMessage = {
+        var message = 'Unable to send transaction proposal.';
-          message: 'Unable to send a transaction proposal. Please, try again',
+        notification.error('Error', message);
-          type: 'error'
-        };
         return;
       }
 
@@ -50,20 +48,16 @@ angular.module('copayApp.controllers').controller('SendController',
       w.createTx(address, amount, commentText, function(ntxid) {
         if (w.totalCopayers > 1) {
           $scope.loading = false;
-          $rootScope.$flashMessage = {
+          var message = 'The transaction proposal has been created';
-            message: 'The transaction proposal has been created',
+          notification.success('Success!', message);
-            type: 'success'
-          };
           $rootScope.$digest();
         } else {
           w.sendTx(ntxid, function(txid) {
-            $rootScope.$flashMessage = txid ? {
+            if (txid) {
-              type: 'success',
+              notification.success('Transaction broadcast', 'Transaction id: ' + txid);
-              message: 'Transaction broadcasted. txid: ' + txid
+            } else {
-            } : {
+              notification.error('Error', 'There was an error sending the transaction.');
-              type: 'error',
+            }
-              message: 'There was an error sending the Transaction'
-            };
             $scope.loading = false;
           });
         }
@@ -202,10 +196,11 @@ angular.module('copayApp.controllers').controller('SendController',
           errorMsg = e.message;
         }
 
-        $rootScope.$flashMessage = {
+        if (errorMsg) {
-          message: errorMsg ? errorMsg : 'Entry removed successful',
+          notification.error('Error', errorMsg);
-          type: errorMsg ? 'error' : 'success'
+        } else {
-        };
+          notification.success('Success', 'Entry removed successfully');
+        }
         $rootScope.$digest();
       }, 500);
     };
@@ -223,10 +218,7 @@ angular.module('copayApp.controllers').controller('SendController',
 
           $scope.submitAddressBook = function(form) {
             if (form.$invalid) {
-              $rootScope.$flashMessage = {
+              notification.error('Form Error', 'Please complete required fields');
-                message: 'Complete required fields, please',
-                type: 'error'
-              };
               return;
             }
             var entry = {
@@ -255,10 +247,11 @@ angular.module('copayApp.controllers').controller('SendController',
             errorMsg = e.message;
           }
 
-          $rootScope.$flashMessage = {
+          if (errorMsg) {
-            message: errorMsg ? errorMsg : 'New entry has been created',
+            notification.error('Error', errorMsg);
-            type: errorMsg ? 'error' : 'success'
+          } else {
-          };
+            notification.success('Success', 'New entry has been created');
+          }
           $rootScope.$digest();
         }, 500);
         $anchorScroll();

js/controllers/setup.js

@@ -33,7 +33,7 @@ var valid_pairs = {
 };
 
 angular.module('copayApp.controllers').controller('SetupController',
-  function($scope, $rootScope, $location, $timeout, walletFactory, controllerUtils, Passphrase) {
+  function($scope, $rootScope, $location, $timeout, walletFactory, controllerUtils, Passphrase, backupService, notification) {
 
     $rootScope.videoInfo = {};
     $scope.loading = false;
@@ -68,10 +68,7 @@ angular.module('copayApp.controllers').controller('SetupController',
 
     $scope.create = function(form) {
       if (form && form.$invalid) {
-        $rootScope.$flashMessage = {
+        notification.error('Error', 'Please enter the required fields');
-          message: 'Please, enter required fields',
-          type: 'error'
-        };
         return;
       }
       $scope.loading = true;

js/controllers/signin.js

@@ -1,7 +1,7 @@
 'use strict';
 
 angular.module('copayApp.controllers').controller('SigninController',
-  function($scope, $rootScope, $location, walletFactory, controllerUtils, Passphrase) {
+  function($scope, $rootScope, $location, walletFactory, controllerUtils, Passphrase, backupService, notification) {
     var cmp = function(o1, o2) {
       var v1 = o1.show.toLowerCase(),
         v2 = o2.show.toLowerCase();
@@ -15,10 +15,7 @@ angular.module('copayApp.controllers').controller('SigninController',
 
     $scope.open = function(form) {
       if (form && form.$invalid) {
-        $rootScope.$flashMessage = {
+        notification.error('Error', 'Please enter the required fields');
-          message: 'Please, enter required fields',
-          type: 'error'
-        };
         return;
       }
 
@@ -36,10 +33,7 @@ angular.module('copayApp.controllers').controller('SigninController',
         };
         if (!w) {
           $scope.loading = false;
-          $rootScope.$flashMessage = {
+          notification.error('Error', errMsg || 'Wrong password');
-            message: errMsg || 'Wrong password',
-            type: 'error'
-          };
           $rootScope.$digest();
           return;
         }
@@ -49,10 +43,7 @@ angular.module('copayApp.controllers').controller('SigninController',
 
     $scope.join = function(form) {
       if (form && form.$invalid) {
-        $rootScope.$flashMessage = {
+        notification.error('Error', 'Please enter the required fields');
-          message: 'Please, enter required fields',
-          type: 'error'
-        };
         return;
       }
 
@@ -64,29 +55,15 @@ angular.module('copayApp.controllers').controller('SigninController',
           $scope.loading = false;
           if (err || !w) {
             if (err === 'joinError')
-              $rootScope.$flashMessage = {
+              notification.error('Can\'t find peer.');
-                message: 'Can\'t find peer'
-              };
             else if (err === 'walletFull')
-              $rootScope.$flashMessage = {
+              notification.error('The wallet is full');
-                message: 'The wallet is full',
-                type: 'error'
-              };
             else if (err === 'badNetwork')
-              $rootScope.$flashMessage = {
+              notification.error('Network Error', 'The wallet your are trying to join uses a different Bitcoin Network. Check your settings.');
-                message: 'The wallet your are trying to join uses a different Bitcoin Network. Check your settings.',
-                type: 'error'
-              };
             else if (err === 'badSecret')
-              $rootScope.$flashMessage = {
+              notification.error('Bad secret', 'The secret string you entered is invalid');
-                message: 'Bad secret secret string',
-                type: 'error'
-              };
             else
-              $rootScope.$flashMessage = {
+              notification.error('Unknown error');
-                message: 'Unknown error',
-                type: 'error'
-              };
             controllerUtils.onErrorDigest();
           } else {
             controllerUtils.startNetwork(w, $scope);

js/controllers/transactions.js

@@ -2,7 +2,7 @@
 var bitcore = require('bitcore');
 
 angular.module('copayApp.controllers').controller('TransactionsController',
-  function($scope, $rootScope, $timeout, controllerUtils) {
+  function($scope, $rootScope, $timeout, controllerUtils, notification) {
 
     $scope.title = 'Transactions';
     $scope.loading = false;
@@ -107,13 +107,11 @@ angular.module('copayApp.controllers').controller('TransactionsController',
       $rootScope.txAlertCount = 0;
       var w = $rootScope.wallet;
       w.sendTx(ntxid, function(txid) {
-        $rootScope.$flashMessage = txid ? {
+        if (!txid) {
-          type: 'success',
+          notification.error('Error', 'There was an error sending the transaction');
-          message: 'Transaction broadcasted. txid: ' + txid
+        } else {
-        } : {
+          notification.success('Transaction broadcast', 'Transaction id: '+txid);
-          type: 'error',
+        }
-          message: 'There was an error sending the Transaction'
-        };
         if (cb) return cb();
         else $scope.update();
       });
@@ -124,10 +122,7 @@ angular.module('copayApp.controllers').controller('TransactionsController',
       var w = $rootScope.wallet;
       w.sign(ntxid, function(ret) {
         if (!ret) {
-          $rootScope.$flashMessage = {
+          notification.error('Error', 'There was an error signing the transaction');
-            type: 'error',
-            message: 'There was an error signing the Transaction',
-          };
           $scope.update();
         } else {
           var p = w.txProposals.getTxProposal(ntxid);
@@ -180,10 +175,7 @@ angular.module('copayApp.controllers').controller('TransactionsController',
       $rootScope.txAlertCount = 0;
       var w = $rootScope.wallet;
       w.reject(ntxid);
-      $rootScope.$flashMessage = {
+      notification.warning('Transaction rejected', 'You rejected the transaction successfully');
-        type: 'warning',
-        message: 'Transaction rejected by you'
-      };
       $scope.loading = false;
     };
 

js/directives.js

@@ -30,7 +30,6 @@ angular.module('copayApp.directives')
         link: function(scope, element, attrs, ctrl) {
           setTimeout(function() {
             scope.$apply(function() {
-              $rootScope.$flashMessage = {};
             });
           }, 5000);
         }

js/services/controllerUtils.js

@@ -36,35 +36,27 @@ angular.module('copayApp.services')
 
     root.onErrorDigest = function(scope, msg) {
       root.onError(scope);
-      if (msg) $rootScope.$flashMessage = {
+      if (msg) {
-        type: 'error',
+        notification.error('Error', msg);
-        message: msg
+      }
-      };
       $rootScope.$digest();
     };
 
     root.installStartupHandlers = function(wallet, $scope) {
       wallet.on('serverError', function(msg) {
-        $rootScope.$flashMessage = {
+        notification.error('PeerJS Error', 'There was an error connecting to the PeerJS server.'
-          message: 'There was an error connecting to the PeerJS server.' + (msg || 'Check you settings and Internet connection.'),
+          + (msg || 'Check you settings and Internet connection.'));
-          type: 'error',
-        };
         root.onErrorDigest($scope);
         $location.path('addresses');
       });
       wallet.on('connectionError', function() {
-        var message = "Looks like you are already connected to this wallet, please logout from it and try importing it again.";
+        var message = "Looks like you are already connected to this wallet, please logout and try importing it again.";
-        $rootScope.$flashMessage = {
+        notification.error('PeerJS Error', message);
-          message: message,
-          type: 'error'
-        };
         root.onErrorDigest($scope);
       });
       wallet.on('serverError', function() {
-        $rootScope.$flashMessage = {
+        var message = 'The PeerJS server is not responding, please try again';
-          message: 'The PeerJS server is not responding, please try again',
+        notification.error('PeerJS Error', message);
-          type: 'error'
-        };
         root.onErrorDigest($scope);
       });
       wallet.on('ready', function() {
@@ -79,10 +71,7 @@ angular.module('copayApp.services')
       $rootScope.isCollapsed = true;
       $rootScope.$watch('insightError', function(status) {
         if (status === -1) {
-          $rootScope.$flashMessage = {
+          notification.success('Networking restored', 'Connection to Insight re-established');
-            type: 'success',
-            message: 'Networking Restored :)',
-          };
           $rootScope.insightError = 0;
         }
       });
@@ -117,10 +106,7 @@ angular.module('copayApp.services')
       notification.enableHtml5Mode(); // for chrome: if support, enable it
 
       w.on('badMessage', function(peerId) {
-        $rootScope.$flashMessage = {
+        notification.error('Error', 'Received wrong message from peer ' + peerId);
-          type: 'error',
-          message: 'Received wrong message from peer id:' + peerId
-        };
       });
       w.on('ready', function(myPeerID) {
         $rootScope.wallet = w;

js/services/notifications.js

@@ -21,7 +21,7 @@ factory('notification', ['$timeout',
         enabled: true
       },
       error: {
-        duration: 1e10,
+        duration: 5000,
         enabled: true
       },
       success: {

test/unit/controllers/controllersSpec.js

@@ -12,6 +12,9 @@ saveAs = function(o) {
 
 
 describe("Unit: Controllers", function() {
+  var invalidForm = {
+    $invalid: true
+  };
 
   var scope;
 
@@ -73,6 +76,11 @@ describe("Unit: Controllers", function() {
         expect(array.length).equal(n);
       });
     });
+    describe('#create', function() {
+      it('should work with invalid form', function() {
+        scope.create(invalidForm);
+      });
+    });
 
   });
 
@@ -321,4 +329,42 @@ describe("Unit: Controllers", function() {
     });
   });
 
+  describe('Import Controller', function() {
+    var what;
+    beforeEach(inject(function($controller, $rootScope) {
+      scope = $rootScope.$new();
+      what = $controller('ImportController', {
+        $scope: scope,
+      });
+    }));
+
+    it('should exist', function() {
+      should.exist(what);
+    });
+  });
+
+  describe('Signin Controller', function() {
+    var what;
+    beforeEach(inject(function($controller, $rootScope) {
+      scope = $rootScope.$new();
+      what = $controller('SigninController', {
+        $scope: scope,
+      });
+    }));
+
+    it('should exist', function() {
+      should.exist(what);
+    });
+    describe('#open', function() {
+      it('should work with invalid form', function() {
+        scope.open(invalidForm);
+      });
+    });
+    describe('#join', function() {
+      it('should work with invalid form', function() {
+        scope.join(invalidForm);
+      });
+    });
+  });
+
 });