From 59edea271b646dd2d9d1c643a6e47415108f5cd1 Mon Sep 17 00:00:00 2001 From: Andy Phillipson Date: Wed, 7 Jun 2017 18:55:43 -0400 Subject: [PATCH] Colors top-up icon green or pending. --- src/js/controllers/bitpayCard.js | 10 ++++- src/js/controllers/walletDetails.js | 22 +++------- src/js/directives/svg.js | 2 +- src/js/services/bitpayCardService.js | 1 + src/js/services/timeService.js | 30 ++++++++++++++ src/sass/views/bitpayCard.scss | 60 +++++++++++++++++++++++++++- www/views/includes/cardActivity.html | 58 +++++++++------------------ 7 files changed, 125 insertions(+), 58 deletions(-) create mode 100644 src/js/services/timeService.js diff --git a/src/js/controllers/bitpayCard.js b/src/js/controllers/bitpayCard.js index c17cdf4a1..a7e897507 100644 --- a/src/js/controllers/bitpayCard.js +++ b/src/js/controllers/bitpayCard.js @@ -1,6 +1,6 @@ 'use strict'; -angular.module('copayApp.controllers').controller('bitpayCardController', function($scope, $timeout, $log, $state, lodash, bitpayCardService, moment, popupService, gettextCatalog, $ionicHistory, bitpayService, externalLinkService) { +angular.module('copayApp.controllers').controller('bitpayCardController', function($scope, $timeout, $log, $state, lodash, bitpayCardService, moment, popupService, gettextCatalog, $ionicHistory, bitpayService, externalLinkService, timeService) { var self = this; var runningBalance; @@ -163,6 +163,14 @@ angular.module('copayApp.controllers').controller('bitpayCardController', functi runningBalance -= parseFloat(tx.amount); }; + this.withinPastDay = function(tx) { + var result = false; + if (tx.timestamp) { + result = timeService.withinPastDay(tx.timestamp); + } + return result; + }; + this.openExternalLink = function(url) { var optIn = true; var title = null; diff --git a/src/js/controllers/walletDetails.js b/src/js/controllers/walletDetails.js index 95d24354c..640a263e0 100644 --- a/src/js/controllers/walletDetails.js +++ b/src/js/controllers/walletDetails.js @@ -1,6 +1,6 @@ 'use strict'; -angular.module('copayApp.controllers').controller('walletDetailsController', function($scope, $rootScope, $interval, $timeout, $filter, $log, $ionicModal, $ionicPopover, $state, $stateParams, $ionicHistory, profileService, lodash, configService, platformInfo, walletService, txpModalService, externalLinkService, popupService, addressbookService, storageService, $ionicScrollDelegate, $window, bwcError, gettextCatalog) { +angular.module('copayApp.controllers').controller('walletDetailsController', function($scope, $rootScope, $interval, $timeout, $filter, $log, $ionicModal, $ionicPopover, $state, $stateParams, $ionicHistory, profileService, lodash, configService, platformInfo, walletService, txpModalService, externalLinkService, popupService, addressbookService, storageService, $ionicScrollDelegate, $window, bwcError, gettextCatalog, timeService) { var HISTORY_SHOW_LIMIT = 10; var currentTxHistoryPage = 0; @@ -200,28 +200,18 @@ angular.module('copayApp.controllers').controller('walletDetailsController', fun return $scope.isFirstInGroup(index + 1); }; - function createdDuringSameMonth(tx1, tx2) { - if (!tx1 || !tx2) return false; - var date1 = new Date(tx1.time * 1000); - var date2 = new Date(tx2.time * 1000); - return getMonthYear(date1) === getMonthYear(date2); - } + $scope.createdDuringSameMonth = function(curTx, prevTx) { + return timeService.withinSameMonth(curTx.time, prevTx.time); + }; $scope.createdWithinPastDay = function(time) { - var now = new Date(); - var date = new Date(time * 1000); - return (now.getTime() - date.getTime()) < (1000 * 60 * 60 * 24); + return timeService.withinPastDay(time); }; $scope.isDateInCurrentMonth = function(date) { - var now = new Date(); - return getMonthYear(now) === getMonthYear(date); + return timeService.isDateInCurrentMonth(date); }; - function getMonthYear(date) { - return date.getMonth() + date.getFullYear(); - } - $scope.isUnconfirmed = function(tx) { return !tx.confirmations || tx.confirmations === 0; }; diff --git a/src/js/directives/svg.js b/src/js/directives/svg.js index 077b155a3..99ee79261 100644 --- a/src/js/directives/svg.js +++ b/src/js/directives/svg.js @@ -10,7 +10,7 @@ angular.module('copayApp.directives') link: function(scope, element, attrs) { var imgId = attrs.id; var imgClass = attrs.class; - var imgUrl = attrs.src; + var imgUrl = attrs.src || attrs.ngSrc; var svg; // Load svg content diff --git a/src/js/services/bitpayCardService.js b/src/js/services/bitpayCardService.js index 1de0ce461..114074a28 100644 --- a/src/js/services/bitpayCardService.js +++ b/src/js/services/bitpayCardService.js @@ -65,6 +65,7 @@ angular.module('copayApp.services').factory('bitpayCardService', function($log, n.lastFourDigits = x.lastFourDigits; n.token = x.token; n.currency = x.currency; + n.country = x.country; cards.push(n); }); diff --git a/src/js/services/timeService.js b/src/js/services/timeService.js new file mode 100644 index 000000000..02eeef45f --- /dev/null +++ b/src/js/services/timeService.js @@ -0,0 +1,30 @@ +'use strict'; + +angular.module('copayApp.services').factory('timeService', function() { + var root = {}; + + root.withinSameMonth = function(time1, time2) { + if (!time1 || !time2) return false; + var date1 = new Date(time1 * 1000); + var date2 = new Date(time2 * 1000); + return getMonthYear(date1) === getMonthYear(date2); + } + + root.withinPastDay = function(time) { + var now = new Date(); + var date = new Date(time * 1000); + return (now.getTime() - date.getTime()) < (1000 * 60 * 60 * 24); + }; + + root.isDateInCurrentMonth = function(date) { + var now = new Date(); + return getMonthYear(now) === getMonthYear(date); + }; + + root.getMonthYear = function(date) { + return date.getMonth() + date.getFullYear(); + } + + return root; + +}); diff --git a/src/sass/views/bitpayCard.scss b/src/sass/views/bitpayCard.scss index 7db9296dd..5fc4b0273 100644 --- a/src/sass/views/bitpayCard.scss +++ b/src/sass/views/bitpayCard.scss @@ -70,7 +70,65 @@ } } .item { - border-color: $item-border-color; + display: flex; + align-items: center; + background: #fff; + padding: 0 0 0 1rem; + margin: 0; + border: 0; + + &.send .svg #-Transaction-icons { + } + &.receive .svg #-Transaction-icons { + stroke: #09C286; + } + &.pending .svg #-Transaction-icons { + stroke: $v-bitcoin-orange; + } + } + .tx-icon { + float: left; + margin-right: 25px; + } + .tx-content { + display: flex; + align-items: center; + flex-grow: 1; + padding: 1rem 0; + padding-right: 1rem; + border-bottom: 1px solid rgb(245, 245, 245); + overflow: hidden; + } + .tx-title { + flex-grow: 1; + color: $v-dark-gray; + overflow: hidden; + } + .tx-message { + margin-right: 1rem; + } + .tx-location { + margin-right: 1rem; + font-size: 12.5px; + color: $v-light-gray; + } + .tx-amount { + font-size: 16px; + white-space: nowrap; + &--received { + color: #09C286; + } + &--sent { + color: $v-dark-gray; + } + &--pending { + color: $v-bitcoin-orange; + } + } + .tx-time { + white-space: nowrap; + color: $v-light-gray; + font-size: 12.5px; } .info { .badge { diff --git a/www/views/includes/cardActivity.html b/www/views/includes/cardActivity.html index 62ef1df84..e87f1460e 100644 --- a/www/views/includes/cardActivity.html +++ b/www/views/includes/cardActivity.html @@ -1,43 +1,23 @@ -
-
-
{{tx.timestamp | amDateFormat:'MMM'}}
-
{{tx.timestamp | amDateFormat:'DD'}}
-
-
- -
- -
-
- {{tx.merchant.name || 'Unknown Merchant'}} +
+ +
+
+
+
{{tx.merchant.name || 'Unknown Merchant'}}
+
{{tx.merchant.location}}
+
+
View Confirmation Status
+
+
-
- {{tx.merchant.location}} - - {{tx.timestamp | amDateFormat:'h:mm A'}} + + + {{tx.price | currency:bitpayCard.currencySymbol:2 }} -
-
- View Confirmation Status -
-
- - - -
-
- + - {{tx.price | currency:bitpayCard.currencySymbol:2 }} -
- - Pending +
+ + +
+