diff --git a/src/js/directives/walletBalanceDirective.js b/src/js/directives/walletBalanceDirective.js new file mode 100644 index 000000000..a13d30a98 --- /dev/null +++ b/src/js/directives/walletBalanceDirective.js @@ -0,0 +1,98 @@ +'use strict'; + +(function(){ + + angular + .module('bitcoincom.directives') + .directive('walletBalance', function() { + return { + restrict: 'E', + scope: { + displayAsFiat: '@', + totalBalanceSat: '@', + wallet: '@' + }, + templateUrl: 'views/includes/wallet-balance.html', + controller: walletBalanceController + } + }); + + function walletBalanceController($log, $scope, $timeout, uxLanguage) { + console.log('walletBalanceController'); + var cryptoBalanceHasBeenDisplayed = false; + + formatBalance(); + $scope.$watchGroup(['displayAsFiat', 'totalBalanceSat'], function onWalletBalanceWatch() { + formatBalance(); + }); + + function displayCryptoBalance(wallet) { + console.log('displayCryptoBalance()'); + + if (wallet.status && wallet.status.totalBalanceStr) { + setDisplay(wallet.status.totalBalanceStr, ''); + cryptoBalanceHasBeenDisplayed = true; + return; + } + + if (wallet.cachedBalance) { + setDisplay(wallet.cachedBalance, wallet.cachedBalanceUpdatedOn); + return; + } + + if (wallet.cachedStatus && wallet.cachedStatus.totalBalanceStr) { + setDisplay(wallet.cachedStatus.totalBalanceStr, ''); + return; + } + + setDisplay('', ''); + } + + function displayFiatBalance(wallet) { + var displayAmount = ''; + if (wallet.status && wallet.status.alternativeBalanceAvailable) { + displayAmount = wallet.status.totalBalanceAlternative + ' ' + wallet.status.alternativeIsoCode; + setDisplay(displayAmount, ''); + return; + } + + if (wallet.cachedStatus && wallet.cachedStatus.alternativeBalanceAvailable) { + displayAmount = wallet.cachedStatus.totalBalanceAlternative + ' ' + wallet.cachedStatus.alternativeIsoCode; + setDisplay(displayAmount, ''); + return; + } + + getFiatBalance(wallet); + } + + function formatBalance() { + //console.log('formatBalance() with wallet:', $scope.wallet,); + console.log('formatBalance() with displayAsFiat: "' + $scope.displayAsFiat + '"'); + var wallet = null; + try { + wallet = JSON.parse($scope.wallet); + } catch (e) { + $log.error('Error parsing wallet to display balance.', e); + $scope.displayAmount = ''; + $scope.cachedBalanceUpdatedOn = ''; + } + + if (!$scope.displayAsFiat || $scope.displayAsFiat && !cryptoBalanceHasBeenDisplayed) { + displayCryptoBalance(wallet); + } + + if ($scope.displayAsFiat) { + displayFiatBalance(wallet); + } + } + + function getFiatBalance(wallet) { + } + + function setDisplay(amount, cachedBalanceUpdatedOn) { + $scope.displayAmount = amount; + $scope.cachedBalanceUpdatedOn = cachedBalanceUpdatedOn; + } + } +})(); + diff --git a/src/sass/buttons.scss b/src/sass/buttons.scss index 41ec3f674..df0ce8945 100644 --- a/src/sass/buttons.scss +++ b/src/sass/buttons.scss @@ -74,7 +74,7 @@ color: #FFF; } &-outline { - @include button-style(transparent, #FFFFFF, #FAFAFA, #FFF, #FFFFFF); + @include button-style(transparent, #FFFFFF, #FFFFFF, #FFFFFF, #FFFFFF); @include button-outline(#FFFFFF); background: none; box-shadow: none; diff --git a/src/sass/components/components.scss b/src/sass/components/components.scss index fb53508b0..4d2bd695e 100644 --- a/src/sass/components/components.scss +++ b/src/sass/components/components.scss @@ -9,3 +9,4 @@ @import "expand-content"; @import "fee-summary"; @import "formatted-amount"; +@import "wallet-balance"; diff --git a/src/sass/components/wallet-balance.scss b/src/sass/components/wallet-balance.scss new file mode 100644 index 000000000..faf4e8611 --- /dev/null +++ b/src/sass/components/wallet-balance.scss @@ -0,0 +1,3 @@ +.wallet-balance-directive { + display: inline-block; +} \ No newline at end of file diff --git a/www/views/includes/wallet-balance.html b/www/views/includes/wallet-balance.html new file mode 100644 index 000000000..03baa8cac --- /dev/null +++ b/www/views/includes/wallet-balance.html @@ -0,0 +1,3 @@ +