diff --git a/src/javascript/app/common/helpers.js b/src/javascript/app/common/helpers.js index eed46e0fb80..971eab5a4f9 100644 --- a/src/javascript/app/common/helpers.js +++ b/src/javascript/app/common/helpers.js @@ -129,13 +129,13 @@ const paramsMap = { 'callputequal' : PARAM_NAMES.IS_EQUAL, }; -const setDefaultParams = (elementId, value) => { - if (paramsMap[elementId]) { +const setDefaultParams = (element_id, value) => { + if (paramsMap[element_id]) { const currency = Defaults.get(PARAM_NAMES.CURRENCY); - if (elementId === 'amount' && isCryptocurrency(currency)) { + if (element_id === 'amount' && isCryptocurrency(currency)) { Defaults.set('amount_crypto', value); } else { - Defaults.set(paramsMap[elementId], value); + Defaults.set(paramsMap[element_id], value); } triggerSessionChange(); } diff --git a/src/javascript/app/components/loading-spinner.js b/src/javascript/app/components/loading-spinner.js index 368790f2109..4dde80174d6 100644 --- a/src/javascript/app/components/loading-spinner.js +++ b/src/javascript/app/components/loading-spinner.js @@ -29,7 +29,7 @@ export const show = (content_id) => { */ export const hide = (content_id) => { dataManager.setContract({ - hidePageLoader: true, + hide_page_loader: true, }); assertContainerExists(content_id); diff --git a/src/javascript/app/pages/bottom/explanation.jsx b/src/javascript/app/pages/bottom/explanation.jsx index 5e8ddf5b4d2..9ce8694fca1 100644 --- a/src/javascript/app/pages/bottom/explanation.jsx +++ b/src/javascript/app/pages/bottom/explanation.jsx @@ -10,19 +10,19 @@ import { useContractChange } from '../../hooks/events.js'; export const Explanation = ({ explanationOnly = false }) => { - const [formName,setFormName] = useState(null); + const [form_name,setFormName] = useState(null); - const hasContractChanges = useContractChange(); + const has_contract_changes = useContractChange(); useEffect(() => { - const actualFormName = dataManager.getContract('explanationFormName'); + const actual_form_name = dataManager.getContract('explanationFormName'); setFormName(null); setTimeout(() => { - setFormName(actualFormName); + setFormName(actual_form_name); }, 500); - }, [hasContractChanges]); + }, [has_contract_changes]); const language = Language.get(); const image_path = Url.urlForStatic( @@ -31,7 +31,7 @@ export const Explanation = ({ explanationOnly = false }) => { const Notes = () => ( <> {localize('Note')}: - {contractExplanationData.note[formName].content.map((data, idx) => ( + {contractExplanationData.note[form_name].content.map((data, idx) => ( {parse(data)} ))} @@ -93,19 +93,19 @@ export const Explanation = ({ explanationOnly = false }) => { }, }; - if (formName) { + if (form_name) { return (
{/* ========== Winning ========== */} {!explanationOnly && ( <>
-
+
{localize('Winning the contract')}
- {contractExplanationData.winning[formName].content.map( + {contractExplanationData.winning[form_name].content.map( (data, idx) => ( {parse(data)} ) @@ -116,7 +116,7 @@ export const Explanation = ({ explanationOnly = false }) => {
{/* ========== Image ========== */} - {images[formName] && ( + {images[form_name] && (
@@ -127,15 +127,15 @@ export const Explanation = ({ explanationOnly = false }) => {
- {images[formName].image2 && ( + {images[form_name].image2 && (
)} @@ -149,29 +149,29 @@ export const Explanation = ({ explanationOnly = false }) => { {/* ========== Explain ========== */}
-
+
- {contractExplanationData.explain[formName].title} + {contractExplanationData.explain[form_name].title}
- {contractExplanationData.explain[formName].content.map( + {contractExplanationData.explain[form_name].content.map( (data, idx) => ( {parse(data)} ) )}
- {contractExplanationData.explain[formName].title_secondary && ( + {contractExplanationData.explain[form_name].title_secondary && (
- {contractExplanationData.explain[formName].title_secondary} + {contractExplanationData.explain[form_name].title_secondary}
)} - {contractExplanationData.explain[formName].content_secondary && ( + {contractExplanationData.explain[form_name].content_secondary && (
- {contractExplanationData.explain[formName].content_secondary.map( + {contractExplanationData.explain[form_name].content_secondary.map( (data, idx) => ( {parse(data)} ) @@ -184,7 +184,7 @@ export const Explanation = ({ explanationOnly = false }) => { {/* ========== Note ========== */} {!explanationOnly && ( - contractExplanationData.note[formName] && ( + contractExplanationData.note[form_name] && ( } size='sm' /> ) )} diff --git a/src/javascript/app/pages/bottom/tabs.jsx b/src/javascript/app/pages/bottom/tabs.jsx index ece2317e004..5de055c8145 100644 --- a/src/javascript/app/pages/bottom/tabs.jsx +++ b/src/javascript/app/pages/bottom/tabs.jsx @@ -11,11 +11,11 @@ import dataManager from '../../common/data_manager.js'; import LastDigit from '../trade/last_digit.jsx'; const BottomTabs = () => { - const hasMarketChange = useMarketChange(); + const has_market_change = useMarketChange(); const [selectedTab, setSelectedTab] = useState(1); const [hasLastDigit, setHasLastDigit] = useState(false); - const [formName, setFormName] = useState(''); - const hasContractChange = useContractChange(); + const [form_name, setFormName] = useState(''); + const has_contract_change = useContractChange(); const savedTab = sessionStorage.getItem('currentTab'); const triggerOldTabTimer = useRef(); const [isShowGraph, setIsShowGraph] = useState(false); @@ -37,11 +37,11 @@ const BottomTabs = () => { useEffect(() => { setFormName(dataManager.getContract('explanationFormName')); - }, [hasContractChange, hasMarketChange]); + }, [has_contract_change, has_market_change]); useEffect(() => { - setHasLastDigit(formName === 'digits' || formName === 'evenodd' || formName === 'overunder'); - }, [formName]); + setHasLastDigit(form_name === 'digits' || form_name === 'evenodd' || form_name === 'overunder'); + }, [form_name]); useEffect(() => { if (savedTab !== null) { diff --git a/src/javascript/app/pages/form/barrier-fields.jsx b/src/javascript/app/pages/form/barrier-fields.jsx index 14ecf3a1bea..e7e901d0f4b 100644 --- a/src/javascript/app/pages/form/barrier-fields.jsx +++ b/src/javascript/app/pages/form/barrier-fields.jsx @@ -19,8 +19,8 @@ const BarrierFields = ({ form_name, handleAmountChange }) => { const barrier_low = Defaults.get(PARAM_NAMES.BARRIER_LOW); useEffect(() => { - setBarrierData((oldData) => ({ - ...oldData, + setBarrierData((old_data) => ({ + ...old_data, ...dataManager.getAllTrades(), })); }, [hasBarrierChange]); diff --git a/src/javascript/app/pages/form/currency-dropdown.jsx b/src/javascript/app/pages/form/currency-dropdown.jsx index 7ee4d845336..410530d3f22 100644 --- a/src/javascript/app/pages/form/currency-dropdown.jsx +++ b/src/javascript/app/pages/form/currency-dropdown.jsx @@ -3,7 +3,7 @@ import { CustomDropdown, DropdownItem, DropdownTitle, useDropdown } from '@deriv import { setDefaultParams } from '../../common/helpers'; import { localize } from '../../../_common/localize'; -const CurrencyContent = ({ currency_list, currency, onUpdate, elementId }) => { +const CurrencyContent = ({ currency_list, currency, onUpdate, element_id }) => { const { close } = useDropdown(); const getCurrencyGroupMap = { @@ -22,8 +22,8 @@ const CurrencyContent = ({ currency_list, currency, onUpdate, elementId }) => { label={item.text} selected={item.value === currency} onClick={() => { - onUpdate(elementId, item.value, 'change'); - setDefaultParams(elementId, item.value); + onUpdate(element_id, item.value, 'change'); + setDefaultParams(element_id, item.value); close(); }} /> @@ -33,7 +33,7 @@ const CurrencyContent = ({ currency_list, currency, onUpdate, elementId }) => {
); }; -export const CurrencyDropdown = ({ currency_list, currency, onUpdate, elementId }) => ( +export const CurrencyDropdown = ({ currency_list, currency, onUpdate, element_id }) => ( ); diff --git a/src/javascript/app/pages/form/dropdown-component.jsx b/src/javascript/app/pages/form/dropdown-component.jsx index 4228a8c1119..e4c981cf0eb 100644 --- a/src/javascript/app/pages/form/dropdown-component.jsx +++ b/src/javascript/app/pages/form/dropdown-component.jsx @@ -2,14 +2,14 @@ import React from 'react'; import { CustomDropdown, DropdownItem, useDropdown } from '@deriv-com/quill-ui'; import { setDefaultParams } from '../../common/helpers'; -const DropdownContent = ({ options, value, onUpdate, elementId }) => { +const DropdownContent = ({ options, value, onUpdate, element_id }) => { const { close } = useDropdown(); const handleClick = (val) => { - if (elementId === 'expiry_date') { + if (element_id === 'expiry_date') { onUpdate(val); } else { - onUpdate(elementId, val, 'change'); + onUpdate(element_id, val, 'change'); } }; @@ -22,7 +22,7 @@ const DropdownContent = ({ options, value, onUpdate, elementId }) => { selected={(item.value === value || item.text === value)} onClick={() => { handleClick(item.value); - setDefaultParams(elementId, item.value); + setDefaultParams(element_id, item.value); close(); }} /> @@ -30,7 +30,7 @@ const DropdownContent = ({ options, value, onUpdate, elementId }) => {
); }; -export const DropdownComponent = ({ label = '', options, value, onUpdate, elementId }) => ( +export const DropdownComponent = ({ label = '', options, value, onUpdate, element_id }) => ( ); diff --git a/src/javascript/app/pages/form/form-component.jsx b/src/javascript/app/pages/form/form-component.jsx index bcdf1cfe763..a6703b6feeb 100644 --- a/src/javascript/app/pages/form/form-component.jsx +++ b/src/javascript/app/pages/form/form-component.jsx @@ -30,17 +30,17 @@ import { isCryptocurrency } from '../../../_common/base/currency_base.js'; export const FormComponent = () => { const [tradeData, setTradeData] = useState({}); - const hasTradeChange = useTradeChange(); - const hasMarketChange = useMarketChange(); - const hasContractChange = useContractChange(); - const hasSessionChange = useSessionChange(); + const has_trade_change = useTradeChange(); + const has_market_change = useMarketChange(); + const has_contract_change = useContractChange(); + const has_session_change = useSessionChange(); useEffect(() => { - setTradeData((oldData) => ({ - ...oldData, + setTradeData((old_data) => ({ + ...old_data, ...dataManager.getAllTrades(), })); - }, [hasMarketChange, hasContractChange, hasTradeChange, hasSessionChange]); + }, [has_market_change, has_contract_change, has_trade_change, has_session_change]); const form_name = Defaults.get(PARAM_NAMES.FORM_NAME); const expiry_type = Defaults.get(PARAM_NAMES.EXPIRY_TYPE); @@ -91,33 +91,33 @@ export const FormComponent = () => { const onExpiryDateChange = (value) => { const element = common_functions.getElementById('expiry_date'); - const newDate = moment(value).format('YYYY-MM-DD'); - if (newDate !== expiry_date) { + const new_date = moment(value).format('YYYY-MM-DD'); + if (new_date !== expiry_date) { if (!endtime_data.show_datepicker) { Array.from(element.options).map((option) => { if (moment(option.text).format('YYYY-MM-DD') === value) { option.setAttribute('selected', true); - option.setAttribute('data-value', newDate); + option.setAttribute('data-value', new_date); } else { option.setAttribute('selected', false); - option.setAttribute('data-value', newDate); + option.setAttribute('data-value', new_date); } }); } else { - element.setAttribute('data-value', newDate); + element.setAttribute('data-value', new_date); } eventDispatcher(element, 'change'); } }; - const updateFormField = (elementId, value, eventType) => { - const element = common_functions.getElementById(elementId); - if (elementId === 'callputequal') { + const updateFormField = (element_id, value, event_type) => { + const element = common_functions.getElementById(element_id); + if (element_id === 'callputequal') { element.checked = !+is_equal; } else { element.value = value; } - eventDispatcher(element, eventType); + eventDispatcher(element, event_type); }; const getMessage = (form) => { @@ -191,7 +191,7 @@ export const FormComponent = () => { options={start_dates.options} value={findTextByValue(start_dates.options, date_start)} onUpdate={updateFormField} - elementId='date_start' + element_id='date_start' />
{date_start !== 'now' && ( @@ -199,7 +199,7 @@ export const FormComponent = () => {
)} @@ -213,7 +213,7 @@ export const FormComponent = () => { options={expiry_type_options} value={findTextByValue(expiry_type_options, expiry_type)} onUpdate={updateFormField} - elementId='expiry_type' + element_id='expiry_type' />
{expiry_type === 'duration' && ( @@ -239,7 +239,7 @@ export const FormComponent = () => { options={duration_options} value={findTextByValue(duration_options, duration_units)} onUpdate={updateFormField} - elementId='duration_units' + element_id='duration_units' />
@@ -264,7 +264,7 @@ export const FormComponent = () => { options={endtime_data.options} value={formatEndDate(expiry_date)} onUpdate={onExpiryDateChange} - elementId='expiry_date' + element_id='expiry_date' /> )}
@@ -278,7 +278,7 @@ export const FormComponent = () => {
@@ -297,7 +297,7 @@ export const FormComponent = () => { label={localize('Last Digit Prediction')} start={0} end={9} - elementId='prediction' + element_id='prediction' onUpdate={updateFormField} />
@@ -311,7 +311,7 @@ export const FormComponent = () => { label={localize('Tick Prediction')} start={1} end={5} - elementId='selected_tick' + element_id='selected_tick' onUpdate={updateFormField} /> @@ -326,7 +326,7 @@ export const FormComponent = () => { options={payoutTypeOptions} value={findTextByValue(payoutTypeOptions, amount_type)} onUpdate={updateFormField} - elementId='amount_type' + element_id='amount_type' /> {currency_list ? ( @@ -344,7 +344,7 @@ export const FormComponent = () => { currency_list={currency_list} currency={currency} onUpdate={updateFormField} - elementId='currency' + element_id='currency' /> @@ -382,7 +382,7 @@ export const FormComponent = () => { currency_list={currency_list} currency={currency} onUpdate={updateFormField} - elementId='multiplier_currency' + element_id='multiplier_currency' /> diff --git a/src/javascript/app/pages/form/numbers-dropdown.jsx b/src/javascript/app/pages/form/numbers-dropdown.jsx index 61f327025e1..528c367af37 100644 --- a/src/javascript/app/pages/form/numbers-dropdown.jsx +++ b/src/javascript/app/pages/form/numbers-dropdown.jsx @@ -2,7 +2,7 @@ import React from 'react'; import { CustomDropdown, DropdownItem, useDropdown } from '@deriv-com/quill-ui'; import { setDefaultParams } from '../../common/helpers'; -const Content = ({ value, start, end, elementId, onUpdate }) => { +const Content = ({ value, start, end, element_id, onUpdate }) => { const { close } = useDropdown(); return ( @@ -13,8 +13,8 @@ const Content = ({ value, start, end, elementId, onUpdate }) => { label={start + idx} selected={start + idx === +value} onClick={() => { - onUpdate(elementId, start + idx, 'change'); - setDefaultParams(elementId, start + idx); + onUpdate(element_id, start + idx, 'change'); + setDefaultParams(element_id, start + idx); close(); }} /> @@ -23,7 +23,7 @@ const Content = ({ value, start, end, elementId, onUpdate }) => { ); }; -export const NumbersDropdown = ({ value, label, start, end, elementId, onUpdate }) => ( +export const NumbersDropdown = ({ value, label, start, end, element_id, onUpdate }) => ( diff --git a/src/javascript/app/pages/form/time-selection.jsx b/src/javascript/app/pages/form/time-selection.jsx index 15cbe952198..2e80de826b4 100644 --- a/src/javascript/app/pages/form/time-selection.jsx +++ b/src/javascript/app/pages/form/time-selection.jsx @@ -6,7 +6,7 @@ import dataManager from '../../common/data_manager.js'; import { setDefaultParams, setMinMaxTime } from '../../common/helpers.js'; import common_functions from '../../../_common/common_functions.js'; -const TimeContent = ({ time, onUpdate, elementId }) => { +const TimeContent = ({ time, onUpdate, element_id }) => { const [startTimeData, setStartTimeData] = useState(); const [expiryTimeData, setExpiryTimeData] = useState(); const hasTimeChange = useTimeChange(); @@ -27,13 +27,13 @@ const TimeContent = ({ time, onUpdate, elementId }) => { const timeIntervals = []; let startTime, endTime; - if (elementId === 'time_start') { + if (element_id === 'time_start') { const minTime = startTimeData?.minTime; const maxTime = startTimeData?.maxTime; startTime = minTime && !isNaN(minTime.hour) && !isNaN(minTime.minute) ? formatTime(minTime) : '00:00'; endTime = maxTime && !isNaN(maxTime.hour) && !isNaN(maxTime.minute) ? formatTime(maxTime) : '23:55'; } - if (elementId === 'expiry_time') { + if (element_id === 'expiry_time') { const minTime = expiryTimeData?.minTime; const maxTime = expiryTimeData?.maxTime; startTime = minTime && !isNaN(minTime.hour) && !isNaN(minTime.minute) ? formatTime(minTime) : '00:00'; @@ -61,9 +61,9 @@ const TimeContent = ({ time, onUpdate, elementId }) => { label={item} selected={item === time} onClick={() => { - onUpdate(elementId, item, 'change'); - common_functions.getElementById(elementId).setAttribute('data-value', item); - setDefaultParams(elementId, item); + onUpdate(element_id, item, 'change'); + common_functions.getElementById(element_id).setAttribute('data-value', item); + setDefaultParams(element_id, item); close(); }} /> @@ -74,7 +74,7 @@ const TimeContent = ({ time, onUpdate, elementId }) => { export const TimePickerDropdown = ({ time, onUpdate, - elementId, + element_id, }) => { const handleOpen = (id) => { if (id === 'expiry_time') { @@ -88,13 +88,13 @@ export const TimePickerDropdown = ({ handleOpen(elementId)} + onClickDropdown={() => handleOpen(element_id)} fullHeightOnOpen={false} > ); diff --git a/src/javascript/app/pages/loader.jsx b/src/javascript/app/pages/loader.jsx index d3c66892ae1..03ba28b455f 100644 --- a/src/javascript/app/pages/loader.jsx +++ b/src/javascript/app/pages/loader.jsx @@ -36,7 +36,7 @@ const pageTypes = [ ]; const Loader = () => { - const hasContractChange = useContractChange(); + const has_contract_change = useContractChange(); const [loading, setLoading] = useState(true); @@ -45,13 +45,13 @@ const Loader = () => { const page = getPageType().name; useEffect(() => { - const hidePageLoader = dataManager.getContract('hidePageLoader'); + const hide_page_loader = dataManager.getContract('hide_page_loader'); - if (hidePageLoader) { + if (hide_page_loader) { setLoading(false); } - }, [hasContractChange]); + }, [has_contract_change]); useEffect(() => { const handleLoad = () => { diff --git a/src/javascript/app/pages/trade/analysis.js b/src/javascript/app/pages/trade/analysis.js index 58180200df0..21cb57cda18 100644 --- a/src/javascript/app/pages/trade/analysis.js +++ b/src/javascript/app/pages/trade/analysis.js @@ -37,7 +37,7 @@ const TradingAnalysis = (() => { form_name = map_obj[form_name] || form_name; dataManager.setContract({ - actualFormName : form_name, + actual_form_name : form_name, explanationFormName: tab_form_name, }); diff --git a/src/javascript/app/pages/trade/common.js b/src/javascript/app/pages/trade/common.js index 005e3e79803..c97e8ef1482 100644 --- a/src/javascript/app/pages/trade/common.js +++ b/src/javascript/app/pages/trade/common.js @@ -52,16 +52,16 @@ const commonTrading = (() => { if (!contracts_element) { dataManager.setContract({ - contractsTree : contracts_tree, + contracts_tree, contracts : all_contracts, - formName : selected || Defaults.get('formname'), + formName : selected || Defaults.get('form_name'), contractElement: getElementById('contract'), }); } else { // Update the component. contracts_element.updater.enqueueSetState(contracts_element, { contracts_tree, contracts: all_contracts, - formname : contract_to_show || Defaults.get(FORM_NAME), + form_name: contract_to_show || Defaults.get(FORM_NAME), }); } FormsWrapperElement.init(); @@ -158,7 +158,7 @@ const commonTrading = (() => { showHideOverlay('contracts_list', 'flex'); $('.purchase_button').text(localize('Purchase')); dataManager.setPurchase({ - showPurchaseResults: false, + show_purchase_results: false, }); }; @@ -254,7 +254,7 @@ const commonTrading = (() => { node.show(); elementInnerHtml(node, comment); dataManager.setPurchase({ - [`${position}Comment`]: comment, + [`${position}_comment`]: comment, }); } } @@ -476,13 +476,13 @@ const commonTrading = (() => { showPriceOverlay: () => { showHideOverlay('loading_container2', 'block'); dataManager.setPurchase({ - isPurchaseFormDisabled: true, + is_purchase_form_disabled: true, }); }, hidePriceOverlay: () => { showHideOverlay('loading_container2', 'none'); dataManager.setPurchase({ - isPurchaseFormDisabled: false, + is_purchase_form_disabled: false, }); }, hideFormOverlay: () => { showHideOverlay('loading_container3', 'none'); }, diff --git a/src/javascript/app/pages/trade/contract.js b/src/javascript/app/pages/trade/contract.js index 008f380afc2..e0b4c7d412a 100644 --- a/src/javascript/app/pages/trade/contract.js +++ b/src/javascript/app/pages/trade/contract.js @@ -139,7 +139,7 @@ const Contract = (() => { } } if (form === contract_category) { - if (current_obj.forward_starting_options && current_obj.start_type === 'forward' && sessionStorage.formname !== 'higherlower') { + if (current_obj.forward_starting_options && current_obj.start_type === 'forward' && sessionStorage.form_name !== 'higherlower') { start_dates.list = current_obj.forward_starting_options; } else if (current_obj.start_type === 'spot') { start_dates.has_spot = 1; diff --git a/src/javascript/app/pages/trade/contracts.jsx b/src/javascript/app/pages/trade/contracts.jsx index d3c5f730234..1816c15eb6d 100644 --- a/src/javascript/app/pages/trade/contracts.jsx +++ b/src/javascript/app/pages/trade/contracts.jsx @@ -9,14 +9,14 @@ class Contracts extends React.Component { constructor (props) { super(props); const { contracts, contracts_tree, selected } = props; - const formname = selected || Defaults.get(Defaults.PARAM_NAMES.FORM_NAME); + const form_name = selected || Defaults.get(Defaults.PARAM_NAMES.FORM_NAME); this.references = {}; this.el_contract = getElementById('contract'); - this.el_contract.value = formname; + this.el_contract.value = form_name; this.state = { contracts, contracts_tree, - formname, + form_name, open: false, }; } @@ -65,16 +65,16 @@ class Contracts extends React.Component { saveRef = (name, node) => { this.references[name] = node; }; getCurrentType = () => { - const { formname, contracts } = this.state; + const { form_name, contracts } = this.state; let type = ''; this.state.contracts_tree.forEach((e) => { if (typeof e === 'object') { e[1].forEach((subtype) => { - if (subtype === formname) { + if (subtype === form_name) { type = e[0]; } }); - } else if (e === formname) { + } else if (e === form_name) { type = e; } }); @@ -83,23 +83,23 @@ class Contracts extends React.Component { }; getCurrentContract = () => { - const { formname, contracts } = this.state; + const { form_name, contracts } = this.state; const max_char = window.innerWidth <= 767 ? 10 : 15; - if ((contracts[formname] || '').length > max_char) { - return `${contracts[formname].substr(0,max_char)}...`; + if ((contracts[form_name] || '').length > max_char) { + return `${contracts[form_name].substr(0,max_char)}...`; } - return contracts[formname]; + return contracts[form_name]; }; - onContractClick = (formname) => { + onContractClick = (form_name) => { this.closeDropDown(); - if (formname === this.state.formname) { return; } + if (form_name === this.state.form_name) { return; } // Notify for changes on contract. - this.el_contract.value = formname; + this.el_contract.value = form_name; const event = new Event('change'); this.el_contract.dispatchEvent(event); - this.setState({ formname }); + this.setState({ form_name }); }; /* eslint-enable no-undef */ @@ -108,7 +108,7 @@ class Contracts extends React.Component { contracts, contracts_tree, open, - formname, + form_name, } = this.state; const is_mobile = window.innerWidth <= 767; return ( @@ -140,7 +140,7 @@ class Contracts extends React.Component {
{contract[1].map((subtype, i) =>
@@ -156,7 +156,7 @@ class Contracts extends React.Component {
{contracts[contract]}
{contracts[contract]} diff --git a/src/javascript/app/pages/trade/defaults.js b/src/javascript/app/pages/trade/defaults.js index 449b63eddeb..850712d6a4f 100644 --- a/src/javascript/app/pages/trade/defaults.js +++ b/src/javascript/app/pages/trade/defaults.js @@ -33,7 +33,7 @@ const Defaults = (() => { EXPIRY_DATE : 'expiry_date', EXPIRY_TIME : 'expiry_time', EXPIRY_TYPE : 'expiry_type', - FORM_NAME : 'formname', + FORM_NAME : 'form_name', IS_EQUAL : 'is_equal', MARKET : 'market', MULTIPLIER : 'multiplier', diff --git a/src/javascript/app/pages/trade/markets/contracts-dropdown.jsx b/src/javascript/app/pages/trade/markets/contracts-dropdown.jsx index cfaef047e1a..f58f42eeb63 100644 --- a/src/javascript/app/pages/trade/markets/contracts-dropdown.jsx +++ b/src/javascript/app/pages/trade/markets/contracts-dropdown.jsx @@ -6,14 +6,14 @@ import Defaults, { PARAM_NAMES } from '../defaults'; export const ContractDropdown = () => { const { close } = useDropdown(); - const hasContractChange = useContractChange(); + const has_contract_change = useContractChange(); const [data, setData] = useState(dataManager.getAllContracts()); const selectedRef = useRef(null); const containerRef = useRef(null); const closeDropdownTimer = useRef(); - const onContractClick = (formName) => { - if (formName === data?.formName) { + const onContractClick = (form_name) => { + if (form_name === data?.form_name) { close(); return; } @@ -22,14 +22,14 @@ export const ContractDropdown = () => { if (contractElement) { const event = new Event('change'); - contractElement.value = formName; + contractElement.value = form_name; contractElement.dispatchEvent(event); } - Defaults.set(PARAM_NAMES.FORM_NAME, formName); + Defaults.set(PARAM_NAMES.FORM_NAME, form_name); dataManager.setContract({ - formName, + form_name, }); triggerContractChange(); @@ -42,11 +42,11 @@ export const ContractDropdown = () => { useEffect(() => () => clearTimeout(closeDropdownTimer.current), []); useEffect(() => { - setData(oldData => ({ - ...oldData, + setData(old_data => ({ + ...old_data, ...dataManager.getAllContracts(), })); - }, [hasContractChange]); + }, [has_contract_change]); useEffect(() => { if (selectedRef.current && containerRef.current) { @@ -65,7 +65,7 @@ export const ContractDropdown = () => { return (
- {data?.contractsTree?.map((contract, idx) => { + {data?.contracts_tree?.map((contract, idx) => { if (typeof contract === 'object') { return ( @@ -75,10 +75,10 @@ export const ContractDropdown = () => { key={i} onClick={() => onContractClick(subtype)} label={data?.contracts[subtype]} - selected={subtype === data?.formName} + selected={subtype === data?.form_name} size='md' className='trade-item-selected' - ref={subtype === data?.formName ? selectedRef : null} + ref={subtype === data?.form_name ? selectedRef : null} /> ) )} @@ -93,10 +93,10 @@ export const ContractDropdown = () => { onContractClick(contract)} label={data?.contracts[contract]} - selected={contract === data?.formName} + selected={contract === data?.form_name} size='md' className='contract-item-clickables' - ref={contract === data?.formName ? selectedRef : null} + ref={contract === data?.form_name ? selectedRef : null} /> diff --git a/src/javascript/app/pages/trade/markets/market-selector.jsx b/src/javascript/app/pages/trade/markets/market-selector.jsx index d6b221c1208..52e560a0866 100644 --- a/src/javascript/app/pages/trade/markets/market-selector.jsx +++ b/src/javascript/app/pages/trade/markets/market-selector.jsx @@ -13,16 +13,16 @@ import { useContractChange, useMarketChange } from '../../../hooks/events.js'; const MarketSelector = () => { const [marketLabel, setMarketLabel] = useState(getMarketName()); const [tradeTypeLabel, setTradeTypeLabel] = useState(getContractName()); - const hasContractChange = useContractChange(); - const hasMarketChange = useMarketChange(); + const has_contract_change = useContractChange(); + const has_market_change = useMarketChange(); useEffect(() => { setTradeTypeLabel(getContractName()); - }, [hasContractChange]); + }, [has_contract_change]); useEffect(() => { setMarketLabel(getMarketName()); - }, [hasMarketChange]); + }, [has_market_change]); return ( diff --git a/src/javascript/app/pages/trade/markets/markets-dropdown.jsx b/src/javascript/app/pages/trade/markets/markets-dropdown.jsx index bf1e9898a2d..6a3fb27eb75 100644 --- a/src/javascript/app/pages/trade/markets/markets-dropdown.jsx +++ b/src/javascript/app/pages/trade/markets/markets-dropdown.jsx @@ -42,16 +42,16 @@ export const getContractName = () => { const data = dataManager.getAllContracts('contract'); let name = ''; // eslint-disable-next-line consistent-return - data?.contractsTree?.forEach((contract) => { + data?.contracts_tree?.forEach((contract) => { if (typeof contract === 'object') { contract[1].forEach((subtype) => { - if (subtype === data?.actualFormName) { + if (subtype === data?.actual_form_name) { name = data?.contracts[subtype]; } }); - } else if (contract === data?.actualFormName) { + } else if (contract === data?.actual_form_name) { name = data?.contracts[contract]; } diff --git a/src/javascript/app/pages/trade/not-available.jsx b/src/javascript/app/pages/trade/not-available.jsx index 130f9a3c599..54294ef8556 100644 --- a/src/javascript/app/pages/trade/not-available.jsx +++ b/src/javascript/app/pages/trade/not-available.jsx @@ -30,7 +30,7 @@ const NotAvailable = ({ title, body }) => ( export const init = ({ ...props }) => { dataManager.setContract({ - hidePageLoader: true, + hide_page_loader: true, }); ReactDOM.render(, getElementById('content')); }; diff --git a/src/javascript/app/pages/trade/price.js b/src/javascript/app/pages/trade/price.js index 266aae10fe0..118963087ab 100644 --- a/src/javascript/app/pages/trade/price.js +++ b/src/javascript/app/pages/trade/price.js @@ -215,8 +215,8 @@ const Price = (() => { CommonFunctions.elementTextContent(h4, display_text); dataManager.setPurchase({ - [`${position}DisplayText`] : display_text, - [`${position}ContractType`]: type, + [`${position}_display_text`] : display_text, + [`${position}_contract_type`]: type, }); } @@ -227,7 +227,7 @@ const Price = (() => { if (!data.display_value) { amount.classList.remove('price_moved_up', 'price_moved_down'); dataManager.setPurchase({ - [`${position}AmountClassname`]: '', + [`${position}_amount_classname`]: '', }); } CommonFunctions.elementTextContent(stake, `${localize('Stake')}: `); @@ -236,7 +236,7 @@ const Price = (() => { if (!data.payout) { amount.classList.remove('price_moved_up', 'price_moved_down'); dataManager.setPurchase({ - [`${position}AmountClassname`]: '', + [`${position}_amount_classname`]: '', }); } CommonFunctions.elementTextContent(payout, `${localize('Payout')}: `); @@ -246,22 +246,22 @@ const Price = (() => { CommonFunctions.elementInnerHtml(contract_multiplier, data.multiplier ? formatMoney(currentCurrency, data.multiplier, false, 0, 2) : '-'); dataManager.setPurchase({ - [`${position}Amount`] : data.display_value ? formatMoney(currentCurrency, data.display_value, true) : '-', - [`${position}PayoutAmount`]: data.payout ? formatMoney(currentCurrency, data.payout, true) : '-', - [`${position}Multiplier`] : data.multiplier ? formatMoney(currentCurrency, data.multiplier, true, 0, 2) : '-', - currency : getCurrencyDisplayCode(currentCurrency), + [`${position}_amount`] : data.display_value ? formatMoney(currentCurrency, data.display_value, true) : '-', + [`${position}_payout_amount`]: data.payout ? formatMoney(currentCurrency, data.payout, true) : '-', + [`${position}_multiplier`] : data.multiplier ? formatMoney(currentCurrency, data.multiplier, true, 0, 2) : '-', + currency : getCurrencyDisplayCode(currentCurrency), }); if (data.longcode && window.innerWidth > 500) { dataManager.setPurchase({ - [`${position}Description`]: data.longcode, + [`${position}_description`]: data.longcode, }); if (description) description.setAttribute('data-balloon', data.longcode); if (longcode) CommonFunctions.elementTextContent(longcode, data.longcode); } else { dataManager.setPurchase({ - [`${position}Description`]: '', + [`${position}_description`]: '', }); if (description) description.removeAttribute('data-balloon'); @@ -271,7 +271,7 @@ const Price = (() => { const setPurchaseStatus = (enable) => { dataManager.setPurchase({ - [`${position}PurchaseDisabled`]: !enable, + [`${position}_purchase_disabled`]: !enable, }); purchase.parentNode.classList[enable ? 'remove' : 'add']('button-disabled'); }; @@ -283,7 +283,7 @@ const Price = (() => { error.show(); CommonFunctions.elementTextContent(error, details.error.message); dataManager.setPurchase({ - [`${position}Comment`]: details.error.message, + [`${position}_comment`]: details.error.message, }); } else { setData(proposal); @@ -298,15 +298,15 @@ const Price = (() => { const multiplier_value = formatMoney(Client.get('currency'), proposal.multiplier, false, 3, 2); CommonFunctions.elementInnerHtml(comment, `${localize('Payout')}: ${getLookBackFormula(type, multiplier_value)}`); dataManager.setPurchase({ - [`${position}Comment`]: `${localize('Payout')}: ${getLookBackFormula(type, multiplier_value)}`, + [`${position}_comment`]: `${localize('Payout')}: ${getLookBackFormula(type, multiplier_value)}`, }); } else { commonTrading.displayCommentPrice(comment, (currency.value || currency.getAttribute('value')), proposal.display_value, proposal.payout, position); } const old_price = purchase.getAttribute('data-display_value'); const old_payout = purchase.getAttribute('data-payout'); - if (amount) displayPriceMovement(amount, old_price, proposal.display_value,`${position}AmountClassname`); - if (payout_amount) displayPriceMovement(payout_amount, old_payout, proposal.payout,`${position}PayoutAmountClassname`); + if (amount) displayPriceMovement(amount, old_price, proposal.display_value,`${position}_amount_classname`); + if (payout_amount) displayPriceMovement(payout_amount, old_payout, proposal.payout,`${position}_payout_amount_classname`); Array.from(purchase.attributes).filter(attr => { if (!/^data/.test(attr.name) || /^data-balloon$/.test(attr.name) || @@ -366,7 +366,7 @@ const Price = (() => { commonTrading.showPriceOverlay(); let types = Contract.contractType()[Contract.form()]; if (Contract.form() === 'digits') { - switch (sessionStorage.getItem('formname')) { + switch (sessionStorage.getItem('form_name')) { case 'matchdiff': types = { DIGITMATCH: 1, @@ -391,7 +391,7 @@ const Price = (() => { } if (Contract.form() === 'lookback') { - switch (sessionStorage.getItem('formname')) { + switch (sessionStorage.getItem('form_name')) { case 'lookbackhigh': types = { LBFLOATPUT: 1, @@ -463,14 +463,14 @@ const Price = (() => { if (position_is_visible[position]) { if (position === 'middle') { dataManager.setPurchase({ - showMidPurchase: true, + show_mid_purchase: true, }); } $(container).fadeIn(0); } else { if (position === 'middle') { dataManager.setPurchase({ - showMidPurchase: false, + show_mid_purchase: false, }); } $(container).fadeOut(0); diff --git a/src/javascript/app/pages/trade/process.js b/src/javascript/app/pages/trade/process.js index ef864e83263..e2a45f2ad84 100644 --- a/src/javascript/app/pages/trade/process.js +++ b/src/javascript/app/pages/trade/process.js @@ -129,7 +129,7 @@ const Process = (() => { const init_logo = getElementById('trading_init_progress'); dataManager.setContract({ - hidePageLoader: true, + hide_page_loader: true, }); if (init_logo && init_logo.style.display !== 'none') { @@ -153,7 +153,7 @@ const Process = (() => { if (getPropertyValue(contracts, ['error', 'code']) === 'InvalidSymbol') { Price.processForgetProposals(); dataManager.setPurchase({ - showPurchaseResults: true, + show_purchase_results: true, }); getElementById('contract_confirmation_container').style.display = 'block'; getElementById('contracts_list').style.display = 'none'; @@ -173,33 +173,33 @@ const Process = (() => { Contract.setContracts(contracts); const contract_categories = Contract.contractForms(); - let formname; + let form_name; if (Defaults.get(FORM_NAME) && contract_categories && contract_categories[Defaults.get(FORM_NAME)]) { - formname = Defaults.get(FORM_NAME); + form_name = Defaults.get(FORM_NAME); } else { const tree = commonTrading.getContractCategoryTree(contract_categories); if (tree[0]) { if (typeof tree[0] === 'object') { - formname = tree[0][1][0]; + form_name = tree[0][1][0]; } else { - formname = tree[0]; + form_name = tree[0]; } } } - commonTrading.displayContractForms('contract_form_name_nav', contract_categories, formname); + commonTrading.displayContractForms('contract_form_name_nav', contract_categories, form_name); - processContractForm(formname); + processContractForm(form_name); TradingAnalysis.request(); commonTrading.hideFormOverlay(); }; - const processContractForm = (formname_to_set = getElementById('contract').value || Defaults.get(FORM_NAME)) => { - setFormName(formname_to_set); + const processContractForm = (form_name_to_set = getElementById('contract').value || Defaults.get(FORM_NAME)) => { + setFormName(form_name_to_set); - // get updated formname + // get updated form_name Contract.details(Defaults.get(FORM_NAME)); StartDates.display(); @@ -258,7 +258,7 @@ const Process = (() => { const displayPrediction = () => { const prediction_row = getElementById('prediction_row'); - if (Contract.form() === 'digits' && sessionStorage.getItem('formname') !== 'evenodd') { + if (Contract.form() === 'digits' && sessionStorage.getItem('form_name') !== 'evenodd') { prediction_row.show(); const prediction = getElementById('prediction'); if (Defaults.get(PREDICTION)) { @@ -275,7 +275,7 @@ const Process = (() => { const displaySelectedTick = () => { const selected_tick_row = getElementById('selected_tick_row'); const highlowticks_expiry_row = getElementById('highlowticks_expiry_row'); - if (sessionStorage.getItem('formname') === 'highlowticks') { + if (sessionStorage.getItem('form_name') === 'highlowticks') { selected_tick_row.show(); highlowticks_expiry_row.show(); const selected_tick = getElementById('selected_tick'); @@ -295,11 +295,11 @@ const Process = (() => { contracts.find(contract => contract.contract_category === 'callputequal'); const displayEquals = (expiry_type = 'duration') => { - const formname = Defaults.get(FORM_NAME); + const form_name = Defaults.get(FORM_NAME); const el_equals = document.getElementById('callputequal'); const durations = getPropertyValue(Contract.durations(), [commonTrading.durationType(Defaults.get(DURATION_UNITS))]) || []; - if (/^(callputequal|risefall)$/.test(formname) && (('callputequal' in durations || expiry_type === 'endtime') && hasCallPutEqual())) { + if (/^(callputequal|risefall)$/.test(form_name) && (('callputequal' in durations || expiry_type === 'endtime') && hasCallPutEqual())) { if (+Defaults.get(IS_EQUAL)) { el_equals.checked = true; } @@ -315,16 +315,16 @@ const Process = (() => { } }; - const setFormName = (formname) => { - let formname_to_set = formname; + const setFormName = (form_name) => { + let form_name_to_set = form_name; const has_callputequal = hasCallPutEqual(); - if (formname_to_set === 'callputequal' && (!has_callputequal || !+Defaults.get(IS_EQUAL))) { - formname_to_set = 'risefall'; - } else if (formname_to_set === 'risefall' && has_callputequal && +Defaults.get(IS_EQUAL)) { - formname_to_set = 'callputequal'; + if (form_name_to_set === 'callputequal' && (!has_callputequal || !+Defaults.get(IS_EQUAL))) { + form_name_to_set = 'risefall'; + } else if (form_name_to_set === 'risefall' && has_callputequal && +Defaults.get(IS_EQUAL)) { + form_name_to_set = 'callputequal'; } - Defaults.set(FORM_NAME, formname_to_set); - getElementById('contract').setAttribute('value', formname_to_set); + Defaults.set(FORM_NAME, form_name_to_set); + getElementById('contract').setAttribute('value', form_name_to_set); }; const forgetTradingStreams = () => { diff --git a/src/javascript/app/pages/trade/purchase.js b/src/javascript/app/pages/trade/purchase.js index b5ce0910cc3..067e23e4469 100644 --- a/src/javascript/app/pages/trade/purchase.js +++ b/src/javascript/app/pages/trade/purchase.js @@ -95,18 +95,18 @@ const Purchase = (() => { dataManager.setPurchase({ error: { - showPurchaseResults: true, + show_purchase_results: true, ...error, - action : TopUpVirtualPopup.doTopUp, - title : localize('Top up Virtual Account?'), - isCustom : true, + action : TopUpVirtualPopup.doTopUp, + title : localize('Top up Virtual Account?'), + isCustom : true, }, }); } else { contracts_list.style.display = 'none'; container.style.display = 'block'; dataManager.setPurchase({ - showPurchaseResults: true, + show_purchase_results: true, }); message_container.hide(); @@ -123,9 +123,9 @@ const Purchase = (() => { dataManager.setPurchase({ error: { ...error, - signupUrl: signup_url, - title : localize('Ready to trade?'), - isCustom : true, + signup_url, + title : localize('Ready to trade?'), + isCustom: true, }, }); @@ -194,11 +194,11 @@ const Purchase = (() => { CommonFunctions.elementTextContent(reference, `${localize('Your transaction reference is')} ${receipt.transaction_id}`); dataManager.setPurchase({ - showPurchaseResults: true, - pr_heading : localize('Contract Confirmation'), - pr_description : receipt.longcode, - pr_barrier : '', - pr_reference : `${localize('Your transaction reference is')} ${receipt.transaction_id}`, + show_purchase_results: true, + pr_heading : localize('Contract Confirmation'), + pr_description : receipt.longcode, + pr_barrier : '', + pr_reference : `${localize('Your transaction reference is')} ${receipt.transaction_id}`, }); const currency = Client.get('currency'); @@ -216,16 +216,16 @@ const Purchase = (() => { CommonFunctions.elementInnerHtml(cost, `${localize('Total Cost')}

${formatMoney(currency, cost_value)}

`); dataManager.setPurchase({ - pr_tableCost : localize('Total Cost'), - pr_tableCostValue: formatMoney(currency, cost_value), + pr_table_cost : localize('Total Cost'), + pr_table_cost_value: formatMoney(currency, cost_value), }); if (isLookback(contract_type)) { CommonFunctions.elementInnerHtml(payout, `${localize('Potential Payout')}

${formula}

`); dataManager.setPurchase({ - pr_tablePayout : localize('Potential Payout'), - pr_tablePayoutValue: formula, - pr_showTableProfit : false, + pr_table_payout : localize('Potential Payout'), + pr_table_payout_value: formula, + pr_show_table_profit : false, }); profit.setVisibility(0); } else { @@ -234,11 +234,11 @@ const Purchase = (() => { CommonFunctions.elementInnerHtml(profit, `${localize('Potential Profit')}

${potential_profit_value}

`); dataManager.setPurchase({ - pr_tablePayout : localize('Potential Payout'), - pr_tablePayoutValue: formatMoney(currency, payout_value), - pr_tableProfit : localize('Potential Profit'), - pr_tableProfitValue: potential_profit_value, - pr_showTableProfit : true, + pr_table_payout : localize('Potential Payout'), + pr_table_payout_value: formatMoney(currency, payout_value), + pr_table_profit : localize('Potential Profit'), + pr_table_profit_value: potential_profit_value, + pr_show_table_profit : true, }); } @@ -264,13 +264,13 @@ const Purchase = (() => { button.setAttribute('contract_id', receipt.contract_id); button.show(); dataManager.setPurchase({ - pr_showBtn: true, + pr_show_button: true, }); $('#confirmation_message_container .open_contract_details').attr('contract_id', receipt.contract_id).setVisibility(1); } else { button.hide(); dataManager.setPurchase({ - pr_showBtn: false, + pr_show_button: false, }); $('#confirmation_message_container .open_contract_details').setVisibility(0); } diff --git a/src/javascript/app/pages/trade/purchase/contract-details.jsx b/src/javascript/app/pages/trade/purchase/contract-details.jsx index 5480ed33fbf..d258831c81e 100644 --- a/src/javascript/app/pages/trade/purchase/contract-details.jsx +++ b/src/javascript/app/pages/trade/purchase/contract-details.jsx @@ -10,24 +10,24 @@ import { localize } from '../../../../_common/localize'; import { Explanation } from '../../bottom/explanation'; import { TimeTooltipWrapper, triggerClick } from '../../../common/helpers'; -const resetPopupData = (isAuditReset = false) => { +const resetPopupData = (is_audit_reset = false) => { const audit_reset_object = { - cd_showAudit: false, - auditDataEnd: [], - cd_infoMsg : null, - cd_sellMsg : null, + cd_show_audit : false, + audit_data_end: [], + cd_info_msg : null, + cd_sell_msg : null, }; const contract_reset_object = { ...audit_reset_object, - showContractDetailsPopup: false, - cd_showSell : false, - cd_contractEnded : false, - cd_showAuditBtn : false, + show_contract_details_popup: false, + cd_show_sell : false, + cd_contract_ended : false, + cd_show_audit_buton : false, }; dataManager.setPurchase({ - ...(isAuditReset ? { ...audit_reset_object } : contract_reset_object), + ...(is_audit_reset ? { ...audit_reset_object } : contract_reset_object), }); }; @@ -35,15 +35,15 @@ const AuditSection = ({ data }) => { const audit_data = { start: { title : localize('Contract starts'), - content: data?.auditDataStart, + content: data?.audit_data_start, }, end: { title : localize('Contract ends'), - content: data?.auditDataEnd, + content: data?.audit_data_end, }, details: { title : localize('Contract details'), - content: data?.auditDataDetails, + content: data?.audit_data_details, }, }; @@ -164,7 +164,7 @@ const DetailsSection = ({ data }) => ( {data?.cd_description}
-
+
@@ -174,7 +174,7 @@ const DetailsSection = ({ data }) => ( ); const Contents = ({ data }) => { - if (data?.cd_showAudit) { + if (data?.cd_show_audit) { return ( ); @@ -186,7 +186,7 @@ const Contents = ({ data }) => { }; const ContractDetails = () => { - const hasPurchaseChange = usePurchaseChange(); + const has_purchase_change = usePurchaseChange(); const [data, setData] = useState({}); useEffect(() => { @@ -201,16 +201,16 @@ const ContractDetails = () => { return () => { window.removeEventListener('keydown', handleKeyDown); }; - }, [hasPurchaseChange]); + }, [has_purchase_change]); useEffect(() => { - const newData = dataManager.getAllPurchases(); + const new_data = dataManager.getAllPurchases(); - setData((oldData) => ({ - ...oldData, - ...newData, + setData((old_data) => ({ + ...old_data, + ...new_data, })); - }, [hasPurchaseChange]); + }, [has_purchase_change]); return ( diff --git a/src/javascript/app/pages/trade/purchase/contract-table.jsx b/src/javascript/app/pages/trade/purchase/contract-table.jsx index 60dd68a2472..f8f6872843e 100644 --- a/src/javascript/app/pages/trade/purchase/contract-table.jsx +++ b/src/javascript/app/pages/trade/purchase/contract-table.jsx @@ -17,7 +17,7 @@ const ContractTable = ({ data }) => ( {localize('Contract type')}
- {data?.cd_contractType} + {data?.cd_contract_type}
@@ -26,39 +26,39 @@ const ContractTable = ({ data }) => (
{data?.cd_transaction_ids && - Object.keys(data?.cd_transaction_ids).map((tik) => { - const transactionName = - tik === 'buy' ? localize('Buy') : localize('Sell'); + Object.keys(data?.cd_transaction_ids).map((transaction_key) => { + const transaction_name = + transaction_key === 'buy' ? localize('Buy') : localize('Sell'); return ( - - {data?.cd_transaction_ids[tik]} ({transactionName}) + + {data?.cd_transaction_ids[transaction_key]} ({transaction_name}) ); })}
- {data?.cd_purchaseTime && ( + {data?.cd_purchase_time && (
{localize('Purchase time')}
{TimeTooltipWrapper( - {data.cd_purchaseTime}, - data.cd_purchaseTime + {data.cd_purchase_time}, + data.cd_purchase_time )}
)} - {data?.cd_startTime && !data?.soldBeforeStart && ( + {data?.cd_start_time && !data?.sold_before_start && (
{localize('Start time')}
{TimeTooltipWrapper( - {data.cd_startTime}, - data.cd_startTime + {data.cd_start_time}, + data.cd_start_time )}
@@ -68,52 +68,52 @@ const ContractTable = ({ data }) => ( {localize('Remaining time')}
- {data?.cd_remainingTime} + {data?.cd_remaining_time}
- {data?.cd_showEntrySpot && ( + {data?.cd_show_entry_spot && (
{localize('Entry spot')}
- {data?.cd_entrySpot} + {data?.cd_entry_spot}
)} {data?.cd_barrier && (
- {data?.cd_barrierLabel} + {data?.cd_barrier_label}
{data?.cd_barrier}
)} - {data?.cd_showBarrierLow && ( + {data?.cd_show_barrier_low && (
{localize('Low barrier')}
- {data?.cd_barrierLow} + {data?.cd_barrier_low}
)} - {data?.cd_showBarrierReset && ( + {data?.cd_show_barrier_reset && (
{localize('Reset barrier')}
- {data?.cd_barrierReset} + {data?.cd_barrier_reset}
)}
- {data?.cd_payoutLabel} + {data?.cd_payout_label}
{parseData(data.cd_payout)} @@ -129,13 +129,13 @@ const ContractTable = ({ data }) => (
- {data?.cd_currentLabel} + {data?.cd_current_label}
{data?.cd_showCurrentSpot && (
- {data?.cd_spotLabel} + {data?.cd_spot_label}
{data?.cd_currentSpot} @@ -144,50 +144,50 @@ const ContractTable = ({ data }) => ( )}
- {data?.cd_endLabel || data?.cd_spotTimeLabel} + {data?.cd_end_label || data?.cd_spot_time_label}
{TimeTooltipWrapper( - {data?.cd_endDate || data?.cd_currentDate}, - data?.cd_endDate || data?.cd_currentDate + {data?.cd_end_date || data?.cd_currentDate}, + data?.cd_end_date || data?.cd_currentDate )}
- {!data?.cd_contractEnded && ( + {!data?.cd_contract_ended && (
{localize('Current time')}
{TimeTooltipWrapper( - {data?.cd_currentTime}, - data?.cd_currentTime + {data?.cd_current_time}, + data?.cd_current_time )}
)}
- {data?.cd_indicativeLabel} + {data?.cd_indicative_label}
- {parseData(data.cd_indicativePrice)} + {parseData(data.cd_indicative_price)}
- {data?.cd_profitLossLabel} + {data?.cd_profit_loss_label}
- - {parseData(data.cd_profitLoss)} + + {parseData(data.cd_profit_loss)}
- {data?.cd_contractEnded ? ( + {data?.cd_contract_ended ? ( <> - {(data?.cd_showAuditBtn && !data?.cd_showAudit) && ( + {(data?.cd_show_audit_buton && !data?.cd_show_audit) && (
)} - {data?.cd_sellMsg && ( + {data?.cd_sell_msg && (
)} ) : ( - data?.cd_infoMsg && ( + data?.cd_info_msg && (
) )} - {data?.cd_showSell && ( + {data?.cd_show_sell && (
@@ -134,60 +136,48 @@ const Purchase = () => {
) : ( <> -
-
-
-
- {data?.topDisplayText} -
-
-
-
- {localize('Stake')}: - {data?.topAmount} {displayCurrency(data?.topAmount)} -
-
- {localize('Payout')}: - {data?.topPayoutAmount} {displayCurrency(data?.topPayoutAmount)} -
-
-
- {ButtonTooltipWrapper(
-
-
-
- {parseData(data.topComment)} -
-
-
-
-
-
- {data?.bottomDisplayText} -
-
-
-
- {localize('Stake')}: - {data?.bottomAmount} {displayCurrency(data?.bottomAmount)} + {purchase_positions.map(position => { + const contract_type = data?.[`${position}_contract_type`]; + const display_text = data?.[`${position}_display_text`]; + const amount = data?.[`${position}_amount`]; + const amount_classname = data?.[`${position}_amount_classname`]; + const payout_amount_classname = data?.[`${position}_payout_amount_classname`]; + const payout_amount = data?.[`${position}_payout_amount`]; + const purchase_disabled = data?.[`${position}_purchase_disabled`]; + const description = data?.[`${position}_description`]; + const comment = data?.[`${position}_comment`]; + + return ( + +
+
+
+
+ {display_text} +
+
+
+
+ {localize('Stake')}: + {amount} {displayCurrency(amount)} +
+
+ {localize('Payout')}: + {payout_amount} {displayCurrency(payout_amount)} +
+
+
+ {ButtonTooltipWrapper(
+
-
- {localize('Payout')}: - {data?.bottomPayoutAmount} {displayCurrency(data?.bottomPayoutAmount)} +
+ {parseData(comment)}
-
- {ButtonTooltipWrapper(
-
-
- -
- {parseData(data.bottomComment)} -
- -
+ + ); + })} )}
@@ -221,7 +211,7 @@ const Purchase = () => { variant='primary' size='lg' label={localize('Open a free account')} - onClick={() => window.location.href = data?.error.signupUrl} + onClick={() => window.location.href = data?.error.signup_url} /> {localize('Already have an account?')}
- {data?.pr_tablePayoutValue && ( + {data?.pr_table_payout_value && (
- {data?.pr_tablePayout} - {parseData(data.pr_tablePayoutValue)} + {data?.pr_table_payout} + {parseData(data.pr_table_payout_value)}
)} - { data?.pr_tableCostValue && ( + { data?.pr_table_cost_value && (
- {data?.pr_tableCost} - {parseData(data.pr_tableCostValue)} + {data?.pr_table_cost} + {parseData(data.pr_table_cost_value)}
)} - { data?.pr_tableProfitValue && data?.pr_showTableProfit && ( + { data?.pr_table_profit_value && data?.pr_show_table_profit && (
- {data?.pr_tableProfit} - {parseData(data.pr_tableProfitValue)} + {data?.pr_table_profit} + {parseData(data.pr_table_profit_value)}
)}
{data?.pr_barrier && {parseData(data.pr_barrier)}} {data?.pr_reference && {parseData(data.pr_reference)}} - {data?.pr_showBtn &&
{data?.pr_balance} - {parseData(data.pr_balanceValue)} + {parseData(data.pr_balance_value)}
); diff --git a/src/javascript/app/pages/trade/update_values.js b/src/javascript/app/pages/trade/update_values.js index b9f8a168920..c6a3ebf4838 100644 --- a/src/javascript/app/pages/trade/update_values.js +++ b/src/javascript/app/pages/trade/update_values.js @@ -14,24 +14,24 @@ const updatePurchaseStatus = (final_price, pnl, profit, localized_contract_statu $cost.html($('
', { text: localize('Final price') }).append($('

', { html: formatMoney(currency, final_price) }))); dataManager.setPurchase({ pr_heading : localized_contract_status, - pr_tablePayout : localize('Buy price') , - pr_tablePayoutValue: formatMoney(currency, Math.abs(pnl)), - pr_tableCost : localize('Final price'), - pr_tableCostValue : formatMoney(currency, final_price), + pr_table_payout : localize('Buy price') , + pr_table_payout_value: formatMoney(currency, Math.abs(pnl)), + pr_table_cost : localize('Final price'), + pr_table_cost_value : formatMoney(currency, final_price), }); if (!final_price) { $profit.html($('

', { text: localize('Loss') }).append($('

', { html: formatMoney(currency, pnl) }))); dataManager.setPurchase({ - pr_tableProfit : localize('Loss'), - pr_tableProfitValue: formatMoney(currency, pnl), + pr_table_profit : localize('Loss'), + pr_table_profit_value: formatMoney(currency, pnl), }); } else { $profit.html($('

', { text: localize('Profit') }).append($('

', { html: formatMoney(currency, profit) }))); updateContractBalance(Client.get('balance')); dataManager.setPurchase({ - pr_tableProfit : localize('Profit'), - pr_tableProfitValue: formatMoney(currency, profit), + pr_table_profit : localize('Profit'), + pr_table_profit_value: formatMoney(currency, profit), }); } @@ -41,7 +41,7 @@ const updateContractBalance = (balance) => { $('#contract_purchase_balance').html(localize('Account balance:')).append($('

', { html: formatMoney(Client.get('currency'), balance) })); dataManager.setPurchase({ pr_balance : localize('Account balance:'), - pr_balanceValue: formatMoney(Client.get('currency'), balance), + pr_balance_value: formatMoney(Client.get('currency'), balance), }); }; diff --git a/src/javascript/app/pages/user/view_popup/view_popup.js b/src/javascript/app/pages/user/view_popup/view_popup.js index 330281843b0..a7ed2702b3f 100644 --- a/src/javascript/app/pages/user/view_popup/view_popup.js +++ b/src/javascript/app/pages/user/view_popup/view_popup.js @@ -64,8 +64,8 @@ const ViewPopup = (() => { getContract(); dataManager.setPurchase({ - showContractDetailsPopup: true, - cd_description : null, + show_contract_details_popup: true, + cd_description : null, }); }; @@ -161,7 +161,7 @@ const ViewPopup = (() => { ViewPopupUI.repositionConfirmation(); dataManager.setPurchase({ - cd_contractType : ContractTypeDisplay()[contract.contract_type], + cd_contract_type : ContractTypeDisplay()[contract.contract_type], cd_purchasePrice: formatMoney(contract.currency, contract.buy_price), cd_multiplier : formatMoney(contract.currency, multiplier, false, 3, 2), cd_payout : Lookback.isLookback(contract.contract_type) ? @@ -181,15 +181,15 @@ const ViewPopup = (() => { $('#trade_details_start_date').parent().setVisibility(0); containerSetText('trade_details_purchase_time', epochToDateTime(contract.purchase_time), '', true); dataManager.setPurchase({ - cd_purchaseTime: epochToDateTime(contract.purchase_time), - soldBeforeStart: true, + cd_purchase_time: epochToDateTime(contract.purchase_time), + sold_before_start: true, }); } else { $('#trade_details_purchase_time').parent().setVisibility(0); containerSetText('trade_details_start_date', epochToDateTime(contract.date_start), '', true); dataManager.setPurchase({ - cd_startTime : epochToDateTime(contract.date_start), - soldBeforeStart: false, + cd_start_time : epochToDateTime(contract.date_start), + sold_before_start: false, }); } @@ -202,7 +202,7 @@ const ViewPopup = (() => { containerSetText('trade_details_barrier_low', is_sold_before_start ? '-' : addComma(contract.low_barrier), '', true); dataManager.setPurchase({ cd_barrier : is_sold_before_start ? '-' : addComma(contract.high_barrier), - cd_barrierLow: is_sold_before_start ? '-' : addComma(contract.low_barrier), + cd_barrier_low: is_sold_before_start ? '-' : addComma(contract.low_barrier), }); } else if (contract.barrier) { const formatted_barrier = addComma(contract.barrier); @@ -237,7 +237,7 @@ const ViewPopup = (() => { dataManager.setPurchase({ cd_barrier : is_sold_before_start ? '-' : contract.entry_spot_display_value, - cd_barrierReset: contract.entry_tick_time && is_sold_before_start ? '-' : (barrier_prefix + formatted_barrier), + cd_barrier_reset: contract.entry_tick_time && is_sold_before_start ? '-' : (barrier_prefix + formatted_barrier), }); } } @@ -283,15 +283,15 @@ const ViewPopup = (() => { containerSetText('trade_details_indicative_price', indicative_price ? formatMoney(contract.currency, indicative_price) : '-'); dataManager.setPurchase({ - cd_transaction_ids: contract.transaction_ids, - cd_indicativePrice: indicative_price ? formatMoney(contract.currency, indicative_price) : '-', + cd_transaction_ids : contract.transaction_ids, + cd_indicative_price: indicative_price ? formatMoney(contract.currency, indicative_price) : '-', }); if (is_ended && !contract.sell_price) { containerSetText('trade_details_profit_loss', localize('Waiting for contract settlement.'), { class: 'pending' }); dataManager.setPurchase({ - cd_profitLoss : localize('Waiting for contract settlement.'), - cd_profitLossClass: 'pending', + cd_profit_loss : localize('Waiting for contract settlement.'), + cd_profit_loss_class: 'pending', }); } else if (contract.sell_price || contract.bid_price) { containerSetText('trade_details_profit_loss', @@ -299,14 +299,14 @@ const ViewPopup = (() => { { class: (contract.profit >= 0 ? 'profit' : 'loss') } ); dataManager.setPurchase({ - cd_profitLoss : `${formatMoney(contract.currency, contract.profit)}(${(contract.profit_percentage > 0 ? '+' : '')}${addComma(contract.profit_percentage, 2)}%)`, - cd_profitLossClass: (contract.profit >= 0 ? 'profit' : 'loss'), + cd_profit_loss : `${formatMoney(contract.currency, contract.profit)}(${(contract.profit_percentage > 0 ? '+' : '')}${addComma(contract.profit_percentage, 2)}%)`, + cd_profit_loss_class: (contract.profit >= 0 ? 'profit' : 'loss'), }); } else { containerSetText('trade_details_profit_loss', '-', { class: 'loss' }); dataManager.setPurchase({ - cd_profitLoss : '-', - cd_profitLossClass: 'loss', + cd_profit_loss : '-', + cd_profit_loss_class: 'loss', }); } @@ -330,20 +330,20 @@ const ViewPopup = (() => { containerSetText('trade_details_entry_spot > span', '-'); containerSetText('trade_details_message', localize('Contract has not started yet')); dataManager.setPurchase({ - cd_entrySpot: '-', - cd_infoMsg : localize('Contract has not started yet'), + cd_entry_spot: '-', + cd_info_msg : localize('Contract has not started yet'), }); } else { if (contract.entry_spot > 0) { // only show entry spot if available and contract was not sold before start time containerSetText('trade_details_entry_spot > span', is_sold_before_start ? '-' : contract.entry_spot_display_value); dataManager.setPurchase({ - cd_entrySpot: is_sold_before_start ? '-' : contract.entry_spot_display_value, + cd_entry_spot: is_sold_before_start ? '-' : contract.entry_spot_display_value, }); } containerSetText('trade_details_message', contract.validation_error && !is_unsupported_contract ? contract.validation_error : ' '); dataManager.setPurchase({ - cd_infoMsg: contract.validation_error && !is_unsupported_contract ? contract.validation_error : null, + cd_info_msg: contract.validation_error && !is_unsupported_contract ? contract.validation_error : null, }); if (is_unsupported_contract) { const redirect = ``; @@ -404,7 +404,7 @@ const ViewPopup = (() => { Clock.setExternalTimer(); // stop timer dataManager.setPurchase({ - cd_remainingTime: '-', + cd_remaining_time: '-', }); } else { $container.find('#notice_ongoing').setVisibility(1); @@ -427,7 +427,7 @@ const ViewPopup = (() => { const now = Math.max(Math.floor((window.time || 0) / 1000), contract.current_spot_time || 0); containerSetText('trade_details_live_date', epochToDateTime(now)); dataManager.setPurchase({ - cd_currentTime: epochToDateTime(now), + cd_current_time: epochToDateTime(now), }); Clock.showLocalTimeOnHover('#trade_details_live_date'); @@ -436,7 +436,7 @@ const ViewPopup = (() => { if (!is_started || contract.status !== 'open' || remained < 0) { containerSetText('trade_details_live_remaining', '-'); dataManager.setPurchase({ - cd_remainingTime: '-', + cd_remaining_time: '-', }); } else { let days = 0; @@ -449,8 +449,8 @@ const ViewPopup = (() => { (days > 0 ? `${days} ${days > 1 ? localize('days') : localize('day')}, ` : '') + moment((remained) * 1000).utc().format('HH:mm:ss')); dataManager.setPurchase({ - cd_remainingTime: (days > 0 ? `${days} ${days > 1 ? localize('days') : localize('day')}, ` : '') + moment((remained) * 1000).utc().format('HH:mm:ss'), - cd_contractEnded: false, + cd_remaining_time: (days > 0 ? `${days} ${days > 1 ? localize('days') : localize('day')}, ` : '') + moment((remained) * 1000).utc().format('HH:mm:ss'), + cd_contract_ended: false, }); } }; @@ -466,33 +466,33 @@ const ViewPopup = (() => { containerSetText('trade_details_profit_loss_label', localize('Profit/loss')); dataManager.setPurchase({ - cd_currentLabel : localize('Contract result'), - cd_indicativeLabel: localize('Payout'), - cd_profitLossLabel: localize('Profit/loss'), - cd_contractEnded : true, + cd_current_label : localize('Contract result'), + cd_indicative_label : localize('Payout'), + cd_profit_loss_label: localize('Profit/loss'), + cd_contract_ended : true, }); if (contract.status === 'sold') { containerSetText('trade_details_end_label', localize('Exit time')); containerSetText('trade_details_end_date', epochToDateTime(contract.sell_time), '', true); dataManager.setPurchase({ - cd_endLabel: localize('Exit time'), - cd_endDate : epochToDateTime(contract.sell_time), + cd_end_label: localize('Exit time'), + cd_end_date : epochToDateTime(contract.sell_time), }); } if (Lookback.isLookback(contract.contract_type)) { containerSetText('trade_details_spot_label', localize('Close')); containerSetText('trade_details_spottime_label', localize('Close time')); dataManager.setPurchase({ - cd_spotLabel : localize('Close'), - cd_spotTimeLabel: localize('Close time'), + cd_spot_label : localize('Close'), + cd_spot_time_label: localize('Close time'), }); } else { containerSetText('trade_details_spot_label', localize('Exit spot')); containerSetText('trade_details_spottime_label', localize('Exit spot time')); dataManager.setPurchase({ - cd_spotLabel : localize('Exit spot'), - cd_spotTimeLabel: localize('Exit spot time'), + cd_spot_label : localize('Exit spot'), + cd_spot_time_label: localize('Exit spot time'), }); } @@ -540,12 +540,12 @@ const ViewPopup = (() => { if (show) { setAuditVisibility(1); dataManager.setPurchase({ - cd_showAudit: true, + cd_show_audit: true, }); } else { setAuditButtonsVisibility(1); dataManager.setPurchase({ - cd_showAudit: false, + cd_show_audit: false, }); } return; @@ -724,7 +724,7 @@ const ViewPopup = (() => { createAuditHeader(contract_starts.table); appendAuditLink('trade_details_entry_spot'); dataManager.setPurchase({ - cd_showAuditBtn: true, + cd_show_audit_buton: true, }); } else { contract_starts.div.remove(); @@ -737,7 +737,7 @@ const ViewPopup = (() => { createAuditHeader(contract_ends.table); appendAuditLink('trade_details_current_spot'); dataManager.setPurchase({ - cd_showAuditBtn: true, + cd_show_audit_buton: true, }); } else { contract_ends.div.remove(); @@ -756,7 +756,7 @@ const ViewPopup = (() => { appendAuditLink('trade_details_entry_spot'); appendAuditLink('trade_details_current_spot'); dataManager.setPurchase({ - cd_showAuditBtn: true, + cd_show_audit_buton: true, }); } else { contract_details.div.remove(); @@ -838,20 +838,20 @@ const ViewPopup = (() => { // Pass all contract details to new quill contract detail popup // cd_ prefix is Contract Details dataManager.setPurchase({ - cd_description : longcode, - cd_showEntrySpot : should_show_entry_spot, - cd_showBarrier : should_show_barrier, - cd_showBarrierReset: Reset.isReset(contract.contract_type), - cd_showBarrierLow : contract.barrier_count > 1 , - cd_barrierLabel : barrier_text, - cd_spotLabel : localize('Spot'), - cd_lowBarrierText : low_barrier_text, - cd_payoutLabel : Callputspread.isCallputspread(contract.contract_type) ? localize('Maximum payout') : localize('Potential payout'), - cd_chartId : (contract.tick_count ? id_tick_chart : 'analysis_live_chart'), - cd_currentLabel : localize('Current'), - cd_spotTimeLabel : localize('Spot time'), - cd_indicativeLabel : localize('Indicative'), - cd_profitLossLabel : localize('Potential profit/loss'), + cd_description : longcode, + cd_show_entry_spot : should_show_entry_spot, + cd_show_barrier : should_show_barrier, + cd_show_barrier_reset: Reset.isReset(contract.contract_type), + cd_show_barrier_low : contract.barrier_count > 1 , + cd_barrier_label : barrier_text, + cd_spot_label : localize('Spot'), + cd_low_barrier_text : low_barrier_text, + cd_payout_label : Callputspread.isCallputspread(contract.contract_type) ? localize('Maximum payout') : localize('Potential payout'), + cd_chart_id : (contract.tick_count ? id_tick_chart : 'analysis_live_chart'), + cd_current_label : localize('Current'), + cd_spot_time_label : localize('Spot time'), + cd_indicative_label : localize('Indicative'), + cd_profit_loss_label : localize('Potential profit/loss'), }); return $(`#${wrapper_id}`); @@ -885,7 +885,7 @@ const ViewPopup = (() => { } } else if ($loading) { dataManager.setContract({ - hidePageLoader: true, + hide_page_loader: true, }); if ($loading.length) { @@ -921,7 +921,7 @@ const ViewPopup = (() => { const is_started = !contract.is_forward_starting || contract.current_spot_time > contract.date_start; const $sell_wrapper = $container.find('#contract_sell_wrapper'); dataManager.setPurchase({ - cd_showSell: true, + cd_show_sell: true, }); if (is_exist) { @@ -929,7 +929,7 @@ const ViewPopup = (() => { addSellNote($sell_wrapper); $sell_wrapper.find(`#${sell_button_id}`).text(localize('Sell at market')); dataManager.setPurchase({ - cd_sellLabel: localize('Sell at market'), + cd_sell_label: localize('Sell at market'), }); } return; @@ -943,7 +943,7 @@ const ViewPopup = (() => { } dataManager.setPurchase({ - cd_sellLabel: is_started ? localize('Sell at market') : localize('Sell'), + cd_sell_label: is_started ? localize('Sell at market') : localize('Sell'), }); $container.find(`#${sell_button_id}`).unbind('click').click((e) => { @@ -958,7 +958,7 @@ const ViewPopup = (() => { }); } else { dataManager.setPurchase({ - cd_showSell: false, + cd_show_sell: false, }); if (!is_exist) return; @@ -974,8 +974,8 @@ const ViewPopup = (() => { .append($('', { text: localize('Contract will be sold at the prevailing market price when the request is received by our servers. This price may differ from the indicated price.') }))); dataManager.setPurchase({ - cd_sellInfo: `${localize('Note')}: ${localize('Contract will be sold at the prevailing market price when the request is received by our servers. This price may differ from the indicated price.')}`, - cd_showSell: true, + cd_sellInfo : `${localize('Note')}: ${localize('Contract will be sold at the prevailing market price when the request is received by our servers. This price may differ from the indicated price.')}`, + cd_show_sell: true, }); }; @@ -1001,7 +1001,7 @@ const ViewPopup = (() => { } else { $container.find('#errMsg').text(response.error.message).setVisibility(1); dataManager.setPurchase({ - cd_errorMsg: response.error.message, + cd_error_msg: response.error.message, }); } sellSetVisibility(true); @@ -1018,7 +1018,7 @@ const ViewPopup = (() => {
${localize('Your transaction reference number is [_1]', response.sell.transaction_id)}`); dataManager.setPurchase({ - cd_sellMsg: `${localize('You have sold this contract at [_1] [_2]', [formatted_sell_price, getCurrencyDisplayCode(contract.currency)])} + cd_sell_msg: `${localize('You have sold this contract at [_1] [_2]', [formatted_sell_price, getCurrencyDisplayCode(contract.currency)])}
${localize('Your transaction reference number is [_1]', response.sell.transaction_id)}`, });