From c5e5d4457fe38983cb8f473daf90842cea8e407b Mon Sep 17 00:00:00 2001 From: Hubert Koster Date: Tue, 14 Sep 2021 14:04:20 +0200 Subject: [PATCH 1/4] adding deposit error message functionality --- .../pages/user/metatrader/metatrader.config.js | 17 +++-------------- .../app/pages/user/metatrader/metatrader.ui.js | 14 ++++++++++++++ src/sass/app/metatrader.scss | 6 ++++++ src/templates/app/user/metatrader.jsx | 3 +++ 4 files changed, 26 insertions(+), 14 deletions(-) diff --git a/src/javascript/app/pages/user/metatrader/metatrader.config.js b/src/javascript/app/pages/user/metatrader/metatrader.config.js index a7ce80da56265..05174a94c2c41 100644 --- a/src/javascript/app/pages/user/metatrader/metatrader.config.js +++ b/src/javascript/app/pages/user/metatrader/metatrader.config.js @@ -8,7 +8,6 @@ const Validation = require('../../../common/form_validation'); const GTM = require('../../../../_common/base/gtm'); const localize = require('../../../../_common/localize').localize; const State = require('../../../../_common/storage').State; -const urlFor = require('../../../../_common/url').urlFor; const isBinaryApp = require('../../../../config').isBinaryApp; const MetaTraderConfig = (() => { @@ -442,26 +441,16 @@ const MetaTraderConfig = (() => { ['req', { hide_asterisk: true }], // check if entered amount is less than the available balance // e.g. transfer amount is 10 but client balance is 5 - ['custom', { - func: () => { - const balance = Client.get('balance'); - - const is_balance_more_than_entered = +balance >= +$(fields.deposit.txt_amount.id).val(); - - return balance && is_balance_more_than_entered; - }, - message: localize('You have insufficient funds in your Binary account, please add funds.', urlFor('cashier')), - }], // check if balance is less than the minimum limit for transfer // e.g. client balance could be 0.45 but min limit could be 1 ['custom', { func: () => { - const balance = Client.get('balance'); + const deposit_input_value = document.querySelector('#txt_amount_deposit').value; const min_req_balance = Currency.getTransferLimits(Client.get('currency'), 'min', 'mt5'); - const is_balance_more_than_min_req = +balance >= +min_req_balance; + const is_balance_more_than_min_req = +deposit_input_value > +min_req_balance; - return balance && is_balance_more_than_min_req; + return is_balance_more_than_min_req; }, message: localize('Should be more than [_1]', Currency.getTransferLimits(Client.get('currency'), 'min', 'mt5')), }], diff --git a/src/javascript/app/pages/user/metatrader/metatrader.ui.js b/src/javascript/app/pages/user/metatrader/metatrader.ui.js index 0a1afc274f26e..313f161d710cc 100644 --- a/src/javascript/app/pages/user/metatrader/metatrader.ui.js +++ b/src/javascript/app/pages/user/metatrader/metatrader.ui.js @@ -560,6 +560,8 @@ const MetaTraderUI = (() => { $form.find('label[for="txt_amount_withdrawal"]').append(` ${mt_currency}`); const should_show_transfer_fee = client_currency !== mt_currency; + const txt_amount_deposit_element = $form.find('#txt_amount_deposit'); + if (should_show_transfer_fee) { $('#transfer_fee_amount_to').text(getTransferFee(client_currency, mt_currency)); $('#transfer_fee_minimum_to').text(Currency.getMinimumTransferFee(client_currency)); @@ -568,6 +570,18 @@ const MetaTraderUI = (() => { } $form.find('#txt_amount_deposit, #txt_amount_withdrawal').siblings('.hint').setVisibility(should_show_transfer_fee); + txt_amount_deposit_element.on('input', () => { + const balance = Client.get('balance'); + const insufficient_funds_error = $form.find('#insufficient_funds'); + const txt_amount_deposit_value = txt_amount_deposit_element.val(); + const is_balance_more_than_entered = balance >= txt_amount_deposit_value; + + if (is_balance_more_than_entered) { + return insufficient_funds_error.setVisibility(0); + } + return insufficient_funds_error.setVisibility(1); + }); + ['deposit', 'withdrawal'].forEach((act) => { actions_info[act].prerequisites(acc_type).then((error_msg) => { if (error_msg) { diff --git a/src/sass/app/metatrader.scss b/src/sass/app/metatrader.scss index 63e737ca3ae75..f0d9f639f4a36 100644 --- a/src/sass/app/metatrader.scss +++ b/src/sass/app/metatrader.scss @@ -340,6 +340,12 @@ font-weight: bold; color: $COLOR_GRAY_SHADE; } + #insufficient_funds { + a { + color: $COLOR_RED; + } + text-align: left; + } #mt5_remaining_transfers .empty { color: $COLOR_RED; } diff --git a/src/templates/app/user/metatrader.jsx b/src/templates/app/user/metatrader.jsx index 7a7974c3d284e..a2558e948af7d 100644 --- a/src/templates/app/user/metatrader.jsx +++ b/src/templates/app/user/metatrader.jsx @@ -543,6 +543,9 @@ const Metatrader = () => (
', '')} /> +

+ {it.L('You have insufficient funds in your Binary account, please add funds.', it.url_for('cashier'))} +

Date: Tue, 14 Sep 2021 14:13:12 +0200 Subject: [PATCH 2/4] removing comment --- src/javascript/app/pages/user/metatrader/metatrader.config.js | 2 -- 1 file changed, 2 deletions(-) diff --git a/src/javascript/app/pages/user/metatrader/metatrader.config.js b/src/javascript/app/pages/user/metatrader/metatrader.config.js index 05174a94c2c41..cc324fb5fbcec 100644 --- a/src/javascript/app/pages/user/metatrader/metatrader.config.js +++ b/src/javascript/app/pages/user/metatrader/metatrader.config.js @@ -439,8 +439,6 @@ const MetaTraderConfig = (() => { selector : fields.deposit.txt_amount.id, validations: [ ['req', { hide_asterisk: true }], - // check if entered amount is less than the available balance - // e.g. transfer amount is 10 but client balance is 5 // check if balance is less than the minimum limit for transfer // e.g. client balance could be 0.45 but min limit could be 1 ['custom', { From ed85538f939293611808f4a09059aa8c2dfba1f7 Mon Sep 17 00:00:00 2001 From: Hubert Koster Date: Tue, 14 Sep 2021 14:17:41 +0200 Subject: [PATCH 3/4] refactoring code --- src/javascript/app/pages/user/metatrader/metatrader.ui.js | 3 +-- 1 file changed, 1 insertion(+), 2 deletions(-) diff --git a/src/javascript/app/pages/user/metatrader/metatrader.ui.js b/src/javascript/app/pages/user/metatrader/metatrader.ui.js index 313f161d710cc..e7c9b16b8da89 100644 --- a/src/javascript/app/pages/user/metatrader/metatrader.ui.js +++ b/src/javascript/app/pages/user/metatrader/metatrader.ui.js @@ -573,8 +573,7 @@ const MetaTraderUI = (() => { txt_amount_deposit_element.on('input', () => { const balance = Client.get('balance'); const insufficient_funds_error = $form.find('#insufficient_funds'); - const txt_amount_deposit_value = txt_amount_deposit_element.val(); - const is_balance_more_than_entered = balance >= txt_amount_deposit_value; + const is_balance_more_than_entered = balance >= txt_amount_deposit_element.val(); if (is_balance_more_than_entered) { return insufficient_funds_error.setVisibility(0); From 9ffd6eef50c608c05dc1191640f7dafea689e10a Mon Sep 17 00:00:00 2001 From: Hubert Koster Date: Tue, 14 Sep 2021 15:51:49 +0200 Subject: [PATCH 4/4] refactoring code --- src/javascript/app/pages/user/metatrader/metatrader.config.js | 4 +--- src/sass/app/metatrader.scss | 2 +- src/templates/app/user/metatrader.jsx | 2 +- 3 files changed, 3 insertions(+), 5 deletions(-) diff --git a/src/javascript/app/pages/user/metatrader/metatrader.config.js b/src/javascript/app/pages/user/metatrader/metatrader.config.js index cc324fb5fbcec..0b59860176c8e 100644 --- a/src/javascript/app/pages/user/metatrader/metatrader.config.js +++ b/src/javascript/app/pages/user/metatrader/metatrader.config.js @@ -446,9 +446,7 @@ const MetaTraderConfig = (() => { const deposit_input_value = document.querySelector('#txt_amount_deposit').value; const min_req_balance = Currency.getTransferLimits(Client.get('currency'), 'min', 'mt5'); - const is_balance_more_than_min_req = +deposit_input_value > +min_req_balance; - - return is_balance_more_than_min_req; + return +deposit_input_value > +min_req_balance; }, message: localize('Should be more than [_1]', Currency.getTransferLimits(Client.get('currency'), 'min', 'mt5')), }], diff --git a/src/sass/app/metatrader.scss b/src/sass/app/metatrader.scss index f0d9f639f4a36..06da6d6e025c1 100644 --- a/src/sass/app/metatrader.scss +++ b/src/sass/app/metatrader.scss @@ -341,7 +341,7 @@ color: $COLOR_GRAY_SHADE; } #insufficient_funds { - a { + .insufficient-funds-error-link { color: $COLOR_RED; } text-align: left; diff --git a/src/templates/app/user/metatrader.jsx b/src/templates/app/user/metatrader.jsx index a2558e948af7d..c18da7192e0b8 100644 --- a/src/templates/app/user/metatrader.jsx +++ b/src/templates/app/user/metatrader.jsx @@ -544,7 +544,7 @@ const Metatrader = () => (
', '')} />

- {it.L('You have insufficient funds in your Binary account, please add funds.', it.url_for('cashier'))} + {it.L('You have insufficient funds in your Binary account, please add funds.', it.url_for('cashier'))}