Merge pull request #2410 from cmgustavo/bug/modal-txp-update

TXP Modal: Update status when transaction signed/rejected/broadcasted

js/controllers/homeWallet.js

@@ -5,43 +5,63 @@ angular.module('copayApp.controllers').controller('HomeWalletController', functi
   $scope.openTxModal = function(tx) {
     var ModalInstanceCtrl = function($scope, $modalInstance) {
       var w = $rootScope.wallet;
+      $scope.error = null;
       $scope.tx = tx;
+      $scope.registeredCopayerIds = w.getRegisteredCopayerIds();
       $scope.loading = null;
 
+      $scope.getShortNetworkName = function() {
+        var w = $rootScope.wallet;
+        return w.getNetworkName().substring(0, 4);
+      };
+
       $scope.sign = function(ntxid) {
         $scope.loading = true;
+        $scope.error = null;
         $timeout(function() {
           w.signAndSend(ntxid, function(err, id, status) {
             $scope.loading = false;
-            if (err)
-            $scope.error = err;
-            else
-            $modalInstance.close(status);
+            if (err) {
+              $scope.error = 'Transaction could not send. Please try again.';
+              $scope.$digest();
+            }
+            else {
+              $modalInstance.close(status);
+            }
           });
         }, 100);
       };
 
       $scope.reject = function(ntxid) {
         $scope.loading = true;
+        $scope.error = null;
         $timeout(function() {
           w.reject(ntxid, function(err, status) {
             $scope.loading = false;
-            if (err)
-            $scope.error = err;
-            else
-            $modalInstance.close(status);
+            if (err) {
+              $scope.error = err;
+              $scope.$digest();
+            }
+            else {
+              $modalInstance.close(status);
+            }
           });
         }, 100);
       };
 
       $scope.broadcast = function(ntxid) {
         $scope.loading = true;
+        $scope.error = null;
         $timeout(function() {
           w.issueTx(ntxid, function(err, txid, status) {
             $scope.loading = false;
-            if (err)
-              $scope.error = err;
-            $modalInstance.close(status);
+            if (err) {
+              $scope.error = 'Transaction could not send. Please try again.';
+              $scope.$digest();
+            }
+            else {
+              $modalInstance.close(status);
+            }
           });
         }, 100);
       };

views/modals/tx-details.html

@@ -73,7 +73,7 @@
 <small class="ellipsis text-gray m10v"  ng-if="btx.txid" > ID: {{btx.txid}} </small>
 
 <div class="oh">
-  <a class="button-setup right" ng-click="$root.openExternalLink('http://' + getShortNetworkName() + '.insight.is/tx/' + btx.txid)"  ng-if="btx.txid">
+  <a class="button outline light-gray tiny right" ng-click="$root.openExternalLink('http://' + getShortNetworkName() + '.insight.is/tx/' + btx.txid)"  ng-if="btx.txid">
       See it on the blockchain <i class="icon-arrow-right2 vm"></i>
   </a>
 </div>

views/modals/txp-details.html

@@ -57,16 +57,19 @@
 <div ng-if="tx.actionList[0]" class="m10v">
   <i>Signatures:</i>
   <ul class="tx-copayers m10t" ng-if="tx.actionList[0]">
-    <li ng-repeat="c in tx.actionList" ng-class="{'bottom-line-copayers':!$last}">
+    <li ng-repeat="cId in registeredCopayerIds" 
+    ng-class="{'bottom-line-copayers':!$last}">
     <span>
-      <i ng-if="c.actions.rejected" class="fi-x icon-sign x"></i>
-      <i ng-if="c.actions.sign" class="fi-check icon-sign check"></i>
-      <i ng-if="!c.actions.sign && !c.actions.rejected && tx.missingSignatures" class="m10r fi-loop icon-rotate"></i>
+      <i ng-if="$root.wallet.txProposals.txps[tx.ntxid].rejectedBy[cId]" class="fi-x icon-sign x"></i>
+      <i ng-if="$root.wallet.txProposals.txps[tx.ntxid].signedBy[cId]" class="fi-check icon-sign check"></i>
+      <i ng-if="!$root.wallet.txProposals.txps[tx.ntxid].rejectedBy[cId] 
+        && !$root.wallet.txProposals.txps[tx.ntxid].signedBy[cId]" class="m10r fi-loop icon-rotate"></i>
     </span>
     <span>
-      <i ng-if="c.actions.create" class="fi-crown icon-status icon-active m10r"></i>
+      <i ng-if="$root.wallet.txProposals.txps[tx.ntxid].creator == cId" 
+        class="fi-crown icon-status icon-active m10r"></i>
     </span>
-    <span>{{c.cId === $root.wallet.getMyCopayerId() ? 'Me' : $root.wallet.publicKeyRing.nicknameForCopayer(c.cId)}}</span>
+    <span>{{cId === $root.wallet.getMyCopayerId() ? 'Me' : $root.wallet.publicKeyRing.nicknameForCopayer(cId)}}</span>
     </li>
   </ul>
 </div>
@@ -78,14 +81,14 @@
   <span class="text-warning size-14">
     {{error}}
   </span>
-  <a class="close-notification text-warning" ng-click="error=null">&#215;</a>
 </div>
 
-<div class="row collapse" 
+<div class="row collapse m10t" 
   ng-init="hideSign = false; hideReject = false"
-  ng-show="!tx.signedBy[$root.wallet.getMyCopayerId()] && !tx.rejectedBy[$root.wallet.getMyCopayerId()]">
+  ng-show="!tx.signedBy[$root.wallet.getMyCopayerId()] && !tx.rejectedBy[$root.wallet.getMyCopayerId()] &&
+  $root.wallet.txProposals.txps[tx.ntxid].builder.build().countInputMissingSignatures(0) != 0">
   <div class="large-5 medium-5 small-5 columns">
-    <button class="button warning m0 expand" ng-click="hideSign = true; reject(tx.ntxid);" 
+    <button class="button warning m0 expand" ng-click="hideTxInfo = true; hideSign = true; reject(tx.ntxid);" 
       ng-disabled="loading" ng-show="!hideReject">
       <i class="fi-x icon-sign x" ng-show="!loading"></i>  
       <i class="fi-bitcoin-circle icon-rotate spinner" ng-show="loading"></i>
@@ -93,7 +96,7 @@
     </button>
   </div>
   <div class="large-5 medium-5 small-5 columns text-right">
-    <button class="button primary m0 expand" ng-click="hideReject = true; sign(tx.ntxid)" 
+    <button class="button primary m0 expand" ng-click="hideTxInfo = true; hideReject = true; sign(tx.ntxid)" 
       ng-disabled="loading" ng-show="!hideSign">
       <i class="fi-check icon-sign check" ng-show="!loading"></i>  
       <i class="fi-bitcoin-circle icon-rotate spinner" ng-show="loading"></i>
@@ -102,11 +105,30 @@
   </div>
 </div>
 
-<div class="row collapse" ng-show="!tx.missingSignatures && !tx.sentTs">
-  <button class="primary tiny m0 expand"
-    ng-click="broadcast(tx.ntxid)"
-    ng-disabled="loading"> <i class="fi-upload-cloud"></i>
-    <span translate>Broadcast Transaction</span>
-  </button>
+<div ng-show="!hideTxInfo">
+  <div class="row collapse m10t" 
+    ng-show="!$root.wallet.txProposals.txps[tx.ntxid].sentTs 
+    && $root.wallet.txProposals.txps[tx.ntxid].builder.build().countInputMissingSignatures(0) == 0">
+    <button class="primary tiny m0 expand"
+      ng-click="broadcast(tx.ntxid)"
+      ng-disabled="loading"> <i class="fi-upload-cloud"></i>
+      <span translate>Broadcast Transaction</span>
+    </button>
+  </div>
+  <div class="text-success m10t oh" 
+    ng-show="$root.wallet.txProposals.txps[tx.ntxid].sentTs 
+    && $root.wallet.txProposals.txps[tx.ntxid].isFullySigned()">
+    <a class="button outline light-gray tiny right" 
+      ng-click="$root.openExternalLink('http://' + getShortNetworkName() + '.insight.is/tx/' +
+      $root.wallet.txProposals.txps[tx.ntxid].sentTxid)">
+      See it on the blockchain <i class="icon-arrow-right2 vm"></i>
+    </a>
+    <div class="m10t">Transaction sent!</div>
+  </div>
+  <div class="text-center text-warning"
+    ng-show="!$root.wallet.txProposals.txps[tx.ntxid].sentTs && 
+    $root.wallet.txProposals.txps[tx.ntxid].isFinallyRejected($root.wallet.maxRejectCount())">
+    Transaction finally rejected
+  </div>
 </div>
 </div>