mirror of https://github.com/BTCPrivate/copay.git
Merge pull request #5106 from gabrielbazan7/feat/customAmount
custom amount feature
This commit is contained in:
Gustavo Maximiliano Cortez
GitHub
commit
c97079ac92
|
|
@ -24,7 +24,9 @@ angular.module('copayApp.controllers').controller('amountController', function($
|
|||
$scope.showAlternativeAmount = !!$scope.cardId;
|
||||
$scope.toColor = data.stateParams.toColor;
|
||||
|
||||
if (!$scope.cardId && !$stateParams.toAddress) {
|
||||
$scope.customAmount = data.stateParams.customAmount;
|
||||
|
||||
if (!$scope.cardId && !data.stateParams.toAddress) {
|
||||
$log.error('Bad params at amount')
|
||||
throw ('bad params');
|
||||
}
|
||||
|
|
@ -240,13 +242,20 @@ angular.module('copayApp.controllers').controller('amountController', function($
|
|||
|
||||
} else {
|
||||
var amount = $scope.showAlternativeAmount ? fromFiat(_amount) : _amount;
|
||||
$state.transitionTo('tabs.send.confirm', {
|
||||
isWallet: $scope.isWallet,
|
||||
toAmount: (amount * unitToSatoshi).toFixed(0),
|
||||
toAddress: $scope.toAddress,
|
||||
toName: $scope.toName,
|
||||
toEmail: $scope.toEmail
|
||||
});
|
||||
if ($scope.customAmount) {
|
||||
$state.transitionTo('tabs.receive.customAmount', {
|
||||
toAmount: (amount * unitToSatoshi).toFixed(0),
|
||||
toAddress: $scope.toAddress
|
||||
});
|
||||
} else {
|
||||
$state.transitionTo('tabs.send.confirm', {
|
||||
isWallet: $scope.isWallet,
|
||||
toAmount: (amount * unitToSatoshi).toFixed(0),
|
||||
toAddress: $scope.toAddress,
|
||||
toName: $scope.toName,
|
||||
toEmail: $scope.toEmail
|
||||
});
|
||||
}
|
||||
}
|
||||
};
|
||||
});
|
||||
|
|
|
|||
|
|
@ -0,0 +1,27 @@
|
|||
'use strict';
|
||||
|
||||
angular.module('copayApp.controllers').controller('customAmountController', function($rootScope, $scope, $stateParams, $ionicHistory, txFormatService, platformInfo) {
|
||||
|
||||
$scope.$on("$ionicView.beforeEnter", function(event, data) {
|
||||
var satToBtc = 1 / 100000000;
|
||||
$scope.isCordova = platformInfo.isCordova;
|
||||
$scope.address = data.stateParams.toAddress;
|
||||
$scope.amount = parseInt(data.stateParams.toAmount);
|
||||
$scope.amountBtc = ($scope.amount * satToBtc).toFixed(8);
|
||||
$scope.amountStr = txFormatService.formatAmountStr($scope.amount);
|
||||
$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,
|
||||
historyRoot: true
|
||||
});
|
||||
$ionicHistory.goBack(-2);
|
||||
};
|
||||
|
||||
});
|
||||
|
|
@ -1,79 +0,0 @@
|
|||
'use strict';
|
||||
|
||||
angular.module('copayApp.controllers').controller('customAmountController', function($scope, $timeout, $filter, platformInfo, rateService) {
|
||||
var self = $scope.self;
|
||||
|
||||
$scope.unitName = self.unitName;
|
||||
$scope.alternativeAmount = self.alternativeAmount;
|
||||
$scope.alternativeName = self.alternativeName;
|
||||
$scope.alternativeIsoCode = self.alternativeIsoCode;
|
||||
$scope.isRateAvailable = self.isRateAvailable;
|
||||
$scope.unitToSatoshi = self.unitToSatoshi;
|
||||
$scope.unitDecimals = self.unitDecimals;
|
||||
var satToUnit = 1 / self.unitToSatoshi;
|
||||
$scope.showAlternative = false;
|
||||
$scope.isCordova = platformInfo.isCordova;
|
||||
|
||||
Object.defineProperty($scope,
|
||||
"_customAlternative", {
|
||||
get: function() {
|
||||
return $scope.customAlternative;
|
||||
},
|
||||
set: function(newValue) {
|
||||
$scope.customAlternative = newValue;
|
||||
if (typeof(newValue) === 'number' && $scope.isRateAvailable) {
|
||||
$scope.customAmount = parseFloat((rateService.fromFiat(newValue, $scope.alternativeIsoCode) * satToUnit).toFixed($scope.unitDecimals), 10);
|
||||
} else {
|
||||
$scope.customAmount = null;
|
||||
}
|
||||
},
|
||||
enumerable: true,
|
||||
configurable: true
|
||||
});
|
||||
|
||||
Object.defineProperty($scope,
|
||||
"_customAmount", {
|
||||
get: function() {
|
||||
return $scope.customAmount;
|
||||
},
|
||||
set: function(newValue) {
|
||||
$scope.customAmount = newValue;
|
||||
if (typeof(newValue) === 'number' && $scope.isRateAvailable) {
|
||||
$scope.customAlternative = parseFloat((rateService.toFiat(newValue * $scope.unitToSatoshi, $scope.alternativeIsoCode)).toFixed(2), 10);
|
||||
} else {
|
||||
$scope.customAlternative = null;
|
||||
}
|
||||
$scope.alternativeAmount = $scope.customAlternative;
|
||||
},
|
||||
enumerable: true,
|
||||
configurable: true
|
||||
});
|
||||
|
||||
$scope.submitForm = function(form) {
|
||||
var satToBtc = 1 / 100000000;
|
||||
var amount = form.amount.$modelValue;
|
||||
var amountSat = parseInt((amount * $scope.unitToSatoshi).toFixed(0));
|
||||
$timeout(function() {
|
||||
$scope.customizedAmountUnit = amount + ' ' + $scope.unitName;
|
||||
$scope.customizedAlternativeUnit = $filter('formatFiatAmount')(form.alternative.$modelValue) + ' ' + $scope.alternativeIsoCode;
|
||||
if ($scope.unitName == 'bits') {
|
||||
amount = (amountSat * satToBtc).toFixed(8);
|
||||
}
|
||||
$scope.customizedAmountBtc = amount;
|
||||
}, 1);
|
||||
};
|
||||
|
||||
$scope.toggleAlternative = function() {
|
||||
$scope.showAlternative = !$scope.showAlternative;
|
||||
};
|
||||
|
||||
$scope.shareAddress = function(uri) {
|
||||
if (platformInfo.isCordova) {
|
||||
window.plugins.socialsharing.share(uri, null, null, null);
|
||||
}
|
||||
};
|
||||
|
||||
$scope.cancel = function() {
|
||||
$scope.customAmountModal.hide();
|
||||
};
|
||||
});
|
||||
|
|
@ -1,8 +1,9 @@
|
|||
'use strict';
|
||||
|
||||
angular.module('copayApp.controllers').controller('tabReceiveController', function($rootScope, $scope, $timeout, $log, $ionicModal, $state, $ionicHistory, storageService, platformInfo, walletService, profileService, configService, lodash, gettextCatalog, popupService, bwcError) {
|
||||
angular.module('copayApp.controllers').controller('tabReceiveController', function($rootScope, $scope, $timeout, $log, $ionicModal, $state, $ionicHistory, $ionicPopover, storageService, platformInfo, walletService, profileService, configService, lodash, gettextCatalog, popupService, bwcError) {
|
||||
|
||||
var listeners = [];
|
||||
var MENU_ITEM_HEIGHT = 55;
|
||||
$scope.isCordova = platformInfo.isCordova;
|
||||
$scope.isNW = platformInfo.isNW;
|
||||
$scope.walletAddrs = {};
|
||||
|
|
@ -139,6 +140,31 @@ angular.module('copayApp.controllers').controller('tabReceiveController', functi
|
|||
});
|
||||
};
|
||||
|
||||
var goRequestAmount = function() {
|
||||
$scope.menu.hide();
|
||||
$state.go('tabs.receive.amount', {
|
||||
customAmount: true,
|
||||
toAddress: $scope.addr
|
||||
});
|
||||
}
|
||||
|
||||
$scope.showMenu = function(allAddresses, $event) {
|
||||
var requestAmountObj = {
|
||||
text: gettextCatalog.getString('Request Specific amount'),
|
||||
action: goRequestAmount,
|
||||
};
|
||||
|
||||
$scope.items = [requestAmountObj];
|
||||
$scope.height = $scope.items.length * MENU_ITEM_HEIGHT;
|
||||
|
||||
$ionicPopover.fromTemplateUrl('views/includes/menu-popover.html', {
|
||||
scope: $scope
|
||||
}).then(function(popover) {
|
||||
$scope.menu = popover;
|
||||
$scope.menu.show($event);
|
||||
});
|
||||
};
|
||||
|
||||
$scope.$on("$ionicView.beforeEnter", function(event, data) {
|
||||
$scope.wallets = profileService.getWallets();
|
||||
|
||||
|
|
|
|||
|
|
@ -632,6 +632,31 @@ angular.module('copayApp').config(function(historicLogProvider, $provide, $logPr
|
|||
}
|
||||
})
|
||||
|
||||
/*
|
||||
*
|
||||
* Request Specific amount
|
||||
*
|
||||
*/
|
||||
|
||||
.state('tabs.receive.amount', {
|
||||
url: '/amount/:customAmount/:toAddress',
|
||||
views: {
|
||||
'tab-receive@tabs': {
|
||||
controller: 'amountController',
|
||||
templateUrl: 'views/amount.html'
|
||||
}
|
||||
}
|
||||
})
|
||||
.state('tabs.receive.customAmount', {
|
||||
url: '/customAmount/:toAmount/:toAddress',
|
||||
views: {
|
||||
'tab-receive@tabs': {
|
||||
controller: 'customAmountController',
|
||||
templateUrl: 'views/customAmount.html'
|
||||
}
|
||||
}
|
||||
})
|
||||
|
||||
/*
|
||||
*
|
||||
* Init backup flow
|
||||
|
|
|
|||
|
|
@ -34,7 +34,7 @@
|
|||
position: absolute;
|
||||
top: 10px;
|
||||
}
|
||||
.amount-pane {
|
||||
.amount-pane-send {
|
||||
position: absolute;
|
||||
top: 95px;
|
||||
bottom: 0;
|
||||
|
|
@ -65,6 +65,37 @@
|
|||
}
|
||||
}
|
||||
}
|
||||
.amount-pane-receive {
|
||||
position: absolute;
|
||||
top: 0;
|
||||
bottom: 0;
|
||||
width: 100%;
|
||||
background-color: #fff;
|
||||
padding: 0 16px;
|
||||
|
||||
.amount-bar {
|
||||
padding: 24px 0;
|
||||
font-size: 18px;
|
||||
.title {
|
||||
float: left;
|
||||
padding-top: 10px;
|
||||
color: $dark-gray;
|
||||
font-weight: bold;
|
||||
}
|
||||
}
|
||||
.amount {
|
||||
display: flex;
|
||||
flex-direction: column;
|
||||
justify-content: center;
|
||||
flex-grow: 1;
|
||||
position: absolute;
|
||||
bottom: 254px;
|
||||
top: 66px;
|
||||
.light {
|
||||
color: $light-gray;
|
||||
}
|
||||
}
|
||||
}
|
||||
.amount {
|
||||
&__editable {
|
||||
margin-bottom: 1rem;
|
||||
|
|
|
|||
|
|
@ -0,0 +1,16 @@
|
|||
#custom-amount {
|
||||
.share {
|
||||
justify-content: center;
|
||||
}
|
||||
.info {
|
||||
.single-line {
|
||||
display: flex;
|
||||
align-items: center;
|
||||
padding-top: 17px;
|
||||
padding-bottom: 17px;
|
||||
.item-note {
|
||||
margin-left: 10px;
|
||||
}
|
||||
}
|
||||
}
|
||||
}
|
||||
|
|
@ -200,7 +200,7 @@
|
|||
}
|
||||
}
|
||||
#bit-address {
|
||||
position: realtive;
|
||||
position: relative;
|
||||
}
|
||||
}
|
||||
}
|
||||
|
|
|
|||
|
|
@ -41,3 +41,4 @@
|
|||
@import "includes/walletSelector";
|
||||
@import "integrations/coinbase";
|
||||
@import "integrations/glidera";
|
||||
@import "custom-amount";
|
||||
|
|
|
|||
|
|
@ -1,7 +1,7 @@
|
|||
<ion-view id="view-amount" hide-tabs>
|
||||
<ion-nav-bar class="bar-royal">
|
||||
<ion-nav-title>
|
||||
{{'Enter Amount'|translate}}
|
||||
{{'Enter Amount' | translate}}
|
||||
</ion-nav-title>
|
||||
<ion-nav-back-button>
|
||||
</ion-nav-back-button>
|
||||
|
|
@ -9,7 +9,7 @@
|
|||
|
||||
<ion-content scroll="false">
|
||||
|
||||
<div>
|
||||
<div ng-if="!customAmount">
|
||||
<div class="item item-no-bottom-border recipient-label" translate>Recipient</div>
|
||||
|
||||
<div class="item item-text-wrap item-icon-left bitcoin-address" ng-class="{'item-big-icon-left':cardId}">
|
||||
|
|
@ -26,7 +26,7 @@
|
|||
</div>
|
||||
</div>
|
||||
|
||||
<div class="amount-pane">
|
||||
<div ng-class="{'amount-pane-send': !customAmount, 'amount-pane-receive': customAmount}">
|
||||
|
||||
<div class="amount-bar">
|
||||
<div class="title" translate>Amount</div>
|
||||
|
|
|
|||
|
|
@ -0,0 +1,39 @@
|
|||
<ion-view id="custom-amount" hide-tabs>
|
||||
<ion-nav-bar class="bar-royal">
|
||||
<ion-nav-title>
|
||||
{{'Custom Amount' | translate}}
|
||||
</ion-nav-title>
|
||||
<ion-nav-back-button>
|
||||
</ion-nav-back-button>
|
||||
<ion-nav-buttons side="secondary">
|
||||
<button class="button no-border" ng-click="finish()" translate>
|
||||
Finish
|
||||
</button>
|
||||
</ion-nav-buttons>
|
||||
</ion-nav-bar>
|
||||
<ion-content scroll="false">
|
||||
<div class="item head text-center">
|
||||
<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">
|
||||
<span class="label" translate>Address</span>
|
||||
<span class="item-note ellipsis">
|
||||
{{address}}
|
||||
</span>
|
||||
</div>
|
||||
<div class="item single-line">
|
||||
<span class="label" translate>Amount</span>
|
||||
<span class="item-note">
|
||||
{{amountStr}} - {{altAmountStr}}
|
||||
</span>
|
||||
</div>
|
||||
</div>
|
||||
</ion-content>
|
||||
</ion-view>
|
||||
|
|
@ -1,88 +0,0 @@
|
|||
<ion-modal-view ng-controller="customAmountController">
|
||||
<ion-header-bar align-title="center" class="tab-bar" ng-style="{'background-color':color, 'border-color': color}">
|
||||
<div class="left-small">
|
||||
<a ng-click="cancel()" class="p10">
|
||||
<span class="text-close" translate>Close</span>
|
||||
</a>
|
||||
</div>
|
||||
<h1 class="title ellipsis" translate>Request a specific amount</h1>
|
||||
</ion-header-bar>
|
||||
|
||||
<ion-content ng-style="{'background-color': '#f6f7f9'}">
|
||||
<div class="fix-modals-touch">
|
||||
<div class="m20b" ng-show="customizedAmountBtc">
|
||||
<h4 class="title m0" translate>QR Code</h4>
|
||||
<ul class="no-bullet size-14 m0">
|
||||
<li class="line-b p10 oh text-center">
|
||||
<qrcode size="220" data="bitcoin:{{addr + '?amount=' + customizedAmountBtc}}" color="#334"></qrcode>
|
||||
<div class="m10t text-center" ng-show="isCordova">
|
||||
<span class="button outline dark-gray tiny round"
|
||||
ng-click="shareAddress('bitcoin:' + addr + '?amount=' + customizedAmountBtc)">
|
||||
<i class="fi-share"></i>
|
||||
<span translate>Share address</span>
|
||||
</span>
|
||||
</div>
|
||||
</li>
|
||||
</ul>
|
||||
|
||||
<h4 class="title m0" translate>Details</h4>
|
||||
<ul class="no-bullet size-14 m0">
|
||||
<li class="line-b p10 oh">
|
||||
<span class="text-gray" translate>Address</span>:
|
||||
<span class="right">
|
||||
<span class="text-gray enable_text_select">{{addr}}</span>
|
||||
</span>
|
||||
</li>
|
||||
<li class="line-b p10 oh">
|
||||
<span class="text-gray" translate>Amount</span>:
|
||||
<span class="right">
|
||||
{{customizedAmountUnit}}
|
||||
<span class="label gray radius">{{customizedAlternativeUnit}}</span>
|
||||
</span>
|
||||
</li>
|
||||
</ul>
|
||||
</div>
|
||||
|
||||
<div ng-show="!customizedAmountBtc" class="row m20t">
|
||||
<div class="large-12 large-centered columns">
|
||||
<form name="amountForm" ng-submit="submitForm(amountForm)" novalidate>
|
||||
<div class="right" ng-hide="amountForm.amount.$pristine && !amountForm.amount.$modelValue ">
|
||||
<span class="has-error right size-12" ng-if="amountForm.amount.$invalid">
|
||||
<i class="icon-close-circle size-14"></i>
|
||||
<span clas="vm" translate>Not valid</span>
|
||||
</span>
|
||||
<small class="text-primary right" ng-if="!amountForm.amount.$invalid">
|
||||
<i class="icon-checkmark-circle size-14"></i>
|
||||
</small>
|
||||
</div>
|
||||
<div ng-show="!showAlternative">
|
||||
<label for="amount">
|
||||
<span translate>Amount</span>
|
||||
</label>
|
||||
<div class="input">
|
||||
<input type="number" id="amount" name="amount" ng-attr-placeholder="{{'Amount in'|translate}} {{unitName}}" ignore-mouse-wheel
|
||||
ng-model="_customAmount" ng-minlength="0.00000001" ng-maxlength="10000000000" valid-amount required autocomplete="off">
|
||||
<input type="number" id="alternative" name="alternative" ng-model="_customAlternative" style="display:none">
|
||||
<a class="postfix button" ng-style="{'background-color':color}" ng-click="toggleAlternative()">{{unitName}}</a>
|
||||
</div>
|
||||
</div>
|
||||
<div ng-show="showAlternative">
|
||||
<label for="alternative"><span translate>Amount</span> [{{ alternativeIsoCode }}]
|
||||
</label>
|
||||
<div class="input">
|
||||
<input type="number" id="alternative" name="alternative" ng-attr-placeholder="{{'Amount in'|translate}} {{alternativeName}}" ignore-mouse-wheel
|
||||
ng-model="_customAlternative" required autocomplete="off" required>
|
||||
<input type="number" id="amount" name="amount" ng-model="_customAmount" style="display:none">
|
||||
<a class="postfix button black" ng-click="toggleAlternative()"> {{ alternativeIsoCode }}</a>
|
||||
</div>
|
||||
</div>
|
||||
|
||||
<button type="submit" class="button black round expand" ng-disabled="amountForm.$invalid" ng-style="{'background-color':color}" translate>
|
||||
Generate QR Code
|
||||
</button>
|
||||
</form>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
</ion-content>
|
||||
</ion-view-modal>
|
||||
|
|
@ -1,6 +1,11 @@
|
|||
<ion-view id="tab-receive">
|
||||
<ion-nav-bar class="bar-royal">
|
||||
<ion-nav-title>{{'Receive' | translate}}</ion-nav-title>
|
||||
<ion-nav-buttons side="secondary">
|
||||
<button ng-disabled="generatingAddress" class="button back-button" ng-click="showMenu(false, $event)">
|
||||
<i class="icon ion-ios-more"></i>
|
||||
</button>
|
||||
</ion-nav-buttons>
|
||||
</ion-nav-bar>
|
||||
<ion-content scroll="false">
|
||||
<article class="list card padding text-center" ng-if="!wallets[0]">
|
||||
|
|
|
|||
Loading…
Reference in New Issue