anders/Wallet
1
0
Fork 0
Code Issues Projects Releases Packages Wiki Activity

Merge pull request #5196 from ajp8164/feat/balance-modal

Browse source 
Initial implementation for balance modal.
This commit is contained in:
Javier Donadío 2016-12-15 13:58:11 -03:00 • committed by GitHub
commit 685a11cbfc
12 changed files with 350 additions and 55 deletions
Download patch file Download diff file Expand all files Collapse all files

60
src/js/controllers/walletDetails.js
View file

@ -67,6 +67,7 @@ angular.module('copayApp.controllers').controller('walletDetailsController', fun
setPendingTxps(status.pendingTxps);
$scope.status = status;
}
refreshAmountSection();
$timeout(function() {
$scope.$apply();
});
@ -107,6 +108,19 @@ angular.module('copayApp.controllers').controller('walletDetailsController', fun
});
};
$scope.openBalanceModal = function() {
$ionicModal.fromTemplateUrl('views/modals/wallet-balance.html', {
scope: $scope
}).then(function(modal) {
$scope.walletBalanceModal = modal;
$scope.walletBalanceModal.show();
});
$scope.close = function() {
$scope.walletBalanceModal.hide();
};
};
$scope.recreate = function() {
walletService.recreate($scope.wallet, function(err) {
if (err) return;
@ -234,11 +248,10 @@ angular.module('copayApp.controllers').controller('walletDetailsController', fun
};
var prevPos;
var screenInactive = true;
function getScrollPosition() {
var scrollPosition = $ionicScrollDelegate.getScrollPosition();
if (!scrollPosition || screenInactive) {
if (!scrollPosition) {
$window.requestAnimationFrame(function() {
getScrollPosition();
});
@ -252,16 +265,21 @@ angular.module('copayApp.controllers').controller('walletDetailsController', fun
return;
}
prevPos = pos;
var amountHeight = 180 - pos;
refreshAmountSection(pos);
};
function refreshAmountSection(scrollPos) {
scrollPos = scrollPos || 0;
var amountHeight = 210 - scrollPos;
if (amountHeight < 80) {
amountHeight = 80;
}
var contentMargin = amountHeight;
if (contentMargin > 180) {
contentMargin = 180;
if (contentMargin > 210) {
contentMargin = 210;
}
var amountScale = (amountHeight / 180);
var amountScale = (amountHeight / 210);
if (amountScale < 0.5) {
amountScale = 0.5;
}
@ -271,11 +289,31 @@ angular.module('copayApp.controllers').controller('walletDetailsController', fun
var s = amountScale;
// Make space for the balance button when it needs to display.
var TOP_NO_BALANCE_BUTTON = 45;
var TOP_BALANCE_BUTTON = 10;
var top = TOP_NO_BALANCE_BUTTON;
$scope.showBalanceButton = ($scope.wallet.status.totalBalanceSat != $scope.wallet.status.spendableAmount);
if ($scope.showBalanceButton) {
top = TOP_BALANCE_BUTTON;
$scope.showBalanceButton = true;
}
var amountTop = ((amountScale - 0.5) / 0.5) * top;
if (amountTop < 5) {
amountTop = 5;
}
if (amountTop > top) {
amountTop = top;
}
var t = amountTop;
$scope.altAmountOpacity = (amountHeight - 100) / 80;
$window.requestAnimationFrame(function() {
$scope.amountHeight = amountHeight + 'px';
$scope.contentMargin = contentMargin + 'px';
$scope.amountScale = 'scale3d(' + s + ',' + s + ',' + s + ')';
$scope.amountScale = 'scale3d(' + s + ',' + s + ',' + s + ') translateY(' + t + 'px)';
$scope.$digest();
getScrollPosition();
});
@ -285,16 +323,10 @@ angular.module('copayApp.controllers').controller('walletDetailsController', fun
$scope.$on("$ionicView.enter", function(event, data) {
if ($scope.isCordova && $scope.isAndroid) setAndroidStatusBarColor();
$timeout(function() {
screenInactive = false;
}, 200);
if (scrollWatcherInitialized || !$scope.amountIsCollapsible) {
return;
}
scrollWatcherInitialized = true;
$timeout(function() {
getScrollPosition();
}, 100);
});
$scope.$on("$ionicView.beforeEnter", function(event, data) {
@ -308,6 +340,7 @@ angular.module('copayApp.controllers').controller('walletDetailsController', fun
});
$scope.updateAll();
refreshAmountSection();
listeners = [
$rootScope.$on('bwsEvent', function(e, walletId) {
@ -328,7 +361,6 @@ angular.module('copayApp.controllers').controller('walletDetailsController', fun
});
$scope.$on("$ionicView.leave", function(event, data) {
screenInactive = true;
lodash.each(listeners, function(x) {
x();
});

22
src/js/services/walletService.js
View file

@ -160,19 +160,22 @@ angular.module('copayApp.services').factory('walletService', function($log, $tim
// Address with Balance
cache.balanceByAddress = balance.byAddress;
// Total wallet balance is same regardless of 'spend unconfirmed funds' setting.
cache.totalBalanceSat = balance.totalAmount;
// Spend unconfirmed funds
if (config.spendUnconfirmed) {
cache.totalBalanceSat = balance.totalAmount;
cache.lockedBalanceSat = balance.lockedAmount;
cache.availableBalanceSat = balance.availableAmount;
cache.totalBytesToSendMax = balance.totalBytesToSendMax;
cache.pendingAmount = null;
cache.pendingAmount = 0;
cache.spendableAmount = balance.totalAmount - balance.lockedAmount;
} else {
cache.totalBalanceSat = balance.totalConfirmedAmount;
cache.lockedBalanceSat = balance.lockedConfirmedAmount;
cache.availableBalanceSat = balance.availableConfirmedAmount;
cache.totalBytesToSendMax = balance.totalBytesToSendConfirmedMax;
cache.pendingAmount = balance.totalAmount - balance.totalConfirmedAmount;
cache.spendableAmount = balance.totalConfirmedAmount - balance.lockedAmount;
}
// Selected unit
@ -184,13 +187,8 @@ angular.module('copayApp.services').factory('walletService', function($log, $tim
cache.totalBalanceStr = txFormatService.formatAmount(cache.totalBalanceSat) + ' ' + cache.unitName;
cache.lockedBalanceStr = txFormatService.formatAmount(cache.lockedBalanceSat) + ' ' + cache.unitName;
cache.availableBalanceStr = txFormatService.formatAmount(cache.availableBalanceSat) + ' ' + cache.unitName;
cache.pendingBalanceStr = txFormatService.formatAmount(cache.totalBalanceSat + (cache.pendingAmount === null ? 0 : cache.pendingAmount)) + ' ' + cache.unitName;
if (cache.pendingAmount !== null && cache.pendingAmount !== 0) {
cache.pendingAmountStr = txFormatService.formatAmount(cache.pendingAmount) + ' ' + cache.unitName;
} else {
cache.pendingAmountStr = null;
}
cache.spendableBalanceStr = txFormatService.formatAmount(cache.spendableAmount) + ' ' + cache.unitName;
cache.pendingBalanceStr = txFormatService.formatAmount(cache.pendingAmount) + ' ' + cache.unitName;
cache.alternativeName = config.settings.alternativeName;
cache.alternativeIsoCode = config.settings.alternativeIsoCode;
@ -209,11 +207,15 @@ angular.module('copayApp.services').factory('walletService', function($log, $tim
rateService.whenAvailable(function() {
var totalBalanceAlternative = rateService.toFiat(cache.totalBalanceSat, cache.alternativeIsoCode);
var pendingBalanceAlternative = rateService.toFiat(cache.pendingAmount, cache.alternativeIsoCode);
var lockedBalanceAlternative = rateService.toFiat(cache.lockedBalanceSat, cache.alternativeIsoCode);
var spendableBalanceAlternative = rateService.toFiat(cache.spendableAmount, cache.alternativeIsoCode);
var alternativeConversionRate = rateService.toFiat(100000000, cache.alternativeIsoCode);
cache.totalBalanceAlternative = $filter('formatFiatAmount')(totalBalanceAlternative);
cache.pendingBalanceAlternative = $filter('formatFiatAmount')(pendingBalanceAlternative);
cache.lockedBalanceAlternative = $filter('formatFiatAmount')(lockedBalanceAlternative);
cache.spendableBalanceAlternative = $filter('formatFiatAmount')(spendableBalanceAlternative);
cache.alternativeConversionRate = $filter('formatFiatAmount')(alternativeConversionRate);
cache.alternativeBalanceAvailable = true;

7
src/sass/views/tab-home.scss
View file

@ -111,6 +111,13 @@
font-weight: 300;
color: $light-gray;
}
&__status-icon {
font-size: 18px;
margin-left: 5px;
position: relative;
top: 1px;
color: $light-gray;
}
}
}
.release {

1
src/sass/views/views.scss
View file

@ -9,6 +9,7 @@
@import "tab-scan";
@import "tab-send";
@import "tab-settings";
@import "walletBalance";
@import "walletDetails";
@import "advancedSettings";
@import "bitpayCard";

113
src/sass/views/walletBalance.scss Normal file
View file

@ -0,0 +1,113 @@
.wallet-balance {
&__amount {
font-size: 16px;
&--total {
color: $mid-gray;
}
&--available {
color: #09C286;;
}
&--confirming {
color: #FF9900;
}
&--locked {
color: #FF9900;
}
&--alternative {
color: $light-gray;
font-size: 14px;
}
}
&__title {
flex-grow: 1;
color: $dark-gray;
overflow: hidden;
}
&__icon {
float: left;
margin-right: 1rem;
color: $light-gray;
font-size: 24px;
}
&__list {
background: #f5f5f5;
}
.item {
display: flex;
align-items: center;
background: #fff;
padding-left: 1rem;
}
&__item {
display: flex;
align-items: center;
background: #fff;
padding: 0;
margin: 0;
border: 0;
padding-left: 1rem;
}
&__content {
display: flex;
align-items: center;
flex-grow: 1;
padding: 0.6rem 0;
padding-right: 1rem;
border-bottom: 1px solid rgb(245, 245, 245);
overflow: hidden;
&.no-border {
border: 0;
}
}
&__amount {
white-space: nowrap;
}
&__heading {
font-size: 17px;
color: #445;
margin: 1rem 1rem 1rem 1rem;
}
&__description {
font-size: 12.5px;
color: #667;
margin: 0.7rem;
line-height: 16px;
}
}
#wallet-balance {
.bar-header {
border: 0;
background: none;
.title, .button {
color: #fff;
}
.button {
background-color: transparent;
}
}
ion-content {
background: #F5F5F5;
}
}

17
src/sass/views/walletDetails.scss
View file

@ -130,7 +130,7 @@
ion-content {
&.collapsible {
margin-top: 180px;
margin-top: 210px;
}
padding-top: 0;
@ -168,9 +168,9 @@
width: 100%;
text-align: center;
color: #fff;
height: 180px;
height: 210px;
padding-top: 40px;
display: flex;
display: block;
align-items: center;
justify-content: center;
@ -179,8 +179,7 @@
}
&__balance {
transform: scale3d(1, 1, 1);
margin-top: 5px;
transform: scale3d(1, 1, 1) translateY(45px);
}
&__updating {
@ -192,9 +191,11 @@
line-height: 36px;
}
strong {
line-height: 100%;
&__button-balance {
background-color: transparent;
border: 1px solid rgba(255,255,255,0.25);
}
}
.item.item-footer {
font-weight: lighter;
@ -214,7 +215,7 @@
position: absolute;
top: inherit;
left: 10px;
bottom: 15px;
bottom: 5px;
font-size: 20px;
color: #fff;
}