Skip to content

Commit 094ff74

Browse files
authored
Merge pull request binary-com#3835 from negarn/negar/show_popup_on_trade
negar/show_popup_on_trade
2 parents 7dfc211 + b4619ac commit 094ff74

File tree

7 files changed

+43
-17
lines changed

7 files changed

+43
-17
lines changed

src/javascript/app/pages/trade/event.js

Lines changed: 11 additions & 1 deletion
Original file line numberDiff line numberDiff line change
@@ -11,6 +11,7 @@ const Price = require('./price');
1111
const Process = require('./process');
1212
const Purchase = require('./purchase');
1313
const Tick = require('./tick');
14+
const ViewPopup = require('../user/view_popup/view_popup');
1415
const GTM = require('../../base/gtm');
1516
const BinarySocket = require('../../base/socket');
1617
const getDecimalPlaces = require('../../common/currency').getDecimalPlaces;
@@ -321,7 +322,16 @@ const TradingEvents = (() => {
321322
if (id && ask_price) {
322323
$('.purchase_button').css('visibility', 'hidden');
323324
BinarySocket.send(params).then((response) => {
324-
Purchase.display(response);
325+
if (response.error || /digit/i.test(response.echo_req.passthrough.contract_type)) {
326+
Purchase.display(response);
327+
} else {
328+
this.setAttribute('contract_id', response.buy.contract_id);
329+
ViewPopup.init(this, () => {
330+
GetTicks.request();
331+
CommonTrading.hideOverlayContainer();
332+
Price.processPriceRequest();
333+
});
334+
}
325335
GTM.pushPurchaseData(response);
326336
});
327337
Price.incrFormId();

src/javascript/app/pages/trade/purchase.js

Lines changed: 4 additions & 3 deletions
Original file line numberDiff line numberDiff line change
@@ -35,7 +35,7 @@ const Purchase = (() => {
3535
const descr = CommonFunctions.getElementById('contract_purchase_descr');
3636
const barrier_element = CommonFunctions.getElementById('contract_purchase_barrier');
3737
const reference = CommonFunctions.getElementById('contract_purchase_reference');
38-
const chart = CommonFunctions.getElementById('tick_chart');
38+
const chart = CommonFunctions.getElementById('trade_tick_chart');
3939
const payout = CommonFunctions.getElementById('contract_purchase_payout');
4040
const cost = CommonFunctions.getElementById('contract_purchase_cost');
4141
const profit = CommonFunctions.getElementById('contract_purchase_profit');
@@ -118,10 +118,10 @@ const Purchase = (() => {
118118
CommonFunctions.elementTextContent(button, localize('View'));
119119
button.setAttribute('contract_id', receipt.contract_id);
120120
button.show();
121-
$('.open_contract_details').attr('contract_id', receipt.contract_id).setVisibility(1);
121+
$('#confirmation_message_container .open_contract_details').attr('contract_id', receipt.contract_id).setVisibility(1);
122122
} else {
123123
button.hide();
124-
$('.open_contract_details').setVisibility(0);
124+
$('#confirmation_message_container .open_contract_details').setVisibility(0);
125125
}
126126
}
127127

@@ -160,6 +160,7 @@ const Purchase = (() => {
160160
payout : receipt.payout,
161161
show_contract_result: 1,
162162
width : $('#confirmation_message').width(),
163+
id_render : 'trade_tick_chart',
163164
});
164165
TickDisplay.resetSpots();
165166
}

src/javascript/app/pages/trade/tick_trade.js

Lines changed: 8 additions & 3 deletions
Original file line numberDiff line numberDiff line change
@@ -39,6 +39,8 @@ const TickDisplay = (() => {
3939
subscribe,
4040
responseID;
4141

42+
let id_render = 'tick_chart';
43+
4244
const initialize = (data, options) => {
4345
// setting up globals
4446
number_of_ticks = parseInt(data.number_of_ticks);
@@ -50,6 +52,9 @@ const TickDisplay = (() => {
5052
abs_barrier = data.abs_barrier;
5153
display_decimals = data.display_decimals || 2;
5254
show_contract_result = data.show_contract_result;
55+
if (options.id_render) {
56+
id_render = options.id_render;
57+
}
5358

5459
if (data.show_contract_result) {
5560
contract_sentiment = data.contract_sentiment;
@@ -110,7 +115,7 @@ const TickDisplay = (() => {
110115
chart = new Highcharts.Chart({
111116
chart: {
112117
type : 'line',
113-
renderTo : 'tick_chart',
118+
renderTo : id_render,
114119
width : config.width || (config.minimize ? 394 : null),
115120
height : config.minimize ? 143 : null,
116121
backgroundColor: null,
@@ -158,7 +163,7 @@ const TickDisplay = (() => {
158163
if (!show_contract_result) {
159164
return;
160165
}
161-
const chart_container = $('#tick_chart');
166+
const chart_container = $(`#${id_render}`);
162167
if (contract_sentiment === 'up') {
163168
if (tick.quote > contract_barrier) {
164169
chart_container.css('background-color', 'rgba(46,136,54,0.198039)');
@@ -283,7 +288,7 @@ const TickDisplay = (() => {
283288
};
284289

285290
const dispatch = (data) => {
286-
const tick_chart = CommonFunctions.getElementById('tick_chart');
291+
const tick_chart = CommonFunctions.getElementById(id_render);
287292

288293
if (!CommonFunctions.isVisible(tick_chart) || !data || (!data.tick && !data.history)) {
289294
return;

src/javascript/app/pages/trade/tradepage.js

Lines changed: 2 additions & 2 deletions
Original file line numberDiff line numberDiff line change
@@ -7,7 +7,7 @@ const Defaults = require('./defaults');
77
const TradingEvents = require('./event');
88
const Price = require('./price');
99
const Process = require('./process');
10-
const ViewPopup = require('../user/view_popup/view_popup');
10+
// const ViewPopup = require('../user/view_popup/view_popup');
1111
const BinaryPjax = require('../../base/binary_pjax');
1212
const Client = require('../../base/client');
1313
const Header = require('../../base/header');
@@ -73,7 +73,7 @@ const TradePage = (() => {
7373
});
7474
TradingAnalysis.bindAnalysisTabEvent();
7575

76-
ViewPopup.viewButtonOnClick('#contract_confirmation_container');
76+
// ViewPopup.viewButtonOnClick('#contract_confirmation_container');
7777
};
7878

7979
const reload = () => {

src/javascript/app/pages/user/view_popup/view_popup.js

Lines changed: 6 additions & 2 deletions
Original file line numberDiff line numberDiff line change
@@ -30,7 +30,7 @@ const ViewPopup = (() => {
3030
const wrapper_id = 'sell_content_wrapper';
3131
const hidden_class = 'invisible';
3232

33-
const init = (button) => {
33+
const init = (button, onClose) => {
3434
btn_view = button;
3535
contract_id = $(btn_view).attr('contract_id');
3636
contract = {};
@@ -42,6 +42,10 @@ const ViewPopup = (() => {
4242
sell_text_updated = false;
4343
$container = '';
4444

45+
if (typeof onClose === 'function') {
46+
ViewPopupUI.setOnCloseFunction(onClose);
47+
}
48+
4549
if (btn_view) {
4650
ViewPopupUI.disableButton($(btn_view));
4751
ViewPopupUI.cleanup();
@@ -213,7 +217,7 @@ const ViewPopup = (() => {
213217
if (contract.entry_tick_time) {
214218
chart_started = true;
215219
}
216-
} else if (contract.tick_count && !chart_updated) {
220+
} else if (contract.tick_count && !chart_updated && contract.barrier) {
217221
TickDisplay.updateChart('', contract);
218222
chart_updated = true;
219223
}

src/javascript/app/pages/user/view_popup/view_popup.ui.js

Lines changed: 8 additions & 2 deletions
Original file line numberDiff line numberDiff line change
@@ -6,7 +6,8 @@ const ViewPopupUI = (() => {
66
let $container,
77
stream_ids,
88
chart_stream_ids,
9-
getPageTickStream;
9+
getPageTickStream,
10+
triggerOnClose;
1011

1112
const init = () => {
1213
$container = null;
@@ -44,6 +45,10 @@ const ViewPopupUI = (() => {
4445
closeContainer();
4546
init();
4647
if (typeof getPageTickStream === 'function') getPageTickStream();
48+
if (typeof triggerOnClose === 'function') {
49+
triggerOnClose();
50+
triggerOnClose = '';
51+
}
4752
$(window).off('resize', () => { repositionConfirmation(); });
4853
};
4954

@@ -174,7 +179,8 @@ const ViewPopupUI = (() => {
174179
repositionConfirmation,
175180
storeSubscriptionID,
176181

177-
setStreamFunction: (streamFnc) => { getPageTickStream = streamFnc; },
182+
setStreamFunction : (streamFnc) => { getPageTickStream = streamFnc; },
183+
setOnCloseFunction: (onCloseFnc) => { triggerOnClose = onCloseFnc; },
178184
};
179185
})();
180186

src/templates/app/trade/trading.jsx

Lines changed: 4 additions & 4 deletions
Original file line numberDiff line numberDiff line change
@@ -176,7 +176,7 @@ const Trading = () => (
176176
<span id='contract_purchase_button' className='button open_contract_details' />
177177
</div>
178178
<div id='contract_purchase_spots' />
179-
<div id='tick_chart' />
179+
<div id='trade_tick_chart' />
180180
<div id='contract_purchase_balance' />
181181
</div>
182182
<div id='confirmation_error' />
@@ -201,7 +201,7 @@ const Trading = () => (
201201
</div>
202202
</div>
203203
<div className='contract_purchase button'>
204-
<span className='purchase_button contract_description no-underline' id='purchase_button_top' data-balloon-length='xlarge' value='purchase'>{it.L('Purchase')}</span>
204+
<span className='purchase_button contract_description no-underline open_contract_details' id='purchase_button_top' data-balloon-length='xlarge' value='purchase'>{it.L('Purchase')}</span>
205205
</div>
206206
</span>
207207
</div>
@@ -225,7 +225,7 @@ const Trading = () => (
225225
</div>
226226
</div>
227227
<div className='contract_purchase button'>
228-
<span className='purchase_button contract_description no-underline' id='purchase_button_bottom' data-balloon-length='xlarge' value='purchase'>{it.L('Purchase')}</span>
228+
<span className='purchase_button contract_description no-underline open_contract_details' id='purchase_button_bottom' data-balloon-length='xlarge' value='purchase'>{it.L('Purchase')}</span>
229229
</div>
230230
</span>
231231
</div>
@@ -249,7 +249,7 @@ const Trading = () => (
249249
</div>
250250
</div>
251251
<div className='contract_purchase button'>
252-
<span className='purchase_button no-underline' id='purchase_button_middle' data-balloon-length='xlarge' value='purchase'>{it.L('Purchase')}</span>
252+
<span className='purchase_button no-underline open_contract_details' id='purchase_button_middle' data-balloon-length='xlarge' value='purchase'>{it.L('Purchase')}</span>
253253
</div>
254254
</span>
255255
</div>

0 commit comments

Comments
 (0)