From 18e00e5fcadbb6243b3c00bf87e57f5f0bb56240 Mon Sep 17 00:00:00 2001 From: Sam Cheng Hung Date: Wed, 1 Aug 2018 16:59:13 +0800 Subject: [PATCH 1/9] Renames amount directive to formatted-amount, fixes formatting for crypto --- src/js/directives/amount.js | 92 ------------------ src/js/directives/formattedAmount.js | 96 +++++++++++++++++++ .../{amount.html => formatted-amount.html} | 0 3 files changed, 96 insertions(+), 92 deletions(-) delete mode 100644 src/js/directives/amount.js create mode 100644 src/js/directives/formattedAmount.js rename www/views/includes/{amount.html => formatted-amount.html} (100%) diff --git a/src/js/directives/amount.js b/src/js/directives/amount.js deleted file mode 100644 index 9622ca09d..000000000 --- a/src/js/directives/amount.js +++ /dev/null @@ -1,92 +0,0 @@ -'use strict'; - -/** - * @desc amount directive that can be used to display formatted financial values - * size-equal attribute is optional, defaults to false. - * @example fee = { - * value: 12.49382901, - * currency: 'BCH' - * } - * @example - * @example - */ -angular.module('bitcoincom.directives') - .directive('amount', [ - '$timeout', - function($timeout) { - return { - restrict: 'E', - scope: { - value: '=', - currency: '=', - sizeEqual: '=' - }, - templateUrl: 'views/includes/amount.html', - controller: ['$scope', function($scope) { - $scope.displaySizeEqual = typeof $scope.sizeEqual == 'undefined' ? false : true; - - var decimalPlaces = { - '0': ['BIF', 'CLP', 'DJF', 'GNF', 'ILS', 'JPY', 'KMF', 'KRW', 'MGA', 'PYG', 'RWF', 'UGX', 'VND', 'VUV', 'XAF', 'XOF', 'XPF'], - '3': ['BHD', 'IQD', 'JOD', 'KWD', 'OMR', 'TND'], - '8': ['BCH', 'BTC'] - }; - - var numberWithCommas = function(x) { - return parseFloat(x).toLocaleString(); - }; - - var buildAmount = function(start, middle, end) { - $scope.start = start; - $scope.middle = middle; - $scope.end = end; - }; - - var getDecimalPlaces = function(currency) { - if (decimalPlaces['0'].indexOf($scope.currency.toUpperCase()) > -1) return '0'; - if (decimalPlaces['3'].indexOf($scope.currency.toUpperCase()) > -1) return '3'; - if (decimalPlaces['8'].indexOf($scope.currency.toUpperCase()) > -1) return '8'; - return '2'; - }; - - var formatNumbers = function(currency, value) { - switch (getDecimalPlaces(currency)) { - case '0': - var valueFormatted = numberWithCommas(Math.round(parseFloat(value))); - buildAmount(valueFormatted, '', ''); - break; - - case '2': - var valueProcessing = parseFloat(parseFloat(value).toFixed(2)); - var valueFormatted = numberWithCommas(valueProcessing); - buildAmount(valueFormatted, '', ''); - break; - - case '3': - var valueProcessing = parseFloat(parseFloat(value).toFixed(3)); - var valueFormatted = numberWithCommas(valueProcessing); - buildAmount(valueFormatted, '', ''); - break; - - case '8': - var valueFormatted = parseFloat(value).toFixed(8); - if (parseFloat(value) == 0) { - buildAmount('0', '', ''); - } else { - buildAmount(valueFormatted, '', ''); - var start = numberWithCommas(valueFormatted.slice(0, -5)); - var middle = valueFormatted.slice(-5, -2); - var end = valueFormatted.substr(valueFormatted.length - 2); - buildAmount(start, middle, end); - } - break; - } - } - - formatNumbers($scope.currency, $scope.value); - $scope.$watchGroup(['currency', 'value'], function() { - formatNumbers($scope.currency, $scope.value); - }); - }] - }; - } -]); \ No newline at end of file diff --git a/src/js/directives/formattedAmount.js b/src/js/directives/formattedAmount.js new file mode 100644 index 000000000..ac74afd2b --- /dev/null +++ b/src/js/directives/formattedAmount.js @@ -0,0 +1,96 @@ +'use strict'; + +/** + * @desc amount directive that can be used to display formatted financial values + * size-equal attribute is optional, defaults to false. + * @example fee = { + * value: 12.49382901, + * currency: 'BCH' + * } + * @example + * @example + */ +angular.module('bitcoincom.directives') + .directive('formattedAmount', function(configService, uxLanguage) { + return { + restrict: 'E', + scope: { + value: '=', + currency: '=', + sizeEqual: '=' + }, + templateUrl: 'views/includes/formatted-amount.html', + controller: function($scope, $timeout) { + $scope.displaySizeEqual = !!$scope.sizeEqual; + + configService.whenAvailable(function(config) { + $timeout(function() { + var decimalPlaces = { + '0': ['BIF', 'CLP', 'DJF', 'GNF', 'ILS', 'JPY', 'KMF', 'KRW', 'MGA', 'PYG', 'RWF', 'UGX', 'VND', 'VUV', 'XAF', 'XOF', 'XPF'], + '3': ['BHD', 'IQD', 'JOD', 'KWD', 'OMR', 'TND'], + '8': ['BCH', 'BTC'] + }; + var localizeNumbers = function(x, minimumFractionDigits = 0, useGrouping = true) { + return parseFloat(x).toLocaleString(uxLanguage.getCurrentLanguage(), { + minimumFractionDigits: minimumFractionDigits, + useGrouping: useGrouping + }); + }; + + var buildAmount = function(start, middle, end) { + $scope.start = start; + $scope.middle = middle; + $scope.end = end; + }; + + var getDecimalPlaces = function(currency) { + if (decimalPlaces['0'].indexOf($scope.currency.toUpperCase()) > -1) return '0'; + if (decimalPlaces['3'].indexOf($scope.currency.toUpperCase()) > -1) return '3'; + if (decimalPlaces['8'].indexOf($scope.currency.toUpperCase()) > -1) return '8'; + return '2'; + }; + + var formatNumbers = function(currency, value) { + switch (getDecimalPlaces(currency)) { + case '0': + var valueFormatted = localizeNumbers(Math.round(parseFloat(value))); + buildAmount(valueFormatted, '', ''); + break; + + case '3': + var valueProcessing = parseFloat(parseFloat(value).toFixed(3)); + var valueFormatted = localizeNumbers(valueProcessing); + buildAmount(valueFormatted, '', ''); + break; + + case '8': + var valueFormatted = parseFloat(value).toFixed(8); + if (parseFloat(value) == 0) { + buildAmount('0', '', ''); + } else { + var valueFormatted = localizeNumbers(valueFormatted, 8); + var start = valueFormatted.slice(0, -5); + var middle = valueFormatted.slice(-5, -2); + var end = valueFormatted.substr(valueFormatted.length - 2); + buildAmount(start, middle, end); + } + break; + + default: + var valueProcessing = parseFloat(parseFloat(value).toFixed(2)); + var valueFormatted = localizeNumbers(valueProcessing); + buildAmount(valueFormatted, '', ''); + break; + } + } + + formatNumbers($scope.currency, $scope.value); + $scope.$watchGroup(['currency', 'value'], function() { + formatNumbers($scope.currency, $scope.value); + }); + }); + }); + } + }; + } +); \ No newline at end of file diff --git a/www/views/includes/amount.html b/www/views/includes/formatted-amount.html similarity index 100% rename from www/views/includes/amount.html rename to www/views/includes/formatted-amount.html From 9f418583abd989dfbc98452cbdc46cfb036e1494 Mon Sep 17 00:00:00 2001 From: Sebastiaan Pasma Date: Tue, 7 Aug 2018 16:11:47 +0200 Subject: [PATCH 2/9] formatted amount controller update + css + renames + included in views --- src/js/directives/formattedAmount.js | 29 +++++++++++++------ src/sass/components/components.scss | 2 +- .../{amount.scss => formatted-amount.scss} | 4 ++- www/views/amount.html | 12 ++++---- www/views/includes/formatted-amount.html | 2 +- www/views/includes/walletHistory.html | 5 ++-- www/views/includes/walletList.html | 8 +++-- www/views/tx-details.html | 8 ++--- www/views/walletDetails.html | 27 ++++++++--------- 9 files changed, 58 insertions(+), 39 deletions(-) rename src/sass/components/{amount.scss => formatted-amount.scss} (89%) diff --git a/src/js/directives/formattedAmount.js b/src/js/directives/formattedAmount.js index ac74afd2b..3c787521a 100644 --- a/src/js/directives/formattedAmount.js +++ b/src/js/directives/formattedAmount.js @@ -15,16 +15,27 @@ angular.module('bitcoincom.directives') return { restrict: 'E', scope: { - value: '=', - currency: '=', - sizeEqual: '=' + value: '@', + currency: '@', + sizeEqual: '@' }, templateUrl: 'views/includes/formatted-amount.html', controller: function($scope, $timeout) { + if (!$scope.currency && $scope.value) { // If there is no currency available.. + // Try to extract currency from value.. + var currencySplit = $scope.value.split(" "); + if (currencySplit.length === 2) { + $scope.value = currencySplit[0]; + $scope.currency = currencySplit[1]; + } + } + $scope.displaySizeEqual = !!$scope.sizeEqual; configService.whenAvailable(function(config) { + console.log("WAIT!!"); $timeout(function() { + console.log("FIRED!!"); var decimalPlaces = { '0': ['BIF', 'CLP', 'DJF', 'GNF', 'ILS', 'JPY', 'KMF', 'KRW', 'MGA', 'PYG', 'RWF', 'UGX', 'VND', 'VUV', 'XAF', 'XOF', 'XPF'], '3': ['BHD', 'IQD', 'JOD', 'KWD', 'OMR', 'TND'], @@ -44,9 +55,9 @@ angular.module('bitcoincom.directives') }; var getDecimalPlaces = function(currency) { - if (decimalPlaces['0'].indexOf($scope.currency.toUpperCase()) > -1) return '0'; - if (decimalPlaces['3'].indexOf($scope.currency.toUpperCase()) > -1) return '3'; - if (decimalPlaces['8'].indexOf($scope.currency.toUpperCase()) > -1) return '8'; + if (decimalPlaces['0'].indexOf(currency.toUpperCase()) > -1) return '0'; + if (decimalPlaces['3'].indexOf(currency.toUpperCase()) > -1) return '3'; + if (decimalPlaces['8'].indexOf(currency.toUpperCase()) > -1) return '8'; return '2'; }; @@ -59,7 +70,7 @@ angular.module('bitcoincom.directives') case '3': var valueProcessing = parseFloat(parseFloat(value).toFixed(3)); - var valueFormatted = localizeNumbers(valueProcessing); + var valueFormatted = localizeNumbers(valueProcessing, 3); buildAmount(valueFormatted, '', ''); break; @@ -78,11 +89,11 @@ angular.module('bitcoincom.directives') default: var valueProcessing = parseFloat(parseFloat(value).toFixed(2)); - var valueFormatted = localizeNumbers(valueProcessing); + var valueFormatted = localizeNumbers(valueProcessing, 2); buildAmount(valueFormatted, '', ''); break; } - } + }; formatNumbers($scope.currency, $scope.value); $scope.$watchGroup(['currency', 'value'], function() { diff --git a/src/sass/components/components.scss b/src/sass/components/components.scss index 0af55e5be..fb53508b0 100644 --- a/src/sass/components/components.scss +++ b/src/sass/components/components.scss @@ -8,4 +8,4 @@ @import "action-minor"; @import "expand-content"; @import "fee-summary"; -@import "amount.scss"; +@import "formatted-amount"; diff --git a/src/sass/components/amount.scss b/src/sass/components/formatted-amount.scss similarity index 89% rename from src/sass/components/amount.scss rename to src/sass/components/formatted-amount.scss index 363d38a20..6678572c9 100644 --- a/src/sass/components/amount.scss +++ b/src/sass/components/formatted-amount.scss @@ -1,4 +1,6 @@ -.amount { +.formatted-amount { + display: inline-block; + .start, .middle, .end, diff --git a/www/views/amount.html b/www/views/amount.html index 48637ec1b..ee969762a 100644 --- a/www/views/amount.html +++ b/www/views/amount.html @@ -16,11 +16,13 @@
- {{vm.amount || '0'}} {{vm.unit}} + + +
- {{vm.globalResult}} {{vm.unit}} +
- {{vm.alternativeAmount || '0.00'}} {{vm.alternativeUnit}} +
@@ -43,7 +45,7 @@
- Available Funds: {{vm.availableFunds}} + Available Funds: 
@@ -53,7 +55,7 @@ diff --git a/www/views/includes/formatted-amount.html b/www/views/includes/formatted-amount.html index 361dededc..20063458d 100644 --- a/www/views/includes/formatted-amount.html +++ b/www/views/includes/formatted-amount.html @@ -1,4 +1,4 @@ -
{{start}}{{middle}}{{end}}{{currency}}
\ No newline at end of file diff --git a/www/views/includes/walletHistory.html b/www/views/includes/walletHistory.html index 4a40e93d8..296b35b1a 100644 --- a/www/views/includes/walletHistory.html +++ b/www/views/includes/walletHistory.html @@ -64,17 +64,16 @@ - – (possible double spend) - {{btx.amountValueStr}} {{btx.amountUnitStr}} +
- {{btx.alternativeAmountStr}} +
diff --git a/www/views/includes/walletList.html b/www/views/includes/walletList.html index f7a061740..d5fb65302 100644 --- a/www/views/includes/walletList.html +++ b/www/views/includes/walletList.html @@ -7,8 +7,12 @@ Incomplete - {{wallet.status.totalBalanceStr ? wallet.status.totalBalanceStr : ( wallet.cachedBalance ? wallet.cachedBalance + (wallet.cachedBalanceUpdatedOn ? ' · ' + ( wallet.cachedBalanceUpdatedOn * 1000 | amTimeAgo) : '') : '' ) }} - {{wallet.status.totalBalanceAlternative ? wallet.status.totalBalanceAlternative : ( wallet.cachedBalance ? wallet.cachedBalance + (wallet.cachedBalanceUpdatedOn ? ' · ' + ( wallet.cachedBalanceUpdatedOn * 1000 | amTimeAgo) : '') : '' ) }} {{wallet.status.alternativeIsoCode}} + + + + + + Scanning funds... [Balance Hidden] diff --git a/www/views/tx-details.html b/www/views/tx-details.html index e3a7a06b4..467ce28e3 100644 --- a/www/views/tx-details.html +++ b/www/views/tx-details.html @@ -24,13 +24,13 @@ Receiving
-
{{btx.amountValueStr}} {{btx.amountUnitStr}}
+
- {{btx.alternativeAmountStr}} + ... - {{rate| currency:'':2}} {{alternativeIsoCode}} ({{rateDate | amDateFormat:'MM/DD/YYYY HH:mm a'}}) + ({{rateDate | amDateFormat:'MM/DD/YYYY HH:mm a'}})
@@ -115,7 +115,7 @@ Fee {{btx.feeStr || '...'}} - {{btx.feeFiatStr || '...'}} - {{btx.feeRateStr}} of the transaction + ...- {{btx.feeRateStr}} of the transaction
diff --git a/www/views/walletDetails.html b/www/views/walletDetails.html index 0f9e4961c..12506e05d 100644 --- a/www/views/walletDetails.html +++ b/www/views/walletDetails.html @@ -34,12 +34,12 @@ on-hold="hideToggle()" ng-style="{'transform': amountScale}" ng-class="{amount__balance: amountIsCollapsible}"> - {{status.totalBalanceAlternative}} {{status.alternativeIsoCode}} +
- {{status.totalBalanceStr}} +
@@ -47,13 +47,14 @@ ng-show="selectedPriceDisplay=='crypto' && !updateStatusError && !wallet.balanceHidden && !wallet.scanning" on-hold="hideToggle()" ng-style="{'transform': amountScale}" + ng-if="status.totalBalanceStr" ng-class="{amount__balance: amountIsCollapsible}"> - {{status.totalBalanceStr}} +
- {{status.totalBalanceAlternative}} {{status.alternativeIsoCode}} +
@@ -86,7 +87,7 @@   - {{status.spendableBalanceAlternative}} {{status.alternativeIsoCode}} + @@ -127,12 +128,12 @@ on-hold="hideToggle()" ng-style="{'transform': amountScale}" ng-class="{amount__balance: amountIsCollapsible}"> - {{status.totalBalanceStr}} +
- {{status.totalBalanceAlternative}} {{status.alternativeIsoCode}} +
@@ -142,12 +143,12 @@ on-hold="hideToggle()" ng-style="{'transform': amountScale}" ng-class="{amount__balance: amountIsCollapsible}"> - {{status.totalBalanceAlternative}} {{status.alternativeIsoCode}} +
- {{status.totalBalanceStr}} +
@@ -180,7 +181,7 @@   - {{status.spendableBalanceAlternative}} {{status.alternativeIsoCode}} + @@ -189,7 +190,7 @@