From 872cfaba682ecbceb9b0e18a7d375e93b4eb3671 Mon Sep 17 00:00:00 2001 From: Gustavo Cortez Date: Thu, 24 Apr 2014 22:43:19 -0300 Subject: [PATCH] Added spinner to all buttons --- css/main.css | 4 ++++ img/loading.gif | Bin 0 -> 529 bytes index.html | 22 +++++++++++----------- js/controllers/addresses.js | 2 ++ js/controllers/send.js | 19 ++++++++++++------- js/controllers/signin.js | 1 + js/controllers/transactions.js | 5 +++++ js/directives.js | 17 +++++++++++++++++ 8 files changed, 52 insertions(+), 18 deletions(-) create mode 100644 img/loading.gif diff --git a/css/main.css b/css/main.css index 6ab5b4587..b94ef5b83 100644 --- a/css/main.css +++ b/css/main.css @@ -248,6 +248,10 @@ button.secondary { background-color: #FAE448 !important; } button.primary:hover { background-color: #333;} button.secondary:hover { background-color: #FFDF00 !important;} +[ng\:cloak], [ng-cloak], [data-ng-cloak], [x-ng-cloak], .ng-cloak, .x-ng-cloak { + display: none !important; +} +.dn {display: none;} .text-gray { color: #999 !important;} .pr {position: relative;} .m0 {margin: 0;} diff --git a/img/loading.gif b/img/loading.gif new file mode 100644 index 0000000000000000000000000000000000000000..c14d37553e505f4f01749f4f5635d7e10cb0298e GIT binary patch literal 529 zcmZ?wbhEHb6krfw_{6~Q|Nnmm28Kh24mCA30U27f_WB$Ow?(49wCTyNpbdJYSxe zeIv`}_0t~a#+1x?8LQUiyxzr$O}z}qt~-256BOkpr`($QJ8Z@`*Wj;n!Rq(rGvU(k zFQC)0t)pvF*TH{tk0l0|mO?aSV$}e2(Vc$=r%oPGa6aSx;mrd!zR9hbAs`p|VRaEy zz31w+KxZveyUo&f&%)>Cwb-23T3FRfLCp7Dz1QNkCY$7;CxZ7~<~_13kh`IR&HXUt zuSJ@942>^dRxf*0kUD$mx}4isl|x+PW_UtCC?v`F|IKTjQ(9BO-ra=NHTc8R8Wd4r F000zFq_F@1 literal 0 HcmV?d00001 diff --git a/index.html b/index.html index 5da820527..47dae5ca9 100644 --- a/index.html +++ b/index.html @@ -93,7 +93,7 @@ -
+
@@ -110,7 +110,7 @@

Create a New Wallet

- +
@@ -125,7 +125,7 @@
+ ng-click="open(selectedWalletId)" ng-disabled="loading" loading="Opening">Open
@@ -139,7 +139,7 @@
+ ng-click="join(connectionId)" ng-disabled="loading" loading="Joining">Join
@@ -148,7 +148,7 @@
- Create a new wallet + Create a new wallet
Import from file
@@ -245,7 +245,7 @@

Create a New Address

- +
@@ -316,10 +316,10 @@ Signed by you already
- -
@@ -331,7 +331,7 @@ Transaction ready. - @@ -443,8 +443,8 @@
-
-
diff --git a/js/controllers/addresses.js b/js/controllers/addresses.js index af3a7ee01..6b2ee0e3c 100644 --- a/js/controllers/addresses.js +++ b/js/controllers/addresses.js @@ -16,12 +16,14 @@ angular.module('copay.addresses').controller('AddressesController', $scope.isMain = isMain; $scope.addrs = Object.keys(balanceByAddr); $scope.selectedAddr = $scope.addrs[0]; + $scope.loading = false; $rootScope.$digest(); } }); }; $scope.newAddr = function() { + $scope.loading = true; w.generateAddress(); _updateBalance(); }; diff --git a/js/controllers/send.js b/js/controllers/send.js index 820a42f85..bdad886a8 100644 --- a/js/controllers/send.js +++ b/js/controllers/send.js @@ -3,6 +3,7 @@ angular.module('copay.send').controller('SendController', function($scope, $rootScope, $location) { $scope.title = 'Send'; + $scope.loading = false; $scope.unitIds = ['BTC','mBTC']; $scope.selectedUnit = $scope.unitIds[0]; @@ -13,20 +14,24 @@ angular.module('copay.send').controller('SendController', return; } + $scope.loading = true; + var address = form.address.$modelValue; var amount = (form.amount.$modelValue * 100000000).toString(); // satoshi to string var w = $rootScope.wallet; w.createTx( address, amount,function() { - // reset fields - $scope.address = null; - $scope.amount = null; - form.address.$pristine = true; - form.amount.$pristine = true; + $scope.loading = false; $rootScope.flashMessage = { message: 'The transaction proposal has been created', type: 'success'}; $rootScope.$digest(); }); - - }; + + // reset fields + $scope.address = null; + $scope.amount = null; + form.address.$pristine = true; + form.amount.$pristine = true; + + }; }); diff --git a/js/controllers/signin.js b/js/controllers/signin.js index 0a0c80070..e2a8a1790 100644 --- a/js/controllers/signin.js +++ b/js/controllers/signin.js @@ -7,6 +7,7 @@ angular.module('copay.signin').controller('SigninController', $scope.selectedWalletId = $scope.wallets.length ? $scope.wallets[0].id : null; $scope.create = function() { + $scope.loading = true; $location.path('setup'); }; diff --git a/js/controllers/transactions.js b/js/controllers/transactions.js index fed674948..c34221bfd 100644 --- a/js/controllers/transactions.js +++ b/js/controllers/transactions.js @@ -5,6 +5,7 @@ angular.module('copay.transactions').controller('TransactionsController', var bitcore = require('bitcore'); $scope.title = 'Transactions'; + $scope.loading = false; var _updateTxs = function() { var w =$rootScope.wallet; if (!w) return; @@ -34,9 +35,11 @@ angular.module('copay.transactions').controller('TransactionsController', $scope.txs = txs; w.removeListener('txProposalsUpdated',_updateTxs) w.once('txProposalsUpdated',_updateTxs); + $scope.loading = false; }; $scope.send = function (ntxid) { + $scope.loading = true; var w = $rootScope.wallet; w.sendTx(ntxid, function(txid) { console.log('[transactions.js.68:txid:] SENTTX CALLBACK',txid); //TODO @@ -50,6 +53,7 @@ angular.module('copay.transactions').controller('TransactionsController', }; $scope.sign = function (ntxid) { + $scope.loading = true; var w = $rootScope.wallet; var ret = w.sign(ntxid); @@ -84,6 +88,7 @@ angular.module('copay.transactions').controller('TransactionsController', }; $scope.reject = function (ntxid) { + $scope.loading = true; var w = $rootScope.wallet; w.reject(ntxid); $rootScope.flashMessage = {type:'warning', message: 'Transaction rejected by you'}; diff --git a/js/directives.js b/js/directives.js index 991ed318f..9dd48091c 100644 --- a/js/directives.js +++ b/js/directives.js @@ -58,5 +58,22 @@ angular.module('copay.directives') } }; }]) + .directive('loading', function () { + return { + restrict: 'A', + link: function (scope, element, attr) { + var a = element.html(); + var text = attr.loading; + scope.$watch('loading', function (val) { + if (val) { + element.html(' ' + text + '...' ); + } + else { + element.html(a); + } + }); + } + } + }) ;