add animations - fix UI

This commit is contained in:
Javier 2016-05-19 13:27:17 -03:00
commit 4964a3d7c3
3 changed files with 54 additions and 46 deletions

View file

@ -81,8 +81,8 @@
<span translate>Pending Confirmation</span>: <span translate>Pending Confirmation</span>:
{{index.pendingAmountStr}} {{index.pendingAmountStr}}
</div> </div>
</div> </div>
<div ng-show="!index.updateError && index.walletScanStatus != 'error' && index.shouldHideBalance" on-hold="index.onHold()"> <div ng-show="!index.updateError && index.walletScanStatus != 'error' && index.shouldHideBalance" on-hold="index.onHold()">
<strong class="size-24" translate>[Balance Hidden]</strong> <strong class="size-24" translate>[Balance Hidden]</strong>
<div class="size-14" ng-if="!shouldCollapse" transalate> <div class="size-14" ng-if="!shouldCollapse" transalate>
@ -106,7 +106,8 @@
</div> </div>
</div> <!-- oh --> </div> <!-- oh -->
</ion-content> </ion-content>
<ion-content overflow-scroll="true" ng-class="{m150t: !shouldCollapse, m50t: shouldCollapse}" delegate-handle="transactions" on-scroll="collapseBalanceContent(index.updatingTxHistory && index.txProgress > 5)">
<ion-content overflow-scroll="false" class="fade" ng-class="{m150t: !shouldCollapse, m50t: shouldCollapse}" delegate-handle="transactions" on-scroll="collapseBalanceContent(index.updatingTxHistory && index.txProgress > 5)">
<div class="m50b"> <div class="m50b">
<div class="oh pr m20t" ng-show="index.incorrectDerivation"> <div class="oh pr m20t" ng-show="index.incorrectDerivation">
<div class="text-center text-warning"> <div class="text-center text-warning">

View file

@ -32,21 +32,22 @@ angular.module('copayApp.controllers').controller('walletHomeController', functi
ret.sendMaxInfo = {}; ret.sendMaxInfo = {};
var vanillaScope = ret; var vanillaScope = ret;
$scope.collapseBalanceContent = function(val) { $scope.collapseBalanceContent = function(updating) {
if (val) return; if (updating) return;
$scope.shouldCollapse = $ionicScrollDelegate.$getByHandle('transactions').getScrollPosition().top > 50 ? true : false;
var scrollPosition = $ionicScrollDelegate.$getByHandle('transactions').getScrollPosition().top;
$scope.shouldCollapse = scrollPosition > 50 ? true : false;
$timeout(function() { $timeout(function() {
$scope.$apply(); $scope.$apply();
}); });
}; };
$scope.freezeScroll = function() { $scope.freezeScroll = function() {
var scrollPosition = $ionicScrollDelegate.$getByHandle('balance').getScrollPosition().top;
var openRatio = $ionicSideMenuDelegate.getOpenRatio();
if ($ionicScrollDelegate.$getByHandle('balance').getScrollPosition().top < -75) { if (scrollPosition < -75 || openRatio != 0)
$ionicScrollDelegate.$getByHandle('balance').freezeScroll(true);
return;
}
if ($ionicSideMenuDelegate.getOpenRatio() != 0)
$ionicScrollDelegate.$getByHandle('balance').freezeScroll(true); $ionicScrollDelegate.$getByHandle('balance').freezeScroll(true);
else else
$ionicScrollDelegate.$getByHandle('balance').freezeScroll(false); $ionicScrollDelegate.$getByHandle('balance').freezeScroll(false);

View file

@ -460,6 +460,10 @@ ul.manage li {
} }
} }
.fade {
transition: margin-top .2s ease;
}
.dn { .dn {
display: none; display: none;
} }
@ -1577,6 +1581,7 @@ input.ng-invalid-match {
color: #fff; color: #fff;
height: 150px; height: 150px;
margin-bottom: 25px; margin-bottom: 25px;
transition: .4s all ease;
} }
.amountcollapsed { .amountcollapsed {
@ -1584,6 +1589,7 @@ input.ng-invalid-match {
text-align: center; text-align: center;
color: #fff; color: #fff;
height: 50px; height: 50px;
transition: .4s all ease;
} }
.alternative-amount { .alternative-amount {