Thanks to visit codestin.com
Credit goes to github.com

Skip to content
This repository was archived by the owner on May 20, 2025. It is now read-only.

Kevin/fix:calculator-minor-issues #1234

Merged
Merged
Show file tree
Hide file tree
Changes from all commits
Commits
File filter

Filter by extension

Filter by extension

Conversations
Failed to load comments.
Loading
Jump to
Jump to file
Failed to load files.
Loading
Diff view
Diff view
Binary file modified src/images/common/trade-tools/swap-forex-formula.png
Loading
Sorry, something went wrong. Reload?
Sorry, we cannot display this file.
Sorry, this file is invalid so it cannot be displayed.
Binary file modified src/images/common/trade-tools/swap-synthetic-formula.png
Loading
Sorry, something went wrong. Reload?
Sorry, we cannot display this file.
Sorry, this file is invalid so it cannot be displayed.
9 changes: 6 additions & 3 deletions src/pages/trader-tools/_margin-calculator.js
Original file line number Diff line number Diff line change
Expand Up @@ -88,7 +88,7 @@ const MarginCalculator = () => {
}

const toFixed = (val) => {
return parseFloat(val.toFixed(2)).toLocaleString()
return parseFloat(val.toFixed(3)).toLocaleString()
}

const resetValidation = (values) => {
Expand Down Expand Up @@ -376,10 +376,13 @@ const MarginCalculator = () => {
{localize('How margin is calculated')}
</RightContentHeader>

<StyledText>
<Localize translate_text="The margin required for a contract on DMT5 is calculated based on the formula:" />
</StyledText>
<StyledText mb="1.6rem">
<Localize
translate_text="The margin required for a contract on DMT5 is calculated based on the formula:<1></1><0> Margin = volume in lots × contract size × asset price/leverage </0>"
components={[<strong key={0} />, <br key={1} />]}
translate_text="<0> Margin = volume in lots × contract size × asset price/leverage </0>"
components={[<strong key={0} />]}
/>
</StyledText>

Expand Down
5 changes: 3 additions & 2 deletions src/pages/trader-tools/_style.js
Original file line number Diff line number Diff line change
Expand Up @@ -82,9 +82,10 @@ export const FormWrapper = styled(Flex)`
}
`
export const SwapFormWrapper = styled(FormWrapper)`
max-height: 580px;
margin-top: 40px;
height: 569px;
margin-top: 45px;
@media ${device.tabletL} {
height: unset;
margin-top: 0;
}
`
Expand Down
30 changes: 22 additions & 8 deletions src/pages/trader-tools/_swap-calculator.js
Original file line number Diff line number Diff line change
Expand Up @@ -105,7 +105,7 @@ const SwapCalculator = () => {
}

const toFixed = (val) => {
return parseFloat(val.toFixed(2)).toLocaleString()
return parseFloat(val.toFixed(3)).toLocaleString()
}

const resetValidationSynthetic = (values) => {
Expand Down Expand Up @@ -209,7 +209,15 @@ const SwapCalculator = () => {
}

const numberSubmitFormatNegative = (input) => {
return input.replace(/^(-?)0+/, '$1')
let result = input.replace(/^(-?)0+/, '$1')

if (result.charAt(0) == '-' && result.charAt(1) == '.') {
result = result.slice(0, 1) + '0' + result.slice(1)
} else if (result.charAt(0) == '.') {
result = '0' + result
}

return result
}

return (
Expand All @@ -224,7 +232,7 @@ const SwapCalculator = () => {
)}
</SectionSubtitle>

<Flex mb="8rem" p="0 1.6rem" tablet={{ mb: '32px', height: 'unset' }}>
<Flex mb="40px" p="0 1.6rem" tablet={{ mb: '32px', height: 'unset' }}>
<SwapTabSelector
active={tab === 'Synthetic'}
onClick={() => onTabClick('Synthetic')}
Expand Down Expand Up @@ -457,10 +465,13 @@ const SwapCalculator = () => {
{localize('How swap charges are calculated')}
</RightContentHeader>

<StyledText size="1.6rem">
<Localize translate_text="For synthetic indices, the swap charge is calculated on an annual basis for long and short positions using the formula:" />
</StyledText>
<StyledText size="1.6rem" mb="2rem">
<Localize
translate_text="For synthetic indices, the swap charge is calculated on an annual basis for long and short positions using the formula:<1></1><0>Swap charge = volume × contract size × asset price × (swap rate/100) /360</0>"
components={[<strong key={0} />, <br key={1} />]}
translate_text="<0>Swap charge = volume × contract size × asset price × (swap rate/100) /360</0>"
components={[<strong key={0} />]}
/>
</StyledText>

Expand Down Expand Up @@ -502,7 +513,7 @@ const SwapCalculator = () => {
</FormulaText>
</ImageWrapper>
<TextWrapper>
<StyledText size="1.6rem" mb="2rem" mt="1.6rem">
<StyledText size="1.6rem" mt="1.6rem">
<Localize
translate_text="So you will be required to pay a swap charge of <0>0.83 USD</0> to keep the position open for one night."
components={[<strong key={0} />]}
Expand Down Expand Up @@ -758,10 +769,13 @@ const SwapCalculator = () => {
{localize('How swap charges are calculated')}
</RightContentHeader>

<StyledText size="1.6rem">
<Localize translate_text="For forex and commodities, the swap charge is calculated using the formula is:" />
</StyledText>
<StyledText size="1.6rem" mb="2rem">
<Localize
translate_text="For forex and commodities, the swap charge is calculated using the formula is:<1></1><0>Swap charge = volume × contract size × point value × swap rate</0>"
components={[<strong key={0} />, <br key={1} />]}
translate_text="<0>Swap charge = volume × contract size × point value × swap rate</0>"
components={[<strong key={0} />]}
/>
</StyledText>

Expand Down
3 changes: 0 additions & 3 deletions src/pages/trader-tools/index.js
Original file line number Diff line number Diff line change
Expand Up @@ -9,7 +9,6 @@ import { localize, WithIntl } from 'components/localization'
import Layout from 'components/layout/layout'
import { getLocationHash, isBrowser, scrollTop } from 'common/utility'
import Patterns from 'images/common/trade-tools/trade-tools-bg.png'
import Signup, { Appearances } from 'components/custom/signup'

const Hero = styled(Flex)`
height: 40rem;
Expand All @@ -33,7 +32,6 @@ const Item = styled.div`

h4 {
color: var(--color-black);
opacity: ${(props) => (props.name === props.active_tab ? '1' : '0.32')};
font-weight: ${(props) => (props.name === props.active_tab ? 'bold' : 'normal')};
}
@media ${device.tabletL} {
Expand Down Expand Up @@ -103,7 +101,6 @@ const TraderTools = () => {
{active_tab === 'marginCalculator' && <MarginCalculator />}
{active_tab === 'swapCalculator' && <SwapCalculator />}
</Box>
<Signup appearance={Appearances.public} />
</Layout>
)
}
Expand Down