mirror of https://github.com/BTCPrivate/copay.git
Merge pull request #96 from cmgustavo/feature/send-form
Send form: validation and functionality. Issue in navbar was fixed
This commit is contained in:
commit
270891b5fd
17
css/main.css
17
css/main.css
|
@ -58,7 +58,6 @@ body {
|
|||
.header {
|
||||
background: #111;
|
||||
color: white;
|
||||
overflow: hidden;
|
||||
margin-bottom: 30px;
|
||||
}
|
||||
|
||||
|
@ -71,6 +70,10 @@ body {
|
|||
color: #fff;
|
||||
}
|
||||
|
||||
.top-bar {
|
||||
height: auto;
|
||||
}
|
||||
|
||||
.panel {
|
||||
color: #333;
|
||||
background: #FFFFFF;
|
||||
|
@ -164,7 +167,7 @@ span.panel-res {
|
|||
color: #FBE500;
|
||||
}
|
||||
|
||||
.alert-box.warning {
|
||||
.alert-box.warning, .alert-box.error {
|
||||
background-color: #C0392A;
|
||||
border-color: #C0392A;
|
||||
color: #fff;
|
||||
|
@ -174,6 +177,14 @@ span.panel-res {
|
|||
color:#C0392A;
|
||||
}
|
||||
|
||||
small.is-valid {
|
||||
color: #04B404;
|
||||
}
|
||||
|
||||
small.has-error {
|
||||
color: #f04124;
|
||||
}
|
||||
|
||||
hr { margin: 2.25rem 0;}
|
||||
|
||||
button.primary { background-color: #111; }
|
||||
|
@ -203,4 +214,4 @@ button.secondary:hover { background-color: #FFDF00 !important;}
|
|||
.p20h {padding: 0 20px;}
|
||||
.m30v {margin: 30px 0;}
|
||||
.m30a {margin: 30px auto;}
|
||||
.br100 {border-radius: 100%;}
|
||||
.br100 {border-radius: 100%;}
|
||||
|
|
71
index.html
71
index.html
|
@ -45,11 +45,14 @@
|
|||
|
||||
</div>
|
||||
|
||||
<div ng-if='$root.flashMessage.message' class="panel callout radius" style="color:red" >
|
||||
{{$root.flashMessage.type}}:
|
||||
{{$root.flashMessage.message}}
|
||||
<a ng-click="clearFlashMessage()" class="button tiny">Dismiss</a>
|
||||
<div class="row" ng-if='$root.flashMessage.message'>
|
||||
<div class="small-8 large-centered columns">
|
||||
<div data-alert class="alert-box round {{$root.flashMessage.type}}">
|
||||
{{$root.flashMessage.message}}
|
||||
<a ng-click="clearFlashMessage()" class="close">×</a>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
|
||||
<div class="row">
|
||||
<div ng-if='$root.wallet && !$root.wallet.publicKeyRing.isComplete() && !loading' data-alert class="alert-box warning round" >
|
||||
|
@ -68,7 +71,7 @@
|
|||
|
||||
</div>
|
||||
|
||||
<div class="row m30a">
|
||||
<div class="row">
|
||||
<div class="large-12 columns" ng-view></div>
|
||||
</div>
|
||||
|
||||
|
@ -296,21 +299,51 @@
|
|||
<script type="text/ng-template" id="send.html">
|
||||
<div class="send" data-ng-controller="SendController">
|
||||
<div class="row" ng-show='$root.wallet.publicKeyRing.isComplete()'>
|
||||
<div class="large-8 columns">
|
||||
<form>
|
||||
<label for="address">To
|
||||
<input type="text" id="address" placeholder="Send to">
|
||||
</label>
|
||||
<label for="amount">Amount
|
||||
<input type="text" id="amount" placeholder="Amount">
|
||||
<select class="form-control">
|
||||
<option>mBTC</option>
|
||||
<option>BTC</option>
|
||||
</select>
|
||||
</label>
|
||||
<button class="button primary round" type="button" ng-click="sendTest()">sendTest</button>
|
||||
<button type="submit" class="button secondary round right">send</button>
|
||||
<div class="small-6 large-centered columns">
|
||||
<h1>{{title}}</h1>
|
||||
<form name="sendForm" ng-submit="submitForm(sendForm)" novalidate>
|
||||
<div class="row">
|
||||
<div class="large-12 columns">
|
||||
<label for="address">To address
|
||||
<small ng-hide="!sendForm.address.$pristine">required</small>
|
||||
<small class="is-valid" ng-show="!sendForm.address.$invalid && !sendForm.address.$pristine">is valid!</small>
|
||||
<small class="has-error" ng-show="sendForm.address.$invalid && !sendForm.address.$pristine">
|
||||
is not valid</small>
|
||||
</label>
|
||||
<input type="text" id="address" name="address" placeholder="Send to" ng-model="address" ng-minlength="20" ng-maxlength="37" required>
|
||||
</div>
|
||||
</div>
|
||||
|
||||
<div class="row">
|
||||
<div class="large-6 columns">
|
||||
<div class="row collapse">
|
||||
<label for="amount">Amount
|
||||
<small ng-hide="!sendForm.amount.$pristine">required</small>
|
||||
<small class="is-valid" ng-show="!sendForm.amount.$invalid && !sendForm.amount.$pristine">is valid!</small>
|
||||
<small class="has-error" ng-show="sendForm.amount.$invalid && !sendForm.amount.$pristine">
|
||||
is not valid</small>
|
||||
</label>
|
||||
<div class="small-9 columns">
|
||||
<input type="number" id="amount" name="amount" placeholder="Amount" ng-model="amount" min="0.0001" max="10000000" required>
|
||||
</div>
|
||||
<div class="small-3 columns">
|
||||
<span class="postfix">BTC</span>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
<div class="row">
|
||||
<div class="large-4 columns">
|
||||
<button type="submit" class="button secondary round text-center" ng-disabled="sendForm.$invalid">
|
||||
Send
|
||||
</button>
|
||||
</div>
|
||||
</div>
|
||||
</form>
|
||||
<hr>
|
||||
<div class="text-center">
|
||||
<a ng-click="sendTest()">sendTest</a>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
|
|
|
@ -4,6 +4,9 @@ angular.module('copay.send').controller('SendController',
|
|||
function($scope, $rootScope, $location, Socket, controllerUtils) {
|
||||
$scope.title = 'Send';
|
||||
|
||||
$scope.unitIds = ['BTC','mBTC'];
|
||||
$scope.selectedUnit = $scope.unitIds[0];
|
||||
|
||||
if (!$rootScope.wallet || !$rootScope.wallet.id) {
|
||||
$location.path('signin');
|
||||
}
|
||||
|
@ -11,6 +14,30 @@ angular.module('copay.send').controller('SendController',
|
|||
controllerUtils.handleTransactionByAddress($scope);
|
||||
}
|
||||
|
||||
$scope.submitForm = function(form) {
|
||||
if (form.$invalid) {
|
||||
$rootScope.flashMessage = { message: 'You can not send a proposal transaction. Please, try again', type: 'error'};
|
||||
return;
|
||||
}
|
||||
|
||||
var address = form.address.$modelValue;
|
||||
var amount = (form.amount.$modelValue * 100000000).toString(); // satoshi to string
|
||||
|
||||
var w = $rootScope.wallet;
|
||||
w.createTx( address, amount,function() {
|
||||
$rootScope.$digest();
|
||||
});
|
||||
|
||||
// reset fields
|
||||
$scope.address = null;
|
||||
$scope.amount = null;
|
||||
form.address.$pristine = true;
|
||||
form.amount.$pristine = true;
|
||||
|
||||
// TODO: check if createTx has an error.
|
||||
$rootScope.flashMessage = { message: 'You send a proposal transaction succefully', type: 'success'};
|
||||
};
|
||||
|
||||
$scope.sendTest = function() {
|
||||
var w = $rootScope.wallet;
|
||||
w.createTx( 'mimoZNLcP2rrMRgdeX5PSnR7AjCqQveZZ4', '12345',function() {
|
||||
|
|
Loading…
Reference in New Issue