Permalink
Browse files

perf(lists): added track by expression to improve list rendering perf…

…ormance

 It was noticeable that transactions got duplicated on refresh for a second. Adding track by solved this problem.
  • Loading branch information...
1 parent 709a6fb commit 6b6606a9c9585ccfdd155280acc418a9d4df25f3 @beregovoy68 beregovoy68 committed Oct 26, 2016
Showing with 140 additions and 46 deletions.
  1. +2 −1 Gruntfile.js
  2. +2 −1 bower.json
  3. +8 −0 src/css/style.css
  4. +10 −0 src/js/app.js
  5. +18 −5 src/js/shared/shared.module.js
  6. +76 −13 src/js/wallet/wallet.controller.js
  7. +24 −26 src/main.html
View
@@ -62,7 +62,7 @@ module.exports = function (grunt) {
'bower_components/ngclipboard/dist/ngclipboard.js',
'bower_components/growl/javascripts/jquery.growl.js',
'bower_components/jquery-validation/dist/jquery.validate.js',
- 'bower_components/jpkleemans-angular-validate/src/angular-validate.js',
+ 'bower_components/waves-angular-validate/src/angular-validate.js',
'src/js/vendor/jquery.modal.js',
@@ -118,6 +118,7 @@ module.exports = function (grunt) {
'src/js/shared/password.strength.directive.js',
'src/js/shared/address.directive.js',
'src/js/shared/decimal.directive.js',
+ 'src/js/shared/focus.directive.js',
'src/js/shared/transaction.loading.service.js',
'src/js/shared/transaction.filter.js',
View
@@ -23,7 +23,8 @@
"growl": "^1.3.2",
"angular-messages": "^1.5.8",
"angular-validation-match": "^1.9.0",
- "jpkleemans-angular-validate": "^1.1.1"
+ "angular-material": "^1.1.1",
+ "waves-angular-validate": "git@github.com:beregovoy68/angular-validate.git#^1.1.2"
},
"analytics": false
}
View
@@ -1188,6 +1188,14 @@ span.tabs-radio img.selected {
color: #999999;
}
+.popup-autocomplete {
+ z-index: 160;
+}
+
+.md-virtual-repeat-container.md-autocomplete-suggestions-container {
+ z-index: 160;
+}
+
/* ======================================================================= */
View
@@ -14,6 +14,7 @@ var app = angular.module('app',
'ngMessages',
'ngValidate',
'ngAnimate',
+ 'ngMaterial',
'app.ui',
'app.shared',
'app.login',
@@ -23,3 +24,12 @@ var app = angular.module('app',
'app.community'
]
);
+app.run(['Restangular', 'constants.core', function (rest, coreConstants) {
+ // restangular configuration
+ rest.setDefaultHttpFields({
+ timeout: 10000 // milliseconds
+ });
+ var url = coreConstants.NODE_ADDRESS;
+ //var url = 'http://52.28.66.217:6869';
+ rest.setBaseUrl(url);
+}]);
@@ -1,15 +1,20 @@
(function() {
'use strict';
+ // mock methods to implement late binding
+ var showError = function(message) {};
+ var validateAddress = function(address) {};
+
angular
.module('app.shared', [])
- .config(['$validatorProvider', 'notificationService', function ($validatorProvider, notificationService) {
+ .config(['$validatorProvider', function ($validatorProvider) {
$validatorProvider.setDefaults({
errorClass: 'wInput-error',
onkeyup: false,
showErrors : function(errorMap, errorList) {
errorList.forEach(function(error) {
- notificationService.error(error.message);
+ // can't use notificationService here cos services are not available in config phase
+ showError(error.message);
});
var i, elements;
@@ -22,12 +27,11 @@
}
}
});
-
$validatorProvider.addMethod('address', function(value, element){
- return this.optional(element) || Waves.Addressing.validateDisplayAddress(value);
+ return this.optional(element) || validateAddress(value);
}, "Account number must be a sequence of 35 alphanumeric characters with no spaces, optionally starting with '1W'");
$validatorProvider.addMethod('decimal', function(value, element, params) {
- var maxdigits = angular.isNumeric(params) ? params : Currency.WAV.precision;
+ var maxdigits = angular.isNumber(params) ? params : Currency.WAV.precision;
var regex = new RegExp("^(?:-?\\d+)?(?:\\.\\d{1," + maxdigits + "})?$");
return this.optional(element) || regex.test(value);
@@ -42,5 +46,14 @@
return containsDigits && containsUppercase && containsLowercase;
}, "The password is too weak. A good password must contain at least one digit, one uppercase and one lowercase letter");
+ }])
+ .run(['notificationService', 'addressService', function (notificationService, addressService) {
+ // override mock methods cos in config phase services are not available yet
+ showError = function (message) {
+ notificationService.error(message);
+ };
+ validateAddress = function (address) {
+ return addressService.validateDisplayAddress(address);
+ };
}]);
})();
@@ -1,12 +1,14 @@
(function () {
'use strict';
- function WalletController($scope, $timeout, $interval, applicationContext, dialogService, addressService,
- utilityService, apiService, notificationService, formattingService,
+ function WalletController($scope, $timeout, $interval, constants, applicationContext, dialogService,
+ addressService, utilityService, apiService, notificationService, formattingService,
transferService, transactionLoadingService) {
var wallet = this;
var transaction, refreshPromise;
var refreshDelay = 10 * 1000;
+ var minimumPayment = new Money(constants.MINIMUM_PAYMENT_AMOUNT, Currency.WAV);
+ var minimumFee = new Money(constants.MINIMUM_TRANSACTION_FEE, Currency.WAV);
function unimplementedFeature() {
$scope.home.featureUnderDevelopment();
@@ -48,13 +50,65 @@
},
recipient: ''
};
- wallet.transfer = {};
+ wallet.transfer = {
+ fees: [
+ {
+ amount: 0.001,
+ displayText: '0.001 WAVE (Economic)'
+ },
+ {
+ amount: 0.0015,
+ displayText: '0.0015 WAVE (Standard)'
+ },
+ {
+ amount: 0.002,
+ displayText: '0.002 WAVE (Premium)'
+ }
+ ],
+ selectedFee: undefined,
+ searchText: undefined,
+ querySearch: function (searchText) {
+ if (!searchText)
+ return wallet.transfer.fees;
+
+ return _.filter(wallet.transfer.fees, function (item) {
+ return item.amount.toString().indexOf(searchText) !== -1;
+ });
+ }
+ };
wallet.paymentValidationOptions = {
rules: {
-
+ wavesrecipient: {
+ required: true,
+ address: true
+ },
+ wavessendamount: {
+ required: true,
+ decimal: Currency.WAV.precision,
+ min: minimumPayment.amount
+ },
+ wavessendfee: {
+ required: true,
+ decimal: Currency.WAV.precision,
+ min: minimumFee.amount
+ }
},
messages: {
-
+ wavesrecipient: {
+ required: 'Recipient account number is required'
+ },
+ wavessendamount: {
+ required: 'Amount to send is required',
+ decimal: 'The amount to send must be a number with no more than ' +
+ minimumPayment.currency.precision + ' digits after the decimal point (.)',
+ min: 'Payment amount is too small. It should be greater or equal to ' + minimumPayment.formatAmount(false)
+ },
+ wavessendfee: {
+ required: 'Transaction fee is required',
+ decimal: 'Transaction fee must be with no more than ' +
+ minimumFee.currency.precision + ' digits after the decimal point (.)',
+ min: 'Transaction fee is too small. It should be greater or equal to ' + minimumFee.formatAmount(true)
+ }
}
};
wallet.send = send;
@@ -102,15 +156,21 @@
function submitPayment() {
// here we have a direct markup dependency
var paymentForm = getPaymentForm();
- paymentForm.$setSubmitted();
- if (paymentForm.$invalid)
- // prevent payment dialog from closing
+ wallet.transfer.fee.isValid = angular.isDefined(paymentForm.invalid.wavessendfee) ?
+ paymentForm.invalid.wavessendfee : true;
+ if (!paymentForm.validate())
+ // prevent payment dialog from closing if it's not valid
return false;
+ if (angular.isDefined(wallet.transfer.selectedFee))
+ wallet.transfer.fee.amount = wallet.transfer.selectedFee.amount;
+ else
+ wallet.transfer.fee.amount = wallet.transfer.searchText;
+
var currentCurrency = wallet.current.balance.currency;
var payment = {
amount: new Money(wallet.transfer.amount, currentCurrency),
- fee: new Money(wallet.transfer.fee, currentCurrency),
+ fee: new Money(wallet.transfer.fee.amount, currentCurrency),
recipient: addressService.fromDisplayAddress(wallet.transfer.recipient),
time: utilityService.getTime()
};
@@ -150,7 +210,7 @@
//todo: disable confirm button
apiService.broadcastPayment(transaction).then(function () {
- var amount = new Money(transaction.amount, wallet.current.balance.currency);
+ var amount = Money.fromCoins(transaction.amount, wallet.current.balance.currency);
var address = addressService.fromRawAddress(transaction.recipient).getDisplayAddress();
var displayMessage = 'Sent ' + amount.formatAmount(true) + amount.currency.symbol +
'<br>Recipient ' + address.substr(0,15) + '...<br>Date: ' +
@@ -198,12 +258,15 @@
function resetPaymentForm() {
wallet.transfer.recipient = '';
wallet.transfer.amount = '0';
- wallet.transfer.fee = '0.001';
+ wallet.transfer.fee = {
+ amount: '0.001',
+ isValid: true
+ };
}
}
- WalletController.$inject = ['$scope', '$timeout', '$interval', 'applicationContext', 'dialogService',
- 'addressService', 'utilityService', 'apiService', 'notificationService',
+ WalletController.$inject = ['$scope', '$timeout', '$interval', 'constants.ui', 'applicationContext',
+ 'dialogService', 'addressService', 'utilityService', 'apiService', 'notificationService',
'formattingService', 'transferService', 'transactionLoadingService'];
angular
Oops, something went wrong.

0 comments on commit 6b6606a

Please sign in to comment.