Skip to content
This repository was archived by the owner on Feb 22, 2024. It is now read-only.

Commit 45ecfdd

Browse files
eastereggeasteregg
authored
Merge pull request #1 from msamprz/timepicker-bug-fixes
Timepicker rounding fix (must differ from binary-static)
2 parents e6d41dc + a663e71 commit 45ecfdd

File tree

38 files changed

+421
-363
lines changed

38 files changed

+421
-363
lines changed

‎package-lock.json

Lines changed: 3 additions & 3 deletions
Some generated files are not rendered by default. Learn more about customizing how changed files appear on GitHub.

‎package.json

Lines changed: 1 addition & 1 deletion
Original file line numberDiff line numberDiff line change
@@ -137,7 +137,7 @@
137137
"react-transition-group": "2.4.0",
138138
"scriptjs": "2.5.8",
139139
"sinon": "7.2.2",
140-
"smartcharts-beta": "0.4.22",
140+
"smartcharts-beta": "0.4.23",
141141
"tt-react-custom-scrollbars": "4.2.1-tt2",
142142
"url-polyfill": "1.0.9",
143143
"web-push-notifications": "3.2.15"

‎scripts/config/pages.js

Lines changed: 1 addition & 1 deletion
Original file line numberDiff line numberDiff line change
@@ -128,6 +128,6 @@ module.exports = [
128128
['graduates', 'landing_pages/graduate_program', null, 'Binary.com Graduate Program', 'NOT-en'],
129129
// ['hackathon', 'landing_pages/hackathon', null, 'Hackathon Competition', 'NOT-en'],
130130
['introducing-usb', 'landing_pages/usb', null, 'Introducing USB', 'NOT-en'],
131-
['binarygrid', 'landing_pages/binary_grid', null, 'Our New Mobile Trading App', 'NOT-en'],
131+
['binary-grid', 'landing_pages/binary_grid', null, 'Our New Mobile Trading App', 'NOT-en'],
132132
['landing/signup-frame', 'landing_pages/signup_frame', null, 'Sign up'],
133133
];

‎src/download/BIEL_Pillar_3_Report_20180601.pdf renamed to ‎src/download/BIEL_Pillar_3_Report_20190403.pdf

554 KB
Binary file not shown.

‎src/images/app_2/header/symbol.svg

Lines changed: 1 addition & 1 deletion
Loading

‎src/javascript/_autogenerated/it.js

Lines changed: 1 addition & 1 deletion
Some generated files are not rendered by default. Learn more about customizing how changed files appear on GitHub.

‎src/javascript/app_2/App/Components/Layout/Header/menu-links.jsx

Lines changed: 1 addition & 1 deletion
Original file line numberDiff line numberDiff line change
@@ -16,7 +16,7 @@ const MenuLinks = ({ is_logged_in, items }) => (
1616
null
1717
:
1818
<BinaryLink key={idx} to={item.link_to} className='header__menu-link' active_class='header__menu-link--active'>
19-
<span title={item.text} className='header__menu-link-text'>{item.icon}{item.text}</span>
19+
<span title={item.text} className='header__menu-link-text'>{item.icon}{item.text}{item.logo}</span>
2020
</BinaryLink>
2121
))
2222
}

‎src/javascript/app_2/App/Constants/header-links.js

Lines changed: 6 additions & 8 deletions
Original file line numberDiff line numberDiff line change
@@ -1,14 +1,12 @@
1-
import React from 'react';
2-
import { localize } from '_common/localize';
3-
import {
4-
// IconStatement,
5-
IconTrade } from 'Assets/Header/NavBar/index';
6-
import { routes } from 'Constants/index';
1+
import React from 'react';
2+
import { localize } from '_common/localize';
3+
// import { IconStatement } from 'Assets/Header/NavBar/index';
4+
import { routes } from 'Constants/index';
75

86
const header_links = [
97
{
10-
icon : <IconTrade className='header__icon' />,
11-
text : localize('Trade'),
8+
logo : <div className='header__logo'>{localize('BETA')}</div>,
9+
text : localize('BinaryNex'),
1210
link_to: routes.trade,
1311
},
1412
// {

‎src/javascript/app_2/Modules/Trading/Components/Elements/purchase-button.jsx

Lines changed: 10 additions & 5 deletions
Original file line numberDiff line numberDiff line change
@@ -12,21 +12,26 @@ const PurchaseButton = ({
1212
is_disabled,
1313
is_high_low,
1414
is_loading,
15+
should_fade,
1516
onClickPurchase,
1617
type,
1718
}) => {
1819
const getIconType = () => {
19-
if (is_loading) return '';
20+
if (!should_fade && is_loading) return '';
2021
return (is_high_low) ? `${type.toLowerCase()}_barrier` : type.toLowerCase();
2122
};
23+
2224
return (
2325
<Button
2426
is_disabled={is_contract_mode || is_disabled}
2527
id={`purchase_${type}`}
2628
className={classNames(
2729
'btn-purchase',
28-
{ 'btn-purchase--disabled': (is_contract_mode || is_disabled) && !is_loading },
29-
{ 'btn-purchase--animated': is_loading })}
30+
{
31+
'btn-purchase--disabled' : (is_contract_mode || is_disabled) && !is_loading,
32+
'btn-purchase--animated--slide': is_loading && !should_fade,
33+
'btn-purchase--animated--fade' : is_loading && should_fade,
34+
})}
3035
has_effect
3136
onClick={() => { onClickPurchase(info.id, info.stake, type); }}
3237
>
@@ -40,14 +45,14 @@ const PurchaseButton = ({
4045
</div>
4146
<div className='btn-purchase__text_wrapper'>
4247
<span className='btn-purchase__text'>
43-
{!is_loading && localize('[_1]', getContractTypeDisplay(type, is_high_low))}
48+
{(!should_fade && is_loading) ? '' : localize('[_1]', getContractTypeDisplay(type, is_high_low))}
4449
</span>
4550
</div>
4651
</div>
4752
<div className='btn-purchase__effect-detail' />
4853
<div className='btn-purchase__info btn-purchase__info--right'>
4954
<div className='btn-purchase__text_wrapper'>
50-
<span className='btn-purchase__text'>{is_loading || is_disabled ? '' : info.returns}</span>
55+
<span className='btn-purchase__text'>{!(is_loading || is_disabled) ? info.returns : ''}</span>
5156
</div>
5257
</div>
5358
</React.Fragment>

‎src/javascript/app_2/Modules/Trading/Components/Elements/purchase-fieldset.jsx

Lines changed: 7 additions & 5 deletions
Original file line numberDiff line numberDiff line change
@@ -12,15 +12,15 @@ import PurchaseButton from 'Modules/Trading/Components/Elements/purchase-button.
1212
class PurchaseFieldset extends React.PureComponent {
1313
state = {
1414
show_tooltip: false,
15+
should_fade : false,
1516
}
1617

17-
onMouseEnter = () => {
18-
this.setState({ show_tooltip: true });
18+
componentDidMount() {
19+
this.setState({ should_fade: true });
1920
}
2021

21-
onMouseLeave = () => {
22-
this.setState({ show_tooltip: false });
23-
}
22+
onMouseEnter = () => this.setState({ show_tooltip: true });
23+
onMouseLeave = () => this.setState({ show_tooltip: false });
2424

2525
render() {
2626
const {
@@ -50,6 +50,7 @@ class PurchaseFieldset extends React.PureComponent {
5050
is_high_low={is_high_low}
5151
is_loading={is_loading}
5252
onClickPurchase={onClickPurchase}
53+
should_fade={this.state.should_fade}
5354
type={type}
5455
/>
5556
);
@@ -68,6 +69,7 @@ class PurchaseFieldset extends React.PureComponent {
6869
proposal_info={info}
6970
has_increased={info.has_increased}
7071
is_loading={is_loading}
72+
should_fade={this.state.should_fade}
7173
is_visible={!is_contract_mode}
7274
/>
7375
<div

‎src/javascript/app_2/Modules/Trading/Components/Form/Purchase/contract-info.jsx

Lines changed: 55 additions & 40 deletions
Original file line numberDiff line numberDiff line change
@@ -1,56 +1,71 @@
1-
import classNames from 'classnames';
2-
import PropTypes from 'prop-types';
3-
import React from 'react';
4-
import { localize } from '_common/localize';
5-
import Money from 'App/Components/Elements/money.jsx';
6-
import Tooltip from 'App/Components/Elements/tooltip.jsx';
7-
import { IconPriceMove } from 'Assets/Trading/icon-price-move.jsx';
1+
import classNames from 'classnames';
2+
import PropTypes from 'prop-types';
3+
import React from 'react';
4+
import { getLocalizedBasis } from 'Stores/Modules/Trading/Constants/contract';
5+
import { localize } from '_common/localize';
6+
import Money from 'App/Components/Elements/money.jsx';
7+
import Tooltip from 'App/Components/Elements/tooltip.jsx';
8+
import { IconPriceMove } from 'Assets/Trading/icon-price-move.jsx';
89

910
const ContractInfo = ({
1011
basis,
1112
currency,
1213
has_increased,
1314
is_loading,
15+
should_fade,
1416
is_visible,
1517
proposal_info,
1618
}) => {
17-
const is_loaded_with_error = proposal_info.has_error || !proposal_info.id;
19+
const localized_basis = getLocalizedBasis();
20+
const stakeOrPayout = () => {
21+
switch (basis) {
22+
case 'stake':
23+
return localized_basis.payout;
24+
case 'payout':
25+
return localized_basis.stake;
26+
default:
27+
return basis;
28+
}
29+
};
1830

31+
const has_error_or_not_loaded = proposal_info.has_error || !proposal_info.id;
1932
return (
20-
<React.Fragment>
21-
{is_loading ?
22-
<div className='trade-container__loader'>
23-
<div className='trade-container__loader--loading' />
33+
<div className='trade-container__price'>
34+
<div className={classNames(
35+
'trade-container__price-info',
36+
{
37+
'trade-container__price-info--disabled': has_error_or_not_loaded,
38+
'trade-container__price-info--slide' : is_loading && !should_fade,
39+
'trade-container__price-info--fade' : is_loading && should_fade,
40+
})}
41+
>
42+
<div className='trade-container__price-info-basis'>
43+
{has_error_or_not_loaded
44+
? stakeOrPayout()
45+
: localize('[_1]', proposal_info.obj_contract_basis.text)
46+
}
2447
</div>
25-
:
26-
<div className='trade-container__price'>
27-
<div className={classNames('trade-container__price-info', { 'trade-container__price-info--disabled': is_loaded_with_error })}>
28-
<div className='trade-container__price-info-basis'>{is_loaded_with_error ? basis : localize('[_1]', proposal_info.obj_contract_basis.text)}</div>
29-
<div className='trade-container__price-info-value'>
30-
{is_loaded_with_error ?
31-
''
32-
:
33-
<Money amount={proposal_info.obj_contract_basis.value} className='trade-container__price-info-currency' currency={currency} />
34-
}
35-
</div>
36-
{is_visible &&
37-
<div className='trade-container__price-info-movement'>
38-
{!is_loaded_with_error && has_increased !== null && <IconPriceMove type={has_increased ? 'profit' : 'loss'} />}
39-
</div>
40-
}
41-
</div>
42-
<span>
43-
<Tooltip
44-
alignment='left'
45-
className={classNames('trade-container__price-tooltip', { 'trade-container__price-tooltip--disabled': is_loaded_with_error })}
46-
classNameIcon='trade-container__price-tooltip-i'
47-
icon='info'
48-
message={is_loaded_with_error ? '' : proposal_info.message}
49-
/>
50-
</span>
48+
<div className='trade-container__price-info-value'>
49+
{!has_error_or_not_loaded &&
50+
<Money amount={proposal_info.obj_contract_basis.value} className='trade-container__price-info-currency' currency={currency} />
51+
}
5152
</div>
52-
}
53-
</React.Fragment>
53+
{is_visible &&
54+
<div className='trade-container__price-info-movement'>
55+
{(!has_error_or_not_loaded && has_increased !== null) &&
56+
<IconPriceMove type={has_increased ? 'profit' : 'loss'} />
57+
}
58+
</div>
59+
}
60+
</div>
61+
<Tooltip
62+
alignment='left'
63+
className={classNames('trade-container__price-tooltip', { 'trade-container__price-tooltip--disabled': has_error_or_not_loaded })}
64+
classNameIcon='trade-container__price-tooltip-i'
65+
icon='info'
66+
message={has_error_or_not_loaded ? '' : proposal_info.message}
67+
/>
68+
</div>
5469
);
5570
};
5671
ContractInfo.propTypes = {

‎src/javascript/app_2/Modules/Trading/Containers/purchase.jsx

Lines changed: 21 additions & 17 deletions
Original file line numberDiff line numberDiff line change
@@ -21,17 +21,17 @@ const Purchase = ({
2121
trade_types,
2222
validation_errors,
2323
}) => {
24+
const is_high_low = /high_low/.test(contract_type.toLowerCase());
25+
const isLoading = info => {
26+
const has_validation_error = Object.values(validation_errors).some(e => e.length);
27+
return !has_validation_error && !info.has_error && !info.id;
28+
};
29+
2430
const components = [];
2531
Object.keys(trade_types).map((type, index) => {
26-
const info = proposal_info[type] || {};
27-
const is_disabled = !is_purchase_enabled
28-
|| !is_trade_enabled
29-
|| !info.id
30-
|| !is_client_allowed_to_visit;
31-
const is_high_low = /high_low/.test(contract_type.toLowerCase());
32-
const is_validation_error = Object.values(validation_errors).some(e => e.length);
33-
const is_loading = !is_validation_error && !info.has_error && !info.id;
34-
const is_proposal_error = info.has_error && !info.has_error_details;
32+
const info = proposal_info[type] || {};
33+
const is_disabled = !is_purchase_enabled || !is_trade_enabled || !info.id || !is_client_allowed_to_visit;
34+
const is_proposal_error = info.has_error && !info.has_error_details;
3535

3636
const purchase_fieldset = (
3737
<PurchaseFieldset
@@ -43,7 +43,7 @@ const Purchase = ({
4343
is_contract_mode={is_contract_mode}
4444
is_disabled={is_disabled}
4545
is_high_low={is_high_low}
46-
is_loading={is_loading}
46+
is_loading={isLoading(info)}
4747
// is_purchase_confirm_on={is_purchase_confirm_on}
4848
is_proposal_error={is_proposal_error}
4949
// is_purchase_locked={is_purchase_locked}
@@ -53,13 +53,17 @@ const Purchase = ({
5353
type={type}
5454
/>
5555
);
56-
const contract_type_position = getContractTypePosition(type);
57-
if (contract_type_position === 'top') {
58-
components.unshift(purchase_fieldset);
59-
} else if (contract_type_position === 'bottom') {
60-
components.push(purchase_fieldset);
61-
} else {
62-
components.push(purchase_fieldset);
56+
57+
switch (getContractTypePosition(type)) {
58+
case 'top':
59+
components.unshift(purchase_fieldset);
60+
break;
61+
case 'bottom':
62+
components.push(purchase_fieldset);
63+
break;
64+
default:
65+
components.push(purchase_fieldset);
66+
break;
6367
}
6468
});
6569

‎src/javascript/app_2/Stores/Modules/Trading/Helpers/end-time.js

Lines changed: 1 addition & 1 deletion
Original file line numberDiff line numberDiff line change
@@ -1,7 +1,7 @@
11
const getClosestTime = (
22
time,
33
interval,
4-
) => time.minute(Math.round(time.minute() / interval) * interval);
4+
) => time.minute((Math.ceil(time.minute() / interval) * interval));
55

66
export const getSelectedTime = (
77
server_time,

‎src/sass/app_2/_common/layout/header.scss

Lines changed: 14 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -41,6 +41,7 @@
4141
display: flex;
4242
justify-content: center;
4343
align-items: center;
44+
padding-right: 0.8em;
4445
}
4546
&--notify-toggle {
4647
order: 2;
@@ -128,6 +129,19 @@
128129
}
129130
}
130131
}
132+
&__logo {
133+
background-color: $COLOR_RED;
134+
border-radius: 10px;
135+
color: $COLOR_WHITE;
136+
display: inline-block;
137+
font-size: 1.4rem;
138+
font-weight: normal;
139+
height: 20px;
140+
line-height: 1.43;
141+
margin-left: 0.8rem;
142+
text-align: center;
143+
width: 50px;
144+
}
131145
&__icon {
132146
margin-right: 0.8em;
133147
}

0 commit comments

Comments
 (0)