mirror of https://github.com/BTCPrivate/copay.git
refactor receive view
This commit is contained in:
Gabriel Bazán
parent
3bd9b4e8ec
commit
552a4c8bcf
|
|
@ -114,13 +114,6 @@ angular.module('copayApp.controllers').controller('addressesController', functio
|
|||
});
|
||||
};
|
||||
|
||||
$scope.requestSpecificAmount = function() {
|
||||
$state.go('tabs.receive.amount', {
|
||||
customAmount: true,
|
||||
toAddress: $stateParams.toAddress
|
||||
});
|
||||
}
|
||||
|
||||
$scope.showInformation = function() {
|
||||
$timeout(function() {
|
||||
$scope.showInfo = !$scope.showInfo;
|
||||
|
|
|
|||
|
|
@ -12,10 +12,6 @@ angular.module('copayApp.controllers').controller('customAmountController', func
|
|||
$scope.altAmountStr = txFormatService.formatAlternativeStr($scope.amount);
|
||||
});
|
||||
|
||||
$scope.shareAddress = function(uri) {
|
||||
window.plugins.socialsharing.share(uri, null, null, null);
|
||||
};
|
||||
|
||||
$scope.finish = function() {
|
||||
$ionicHistory.nextViewOptions({
|
||||
disableAnimate: false
|
||||
|
|
|
|||
|
|
@ -1,11 +1,15 @@
|
|||
'use strict';
|
||||
|
||||
angular.module('copayApp.controllers').controller('preferencesAdvancedController', function($scope, $timeout, $stateParams, profileService) {
|
||||
angular.module('copayApp.controllers').controller('preferencesAdvancedController', function($scope, $timeout, $state, $stateParams, profileService) {
|
||||
var wallet = profileService.getWallet($stateParams.walletId);
|
||||
$scope.network = wallet.network;
|
||||
$scope.wallet = wallet;
|
||||
|
||||
|
||||
$scope.goToAddresses = function() {
|
||||
$state.go('tabs.receive.addresses', {
|
||||
walletId: $stateParams.walletId,
|
||||
});
|
||||
};
|
||||
|
||||
$timeout(function() {
|
||||
$scope.$apply();
|
||||
|
|
|
|||
|
|
@ -5,13 +5,12 @@ angular.module('copayApp.controllers').controller('tabReceiveController', functi
|
|||
var listeners = [];
|
||||
$scope.isCordova = platformInfo.isCordova;
|
||||
$scope.isNW = platformInfo.isNW;
|
||||
$scope.walletAddrs = {};
|
||||
|
||||
$scope.shareAddress = function(addr) {
|
||||
if ($scope.generatingAddress) return;
|
||||
if ($scope.isCordova) {
|
||||
window.plugins.socialsharing.share('bitcoin:' + addr, null, null, null);
|
||||
}
|
||||
$scope.requestSpecificAmount = function() {
|
||||
$state.go('tabs.receive.amount', {
|
||||
customAmount: true,
|
||||
toAddress: $scope.addr
|
||||
});
|
||||
};
|
||||
|
||||
$scope.setAddress = function(forceNew) {
|
||||
|
|
@ -27,19 +26,12 @@ angular.module('copayApp.controllers').controller('tabReceiveController', functi
|
|||
}
|
||||
|
||||
$scope.addr = addr;
|
||||
if ($scope.walletAddrs[$scope.wallet.id]) $scope.walletAddrs[$scope.wallet.id] = addr;
|
||||
$timeout(function() {
|
||||
$scope.$apply();
|
||||
}, 10);
|
||||
});
|
||||
};
|
||||
|
||||
$scope.loadAddresses = function(wallet, index) {
|
||||
walletService.getAddress(wallet, false, function(err, addr) {
|
||||
$scope.walletAddrs[wallet.id] = addr;
|
||||
});
|
||||
}
|
||||
|
||||
$scope.goCopayers = function() {
|
||||
$ionicHistory.removeBackView();
|
||||
$ionicHistory.nextViewOptions({
|
||||
|
|
@ -53,13 +45,6 @@ angular.module('copayApp.controllers').controller('tabReceiveController', functi
|
|||
}, 100);
|
||||
};
|
||||
|
||||
$scope.showAddresses = function() {
|
||||
$state.go('tabs.receive.addresses', {
|
||||
walletId: $scope.wallet.credentials.walletId,
|
||||
toAddress: $scope.addr
|
||||
});
|
||||
};
|
||||
|
||||
$scope.openBackupNeededModal = function() {
|
||||
$ionicModal.fromTemplateUrl('views/includes/backupNeededPopup.html', {
|
||||
scope: $scope,
|
||||
|
|
@ -88,56 +73,13 @@ angular.module('copayApp.controllers').controller('tabReceiveController', functi
|
|||
});
|
||||
};
|
||||
|
||||
$scope.setWallet = function(index) {
|
||||
$scope.wallet = $scope.wallets[index];
|
||||
$scope.walletIndex = index;
|
||||
if ($scope.walletAddrs[$scope.wallet.id].addr) $scope.addr = $scope.walletAddrs[$scope.walletIndex].addr;
|
||||
else $scope.setAddress(false);
|
||||
}
|
||||
|
||||
$scope.isActive = function(index) {
|
||||
return $scope.wallets[index] == $scope.wallet;
|
||||
}
|
||||
|
||||
$scope.walletPosition = function(index) {
|
||||
if (index == $scope.walletIndex) return 'current';
|
||||
if (index < $scope.walletIndex) return 'prev';
|
||||
if (index > $scope.walletIndex) return 'next';
|
||||
}
|
||||
|
||||
|
||||
$scope.$on('Wallet/Changed', function(event, wallet) {
|
||||
if (!wallet) {
|
||||
$log.debug('No wallet provided');
|
||||
return;
|
||||
}
|
||||
if (wallet == $scope.wallet) {
|
||||
$log.debug('No change in wallet');
|
||||
return;
|
||||
}
|
||||
$scope.wallet = wallet;
|
||||
$log.debug('Wallet changed: ' + wallet.name);
|
||||
|
||||
$scope.walletIndex = lodash.findIndex($scope.wallets, function(wallet) {
|
||||
return wallet.id == $scope.wallet.id;
|
||||
});
|
||||
|
||||
if (!$scope.walletAddrs[wallet.id]) $scope.setAddress(false);
|
||||
else $scope.addr = $scope.walletAddrs[wallet.id];
|
||||
|
||||
$timeout(function() {
|
||||
$scope.$apply();
|
||||
}, 100);
|
||||
|
||||
});
|
||||
|
||||
$scope.updateCurrentWallet = function() {
|
||||
walletService.getStatus($scope.wallet, {}, function(err, status) {
|
||||
$scope.updateCurrentWallet = function(wallet) {
|
||||
walletService.getStatus(wallet, {}, function(err, status) {
|
||||
if (err) {
|
||||
return popupService.showAlert(bwcError.msg(err, gettextCatalog.getString('Could not update wallet')));
|
||||
}
|
||||
$timeout(function() {
|
||||
$scope.wallet = profileService.getWallet($scope.wallet.id);
|
||||
$scope.wallet = profileService.getWallet(wallet.id);
|
||||
$scope.wallet.status = status;
|
||||
$scope.setAddress();
|
||||
$scope.$apply();
|
||||
|
|
@ -157,40 +99,55 @@ angular.module('copayApp.controllers').controller('tabReceiveController', functi
|
|||
$scope.showReceiveAddressFromHardware = function() {
|
||||
var wallet = $scope.wallet;
|
||||
if (wallet.isPrivKeyExternal() && wallet.credentials.hwInfo) {
|
||||
walletService.showReceiveAddressFromHardware(wallet, $scope.addr, function(){});
|
||||
walletService.showReceiveAddressFromHardware(wallet, $scope.addr, function() {});
|
||||
}
|
||||
};
|
||||
|
||||
$scope.$on("$ionicView.beforeEnter", function(event, data) {
|
||||
$scope.wallets = profileService.getWallets();
|
||||
|
||||
lodash.each($scope.wallets, function(wallet, index) {
|
||||
$scope.loadAddresses(wallet);
|
||||
});
|
||||
$scope.singleWallet = $scope.wallets.length == 1;
|
||||
|
||||
listeners = [
|
||||
$rootScope.$on('bwsEvent', function(e, walletId, type, n) {
|
||||
// Update current address
|
||||
if ($scope.wallet && walletId == $scope.wallet.id) $scope.updateCurrentWallet();
|
||||
if ($scope.wallet && walletId == $scope.wallet.id) $scope.updateCurrentWallet($scope.wallet);
|
||||
})
|
||||
];
|
||||
];
|
||||
|
||||
// Update current wallet
|
||||
if ($scope.wallet) {
|
||||
var w = lodash.find($scope.wallets, function(w) {
|
||||
return w.id == $scope.wallet.id;
|
||||
});
|
||||
if (w) $scope.updateCurrentWallet();
|
||||
else if (screen.width > 700 && screen.height > 700 && $scope.wallets[0]) {
|
||||
$scope.setWallet(0)
|
||||
$scope.walletPosition(0);
|
||||
}
|
||||
}
|
||||
if (!$scope.wallets[0]) return;
|
||||
if (!$scope.wallet) return $scope.init();
|
||||
|
||||
var w = lodash.find($scope.wallets, function(w) {
|
||||
return w.id == $scope.wallet.id;
|
||||
});
|
||||
if (w) $scope.updateCurrentWallet($scope.wallet);
|
||||
else $scope.init();
|
||||
});
|
||||
|
||||
$scope.init = function() {
|
||||
$scope.wallet = $scope.wallets[0];
|
||||
$scope.updateCurrentWallet($scope.wallet);
|
||||
$scope.showWalletSelector();
|
||||
};
|
||||
|
||||
$scope.$on("$ionicView.leave", function(event, data) {
|
||||
lodash.each(listeners, function(x) {
|
||||
x();
|
||||
});
|
||||
});
|
||||
|
||||
$scope.onWalletSelect = function(wallet) {
|
||||
$scope.updateCurrentWallet(wallet);
|
||||
};
|
||||
|
||||
$scope.showWalletSelector = function() {
|
||||
if ($scope.singleWallet) return;
|
||||
$scope.walletSelectorTitle = gettextCatalog.getString('Address from');
|
||||
$scope.showWallets = true;
|
||||
};
|
||||
|
||||
$scope.copyToClipboard = function() {
|
||||
if ($scope.isCordova) return 'bitcoin:' + $scope.addr;
|
||||
else return $scope.addr;
|
||||
}
|
||||
});
|
||||
|
|
|
|||
|
|
@ -11,8 +11,10 @@ angular.module('copayApp.directives')
|
|||
},
|
||||
link: function(scope, element, attrs) {
|
||||
scope.$watch('show', function() {
|
||||
if(scope.show) {
|
||||
$timeout(function() { scope.revealMenu = true; }, 100);
|
||||
if (scope.show) {
|
||||
$timeout(function() {
|
||||
scope.revealMenu = true;
|
||||
}, 100);
|
||||
} else {
|
||||
scope.revealMenu = false;
|
||||
}
|
||||
|
|
|
|||
|
|
@ -21,8 +21,7 @@ angular.module('copayApp.directives')
|
|||
if (!data) return;
|
||||
|
||||
if (isCordova) {
|
||||
window.cordova.plugins.clipboard.copy(data);
|
||||
window.plugins.toast.showShortCenter(msg);
|
||||
window.plugins.socialsharing.share(data, null, null, null);
|
||||
} else if (isNW) {
|
||||
nodeWebkitService.writeToClipboard(data);
|
||||
scope.$apply(function() {
|
||||
|
|
|
|||
|
|
@ -1,512 +1,55 @@
|
|||
#tab-receive {
|
||||
@extend .deflash-blue;
|
||||
ion-header-bar {
|
||||
button {
|
||||
i {
|
||||
color:#fff;
|
||||
font-size: 1.1rem;
|
||||
}
|
||||
}
|
||||
}
|
||||
.border-top {
|
||||
border-top:1px solid rgb(228,228,228);
|
||||
}
|
||||
.scroll {
|
||||
height:100%;
|
||||
}
|
||||
#address {
|
||||
.address {
|
||||
background: #fff;
|
||||
height: 66vh;
|
||||
display: flex;
|
||||
align-items: center;
|
||||
justify-content: center;
|
||||
position: relative;
|
||||
flex-flow: column;
|
||||
@media(max-height: 600px) {
|
||||
height: 68vh;
|
||||
}
|
||||
@media(max-height: 600px) and (-webkit-device-pixel-ratio: 2) {
|
||||
height: 64vh;
|
||||
}
|
||||
@media(max-width: 320px) {
|
||||
height: 62vh;
|
||||
height: 65vh;
|
||||
@media(max-height: 600px) and (max-width: 320px) {
|
||||
height: 70vh;
|
||||
.button {
|
||||
min-height: 50px;
|
||||
}
|
||||
}
|
||||
&-info {
|
||||
height: 100%;
|
||||
display: flex;
|
||||
flex-direction: column;
|
||||
justify-content: center;
|
||||
align-items: center;
|
||||
width: 100%;
|
||||
@media(max-width: 320px) {
|
||||
height: auto;
|
||||
.address-label {
|
||||
margin-top: 5%;
|
||||
font-size: 13px;
|
||||
}
|
||||
}
|
||||
article {
|
||||
flex:1;
|
||||
width: 100%;
|
||||
}
|
||||
#bit-address {
|
||||
width: 100%;
|
||||
margin-top: auto;
|
||||
position: absolute;
|
||||
bottom: 0;
|
||||
min-height: 40px;
|
||||
#next-address {
|
||||
color:$v-light-gray;
|
||||
.qr {
|
||||
position: relative;
|
||||
top: 15%;
|
||||
}
|
||||
.backup {
|
||||
background-color: orange;
|
||||
color: #fff;
|
||||
position: absolute;
|
||||
z-index: 2;
|
||||
i {
|
||||
padding: 10px;
|
||||
}
|
||||
}
|
||||
.request-button {
|
||||
padding-top: 20px;
|
||||
}
|
||||
}
|
||||
.incomplete {
|
||||
padding: 50px;
|
||||
height: 352px;
|
||||
height: 100%;
|
||||
.title {
|
||||
padding: 20px;
|
||||
margin-top: 10%;
|
||||
font-size: 25px;
|
||||
color: #444;
|
||||
text-align: center;
|
||||
}
|
||||
.subtitle {
|
||||
padding: 20px;
|
||||
color: #444;
|
||||
margin-top: 20%;
|
||||
text-align: center;
|
||||
}
|
||||
.button {
|
||||
}
|
||||
}
|
||||
.item {
|
||||
border: none;
|
||||
font-size: .8rem;
|
||||
z-index: 0;
|
||||
i {
|
||||
font-size: 1.3rem;
|
||||
}
|
||||
}
|
||||
#qr-options {
|
||||
.item {
|
||||
font-size:.7rem;
|
||||
@media(min-width:350px) {
|
||||
font-size:.9rem;
|
||||
}
|
||||
@media(min-width:450px) {
|
||||
font-size:1rem;
|
||||
}
|
||||
}
|
||||
}
|
||||
.bit-address {
|
||||
font-size: .8rem;
|
||||
// left:10%;
|
||||
cursor: pointer;
|
||||
cursor: hand;
|
||||
position: absolute;
|
||||
transition: all .15s ease;
|
||||
width:100%;
|
||||
height: 100%;
|
||||
z-index: 0;
|
||||
position: absolute;
|
||||
top:50%;
|
||||
&, &.next {
|
||||
left:100%;
|
||||
-webkit-transform: translate(100%, -40%);
|
||||
transform: translate(100%, -40%);
|
||||
}
|
||||
&.next, &.prev {
|
||||
z-index:2;
|
||||
}
|
||||
&.current,
|
||||
&.prev {
|
||||
left:50%;
|
||||
}
|
||||
&.current {
|
||||
-webkit-transform: translate(-50%, -40%);
|
||||
transform: translate(-50%, -40%);
|
||||
z-index: 3;
|
||||
}
|
||||
&.prev {
|
||||
-webkit-transform: translate(-150%, -40%);
|
||||
transform: translate(-150%, -40%);
|
||||
}
|
||||
.item {
|
||||
white-space: nowrap;
|
||||
padding-top: 5px;
|
||||
padding-bottom: 5px;
|
||||
font-size: .7rem;
|
||||
@media(min-width:350px) {
|
||||
font-size:.9rem;
|
||||
}
|
||||
@media(min-width:450px) {
|
||||
font-size:1rem;
|
||||
}
|
||||
&.item-icon-left {
|
||||
@media(max-width: 320px) {
|
||||
padding-left: 48px;
|
||||
text-overflow: initial;
|
||||
}
|
||||
}
|
||||
color:$v-light-gray;
|
||||
}
|
||||
}
|
||||
.qr {
|
||||
padding: 15vh 0 4vh;
|
||||
align-self: center;
|
||||
margin-top: auto;
|
||||
height: 220px;
|
||||
position: relative;
|
||||
justify-content: center;
|
||||
flex: 1;
|
||||
z-index: 1;
|
||||
@media(max-width: 320px) {
|
||||
height: 260px;
|
||||
margin-top: -50px;
|
||||
}
|
||||
div {
|
||||
transition: all .4s ease;
|
||||
&.current,
|
||||
&.prev,
|
||||
&.next {
|
||||
position: absolute;
|
||||
top:50%;
|
||||
}
|
||||
&.current,
|
||||
&.prev {
|
||||
left:50%;
|
||||
}
|
||||
&.current {
|
||||
-webkit-transform: translate(-50%, -40%);
|
||||
transform: translate(-50%, -40%);
|
||||
}
|
||||
&.prev {
|
||||
-webkit-transform: translate(-150%, -40%);
|
||||
transform: translate(-150%, -40%);
|
||||
}
|
||||
&.next {
|
||||
left:100%;
|
||||
-webkit-transform: translate(100%, -40%);
|
||||
transform: translate(100%, -40%);
|
||||
}
|
||||
}
|
||||
.overlay {
|
||||
position: absolute;
|
||||
width: 220px;
|
||||
height: 100%;
|
||||
background-color: rgba(255,255,255,0.8);
|
||||
button {
|
||||
width: 100%;
|
||||
top: 50%;
|
||||
-webkit-transform: translateY(-50%);
|
||||
transform: translateY(-50%);
|
||||
}
|
||||
}
|
||||
@media(max-height: 700px) {
|
||||
padding: 10vh 0 4vh;
|
||||
}
|
||||
div {
|
||||
display: flex;
|
||||
justify-content: center;
|
||||
align-items: center;
|
||||
position: relative;
|
||||
min-height: 220px;
|
||||
}
|
||||
}
|
||||
#qr-options {
|
||||
justify-content: center;
|
||||
align-self: flex-end;
|
||||
.item{
|
||||
i{left:25px;}
|
||||
}
|
||||
}
|
||||
.backup {
|
||||
background-color: orange;
|
||||
color: #fff;
|
||||
position: absolute;
|
||||
top: 0;
|
||||
left:0;
|
||||
z-index: 2;
|
||||
i {
|
||||
padding: 10px;
|
||||
}
|
||||
}
|
||||
@media (max-height: 600px) {
|
||||
& {
|
||||
.qr {
|
||||
padding:6vh 0 0;
|
||||
div {
|
||||
-webkit-transform: scale(.7);
|
||||
transform: scale(.7);
|
||||
}
|
||||
}
|
||||
}
|
||||
}
|
||||
}
|
||||
#wallets {
|
||||
position: relative;
|
||||
&:before {
|
||||
content: "";
|
||||
display: inline-block;
|
||||
width: 0;
|
||||
height: 0;
|
||||
border-style: solid;
|
||||
border-width: 0 20px 20px 20px;
|
||||
border-color: transparent transparent rgb(242,242,242) transparent;
|
||||
top: -9px;
|
||||
position: absolute;
|
||||
left: 50%;
|
||||
-webkit-transform: translateX(-50%);
|
||||
transform: translateX(-50%);
|
||||
z-index: 4;
|
||||
}
|
||||
}
|
||||
#first-time-tip {
|
||||
background: rgba(30, 49, 134, 1);
|
||||
background: -moz-linear-gradient(top, rgba(30, 49, 134, 1) 0%, rgba(30, 49, 134, 0) 88%, rgba(30, 49, 134, 0) 100%);
|
||||
background: -webkit-gradient(left top, left bottom, color-stop(0%, rgba(30, 49, 134, 1)), color-stop(88%, rgba(30, 49, 134, 0)), color-stop(100%, rgba(30, 49, 134, 0)));
|
||||
background: -webkit-linear-gradient(top, rgba(30, 49, 134, 1) 0%, rgba(30, 49, 134, 0) 88%, rgba(30, 49, 134, 0) 100%);
|
||||
background: -o-linear-gradient(top, rgba(30, 49, 134, 1) 0%, rgba(30, 49, 134, 0) 88%, rgba(30, 49, 134, 0) 100%);
|
||||
background: -ms-linear-gradient(top, rgba(30, 49, 134, 1) 0%, rgba(30, 49, 134, 0) 88%, rgba(30, 49, 134, 0) 100%);
|
||||
background: linear-gradient(to bottom, rgba(30, 49, 134, 1) 0%, rgba(30, 49, 134, 0) 88%, rgba(30, 49, 134, 0) 100%);
|
||||
position: absolute;
|
||||
top: 0;
|
||||
left: 0;
|
||||
width: 100%;
|
||||
height: 100%;
|
||||
opacity: 0;
|
||||
animation-name: fadeIn;
|
||||
animation-iteration-count: 1;
|
||||
animation-timing-function: ease-in;
|
||||
animation-duration: .4s;
|
||||
animation-delay: 2s;
|
||||
animation-fill-mode: forwards;
|
||||
z-index: 10;
|
||||
text-align: center;
|
||||
color: #fff;
|
||||
padding-top: 3rem;
|
||||
.close {
|
||||
top: .5rem;
|
||||
right: 1rem;
|
||||
position: absolute;
|
||||
font-size: 1.5rem;
|
||||
opacity: .5;
|
||||
}
|
||||
h3 {
|
||||
color: #fff;
|
||||
margin-bottom:1rem;
|
||||
}
|
||||
}
|
||||
.receive-tab-bitcoin-icon {
|
||||
border-right: 1px solid rgb(228, 228, 228);
|
||||
padding-right: 10px;
|
||||
}
|
||||
#wallets {
|
||||
#sidebar-wallet{
|
||||
display: none;
|
||||
}
|
||||
}
|
||||
.wallets {
|
||||
position: relative;
|
||||
height: calc(27vh - 62px);
|
||||
z-index: 5;
|
||||
.slides {
|
||||
.swiper-container {
|
||||
position: absolute;
|
||||
left: 50%;
|
||||
top: 50%;
|
||||
-webkit-transform: translate(-50%, -50%);
|
||||
transform: translate(-50%, -50%);
|
||||
max-width: 450px;
|
||||
.swiper-wrapper {
|
||||
height: auto;
|
||||
top: 10%;
|
||||
position:relative;
|
||||
@media(max-height: 600px) {
|
||||
padding-top:.2rem
|
||||
}
|
||||
@media(min-height: 900px) {
|
||||
top:30%;
|
||||
}
|
||||
}
|
||||
.swiper-slide {
|
||||
text-align: center;
|
||||
.card{
|
||||
margin-top: 1vh;
|
||||
display: inline-block;
|
||||
width:80%;
|
||||
@media(min-height: 1000px) and (max-width: 699px) {
|
||||
.item {
|
||||
padding: 2vh 3vw 2vh 3vw;
|
||||
}
|
||||
}
|
||||
}
|
||||
@media(max-width: 500px) {
|
||||
&-next {
|
||||
left:-25%;
|
||||
}
|
||||
&-prev {
|
||||
left:25%;
|
||||
}
|
||||
}
|
||||
}
|
||||
@media (max-height: 600px) {
|
||||
& {
|
||||
-webkit-transform: translate(-50%, -58%);
|
||||
transform: translate(-50%, -58%);
|
||||
}
|
||||
}
|
||||
}
|
||||
}
|
||||
}
|
||||
@media(min-width: 700px) and (min-height: 700px) {
|
||||
.wallets {
|
||||
display: none;
|
||||
}
|
||||
#address {
|
||||
float:left;
|
||||
height:100%;
|
||||
width:calc(100% - 410px);
|
||||
@media(max-width: 1000px){
|
||||
width:65%;
|
||||
}
|
||||
&-info {
|
||||
height: 100%;
|
||||
}
|
||||
#qr-options {
|
||||
.item{
|
||||
font-size:1rem;
|
||||
}
|
||||
}
|
||||
.qr {
|
||||
height: 70%;
|
||||
div {
|
||||
opacity: 0;
|
||||
transition: none;
|
||||
&.current {
|
||||
opacity: 1;
|
||||
}
|
||||
}
|
||||
}
|
||||
.bit-address {
|
||||
opacity: 0;
|
||||
transition: none;
|
||||
&.current {
|
||||
opacity: 1;
|
||||
}
|
||||
}
|
||||
.backup,
|
||||
#bit-address {
|
||||
left:0;
|
||||
}
|
||||
#bit-address {
|
||||
height: 10%;
|
||||
padding: 1vh;
|
||||
.bit-address {
|
||||
.item{
|
||||
top: 40%;
|
||||
-webkit-transform: translateY(-40%);
|
||||
transform: translateY(-40%);
|
||||
font-size:1rem;
|
||||
}
|
||||
}
|
||||
}
|
||||
}
|
||||
#wallets {
|
||||
float:left;
|
||||
width:35%;
|
||||
height: 100%;
|
||||
display: flex;
|
||||
flex-direction: column;
|
||||
overflow: visible;
|
||||
max-width: 410px;
|
||||
@media(max-height: 600px) {
|
||||
padding-top:.55rem;
|
||||
}
|
||||
@media(max-width: 1000px) {
|
||||
max-width: none;
|
||||
}
|
||||
#sidebar-wallet {
|
||||
display: block;
|
||||
}
|
||||
.list {
|
||||
height: 100%;overflow: visible;
|
||||
}
|
||||
#wallet-list {
|
||||
position: absolute;
|
||||
width: 110%;
|
||||
overflow-y: auto;
|
||||
height: 100%;
|
||||
left: -6%;
|
||||
}
|
||||
.wallet {
|
||||
&.current {
|
||||
position: relative;
|
||||
.card {
|
||||
opacity: 1;
|
||||
-webkit-transform: scale(1);
|
||||
transform: scale(1);
|
||||
}
|
||||
&:before {
|
||||
right: 93%;
|
||||
top: 50%;
|
||||
border: solid transparent;
|
||||
content: " ";
|
||||
height: 0;
|
||||
width: 0;
|
||||
position: absolute;
|
||||
pointer-events: none;
|
||||
border-right-color: #f2f2f2;
|
||||
border-width: 20px;
|
||||
margin-top: -20px;
|
||||
}
|
||||
}
|
||||
}
|
||||
.card {
|
||||
max-width: 350px;
|
||||
box-shadow: 0 1px 36px rgba(0, 0, 0, 0.07);
|
||||
padding:0;
|
||||
border-radius: 6px;
|
||||
padding:2px;
|
||||
width: 80%;
|
||||
position: relative;
|
||||
margin: 1.5rem auto 0;
|
||||
position: relative;
|
||||
opacity: .5;
|
||||
-webkit-transform:scale(.85);
|
||||
transform:scale(.85);
|
||||
transition:transform .2s ease;
|
||||
.item {
|
||||
padding: 6% 10% 6% 8%;
|
||||
span {
|
||||
clear: both;
|
||||
width: 100%;
|
||||
display: inline-block;
|
||||
&.wallet-name {
|
||||
font-size:16px;
|
||||
width: 79%;
|
||||
white-space: nowrap;
|
||||
text-overflow: ellipsis;
|
||||
overflow: hidden;
|
||||
font-weight: 600;
|
||||
}
|
||||
&.wallet-number {
|
||||
visibility: hidden;
|
||||
}
|
||||
&.visible {
|
||||
visibility: visible !important;
|
||||
}
|
||||
}
|
||||
.big-icon-svg {
|
||||
padding: 0;
|
||||
& > .bg {
|
||||
padding:.3rem;
|
||||
width: 40px;
|
||||
height:40px;
|
||||
}
|
||||
}
|
||||
}
|
||||
margin-top: 20%;
|
||||
}
|
||||
}
|
||||
}
|
||||
}
|
||||
@keyframes fadeIn {
|
||||
0% {
|
||||
opacity: 0;
|
||||
}
|
||||
100% {
|
||||
opacity: 1;
|
||||
}
|
||||
}
|
||||
|
|
|
|||
|
|
@ -34,10 +34,6 @@
|
|||
<div class="item view-all" ng-click="scan()">
|
||||
<span translate>Scan addresses for funds</span>
|
||||
</div>
|
||||
<div class="item item-icon-right view-all" ng-click="requestSpecificAmount()">
|
||||
<span translate>Request Specific amount</span>
|
||||
<i class="icon ion-ios-arrow-thin-right"></i>
|
||||
</div>
|
||||
<div class="item item-icon-right view-all" ng-if="viewAll.value" ng-click="viewAllAddresses()">
|
||||
<span translate>View All Addresses</span>
|
||||
<i class="icon ion-ios-arrow-thin-right"></i>
|
||||
|
|
|
|||
|
|
@ -12,14 +12,8 @@
|
|||
</ion-nav-buttons>
|
||||
</ion-nav-bar>
|
||||
<ion-content scroll="false">
|
||||
<div class="item head text-center">
|
||||
<div class="item head text-center" copy-to-clipboard="'bitcoin:' + address + '?amount=' + amountBtc">
|
||||
<qrcode size="220" data="bitcoin:{{address + '?amount=' + amountBtc}}" color="#334"></qrcode>
|
||||
<div class="row text-center share" ng-if="isCordova">
|
||||
<div class="item item-icon-left" ng-click="shareAddress('bitcoin:' + address + '?amount=' + amountBtc)" ng-show="true">
|
||||
<i class="icon ion-ios-upload-outline"></i>
|
||||
<span translate>Share</span>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
<div class="info">
|
||||
<div class="item single-line">
|
||||
|
|
|
|||
|
|
@ -13,6 +13,10 @@
|
|||
<span translate>Wallet Information</span>
|
||||
<i class="icon bp-arrow-right"></i>
|
||||
</a>
|
||||
<a class="item item-icon-right" ng-click="goToAddresses()">
|
||||
<span translate>Wallet Addresses</span>
|
||||
<i class="icon bp-arrow-right"></i>
|
||||
</a>
|
||||
<a class="item item-icon-right" ui-sref="tabs.preferences.export">
|
||||
<span translate>Export Wallet</span>
|
||||
<i class="icon bp-arrow-right"></i>
|
||||
|
|
|
|||
|
|
@ -6,25 +6,8 @@
|
|||
<article class="list card padding text-center" ng-if="!wallets[0]">
|
||||
<span translate>No Wallet</span>
|
||||
</article>
|
||||
<article id="address" ng-if="wallets[0]">
|
||||
<div id="address-info" class="text-center" ng-if="!wallet">
|
||||
<div class="row qr">
|
||||
<div class="text-center col center-block">
|
||||
<div style="height:225px; width:220px; margin:auto; background: white; padding-top: 25%;">
|
||||
...
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
<div class="row border-top">
|
||||
<div class="col col-90 center-block bit-address text-center">
|
||||
<div class="item item-icon-left">
|
||||
<i class="icon icon-svg receive-tab-bitcoin-icon"><img src="img/icon-bitcoin-symbol.svg"></i>
|
||||
<span class="bit-address-gen-address">...</span>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
<div id="address-info" class="text-center" ng-if="wallet && !wallet.isComplete()">
|
||||
<article class="address" ng-if="wallets[0]">
|
||||
<div class="address-info" class="text-center" ng-if="wallet && !wallet.isComplete()">
|
||||
<div class="incomplete">
|
||||
<div class="title">
|
||||
<span translate>Incomplete wallet</span>
|
||||
|
|
@ -32,72 +15,63 @@
|
|||
<div class="subtitle">
|
||||
<span translate>All signing devices must be added to this multisig wallet before bitcoin addresses can be created.</span>
|
||||
</div>
|
||||
<div>
|
||||
<button class="button button-standard button-primary" ng-click="goCopayers()" translate>Open wallet</button>
|
||||
</div>
|
||||
</div>
|
||||
<div class="row border-top">
|
||||
<div class="col col-90 center-block bit-address text-center">
|
||||
<div class="item item-icon-left">
|
||||
<i class="icon icon-svg receive-tab-bitcoin-icon"><img src="img/icon-bitcoin-symbol.svg"></i>
|
||||
<span class="bit-address-gen-address" translate>address not yet available</span>
|
||||
</div>
|
||||
</div>
|
||||
<button class="button button-standard button-primary" ng-click="goCopayers()" translate>Open wallet</button>
|
||||
</div>
|
||||
</div>
|
||||
<div id="address-info" ng-if="wallet && wallet.isComplete()">
|
||||
<div class="address-info" ng-if="wallet && wallet.isComplete()">
|
||||
<div class="row backup" ng-show="wallet.needsBackup" ng-click="openBackupNeededModal()">
|
||||
<div class="text-center col center-block">
|
||||
<i class="icon ion-alert"></i><span translate>Wallet not backed up</span><i class="icon ion-ios-arrow-thin-right"></i>
|
||||
</div>
|
||||
</div>
|
||||
<div class="row qr">
|
||||
<div class="text-center col center-block" copy-to-clipboard="addr" ng-repeat="wallet in wallets track by $index" ng-class="walletPosition($index)">
|
||||
<span class="overlay" ng-show="shouldShowReceiveAddressFromHardware()">
|
||||
<button class="button button-standard button-primary" ng-click="showReceiveAddressFromHardware()">
|
||||
<span translate>Show address</span>
|
||||
</button>
|
||||
</span>
|
||||
<qrcode ng-if="walletAddrs[wallet.id]" size="220" data="bitcoin:{{walletAddrs[wallet.id]}}" color="#334"></qrcode>
|
||||
</div>
|
||||
</div>
|
||||
<div id="qr-options" class="row text-center">
|
||||
<div class="item item-icon-left" ng-click="shareAddress(addr)" ng-show="isCordova">
|
||||
<i class="icon ion-ios-upload-outline"></i>
|
||||
<span translate>Share</span>
|
||||
</div>
|
||||
</div>
|
||||
<div id="bit-address" class="row border-top" ng-click="showAddresses()">
|
||||
<div class="center-block bit-address text-center" ng-repeat="wallet in wallets track by $index" ng-class="walletPosition($index)">
|
||||
<div class="item item-icon-left item-icon-right">
|
||||
<i class="icon icon-svg receive-tab-bitcoin-icon"><img src="img/icon-bitcoin-symbol.svg"></i>
|
||||
<span class="bit-address-gen-address" class="ellipsis">{{walletAddrs[wallet.id]}}</span>
|
||||
<span class="bit-address-gen-address" ng-show="!walletAddrs[wallet.id]" translate>address not available</span>
|
||||
<i class="icon ion-ios-arrow-right"></i>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
</article>
|
||||
<article id="wallets" ng-if="wallets[0]">
|
||||
<div id="sidebar-wallet" class="list">
|
||||
<div id="wallet-list">
|
||||
<div class="wallet" ng-repeat="wallet in wallets track by $index" ng-click="setWallet($index)" ng-class="walletPosition($index)">
|
||||
<div class="card">
|
||||
<div class="item item-icon-left text-right" ng-class="{'noBalance': !wallet.status.availableBalanceStr}">
|
||||
<i class="icon big-icon-svg">
|
||||
<img src="img/icon-wallet.svg" ng-class="{'wallet-background-color-default': !wallet.color}" ng-style="{'background-color': wallet.color}" class="bg"/>
|
||||
</i>
|
||||
<span class="wallet-name">{{wallet.name || wallet.id}}</span>
|
||||
<span class="item-note m10l">
|
||||
{{wallet.status.availableBalanceStr}}
|
||||
</span>
|
||||
<div class="text-center col">
|
||||
<div copy-to-clipboard="copyToClipboard()">
|
||||
<span ng-show="shouldShowReceiveAddressFromHardware()">
|
||||
<button class="button button-standard button-primary" ng-click="showReceiveAddressFromHardware()">
|
||||
<span translate>Show address</span>
|
||||
</button>
|
||||
</span>
|
||||
<qrcode ng-if="addr" size="220" data="bitcoin:{{addr}}" color="#334"></qrcode>
|
||||
<div class="address-label">
|
||||
<span class="ellipsis">{{addr}}</span>
|
||||
<ion-spinner ng-show="!addr" class="spinner-dark" icon="crescent"></ion-spinner>
|
||||
</div>
|
||||
</div>
|
||||
<div ng-show="addr" class="request-button">
|
||||
<button class="button button-standard button-primary button-outline" ng-click="requestSpecificAmount()" translate>Request Specific amount</button>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
<wallets id="wallet-slider" wallets="wallets" options="sliderOptions"></wallets>
|
||||
</article>
|
||||
<div class="list card" ng-click="showWalletSelector()" ng-if="wallets[0]">
|
||||
<a ng-if="wallet" class="item item-sub item-icon-left item-big-icon-left item-icon-right">
|
||||
<i class="icon big-icon-svg">
|
||||
<img src="img/icon-wallet.svg" ng-class="{'wallet-background-color-default': !wallet.color}" ng-style="{'background-color': wallet.color}" class="bg wallet"/>
|
||||
</i>
|
||||
<span>
|
||||
{{wallet.name || wallet.id}}
|
||||
</span>
|
||||
<p>
|
||||
<span ng-if="!wallet.balanceHidden"> {{wallet.status.totalBalanceStr}} </span>
|
||||
|
||||
<span ng-if="wallet.balanceHidden" translate>[Balance Hidden]</span>
|
||||
<span class="tab-home__wallet__multisig-number" ng-if="wallet.n > 1">
|
||||
{{wallet.m}}-of-{{wallet.n}}
|
||||
</span>
|
||||
<span class="assertive" ng-if="wallet.error">{{wallet.error}}</span>
|
||||
|
||||
</p>
|
||||
<i ng-if="!singleWallet" class="icon bp-arrow-right"></i>
|
||||
</a>
|
||||
</div>
|
||||
</ion-content>
|
||||
<wallet-selector
|
||||
wallet-selector-title="walletSelectorTitle"
|
||||
wallet-selector-wallets="wallets"
|
||||
wallet-selector-selected-wallet="wallet"
|
||||
wallet-selector-show="showWallets"
|
||||
wallet-selector-on-select="onWalletSelect">
|
||||
</wallet-selector>
|
||||
</ion-view>
|
||||
|
|
|
|||
Loading…
Reference in New Issue