anders/Wallet
1
0
Fork 0
Code Issues Projects Releases Packages Wiki Activity

Merge pull request #648 from msalcala11/txDetailStyling

Browse source 
Better transaction detail view styling
This commit is contained in:
Matias Alejo Garcia 2016-10-22 21:52:17 -03:00 • committed by GitHub
commit 8f46973240
9 changed files with 177 additions and 211 deletions
Download patch file Download diff file Expand all files Collapse all files

10
src/js/controllers/activity.js
View file

@ -1,7 +1,7 @@
'use strict';
angular.module('copayApp.controllers').controller('activityController',
function($timeout, $scope, $log, $ionicModal, lodash, txpModalService, profileService, walletService, ongoingProcess, popupService, gettextCatalog) {
function($timeout, $scope, $log, $ionicModal, lodash, txpModalService, profileService, walletService, ongoingProcess, popupService, gettextCatalog, $state) {
$scope.openTxpModal = txpModalService.open;
$scope.fetchingNotifications = true;
@ -66,11 +66,9 @@ angular.module('copayApp.controllers').controller('activityController',
$scope.wallet = wallet;
$scope.btx = lodash.cloneDeep(tx);
$ionicModal.fromTemplateUrl('views/modals/tx-details.html', {
scope: $scope
}).then(function(modal) {
$scope.txDetailsModal = modal;
$scope.txDetailsModal.show();
$state.transitionTo('tabs.wallet.tx-details', {
txid: $scope.btx.txid,
walletId: $scope.walletId
});
walletService.getTxNote(wallet, n.txid, function(err, note) {

79
src/js/controllers/modals/txDetails.js
View file

@ -1,38 +1,55 @@
'use strict';
angular.module('copayApp.controllers').controller('txDetailsController', function($log, $timeout, $scope, $filter, $stateParams, ongoingProcess, walletService, lodash, gettextCatalog, profileService, configService, txFormatService, externalLinkService, popupService) {
angular.module('copayApp.controllers').controller('txDetailsController', function($log, $timeout, $ionicHistory, $scope, $filter, $stateParams, ongoingProcess, walletService, lodash, gettextCatalog, profileService, configService, txFormatService, externalLinkService, popupService) {
var config = configService.getSync();
var configWallet = config.wallet;
var walletSettings = configWallet.settings;
var wallet;
var wallet = profileService.getWallet($stateParams.walletId);
$scope.wallet = wallet;
$scope.title = gettextCatalog.getString('Transaction');
$scope.init = function() {
wallet = $scope.wallet;
$scope.alternativeIsoCode = walletSettings.alternativeIsoCode;
$scope.color = wallet.color;
$scope.copayerId = wallet.credentials.copayerId;
$scope.isShared = wallet.credentials.n > 1;
$scope.btx.feeLevel = walletSettings.feeLevel;
walletService.getTx(wallet, $stateParams.txid, function(err, tx) {
if (err) {
$log.warn('Could not get tx');
$ionicHistory.goBack();
return;
}
$scope.btx = tx;
$scope.btx.feeLevel = walletSettings.feeLevel;
if ($scope.btx.action != 'invalid') {
if ($scope.btx.action == 'sent') $scope.title = gettextCatalog.getString('Sent Funds');
if ($scope.btx.action == 'received') $scope.title = gettextCatalog.getString('Received Funds');
if ($scope.btx.action == 'moved') $scope.title = gettextCatalog.getString('Moved Funds');
}
if ($scope.btx.action != 'invalid') {
if ($scope.btx.action == 'sent') $scope.title = gettextCatalog.getString('Sent Funds');
if ($scope.btx.action == 'received') $scope.title = gettextCatalog.getString('Received Funds');
if ($scope.btx.action == 'moved') $scope.title = gettextCatalog.getString('Moved Funds');
}
$scope.displayAmount = getDisplayAmount($scope.btx.amountStr);
$scope.displayUnit = getDisplayUnit($scope.btx.amountStr);
updateMemo();
initActionList();
getAlternativeAmount();
updateMemo();
initActionList();
});
};
function getDisplayAmount(amountStr) {
return amountStr.split(' ')[0];
}
function getDisplayUnit(amountStr) {
return amountStr.split(' ')[1];
}
function updateMemo() {
walletService.getTxNote(wallet, $scope.btx.txid, function(err, note) {
if (err) {
$log.warn('Could not fetch transaction note: ' + err);
return;
}
if (!note) return;
$scope.btx.note = note;
@ -49,7 +66,7 @@ angular.module('copayApp.controllers').controller('txDetailsController', functio
});
});
});
};
}
function initActionList() {
$scope.actionList = [];
@ -83,10 +100,13 @@ angular.module('copayApp.controllers').controller('txDetailsController', functio
time: $scope.btx.time,
description: actionDescriptions['broadcasted'],
});
};
}
$scope.showCommentPopup = function() {
var opts = {};
if ($scope.btx.message) {
opts.defaultText = $scope.btx.message;
}
if ($scope.btx.note && $scope.btx.note.body) opts.defaultText = $scope.btx.note.body;
popupService.showPrompt(wallet.name, gettextCatalog.getString('Memo'), opts, function(text) {
@ -114,27 +134,12 @@ angular.module('copayApp.controllers').controller('txDetailsController', functio
});
};
var getAlternativeAmount = function() {
var satToBtc = 1 / 100000000;
wallet.getFiatRate({
code: $scope.alternativeIsoCode,
ts: $scope.btx.time * 1000
}, function(err, res) {
if (err) {
$log.debug('Could not get historic rate');
return;
}
if (res && res.rate) {
var alternativeAmountBtc = ($scope.btx.amount * satToBtc).toFixed(8);
$scope.rateDate = res.fetchedOn;
$scope.rateStr = res.rate + ' ' + $scope.alternativeIsoCode;
$scope.alternativeAmountStr = $filter('formatFiatAmount')(alternativeAmountBtc * res.rate) + ' ' + $scope.alternativeIsoCode;
$timeout(function() {
$scope.$apply();
});
}
});
$scope.viewOnBlockchain = function() {
var btx = $scope.btx;
var url = 'https://' + ($scope.getShortNetworkName() == 'test' ? 'test-' : '') + 'insight.bitpay.com/tx/' + btx.txid;
var title = 'View Transaction on Insight';
var message = 'Would you like to view this transaction on the Insight blockchain explorer?';
$scope.openExternalLink(url, true, title, message, 'Open Insight', 'Go back');
};
$scope.openExternalLink = function(url, optIn, title, message, okText, cancelText) {
@ -149,4 +154,6 @@ angular.module('copayApp.controllers').controller('txDetailsController', functio
$scope.cancel = function() {
$scope.txDetailsModal.hide();
};
$scope.init();
});

8
src/js/controllers/tab-home.js
View file

@ -68,11 +68,9 @@ angular.module('copayApp.controllers').controller('tabHomeController',
$scope.wallet = wallet;
$scope.btx = lodash.cloneDeep(tx);
$ionicModal.fromTemplateUrl('views/modals/tx-details.html', {
scope: $scope
}).then(function(modal) {
$scope.txDetailsModal = modal;
$scope.txDetailsModal.show();
$state.transitionTo('tabs.wallet.tx-details', {
txid: $scope.btx.txid,
walletId: $scope.walletId
});
walletService.getTxNote(wallet, n.txid, function(err, note) {

10
src/js/controllers/walletDetails.js
View file

@ -86,17 +86,15 @@ angular.module('copayApp.controllers').controller('walletDetailsController', fun
$scope.close = function() {
$scope.searchModal.hide();
}
};
};
$scope.openTxModal = function(btx) {
$scope.btx = lodash.cloneDeep(btx);
$scope.walletId = $scope.wallet.id;
$ionicModal.fromTemplateUrl('views/modals/tx-details.html', {
scope: $scope
}).then(function(modal) {
$scope.txDetailsModal = modal;
$scope.txDetailsModal.show();
$state.transitionTo('tabs.wallet.tx-details', {
txid: $scope.btx.txid,
walletId: $scope.walletId
});
};

11
src/js/routes.js
View file

@ -177,6 +177,15 @@ angular.module('copayApp').config(function(historicLogProvider, $provide, $logPr
}
}
})
.state('tabs.wallet.tx-details', {
url: '/tx-details/:txid',
views: {
'tab-home@tabs': {
controller: 'txDetailsController',
templateUrl: 'views/modals/tx-details.html'
}
}
})
/*
*
@ -847,7 +856,7 @@ angular.module('copayApp').config(function(historicLogProvider, $provide, $logPr
*
*/
.state('tabs.bitpayCardIntro', {
.state('tabs.bitpayCardIntro', {
url: '/bitpay-card-intro/:secret/:email/:otp',
views: {
'tab-home@tabs': {

14
src/sass/views/includes/txp-details.scss
View file

@ -24,6 +24,10 @@
img {
margin-right: 1rem;
}
span {
text-transform: capitalize;
}
}
.amount-label{
line-height: 30px;
@ -191,7 +195,7 @@
}
> div {
border: 3px solid #09C286;
border: 3px solid #13e5b6;
border-radius: 50%;
display: flex;
height: 26px;
@ -201,7 +205,7 @@
justify-content: center;
font-weight: 600;
vertical-align: middle;
color: #09C286;
color: #13e5b6;
&.rejected {
background: #E15061;
@ -231,4 +235,10 @@
color: $item-label-color;
padding: 1rem 2rem;
}
.view-on-blockchain-btn {
background: #e8e7e7;
color: rgba(58, 58, 58, .6);
margin-bottom: 1.5rem;
}
}