From 43dfcba55cd538288ed21480f3e1c02ee50c66af Mon Sep 17 00:00:00 2001 From: =?UTF-8?q?Gabriel=20Baz=C3=A1n?= Date: Tue, 20 Sep 2016 10:02:28 -0300 Subject: [PATCH] refactor txp details --- public/views/modals/txp-details.html | 143 +++++++++++++---------- src/js/controllers/modals/txpDetails.js | 74 ++++++++++-- src/js/controllers/walletDetails.js | 21 ++++ src/js/services/txpModalService.js | 3 +- src/sass/main.scss | 22 +--- src/sass/views/includes/txp-details.scss | 66 +++++++++++ 6 files changed, 235 insertions(+), 94 deletions(-) create mode 100644 src/sass/views/includes/txp-details.scss diff --git a/public/views/modals/txp-details.html b/public/views/modals/txp-details.html index c04b0a380..234e9fd28 100644 --- a/public/views/modals/txp-details.html +++ b/public/views/modals/txp-details.html @@ -1,43 +1,35 @@ - - + +
Payment Proposal
+ - -
-
{{tx.amountStr}}
-
{{tx.alternativeAmountStr}}
- - - - Multiple recipients - + +
+
+
+ + Sending +
+
+
{{tx.amountStr}}
+
{{tx.alternativeAmountStr}}
+
-
The payment was removed by creator
-
- - -
- -
Payment accepted, but not yet broadcasted
@@ -54,44 +46,55 @@
Payment Rejected
-
    -
    Details
    -
  • - Description - {{tx.message}} -
    • +
    + Warning: this transaction has unconfirmed inputs +
    -
  • +
    +
    + To + + + + Multiple recipients + +
    + +
    Recipients {{tx.recipientCount}} -
    • +
-
  • - Fee - {{tx.feeStr}} -
    • - -
  • - Time - - +
    + From + + {{wallet.name}} + +
    +
    + Created by + + {{tx.creatorName}} + +
    +
    + Memo + + {{tx.message}} + +
    +
    + Fee + + {{tx.feeStr}} -
    • - -
  • - Created by - {{tx.creatorName}} -
    • - -
    - Warning: this transaction has unconfirmed inputs
    @@ -123,23 +126,28 @@ {{tx.paypro.pr.pd.memo}}
    +
    +
    Timeline
    -
    -
    -
    - {{tx.requiredSignatures}}/{{tx.walletN}} +
    +
    +
    + {{$index + 1}} +
    +
    +
    {{a.description}}
    +
    + {{a.by}} + + + +
    +
    - Participants
    -
  • - - - - - {{ac.copayerName}} ({{'Me'|translate}}) -
    • - +
    +
    * A payment proposal can be deleted if 1) you are the creator, and no other copayer has signed, or 2) 24 hours have passed since the proposal was created. @@ -150,4 +158,13 @@
    +
    + + + + +

    Slide to accept

    +     +     +
    diff --git a/src/js/controllers/modals/txpDetails.js b/src/js/controllers/modals/txpDetails.js index bfd04e3e3..3311fac4f 100644 --- a/src/js/controllers/modals/txpDetails.js +++ b/src/js/controllers/modals/txpDetails.js @@ -1,19 +1,75 @@ 'use strict'; -angular.module('copayApp.controllers').controller('txpDetailsController', function($scope, $rootScope, $timeout, $interval, $ionicModal, ongoingProcess, platformInfo, $ionicScrollDelegate, txFormatService, fingerprintService, bwcError, gettextCatalog, lodash, walletService, popupService) { +angular.module('copayApp.controllers').controller('txpDetailsController', function($scope, $rootScope, $timeout, $interval, $ionicModal, ongoingProcess, platformInfo, $ionicScrollDelegate, txFormatService, fingerprintService, bwcError, gettextCatalog, lodash, walletService, popupService) { var self = $scope.self; var tx = $scope.tx; var copayers = $scope.copayers; var isGlidera = $scope.isGlidera; var GLIDERA_LOCK_TIME = 6 * 60 * 60; var now = Math.floor(Date.now() / 1000); - $scope.loading = null; + $scope.init = function() { + $scope.loading = null; + $scope.hideSlider = false; + $scope.copayerId = $scope.wallet.credentials.copayerId; + $scope.isShared = $scope.wallet.credentials.n > 1; + $scope.canSign = $scope.wallet.canSign() || $scope.wallet.isPrivKeyExternal(); + $scope.color = $scope.wallet.color; + $scope.data = {}; - $scope.copayerId = $scope.wallet.credentials.copayerId; - $scope.isShared = $scope.wallet.credentials.n > 1; - $scope.canSign = $scope.wallet.canSign() || $scope.wallet.isPrivKeyExternal(); - $scope.color = $scope.wallet.color; + initActionList(); + } + + function initActionList() { + $scope.actionList = []; + + if (!$scope.isShared) return; + + var actionDescriptions = { + created: gettextCatalog.getString('Proposal Created'), + accept: gettextCatalog.getString('Accepted'), + reject: gettextCatalog.getString('Rejected'), + broadcasted: gettextCatalog.getString('Broadcasted'), + }; + + $scope.actionList.push({ + type: 'created', + time: tx.createdOn, + description: actionDescriptions['created'], + by: tx.creatorName + }); + + lodash.each(tx.actions, function(action) { + $scope.actionList.push({ + type: action.type, + time: action.createdOn, + description: actionDescriptions[action.type], + by: action.copayerName + }); + }); + }; + + $scope.options = { + loop: false, + effect: 'flip', + speed: 500, + pagination: false, + initialSlide: 1 + } + + $scope.$on("$ionicSlides.sliderInitialized", function(event, data) { + $scope.slider = data.slider; + }); + + $scope.$on("$ionicSlides.slideChangeStart", function(event, data) { + $scope.data.index = data.slider.activeIndex; + if ($scope.data.index == 0) { + $scope.hideSlider = true; + $scope.sign(); + } + }); + + $scope.$on("$ionicSlides.slideChangeEnd", function(event, data) {}); checkPaypro(); @@ -33,9 +89,9 @@ angular.module('copayApp.controllers').controller('txpDetailsController', functi $scope.sign = function() { $scope.loading = true; walletService.publishAndSign($scope.wallet, $scope.tx, function(err, txp) { - $scope.$emit('UpdateTx'); - if (err) return setSendError(err); - $scope.close(); + $scope.$emit('UpdateTx'); + if (err) return setSendError(err); + $scope.close(); }); }; diff --git a/src/js/controllers/walletDetails.js b/src/js/controllers/walletDetails.js index f9a23f91c..1a49736f8 100644 --- a/src/js/controllers/walletDetails.js +++ b/src/js/controllers/walletDetails.js @@ -59,6 +59,27 @@ angular.module('copayApp.controllers').controller('walletDetailsController', fun } var setPendingTxps = function(txps) { + + /* Uncomment to test multiple outputs */ + + // var txp = { + // message: 'test multi-output', + // fee: 1000, + // createdOn: new Date() / 1000, + // outputs: [], + // wallet: wallet + // }; + // + // function addOutput(n) { + // txp.outputs.push({ + // amount: 600, + // toAddress: '2N8bhEwbKtMvR2jqMRcTCQqzHP6zXGToXcK', + // message: 'output #' + (Number(n) + 1) + // }); + // }; + // lodash.times(15, addOutput); + // txps.push(txp); + if (!txps) { $scope.txps = []; return; diff --git a/src/js/services/txpModalService.js b/src/js/services/txpModalService.js index a0cfce6e2..b14f5c4fd 100644 --- a/src/js/services/txpModalService.js +++ b/src/js/services/txpModalService.js @@ -15,9 +15,10 @@ angular.module('copayApp.services').factory('txpModalService', function(configSe var scope = $rootScope.$new(true); scope.tx = tx; scope.wallet = tx.wallet; - scope.copayers = tx.wallet.copayers; + scope.copayers = tx.wallet ? tx.wallet.copayers : null; scope.isGlidera = glideraActive; scope.currentSpendUnconfirmed = config.spendUnconfirmed; + // scope.tx.hasMultiplesOutputs = true; // Uncomment to test multiple outputs $ionicModal.fromTemplateUrl('views/modals/txp-details.html', { scope: scope diff --git a/src/sass/main.scss b/src/sass/main.scss index 1fa71938e..3cdb63cc5 100644 --- a/src/sass/main.scss +++ b/src/sass/main.scss @@ -377,27 +377,6 @@ ul.wallet-selection.wallets { color: #4A90E2; } -.payment-proposal-head { - color: #fff; - padding: 10px 10px 20px 10px; - text-align: center; -} - -.payment-proposal-to { - width: 100%; - display: inline-block; - padding: 5px 15px; - background-color: rgba(0, 0, 0, 0.1); - i { - position: inherit; - left: 25px; - padding-right: 10px; - border-right: 1px solid; - border-color: rgba(255, 255, 255, 0.1); - font-size: 20px; - } -} - .scroll { padding-bottom: 35px; } @@ -995,3 +974,4 @@ input[type=number] { @import "views/includes/wallets"; @import "views/includes/modals/modals"; @import "views/includes/tx-details"; +@import "views/includes/txp-details"; diff --git a/src/sass/views/includes/txp-details.scss b/src/sass/views/includes/txp-details.scss new file mode 100644 index 000000000..60aadee20 --- /dev/null +++ b/src/sass/views/includes/txp-details.scss @@ -0,0 +1,66 @@ +#txp-details{ + .bottom { + bottom: 100px; + } + .head { + padding-bottom: 55px; + .sending-label{ + line-height: 70px; + font-size: 25px; + i { + margin-left: 20px; + } + span { + margin-left: 15px; + } + } + .amount-label{ + margin-left: 20px; + line-height: 30px; + .amount{ + font-size: 36px; + } + .alternative{ + font-size: 18px; + font-weight: 200; + color: grey; + } + } + } + .info{ + span { + display: block; + } + .payment-proposal-to { + width: 100%; + display: inline-block; + padding: 5px 15px; + background-color: #f5f5f5; + margin-top: 10px; + i { + color: grey; + position: inherit; + left: 25px; + vertical-align: super; + padding-right: 10px; + border-right: 1px solid; + border-color: grey; + font-size: 20px; + } + contact { + margin-left: 15px; + margin-bottom: 3px; + margin-top: 5px; + font-size: 14px; + display: inline-block; + } + } + } + .accept-slide { + position: fixed; + bottom: 0; + width: 100%; + height: 100px; + background-color: #f5f5f5; + } +}