BTCPrivate
/
copay
mirror of https://github.com/BTCPrivate/copay.git
1
0
Fork 0
Code Issues Projects Releases Wiki Activity

add scaling and opacity transitions

This commit is contained in:
Marty Alcala 2016-11-09 13:15:42 -05:00
parent c3ef412383
commit e2cd188e39
2 changed files with 30 additions and 3 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

15
src/js/controllers/walletDetails.js
View File

@ -239,9 +239,24 @@ angular.module('copayApp.controllers').controller('walletDetailsController', fun
if(amountHeight < 80) {
amountHeight = 80;
}
var amountScale = amountHeight/180;
if(amountScale < 0.5) {
amountScale = 0.5;
}
if(amountScale > 1.1) {
amountScale = 1.1;
}
var s = amountScale;
$scope.altAmountOpacity = (amountHeight - 100)/80;
console.log('amountHeight', amountHeight);
$window.requestAnimationFrame(function() {
$scope.amountHeight = amountHeight + 'px';
$scope.amountScale = 'scale3d(' + s + ',' + s + ',' + s+ ')';
console.log('$scope.amountScale', $scope.amountScale);
console.log('$scope.altAmountOpacity', $scope.altAmountOpacity);
$scope.$evalAsync(angular.noop);
});
};

18
www/views/walletDetails.html
View File

@ -31,9 +31,21 @@
</div>
<div ng-click='updateAll(true)' ng-show="!updateStatusError && wallet.walletScanStatus != 'error' && !wallet.balanceHidden" on-hold="hideToggle()">
<div
ng-click='updateAll(true)'
ng-show="!updateStatusError && wallet.walletScanStatus != 'error' && !wallet.balanceHidden"
on-hold="hideToggle()"
ng-style="{'transform': amountScale}"
>
<strong ng-if="!status.pendingAmount" class="size-36">{{status.totalBalanceStr}}</strong>
<div ng-if="!status.pendingAmount" class="size-14 amount-alternative" ng-if="status.totalBalanceAlternative">{{status.totalBalanceAlternative}} {{status.alternativeIsoCode}}</div>
<div
ng-if="!status.pendingAmount"
class="size-14 amount-alternative"
ng-if="status.totalBalanceAlternative"
ng-style="{opacity: altAmountOpacity}"
>
{{status.totalBalanceAlternative}} {{status.alternativeIsoCode}}
</div>
<div class="size-20" ng-if="status.pendingAmount">
<div style="margin-bottom:.5rem"><span translate>Available</span>: {{status.totalBalanceStr}}</div>
<div><span translate>Confirming</span>: {{status.pendingAmountStr}}</div>
@ -54,7 +66,7 @@
</div>
</div> <!-- amount -->
<div class="wallet-details-wallet-info">
<div class="wallet-details-wallet-info" ng-style="{opacity: altAmountOpacity}">
<span ng-include="'views/includes/walletInfo.html'"></span>
</div>
</div> <!-- oh -->