Merge pull request #125 from cmgustavo/feature/05-send-form

Improve send form: check if address is valid using bitcore

css/main.css

@@ -201,11 +201,13 @@ span.panel-res {
 }
 
 small.is-valid {
-  color: #04B404; 
+  color: #04B404;
+  font-weight: bold;
 }
 
 small.has-error {
   color: #f04124;
+  font-weight: bold;
 }
 
 @media (max-width: 641px) {
@@ -253,9 +255,7 @@ button.secondary:hover { background-color: #FFDF00 !important;}
 .m30a {margin: 30px auto;}
 .br100 {border-radius: 100%;}
 
-
-input.ng-dirty.ng-invalid { 
+.signin input.ng-dirty.ng-invalid { 
   border: 2px red solid;
 }
 
-

index.html

@@ -79,7 +79,7 @@
 
     <!-- Templates -->
     <script type="text/ng-template" id="signin.html">
-      <div ng-controller="SigninController">
+      <div class="signin" ng-controller="SigninController">
         <div data-alert class="alert-box info round" ng-show="loading">
           Connecting to wallet...
         </div>
@@ -378,11 +378,11 @@
                 <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="is-valid" ng-show="!sendForm.address.$invalid && !sendForm.address.$pristine">valid!</small>
                     <small class="has-error" ng-show="sendForm.address.$invalid && !sendForm.address.$pristine">
-                    is not valid</small>
+                    not valid</small>
                   </label>
-                  <input type="text" id="address" name="address" placeholder="Send to" ng-model="address" ng-minlength="20" ng-maxlength="37" required>
+                  <input type="text" id="address" name="address" placeholder="Send to" ng-model="address" valid-address required>
                 </div>
               </div>
 
@@ -391,9 +391,9 @@
                   <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="is-valid" ng-show="!sendForm.amount.$invalid && !sendForm.amount.$pristine">valid!</small>
                       <small class="has-error" ng-show="sendForm.amount.$invalid && !sendForm.amount.$pristine">
-                      is not valid</small>
+                      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>

js/controllers/send.js

@@ -13,7 +13,7 @@ angular.module('copay.send').controller('SendController',
         return;
       }
 
-      if ($rootScope.totalBalance <= form.amount.$modelValue) {
+      if ($rootScope.availableBalance <= form.amount.$modelValue) {
         $rootScope.flashMessage = { message: 'You have not enough amount to send', type: 'error'};
         return;
       }

js/directives.js

@@ -1 +1,23 @@
 'use strict';
+
+angular.module('copay')
+  .directive('validAddress', [function() {
+
+    var bitcore = require('bitcore');
+    var Address = bitcore.Address;
+
+    return {
+      require: 'ngModel',
+      link: function (scope, elem, attrs, ctrl) {
+        var validator = function(value){
+          var a = new Address(value);
+          ctrl.$setValidity('validAddress', a.isValid());
+          return value;
+        };
+
+        ctrl.$parsers.unshift(validator);
+        ctrl.$formatters.unshift(validator);
+      }
+    };
+  }]);
+