@pradeepjadhav/trading-reload-chart 1.0.3 → 1.0.4
This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.
- package/dist/canvas/layers/ShapesLayer/FibRetracementShape.d.ts +1 -1
- package/dist/canvas/layers/ShapesLayer/LineShape.d.ts +1 -1
- package/dist/canvas/layers/ShapesLayer/PathShape.d.ts +1 -1
- package/dist/canvas/layers/ShapesLayer/RectangleShape.d.ts +1 -1
- package/dist/canvas/layers/ShapesLayer/ShapesLayer.constants.d.ts +10 -0
- package/dist/canvas/layers/ShapesLayer/ShapesLayer.d.ts +11 -0
- package/dist/canvas/layers/ShapesLayer/ShapesLayer.types.d.ts +7 -28
- package/dist/canvas/layers/ShapesLayer/ShortLongPosition.d.ts +2 -3
- package/dist/chart/ChartController.types.d.ts +12 -0
- package/dist/trading-reload-chart.js +396 -399
- package/package.json +1 -1
|
@@ -1,5 +1,5 @@
|
|
|
1
|
-
import { forwardRef as
|
|
2
|
-
import { jsx as
|
|
1
|
+
import { forwardRef as Rt, useEffect as rt, useImperativeHandle as Dt, useRef as N } from "react";
|
|
2
|
+
import { jsx as At } from "react/jsx-runtime";
|
|
3
3
|
var h = {
|
|
4
4
|
primary: "#7959F7",
|
|
5
5
|
blue: "#2962FF",
|
|
@@ -18,61 +18,43 @@ var h = {
|
|
|
18
18
|
axisYTick: "rgba(255, 255, 255, 0.40)",
|
|
19
19
|
divider: "rgba(255,255,255,0.12)",
|
|
20
20
|
crosshairLabelBackground: "#494949"
|
|
21
|
-
},
|
|
21
|
+
}, y = {
|
|
22
22
|
...h,
|
|
23
23
|
gray: "#808080",
|
|
24
24
|
orange: "#ff9500",
|
|
25
|
-
purple: "#af52de"
|
|
26
|
-
|
|
27
|
-
handleFill: h.background
|
|
28
|
-
}, et = {
|
|
25
|
+
purple: "#af52de"
|
|
26
|
+
}, st = {
|
|
29
27
|
defaultWidthCandles: 10,
|
|
30
28
|
defaultStopLossPercent: 0.1,
|
|
31
29
|
defaultRiskRewardRatio: 1.5,
|
|
32
|
-
profitFillColor:
|
|
30
|
+
profitFillColor: y.green,
|
|
33
31
|
profitFillOpacity: 0.18,
|
|
34
|
-
lossFillColor:
|
|
32
|
+
lossFillColor: y.red,
|
|
35
33
|
lossFillOpacity: 0.18,
|
|
36
|
-
borderColor:
|
|
34
|
+
borderColor: y.gray,
|
|
37
35
|
borderOpacity: 0,
|
|
38
36
|
borderWidth: 1,
|
|
39
37
|
borderStyle: "solid",
|
|
40
|
-
midLineColor:
|
|
38
|
+
midLineColor: y.gray,
|
|
41
39
|
midLineOpacity: 0.9,
|
|
42
40
|
midLineWidth: 0.5,
|
|
43
|
-
midLineStyle: "solid"
|
|
44
|
-
|
|
45
|
-
handleBorderColor: f.handleBorder,
|
|
46
|
-
handleBorderThickness: 1.5,
|
|
47
|
-
handleRadius: 5,
|
|
48
|
-
hoverLineWidth: 2,
|
|
49
|
-
selectedLineWidth: 2
|
|
50
|
-
}, Dt = {
|
|
41
|
+
midLineStyle: "solid"
|
|
42
|
+
}, Xt = {
|
|
51
43
|
trendline: {
|
|
52
44
|
lineWidth: 1,
|
|
53
|
-
lineColor:
|
|
45
|
+
lineColor: y.blue,
|
|
54
46
|
lineOpacity: 1,
|
|
55
47
|
lineStyle: "solid",
|
|
56
|
-
fillColor:
|
|
57
|
-
fillOpacity: 0
|
|
58
|
-
handleColor: f.handleFill,
|
|
59
|
-
handleBorderColor: f.handleBorder,
|
|
60
|
-
handleRadius: 5,
|
|
61
|
-
hoverLineWidth: 1,
|
|
62
|
-
selectedLineWidth: 1.1
|
|
48
|
+
fillColor: y.blue,
|
|
49
|
+
fillOpacity: 0
|
|
63
50
|
},
|
|
64
51
|
rectangle: {
|
|
65
52
|
lineWidth: 1,
|
|
66
|
-
lineColor:
|
|
53
|
+
lineColor: y.purple,
|
|
67
54
|
lineOpacity: 0.6,
|
|
68
55
|
lineStyle: "solid",
|
|
69
|
-
fillColor:
|
|
56
|
+
fillColor: y.purple,
|
|
70
57
|
fillOpacity: 0.06,
|
|
71
|
-
handleColor: f.handleFill,
|
|
72
|
-
handleBorderColor: f.handleBorder,
|
|
73
|
-
handleRadius: 5,
|
|
74
|
-
hoverLineWidth: 1,
|
|
75
|
-
selectedLineWidth: 1.1,
|
|
76
58
|
textColor: h.white,
|
|
77
59
|
textOpacity: 1,
|
|
78
60
|
textFontFamily: "Arial",
|
|
@@ -80,23 +62,18 @@ var h = {
|
|
|
80
62
|
},
|
|
81
63
|
path: {
|
|
82
64
|
lineWidth: 1,
|
|
83
|
-
lineColor:
|
|
65
|
+
lineColor: y.yellow,
|
|
84
66
|
lineOpacity: 0.8,
|
|
85
67
|
lineStyle: "solid",
|
|
86
|
-
fillColor:
|
|
87
|
-
fillOpacity: 0
|
|
88
|
-
handleColor: f.handleFill,
|
|
89
|
-
handleBorderColor: f.handleBorder,
|
|
90
|
-
handleRadius: 5,
|
|
91
|
-
hoverLineWidth: 1,
|
|
92
|
-
selectedLineWidth: 1.1
|
|
68
|
+
fillColor: y.yellow,
|
|
69
|
+
fillOpacity: 0
|
|
93
70
|
},
|
|
94
71
|
fibRetracement: {
|
|
95
72
|
levels: [
|
|
96
73
|
{
|
|
97
74
|
level: 1,
|
|
98
75
|
label: "1",
|
|
99
|
-
color:
|
|
76
|
+
color: y.gray,
|
|
100
77
|
opacity: 0.5,
|
|
101
78
|
lineWidth: 1,
|
|
102
79
|
lineStyle: "dashed"
|
|
@@ -104,7 +81,7 @@ var h = {
|
|
|
104
81
|
{
|
|
105
82
|
level: 0.72,
|
|
106
83
|
label: "0.720",
|
|
107
|
-
color:
|
|
84
|
+
color: y.red,
|
|
108
85
|
opacity: 0.5,
|
|
109
86
|
lineWidth: 1,
|
|
110
87
|
lineStyle: "dashed"
|
|
@@ -112,7 +89,7 @@ var h = {
|
|
|
112
89
|
{
|
|
113
90
|
level: 0.618,
|
|
114
91
|
label: "0.618",
|
|
115
|
-
color:
|
|
92
|
+
color: y.orange,
|
|
116
93
|
opacity: 0.5,
|
|
117
94
|
lineWidth: 1,
|
|
118
95
|
lineStyle: "dashed"
|
|
@@ -120,7 +97,7 @@ var h = {
|
|
|
120
97
|
{
|
|
121
98
|
level: 0.5,
|
|
122
99
|
label: "0.5",
|
|
123
|
-
color:
|
|
100
|
+
color: y.purple,
|
|
124
101
|
opacity: 0.5,
|
|
125
102
|
lineWidth: 1,
|
|
126
103
|
lineStyle: "dashed"
|
|
@@ -128,22 +105,17 @@ var h = {
|
|
|
128
105
|
{
|
|
129
106
|
level: 0,
|
|
130
107
|
label: "0",
|
|
131
|
-
color:
|
|
108
|
+
color: y.gray,
|
|
132
109
|
opacity: 0.5,
|
|
133
110
|
lineWidth: 1,
|
|
134
111
|
lineStyle: "dashed"
|
|
135
112
|
}
|
|
136
113
|
],
|
|
137
|
-
fillColor:
|
|
138
|
-
fillOpacity: 0
|
|
139
|
-
handleColor: f.handleFill,
|
|
140
|
-
handleBorderColor: f.handleBorder,
|
|
141
|
-
handleRadius: 5,
|
|
142
|
-
hoverLineWidth: 1,
|
|
143
|
-
selectedLineWidth: 1
|
|
114
|
+
fillColor: y.gray,
|
|
115
|
+
fillOpacity: 0
|
|
144
116
|
},
|
|
145
|
-
longPosition: { ...
|
|
146
|
-
shortPosition: { ...
|
|
117
|
+
longPosition: { ...st },
|
|
118
|
+
shortPosition: { ...st },
|
|
147
119
|
previousDayHighLow: {
|
|
148
120
|
line: {
|
|
149
121
|
color: h.red,
|
|
@@ -157,12 +129,12 @@ var h = {
|
|
|
157
129
|
paddingX: 6
|
|
158
130
|
}
|
|
159
131
|
}
|
|
160
|
-
},
|
|
132
|
+
}, X = { default: "12px Arial" }, nt = {
|
|
161
133
|
width: 1,
|
|
162
134
|
opacity: 0.9,
|
|
163
135
|
style: "dashed",
|
|
164
136
|
dash: [4, 4]
|
|
165
|
-
},
|
|
137
|
+
}, _ = {
|
|
166
138
|
width: 1,
|
|
167
139
|
opacity: 0.9,
|
|
168
140
|
style: "dotted",
|
|
@@ -187,7 +159,7 @@ var h = {
|
|
|
187
159
|
showVolumeSection: !0,
|
|
188
160
|
showPnlSection: !0,
|
|
189
161
|
showCloseSection: !0
|
|
190
|
-
},
|
|
162
|
+
}, ot = {
|
|
191
163
|
width: 32,
|
|
192
164
|
height: 22,
|
|
193
165
|
gapFromStartPriceHandle: 6,
|
|
@@ -200,8 +172,8 @@ var h = {
|
|
|
200
172
|
backgroundOpacity: 0.1,
|
|
201
173
|
textColor: h.white,
|
|
202
174
|
textOpacity: 0.6,
|
|
203
|
-
font:
|
|
204
|
-
},
|
|
175
|
+
font: X.default
|
|
176
|
+
}, at = {
|
|
205
177
|
height: 22,
|
|
206
178
|
widthPNL: 80,
|
|
207
179
|
position: {
|
|
@@ -216,7 +188,7 @@ var h = {
|
|
|
216
188
|
paddingX: 10,
|
|
217
189
|
textColor: h.white,
|
|
218
190
|
textOpacity: 0.85,
|
|
219
|
-
font:
|
|
191
|
+
font: X.default
|
|
220
192
|
}, c = {
|
|
221
193
|
zoom: {
|
|
222
194
|
x: {
|
|
@@ -275,7 +247,7 @@ var h = {
|
|
|
275
247
|
borderColor: h.axisBorder,
|
|
276
248
|
borderWidth: 1,
|
|
277
249
|
textColor: h.axisText,
|
|
278
|
-
font:
|
|
250
|
+
font: X.default,
|
|
279
251
|
textAlign: "center",
|
|
280
252
|
tickColor: h.axisTick,
|
|
281
253
|
tickWidth: 1,
|
|
@@ -287,7 +259,7 @@ var h = {
|
|
|
287
259
|
borderColor: h.crosshairLabelBackground,
|
|
288
260
|
borderWidth: 1,
|
|
289
261
|
textColor: h.white,
|
|
290
|
-
font:
|
|
262
|
+
font: X.default,
|
|
291
263
|
paddingX: 8,
|
|
292
264
|
height: 26
|
|
293
265
|
}
|
|
@@ -298,7 +270,7 @@ var h = {
|
|
|
298
270
|
borderColor: h.axisBorder,
|
|
299
271
|
borderWidth: 1,
|
|
300
272
|
textColor: h.axisText,
|
|
301
|
-
font:
|
|
273
|
+
font: X.default,
|
|
302
274
|
textAlign: "left",
|
|
303
275
|
tickCount: 12,
|
|
304
276
|
tickColor: h.axisYTick,
|
|
@@ -311,14 +283,14 @@ var h = {
|
|
|
311
283
|
borderColor: h.crosshairLabelBackground,
|
|
312
284
|
borderWidth: 1,
|
|
313
285
|
textColor: h.white,
|
|
314
|
-
font:
|
|
286
|
+
font: X.default,
|
|
315
287
|
paddingX: 8,
|
|
316
288
|
height: 20
|
|
317
289
|
}
|
|
318
290
|
}
|
|
319
291
|
},
|
|
320
292
|
tradeHandles: {
|
|
321
|
-
font:
|
|
293
|
+
font: X.default,
|
|
322
294
|
textColor: h.white,
|
|
323
295
|
textOpacity: 0.8,
|
|
324
296
|
pnlTextColors: {
|
|
@@ -335,7 +307,7 @@ var h = {
|
|
|
335
307
|
showVolumeSection: !1
|
|
336
308
|
},
|
|
337
309
|
handleLine: {
|
|
338
|
-
...
|
|
310
|
+
...nt,
|
|
339
311
|
color: h.red
|
|
340
312
|
}
|
|
341
313
|
},
|
|
@@ -349,7 +321,7 @@ var h = {
|
|
|
349
321
|
showVolumeSection: !1
|
|
350
322
|
},
|
|
351
323
|
handleLine: {
|
|
352
|
-
...
|
|
324
|
+
...nt,
|
|
353
325
|
color: h.green
|
|
354
326
|
}
|
|
355
327
|
},
|
|
@@ -366,35 +338,35 @@ var h = {
|
|
|
366
338
|
visible: !0,
|
|
367
339
|
dragActivationThresholdPx: 2,
|
|
368
340
|
slHandle: {
|
|
369
|
-
...
|
|
341
|
+
...ot,
|
|
370
342
|
borderColor: h.red,
|
|
371
343
|
backgroundColor: h.slBackground,
|
|
372
344
|
textColor: h.red
|
|
373
345
|
},
|
|
374
346
|
tpHandle: {
|
|
375
|
-
...
|
|
347
|
+
...ot,
|
|
376
348
|
borderColor: h.green,
|
|
377
349
|
backgroundColor: h.tpBackground,
|
|
378
350
|
textColor: h.green
|
|
379
351
|
},
|
|
380
352
|
temporarySlHandle: {
|
|
381
|
-
...
|
|
353
|
+
...at,
|
|
382
354
|
borderColor: h.red,
|
|
383
355
|
backgroundColor: h.slBackground,
|
|
384
356
|
textColor: h.red
|
|
385
357
|
},
|
|
386
358
|
temporaryTpHandle: {
|
|
387
|
-
...
|
|
359
|
+
...at,
|
|
388
360
|
borderColor: h.green,
|
|
389
361
|
backgroundColor: h.tpBackground,
|
|
390
362
|
textColor: h.green
|
|
391
363
|
},
|
|
392
364
|
temporarySlLine: {
|
|
393
|
-
...
|
|
365
|
+
..._,
|
|
394
366
|
color: h.red
|
|
395
367
|
},
|
|
396
368
|
temporaryTpLine: {
|
|
397
|
-
...
|
|
369
|
+
..._,
|
|
398
370
|
color: h.green
|
|
399
371
|
}
|
|
400
372
|
}
|
|
@@ -415,7 +387,7 @@ var h = {
|
|
|
415
387
|
opacity: 1
|
|
416
388
|
},
|
|
417
389
|
connectorLine: {
|
|
418
|
-
...
|
|
390
|
+
..._,
|
|
419
391
|
color: h.white,
|
|
420
392
|
opacity: 0.65
|
|
421
393
|
}
|
|
@@ -425,8 +397,8 @@ var h = {
|
|
|
425
397
|
bearish: h.red,
|
|
426
398
|
background: h.background
|
|
427
399
|
},
|
|
428
|
-
shapes:
|
|
429
|
-
},
|
|
400
|
+
shapes: Xt
|
|
401
|
+
}, lt = [
|
|
430
402
|
300 * 1e3,
|
|
431
403
|
900 * 1e3,
|
|
432
404
|
1800 * 1e3,
|
|
@@ -436,27 +408,27 @@ var h = {
|
|
|
436
408
|
360 * 60 * 1e3,
|
|
437
409
|
720 * 60 * 1e3,
|
|
438
410
|
1440 * 60 * 1e3
|
|
439
|
-
],
|
|
411
|
+
], It = (t) => {
|
|
440
412
|
if (t.length < 2) return 900 * 1e3;
|
|
441
413
|
const e = [];
|
|
442
414
|
for (let i = 1; i < Math.min(t.length, 10); i++) e.push(t[i].time - t[i - 1].time);
|
|
443
415
|
return e.sort((i, r) => i - r), e[Math.floor(e.length / 2)];
|
|
444
|
-
},
|
|
445
|
-
if (t <= 0 || e <= 0) return
|
|
416
|
+
}, Bt = ({ candleSpacing: t, candleTimeframeMs: e, labelWidth: i, minLabelGap: r }) => {
|
|
417
|
+
if (t <= 0 || e <= 0) return lt[0];
|
|
446
418
|
const s = i + r;
|
|
447
|
-
for (const a of
|
|
419
|
+
for (const a of lt) if (a / e * t >= s) return a;
|
|
448
420
|
const n = 1440 * 60 * 1e3, o = n / e * t;
|
|
449
421
|
return n * Math.ceil(s / o);
|
|
450
|
-
},
|
|
422
|
+
}, Wt = (t, e) => {
|
|
451
423
|
const i = new Date(t), r = (i.getHours() * 60 + i.getMinutes()) * 60 * 1e3 + i.getSeconds() * 1e3 + i.getMilliseconds();
|
|
452
424
|
return e >= 1440 * 60 * 1e3 ? r === 0 : r % e === 0;
|
|
453
|
-
},
|
|
425
|
+
}, Ft = (t) => {
|
|
454
426
|
const e = new Date(t), i = e.getHours(), r = e.getMinutes();
|
|
455
427
|
return i === 0 && r === 0 ? String(e.getDate()) : `${String(i).padStart(2, "0")}:${String(r).padStart(2, "0")}`;
|
|
456
|
-
},
|
|
428
|
+
}, Yt = (t) => {
|
|
457
429
|
const e = new Date(t), i = e.toLocaleDateString("en-US", { weekday: "short" }), r = e.toLocaleDateString("en-US", { month: "short" });
|
|
458
430
|
return `${i} ${e.getDate()} ${r} ${e.getHours().toString().padStart(2, "0")}.${e.getMinutes().toString().padStart(2, "0")}`;
|
|
459
|
-
},
|
|
431
|
+
}, Ot = class {
|
|
460
432
|
#t;
|
|
461
433
|
#e;
|
|
462
434
|
candles;
|
|
@@ -489,7 +461,7 @@ var h = {
|
|
|
489
461
|
}
|
|
490
462
|
drawCrosshairTimeLabel() {
|
|
491
463
|
if (!this.crosshair.visible || !this.crosshair.candle) return;
|
|
492
|
-
const t = this.#e, e = this.#t.width, i = this.#t.height, r = c.axis.axisX.crosshairLabel, s =
|
|
464
|
+
const t = this.#e, e = this.#t.width, i = this.#t.height, r = c.axis.axisX.crosshairLabel, s = Yt(this.crosshair.candle.time);
|
|
493
465
|
t.save(), t.font = r.font;
|
|
494
466
|
const n = t.measureText(s).width + r.paddingX * 2, o = r.height, a = this.getCrosshairLabelX(n, e), l = Math.max(0, (i - o) / 2);
|
|
495
467
|
t.fillStyle = r.backgroundColor, t.fillRect(a, l, n, o), t.strokeStyle = r.borderColor, t.lineWidth = r.borderWidth, t.strokeRect(a, l, n, o), t.fillStyle = r.textColor, t.textAlign = "center", t.textBaseline = "middle", t.fillText(s, a + n / 2, l + o / 2), t.restore();
|
|
@@ -507,9 +479,9 @@ var h = {
|
|
|
507
479
|
}
|
|
508
480
|
drawAxisLabels() {
|
|
509
481
|
if (!this.viewport) return;
|
|
510
|
-
const t = this.#e, e = c.axis.axisX, i = this.#t.width, r =
|
|
482
|
+
const t = this.#e, e = c.axis.axisX, i = this.#t.width, r = It(this.candles);
|
|
511
483
|
t.save(), t.font = e.font, t.fillStyle = e.textColor, t.textAlign = e.textAlign, t.textBaseline = "middle";
|
|
512
|
-
const s = t.measureText("00:00").width, n =
|
|
484
|
+
const s = t.measureText("00:00").width, n = Bt({
|
|
513
485
|
candleSpacing: this.viewport.candleSpacing,
|
|
514
486
|
candleTimeframeMs: r,
|
|
515
487
|
labelWidth: s,
|
|
@@ -517,8 +489,8 @@ var h = {
|
|
|
517
489
|
}), { startIndex: o, endIndex: a } = this.getVisibleCandleIndexRange(i);
|
|
518
490
|
for (let l = o; l <= a; l += 1) {
|
|
519
491
|
const d = this.getSlotTime(l, r);
|
|
520
|
-
if (d === null || !
|
|
521
|
-
const u = this.getCandleCenterX(l), g =
|
|
492
|
+
if (d === null || !Wt(d, n)) continue;
|
|
493
|
+
const u = this.getCandleCenterX(l), g = Ft(d), m = t.measureText(g).width;
|
|
522
494
|
this.isLabelOutsideCanvas(u, m, i) || (this.drawTick(u), this.drawLabel(g, u));
|
|
523
495
|
}
|
|
524
496
|
t.restore();
|
|
@@ -563,7 +535,7 @@ var h = {
|
|
|
563
535
|
getCrosshairLabelX(t, e) {
|
|
564
536
|
return Math.max(120, Math.min(e - t, this.crosshair.x - t / 2));
|
|
565
537
|
}
|
|
566
|
-
}, p = (t, e = 5) => Number(t.toFixed(e)),
|
|
538
|
+
}, p = (t, e = 5) => Number(t.toFixed(e)), O = ({ price: t, minPrice: e, priceRange: i, chartHeight: r }) => r - (t - e) / i * r, mt = ({ y: t, minPrice: e, priceRange: i, chartHeight: r }) => e + (1 - t / r) * i, Et = ({ priceRange: t, canvasHeight: e }) => {
|
|
567
539
|
const i = t / (e / c.axis.axisY.tickGap), r = 10 ** Math.floor(Math.log10(i));
|
|
568
540
|
for (const s of [
|
|
569
541
|
1,
|
|
@@ -620,7 +592,7 @@ var h = {
|
|
|
620
592
|
}
|
|
621
593
|
drawPriceLabels() {
|
|
622
594
|
if (!this.viewport) return;
|
|
623
|
-
const t = this.#e, e = this.#t.height, i = c.axis.axisY, r =
|
|
595
|
+
const t = this.#e, e = this.#t.height, i = c.axis.axisY, r = Et({
|
|
624
596
|
priceRange: this.viewport.priceRange,
|
|
625
597
|
canvasHeight: e
|
|
626
598
|
});
|
|
@@ -642,7 +614,7 @@ var h = {
|
|
|
642
614
|
};
|
|
643
615
|
}
|
|
644
616
|
getPriceY(t, e) {
|
|
645
|
-
return this.viewport ?
|
|
617
|
+
return this.viewport ? O({
|
|
646
618
|
price: t,
|
|
647
619
|
minPrice: this.viewport.minPrice,
|
|
648
620
|
priceRange: this.viewport.priceRange,
|
|
@@ -663,7 +635,7 @@ var h = {
|
|
|
663
635
|
getCrosshairLabelY(t, e) {
|
|
664
636
|
return Math.max(0, Math.min(e - t, this.crosshair.y - t / 2));
|
|
665
637
|
}
|
|
666
|
-
},
|
|
638
|
+
}, zt = class {
|
|
667
639
|
#t;
|
|
668
640
|
#e;
|
|
669
641
|
mouseX = 0;
|
|
@@ -740,7 +712,7 @@ var h = {
|
|
|
740
712
|
drawLine({ ctx: t, fromX: e, fromY: i, toX: r, toY: s }) {
|
|
741
713
|
t.beginPath(), t.moveTo(e, i), t.lineTo(r, s), t.stroke();
|
|
742
714
|
}
|
|
743
|
-
}, F = 60 * 1e3,
|
|
715
|
+
}, F = 60 * 1e3, Ct = 60 * F, Nt = 24 * Ct, _t = class {
|
|
744
716
|
#t;
|
|
745
717
|
#e;
|
|
746
718
|
candles;
|
|
@@ -834,7 +806,7 @@ var h = {
|
|
|
834
806
|
return this.getCandleCenterX(e);
|
|
835
807
|
}
|
|
836
808
|
getPriceAtY(t) {
|
|
837
|
-
return p(
|
|
809
|
+
return p(mt({
|
|
838
810
|
y: t,
|
|
839
811
|
minPrice: this.minPrice,
|
|
840
812
|
priceRange: this.priceRange,
|
|
@@ -958,7 +930,7 @@ var h = {
|
|
|
958
930
|
}
|
|
959
931
|
getInitialFallbackPercent() {
|
|
960
932
|
const t = this.detectCandleTimeframeMs();
|
|
961
|
-
return t <= F ? 25e-4 : t <= 5 * F ? 35e-4 : t <= 15 * F ? 5e-3 : t <=
|
|
933
|
+
return t <= F ? 25e-4 : t <= 5 * F ? 35e-4 : t <= 15 * F ? 5e-3 : t <= Ct ? 75e-4 : (t < Nt, 0.01);
|
|
962
934
|
}
|
|
963
935
|
detectCandleTimeframeMs() {
|
|
964
936
|
if (this.candles.length < 2) return 15 * F;
|
|
@@ -1007,7 +979,7 @@ var h = {
|
|
|
1007
979
|
};
|
|
1008
980
|
}
|
|
1009
981
|
getPriceY(t, e) {
|
|
1010
|
-
return
|
|
982
|
+
return O({
|
|
1011
983
|
price: t,
|
|
1012
984
|
minPrice: this.minPrice,
|
|
1013
985
|
priceRange: this.priceRange,
|
|
@@ -1044,7 +1016,7 @@ var h = {
|
|
|
1044
1016
|
}
|
|
1045
1017
|
#c(t, e) {
|
|
1046
1018
|
if (!this.#r || !this.#e) return;
|
|
1047
|
-
const i = this.#t, r = i.canvas, s =
|
|
1019
|
+
const i = this.#t, r = i.canvas, s = O({
|
|
1048
1020
|
price: t,
|
|
1049
1021
|
minPrice: this.#r.minPrice,
|
|
1050
1022
|
priceRange: this.#r.priceRange,
|
|
@@ -1056,17 +1028,17 @@ var h = {
|
|
|
1056
1028
|
const l = i.measureText(e).width, d = a / 2, u = l / 2 + o.paddingX;
|
|
1057
1029
|
i.globalAlpha = n.opacity, i.strokeStyle = n.color, i.lineWidth = n.width, i.setLineDash(n.dash), i.beginPath(), i.moveTo(0, s), i.lineTo(d - u, s), i.stroke(), i.beginPath(), i.moveTo(d + u, s), i.lineTo(a, s), i.stroke(), i.setLineDash([]), i.globalAlpha = 1, i.fillStyle = o.color, i.textAlign = "center", i.textBaseline = "middle", i.fillText(e, d, s), i.restore();
|
|
1058
1030
|
}
|
|
1059
|
-
},
|
|
1031
|
+
}, vt = (t, e) => {
|
|
1060
1032
|
const i = t.getBoundingClientRect(), r = t.width / i.width, s = t.height / i.height;
|
|
1061
1033
|
return {
|
|
1062
1034
|
x: (e.clientX - i.left) * r,
|
|
1063
1035
|
y: (e.clientY - i.top) * s
|
|
1064
1036
|
};
|
|
1065
1037
|
};
|
|
1066
|
-
var U = () => typeof crypto < "u" && "randomUUID" in crypto ? crypto.randomUUID() : `shape-${Date.now()}-${Math.random().toString(16).slice(2)}`,
|
|
1038
|
+
var U = () => typeof crypto < "u" && "randomUUID" in crypto ? crypto.randomUUID() : `shape-${Date.now()}-${Math.random().toString(16).slice(2)}`, $ = (t, e) => vt(t, e), ht = (t, e) => ({
|
|
1067
1039
|
time: e.getNearestCandleTimeForX(t.x),
|
|
1068
1040
|
price: e.getPriceForY(t.y)
|
|
1069
|
-
}),
|
|
1041
|
+
}), C = (t, e) => ({
|
|
1070
1042
|
x: e.getXForTime(t.time),
|
|
1071
1043
|
y: e.getYForPrice(t.price)
|
|
1072
1044
|
}), Ut = (t, e) => {
|
|
@@ -1079,22 +1051,22 @@ var U = () => typeof crypto < "u" && "randomUUID" in crypto ? crypto.randomUUID(
|
|
|
1079
1051
|
width: r - i,
|
|
1080
1052
|
height: n - s
|
|
1081
1053
|
};
|
|
1082
|
-
},
|
|
1054
|
+
}, J = (t, e, i) => Ut(C(t, i), C(e, i)), K = (t, e) => {
|
|
1083
1055
|
const i = t.x - e.x, r = t.y - e.y;
|
|
1084
1056
|
return Math.sqrt(i * i + r * r);
|
|
1085
|
-
},
|
|
1057
|
+
}, yt = (t, e, i) => {
|
|
1086
1058
|
const r = i.x - e.x, s = i.y - e.y, n = r * r + s * s;
|
|
1087
|
-
if (n === 0) return
|
|
1059
|
+
if (n === 0) return K(t, e);
|
|
1088
1060
|
const o = Math.max(0, Math.min(1, ((t.x - e.x) * r + (t.y - e.y) * s) / n));
|
|
1089
|
-
return
|
|
1061
|
+
return K(t, {
|
|
1090
1062
|
x: e.x + o * r,
|
|
1091
1063
|
y: e.y + o * s
|
|
1092
1064
|
});
|
|
1093
|
-
},
|
|
1094
|
-
if (!
|
|
1065
|
+
}, wt = (t, e, i = 0) => t.x >= e.left - i && t.x <= e.right + i && t.y >= e.top - i && t.y <= e.bottom + i, $t = (t, e, i = 8) => {
|
|
1066
|
+
if (!wt(t, e, i)) return !1;
|
|
1095
1067
|
const r = Math.abs(t.x - e.left) <= i, s = Math.abs(t.x - e.right) <= i, n = Math.abs(t.y - e.top) <= i, o = Math.abs(t.y - e.bottom) <= i, a = t.x >= e.left - i && t.x <= e.right + i, l = t.y >= e.top - i && t.y <= e.bottom + i;
|
|
1096
1068
|
return (r || s) && l || (n || o) && a;
|
|
1097
|
-
},
|
|
1069
|
+
}, x = ({ shapeId: t, type: e, point: i, radius: r = 5, cursor: s, index: n }) => ({
|
|
1098
1070
|
shapeId: t,
|
|
1099
1071
|
type: e,
|
|
1100
1072
|
x: i.x,
|
|
@@ -1102,11 +1074,11 @@ var U = () => typeof crypto < "u" && "randomUUID" in crypto ? crypto.randomUUID(
|
|
|
1102
1074
|
radius: r,
|
|
1103
1075
|
cursor: s,
|
|
1104
1076
|
index: n
|
|
1105
|
-
}),
|
|
1106
|
-
t.strokeStyle =
|
|
1107
|
-
},
|
|
1077
|
+
}), j = (t, e) => K(t, e) <= e.radius + 2, z = (t, e = 1) => t === "dashed" ? [e * 6, e * 4] : t === "dotted" ? [e, e * 3] : [], Q = (t, e, i) => {
|
|
1078
|
+
t.strokeStyle = P(e.lineColor, e.lineOpacity), t.lineWidth = i ?? e.lineWidth, t.setLineDash(z(e.lineStyle, t.lineWidth));
|
|
1079
|
+
}, Pt = (t, e, i) => !e || i === void 0 || i <= 0 ? !1 : (t.fillStyle = P(e, i), !0), E = (t) => {
|
|
1108
1080
|
t.setLineDash([]);
|
|
1109
|
-
},
|
|
1081
|
+
}, Jt = (t, e, i = {
|
|
1110
1082
|
fillColor: "#ffffff",
|
|
1111
1083
|
borderColor: "#2962ff",
|
|
1112
1084
|
borderThickness: 3
|
|
@@ -1114,15 +1086,15 @@ var U = () => typeof crypto < "u" && "randomUUID" in crypto ? crypto.randomUUID(
|
|
|
1114
1086
|
t.save(), t.beginPath(), t.arc(e.x, e.y, e.radius, 0, Math.PI * 2), t.fillStyle = i.fillColor, t.fill(), t.lineWidth = i.borderThickness, t.strokeStyle = i.borderColor, t.stroke(), t.restore();
|
|
1115
1087
|
}, V = (t, e, i) => {
|
|
1116
1088
|
e.forEach((r) => {
|
|
1117
|
-
|
|
1089
|
+
Jt(t, r, i);
|
|
1118
1090
|
});
|
|
1119
|
-
},
|
|
1091
|
+
}, P = (t, e) => {
|
|
1120
1092
|
const i = jt(e, 0, 1);
|
|
1121
|
-
return t.startsWith("rgba(") ? t : t.startsWith("rgb(") ? t.replace("rgb(", "rgba(").replace(")", `, ${i})`) : t.startsWith("#") ?
|
|
1122
|
-
},
|
|
1093
|
+
return t.startsWith("rgba(") ? t : t.startsWith("rgb(") ? t.replace("rgb(", "rgba(").replace(")", `, ${i})`) : t.startsWith("#") ? Kt(t, i) : t;
|
|
1094
|
+
}, Kt = (t, e) => {
|
|
1123
1095
|
const i = t.replace("#", ""), r = i.length === 3 ? i.split("").map((s) => `${s}${s}`).join("") : i;
|
|
1124
1096
|
return `rgba(${parseInt(r.slice(0, 2), 16)}, ${parseInt(r.slice(2, 4), 16)}, ${parseInt(r.slice(4, 6), 16)}, ${e})`;
|
|
1125
|
-
}, jt = (t, e, i) => Math.min(i, Math.max(e, t)),
|
|
1097
|
+
}, jt = (t, e, i) => Math.min(i, Math.max(e, t)), dt = (t, e, i) => e + (t - e) * i, Z = (t, e) => {
|
|
1126
1098
|
if (t.length === 0) return -1;
|
|
1127
1099
|
let i = 0, r = Math.abs(t[0].time - e);
|
|
1128
1100
|
for (let s = 1; s < t.length; s += 1) {
|
|
@@ -1130,7 +1102,7 @@ var U = () => typeof crypto < "u" && "randomUUID" in crypto ? crypto.randomUUID(
|
|
|
1130
1102
|
n < r && (r = n, i = s);
|
|
1131
1103
|
}
|
|
1132
1104
|
return i;
|
|
1133
|
-
},
|
|
1105
|
+
}, q = (t) => {
|
|
1134
1106
|
if (t.length < 2) return 900 * 1e3;
|
|
1135
1107
|
const e = [];
|
|
1136
1108
|
for (let i = 1; i < t.length; i += 1) {
|
|
@@ -1138,10 +1110,15 @@ var U = () => typeof crypto < "u" && "randomUUID" in crypto ? crypto.randomUUID(
|
|
|
1138
1110
|
r > 0 && e.push(r);
|
|
1139
1111
|
}
|
|
1140
1112
|
return e.length === 0 ? 900 * 1e3 : e.reduce((i, r) => i + r, 0) / e.length;
|
|
1141
|
-
},
|
|
1142
|
-
const r =
|
|
1143
|
-
return r >= 0 && s >= 0 && s < t.length ? t[s].time : e +
|
|
1144
|
-
},
|
|
1113
|
+
}, Zt = (t, e, i) => {
|
|
1114
|
+
const r = Z(t, e), s = r + i;
|
|
1115
|
+
return r >= 0 && s >= 0 && s < t.length ? t[s].time : e + q(t) * i;
|
|
1116
|
+
}, ct = (t) => t instanceof MouseEvent && t.type === "contextmenu" ? !1 : "button" in t && t.type === "pointerdown" ? t.button === 0 : !0, f = {
|
|
1117
|
+
handleColor: h.background,
|
|
1118
|
+
handleBorderColor: h.blue,
|
|
1119
|
+
handleBorderThickness: 1.5,
|
|
1120
|
+
handleRadius: 5
|
|
1121
|
+
}, L = class I {
|
|
1145
1122
|
static defaultConfig = {
|
|
1146
1123
|
levels: [
|
|
1147
1124
|
{
|
|
@@ -1186,29 +1163,23 @@ var U = () => typeof crypto < "u" && "randomUUID" in crypto ? crypto.randomUUID(
|
|
|
1186
1163
|
}
|
|
1187
1164
|
],
|
|
1188
1165
|
fillColor: "#808080",
|
|
1189
|
-
fillOpacity: 0.04
|
|
1190
|
-
handleColor: "#ffffff",
|
|
1191
|
-
handleBorderColor: "#2962ff",
|
|
1192
|
-
handleBorderThickness: 1.5,
|
|
1193
|
-
handleRadius: 5,
|
|
1194
|
-
hoverLineWidth: 2,
|
|
1195
|
-
selectedLineWidth: 2
|
|
1166
|
+
fillOpacity: 0.04
|
|
1196
1167
|
};
|
|
1197
|
-
static draw({ ctx: e, shape: i, converter: r, config: s =
|
|
1198
|
-
const [a, l] = i.vertices, d =
|
|
1199
|
-
e.save(),
|
|
1200
|
-
for (const
|
|
1201
|
-
const
|
|
1202
|
-
e.beginPath(), e.strokeStyle =
|
|
1168
|
+
static draw({ ctx: e, shape: i, converter: r, config: s = I.defaultConfig, selected: n = !1, hovered: o = !1 }) {
|
|
1169
|
+
const [a, l] = i.vertices, d = C(a, r), u = C(l, r), g = J(a, l, r), m = Math.min(d.x, u.x), b = Math.max(d.x, u.x);
|
|
1170
|
+
e.save(), Pt(e, s.fillColor, s.fillOpacity) && e.fillRect(g.left, g.top, g.width, g.height);
|
|
1171
|
+
for (const v of s.levels) {
|
|
1172
|
+
const S = dt(a.price, l.price, v.level), T = r.getYForPrice(S), k = v.lineWidth;
|
|
1173
|
+
e.beginPath(), e.strokeStyle = P(v.color, v.opacity), e.lineWidth = k, e.setLineDash(z(v.lineStyle, k)), e.moveTo(m, T), e.lineTo(b, T), e.stroke(), v.label && (e.setLineDash([]), e.fillStyle = P(v.color, v.opacity), e.font = "11px sans-serif", e.textBaseline = "middle", e.fillText(Number(v.label).toFixed(2).toString(), b + 12, T));
|
|
1203
1174
|
}
|
|
1204
|
-
|
|
1205
|
-
fillColor:
|
|
1206
|
-
borderColor:
|
|
1207
|
-
borderThickness:
|
|
1175
|
+
E(e), (n || o) && V(e, I.getHandles(i, r), {
|
|
1176
|
+
fillColor: f.handleColor,
|
|
1177
|
+
borderColor: f.handleBorderColor,
|
|
1178
|
+
borderThickness: f.handleBorderThickness
|
|
1208
1179
|
}), e.restore();
|
|
1209
1180
|
}
|
|
1210
|
-
static drawDraft({ ctx: e, vertices: i, converter: r, config: s =
|
|
1211
|
-
|
|
1181
|
+
static drawDraft({ ctx: e, vertices: i, converter: r, config: s = I.defaultConfig }) {
|
|
1182
|
+
I.draw({
|
|
1212
1183
|
ctx: e,
|
|
1213
1184
|
shape: {
|
|
1214
1185
|
id: "__draft_fib_retracement__",
|
|
@@ -1220,28 +1191,28 @@ var U = () => typeof crypto < "u" && "randomUUID" in crypto ? crypto.randomUUID(
|
|
|
1220
1191
|
selected: !0
|
|
1221
1192
|
});
|
|
1222
1193
|
}
|
|
1223
|
-
static getHandles(e, i
|
|
1224
|
-
const [
|
|
1225
|
-
return [
|
|
1194
|
+
static getHandles(e, i) {
|
|
1195
|
+
const [r, s] = e.vertices, n = C(r, i), o = C(s, i);
|
|
1196
|
+
return [x({
|
|
1226
1197
|
shapeId: e.id,
|
|
1227
1198
|
type: "start",
|
|
1228
|
-
point:
|
|
1229
|
-
radius:
|
|
1199
|
+
point: n,
|
|
1200
|
+
radius: f.handleRadius,
|
|
1230
1201
|
cursor: "grab"
|
|
1231
|
-
}),
|
|
1202
|
+
}), x({
|
|
1232
1203
|
shapeId: e.id,
|
|
1233
1204
|
type: "end",
|
|
1234
|
-
point:
|
|
1235
|
-
radius:
|
|
1205
|
+
point: o,
|
|
1206
|
+
radius: f.handleRadius,
|
|
1236
1207
|
cursor: "grab"
|
|
1237
1208
|
})];
|
|
1238
1209
|
}
|
|
1239
|
-
static hitTest({ point: e, shape: i, converter: r, tolerance: s = 8, config: n =
|
|
1240
|
-
const [o, a] = i.vertices, l =
|
|
1210
|
+
static hitTest({ point: e, shape: i, converter: r, tolerance: s = 8, config: n = I.defaultConfig }) {
|
|
1211
|
+
const [o, a] = i.vertices, l = C(o, r), d = C(a, r), u = Math.min(l.x, d.x), g = Math.max(l.x, d.x);
|
|
1241
1212
|
if (e.x < u - s || e.x > g + s) return !1;
|
|
1242
1213
|
for (const m of n.levels) {
|
|
1243
|
-
const
|
|
1244
|
-
if (Math.abs(e.y -
|
|
1214
|
+
const b = dt(o.price, a.price, m.level), v = r.getYForPrice(b);
|
|
1215
|
+
if (Math.abs(e.y - v) <= s) return !0;
|
|
1245
1216
|
}
|
|
1246
1217
|
return !1;
|
|
1247
1218
|
}
|
|
@@ -1266,29 +1237,23 @@ var U = () => typeof crypto < "u" && "randomUUID" in crypto ? crypto.randomUUID(
|
|
|
1266
1237
|
vertices: [e.vertices[0], r]
|
|
1267
1238
|
} : e;
|
|
1268
1239
|
}
|
|
1269
|
-
},
|
|
1240
|
+
}, M = class Y {
|
|
1270
1241
|
static defaultConfig = {
|
|
1271
1242
|
lineWidth: 2,
|
|
1272
1243
|
lineColor: "#2962ff",
|
|
1273
1244
|
lineOpacity: 1,
|
|
1274
|
-
lineStyle: "solid"
|
|
1275
|
-
handleColor: "#ffffff",
|
|
1276
|
-
handleBorderColor: "#2962ff",
|
|
1277
|
-
handleBorderThickness: 1.5,
|
|
1278
|
-
handleRadius: 5,
|
|
1279
|
-
hoverLineWidth: 3,
|
|
1280
|
-
selectedLineWidth: 3
|
|
1245
|
+
lineStyle: "solid"
|
|
1281
1246
|
};
|
|
1282
|
-
static draw({ ctx: e, shape: i, converter: r, config: s =
|
|
1283
|
-
const [a, l] = i.vertices, d =
|
|
1284
|
-
e.save(),
|
|
1285
|
-
fillColor:
|
|
1286
|
-
borderColor:
|
|
1287
|
-
borderThickness:
|
|
1247
|
+
static draw({ ctx: e, shape: i, converter: r, config: s = Y.defaultConfig, selected: n = !1, hovered: o = !1 }) {
|
|
1248
|
+
const [a, l] = i.vertices, d = C(a, r), u = C(l, r);
|
|
1249
|
+
e.save(), Q(e, s), e.beginPath(), e.moveTo(d.x, d.y), e.lineTo(u.x, u.y), e.stroke(), E(e), (n || o) && V(e, Y.getHandles(i, r), {
|
|
1250
|
+
fillColor: f.handleColor,
|
|
1251
|
+
borderColor: f.handleBorderColor,
|
|
1252
|
+
borderThickness: f.handleBorderThickness
|
|
1288
1253
|
}), e.restore();
|
|
1289
1254
|
}
|
|
1290
|
-
static drawDraft({ ctx: e, vertices: i, converter: r, config: s =
|
|
1291
|
-
|
|
1255
|
+
static drawDraft({ ctx: e, vertices: i, converter: r, config: s = Y.defaultConfig }) {
|
|
1256
|
+
Y.draw({
|
|
1292
1257
|
ctx: e,
|
|
1293
1258
|
shape: {
|
|
1294
1259
|
id: "__draft_trendline__",
|
|
@@ -1300,25 +1265,25 @@ var U = () => typeof crypto < "u" && "randomUUID" in crypto ? crypto.randomUUID(
|
|
|
1300
1265
|
selected: !0
|
|
1301
1266
|
});
|
|
1302
1267
|
}
|
|
1303
|
-
static getHandles(e, i
|
|
1304
|
-
const [
|
|
1305
|
-
return [
|
|
1268
|
+
static getHandles(e, i) {
|
|
1269
|
+
const [r, s] = e.vertices, n = C(r, i), o = C(s, i);
|
|
1270
|
+
return [x({
|
|
1306
1271
|
shapeId: e.id,
|
|
1307
1272
|
type: "start",
|
|
1308
|
-
point:
|
|
1309
|
-
radius:
|
|
1273
|
+
point: n,
|
|
1274
|
+
radius: f.handleRadius,
|
|
1310
1275
|
cursor: "grab"
|
|
1311
|
-
}),
|
|
1276
|
+
}), x({
|
|
1312
1277
|
shapeId: e.id,
|
|
1313
1278
|
type: "end",
|
|
1314
|
-
point:
|
|
1315
|
-
radius:
|
|
1279
|
+
point: o,
|
|
1280
|
+
radius: f.handleRadius,
|
|
1316
1281
|
cursor: "grab"
|
|
1317
1282
|
})];
|
|
1318
1283
|
}
|
|
1319
1284
|
static hitTest({ point: e, shape: i, converter: r, tolerance: s = 8 }) {
|
|
1320
1285
|
const [n, o] = i.vertices;
|
|
1321
|
-
return
|
|
1286
|
+
return yt(e, C(n, r), C(o, r)) <= s;
|
|
1322
1287
|
}
|
|
1323
1288
|
static move(e, i) {
|
|
1324
1289
|
return {
|
|
@@ -1341,37 +1306,31 @@ var U = () => typeof crypto < "u" && "randomUUID" in crypto ? crypto.randomUUID(
|
|
|
1341
1306
|
vertices: [e.vertices[0], r]
|
|
1342
1307
|
} : e;
|
|
1343
1308
|
}
|
|
1344
|
-
},
|
|
1309
|
+
}, R = class B {
|
|
1345
1310
|
static defaultConfig = {
|
|
1346
1311
|
lineWidth: 2,
|
|
1347
1312
|
lineColor: "#2962ff",
|
|
1348
1313
|
lineOpacity: 1,
|
|
1349
1314
|
lineStyle: "solid",
|
|
1350
1315
|
fillColor: "#2962ff",
|
|
1351
|
-
fillOpacity: 0
|
|
1352
|
-
handleColor: "#ffffff",
|
|
1353
|
-
handleBorderColor: "#2962ff",
|
|
1354
|
-
handleBorderThickness: 1.5,
|
|
1355
|
-
handleRadius: 5,
|
|
1356
|
-
hoverLineWidth: 3,
|
|
1357
|
-
selectedLineWidth: 3
|
|
1316
|
+
fillOpacity: 0
|
|
1358
1317
|
};
|
|
1359
1318
|
static draw({ ctx: e, shape: i, converter: r, config: s = B.defaultConfig, selected: n = !1, hovered: o = !1 }) {
|
|
1360
|
-
const a = i.vertices.map((l) =>
|
|
1319
|
+
const a = i.vertices.map((l) => C(l, r));
|
|
1361
1320
|
if (a.length !== 0) {
|
|
1362
|
-
e.save(),
|
|
1321
|
+
e.save(), Q(e, s), e.beginPath(), e.moveTo(a[0].x, a[0].y);
|
|
1363
1322
|
for (let l = 1; l < a.length; l += 1) e.lineTo(a[l].x, a[l].y);
|
|
1364
|
-
e.stroke(),
|
|
1323
|
+
e.stroke(), E(e), a.length >= 2 && B.drawEndArrow({
|
|
1365
1324
|
ctx: e,
|
|
1366
1325
|
previousPoint: a[a.length - 2],
|
|
1367
1326
|
endPoint: a[a.length - 1],
|
|
1368
1327
|
color: s.lineColor,
|
|
1369
1328
|
opacity: s.lineOpacity,
|
|
1370
|
-
lineWidth:
|
|
1371
|
-
}), (n || o) && V(e, B.getHandles(i, r
|
|
1372
|
-
fillColor:
|
|
1373
|
-
borderColor:
|
|
1374
|
-
borderThickness:
|
|
1329
|
+
lineWidth: s.lineWidth
|
|
1330
|
+
}), (n || o) && V(e, B.getHandles(i, r), {
|
|
1331
|
+
fillColor: f.handleColor,
|
|
1332
|
+
borderColor: f.handleBorderColor,
|
|
1333
|
+
borderThickness: f.handleBorderThickness
|
|
1375
1334
|
}), e.restore();
|
|
1376
1335
|
}
|
|
1377
1336
|
}
|
|
@@ -1389,23 +1348,23 @@ var U = () => typeof crypto < "u" && "randomUUID" in crypto ? crypto.randomUUID(
|
|
|
1389
1348
|
selected: !0
|
|
1390
1349
|
});
|
|
1391
1350
|
}
|
|
1392
|
-
static getHandles(e, i
|
|
1393
|
-
return e.vertices.map((
|
|
1351
|
+
static getHandles(e, i) {
|
|
1352
|
+
return e.vertices.map((r, s) => x({
|
|
1394
1353
|
shapeId: e.id,
|
|
1395
|
-
type:
|
|
1396
|
-
point:
|
|
1397
|
-
radius:
|
|
1354
|
+
type: s === 0 ? "start" : s === e.vertices.length - 1 ? "end" : "move",
|
|
1355
|
+
point: C(r, i),
|
|
1356
|
+
radius: f.handleRadius,
|
|
1398
1357
|
cursor: "grab",
|
|
1399
|
-
index:
|
|
1358
|
+
index: s
|
|
1400
1359
|
}));
|
|
1401
1360
|
}
|
|
1402
1361
|
static hitTest({ point: e, shape: i, converter: r, tolerance: s = 8 }) {
|
|
1403
|
-
const n = i.vertices.map((o) =>
|
|
1362
|
+
const n = i.vertices.map((o) => C(o, r));
|
|
1404
1363
|
if (n.length === 1) {
|
|
1405
1364
|
const o = n[0], a = e.x - o.x, l = e.y - o.y;
|
|
1406
1365
|
return Math.sqrt(a * a + l * l) <= s;
|
|
1407
1366
|
}
|
|
1408
|
-
for (let o = 1; o < n.length; o += 1) if (
|
|
1367
|
+
for (let o = 1; o < n.length; o += 1) if (yt(e, n[o - 1], n[o]) <= s) return !0;
|
|
1409
1368
|
return !1;
|
|
1410
1369
|
}
|
|
1411
1370
|
static move(e, i) {
|
|
@@ -1425,9 +1384,9 @@ var U = () => typeof crypto < "u" && "randomUUID" in crypto ? crypto.randomUUID(
|
|
|
1425
1384
|
}
|
|
1426
1385
|
static drawEndArrow({ ctx: e, previousPoint: i, endPoint: r, color: s, opacity: n, lineWidth: o }) {
|
|
1427
1386
|
const a = Math.atan2(r.y - i.y, r.x - i.x), l = 12, d = Math.PI / 7;
|
|
1428
|
-
e.save(), e.beginPath(), e.strokeStyle =
|
|
1387
|
+
e.save(), e.beginPath(), e.strokeStyle = P(s, n), e.fillStyle = P(s, n), e.lineWidth = o, e.setLineDash([]), e.moveTo(r.x, r.y), e.lineTo(r.x - l * Math.cos(a - d), r.y - l * Math.sin(a - d)), e.lineTo(r.x - l * Math.cos(a + d), r.y - l * Math.sin(a + d)), e.closePath(), e.fill(), e.stroke(), e.restore();
|
|
1429
1388
|
}
|
|
1430
|
-
},
|
|
1389
|
+
}, D = class W {
|
|
1431
1390
|
static defaultConfig = {
|
|
1432
1391
|
lineWidth: 2,
|
|
1433
1392
|
lineColor: "#2962ff",
|
|
@@ -1435,27 +1394,21 @@ var U = () => typeof crypto < "u" && "randomUUID" in crypto ? crypto.randomUUID(
|
|
|
1435
1394
|
lineStyle: "solid",
|
|
1436
1395
|
fillColor: "#2962ff",
|
|
1437
1396
|
fillOpacity: 0.12,
|
|
1438
|
-
handleColor: "#ffffff",
|
|
1439
|
-
handleBorderColor: "#2962ff",
|
|
1440
|
-
handleBorderThickness: 1.5,
|
|
1441
|
-
handleRadius: 5,
|
|
1442
|
-
hoverLineWidth: 3,
|
|
1443
|
-
selectedLineWidth: 3,
|
|
1444
1397
|
textColor: "#ffffff",
|
|
1445
1398
|
textOpacity: 1,
|
|
1446
1399
|
textFontFamily: "Arial",
|
|
1447
1400
|
textFontSize: 20
|
|
1448
1401
|
};
|
|
1449
|
-
static draw({ ctx: e, shape: i, converter: r, config: s =
|
|
1450
|
-
const [a, l] = i.vertices, d =
|
|
1451
|
-
e.save(),
|
|
1452
|
-
fillColor:
|
|
1453
|
-
borderColor:
|
|
1454
|
-
borderThickness:
|
|
1402
|
+
static draw({ ctx: e, shape: i, converter: r, config: s = W.defaultConfig, selected: n = !1, hovered: o = !1 }) {
|
|
1403
|
+
const [a, l] = i.vertices, d = J(a, l, r);
|
|
1404
|
+
e.save(), Pt(e, s.fillColor, s.fillOpacity) && e.fillRect(d.left, d.top, d.width, d.height), Q(e, s), e.strokeRect(d.left, d.top, d.width, d.height), E(e), W.drawText(e, d, i.text, s), (n || o) && V(e, W.getHandles(i, r), {
|
|
1405
|
+
fillColor: f.handleColor,
|
|
1406
|
+
borderColor: f.handleBorderColor,
|
|
1407
|
+
borderThickness: f.handleBorderThickness
|
|
1455
1408
|
}), e.restore();
|
|
1456
1409
|
}
|
|
1457
|
-
static drawDraft({ ctx: e, vertices: i, converter: r, config: s =
|
|
1458
|
-
|
|
1410
|
+
static drawDraft({ ctx: e, vertices: i, converter: r, config: s = W.defaultConfig }) {
|
|
1411
|
+
W.draw({
|
|
1459
1412
|
ctx: e,
|
|
1460
1413
|
shape: {
|
|
1461
1414
|
id: "__draft_rectangle__",
|
|
@@ -1467,25 +1420,25 @@ var U = () => typeof crypto < "u" && "randomUUID" in crypto ? crypto.randomUUID(
|
|
|
1467
1420
|
selected: !0
|
|
1468
1421
|
});
|
|
1469
1422
|
}
|
|
1470
|
-
static getHandles(e, i
|
|
1471
|
-
const [
|
|
1472
|
-
return [
|
|
1423
|
+
static getHandles(e, i) {
|
|
1424
|
+
const [r, s] = e.vertices, n = C(r, i), o = C(s, i), a = n.x <= o.x, l = n.y <= o.y, d = a === l ? "nwse-resize" : "nesw-resize", u = a === l ? "nwse-resize" : "nesw-resize";
|
|
1425
|
+
return [x({
|
|
1473
1426
|
shapeId: e.id,
|
|
1474
1427
|
type: "start",
|
|
1475
|
-
point:
|
|
1476
|
-
radius:
|
|
1477
|
-
cursor:
|
|
1478
|
-
}),
|
|
1428
|
+
point: n,
|
|
1429
|
+
radius: f.handleRadius,
|
|
1430
|
+
cursor: d
|
|
1431
|
+
}), x({
|
|
1479
1432
|
shapeId: e.id,
|
|
1480
1433
|
type: "end",
|
|
1481
|
-
point:
|
|
1482
|
-
radius:
|
|
1483
|
-
cursor:
|
|
1434
|
+
point: o,
|
|
1435
|
+
radius: f.handleRadius,
|
|
1436
|
+
cursor: u
|
|
1484
1437
|
})];
|
|
1485
1438
|
}
|
|
1486
1439
|
static hitTest({ point: e, shape: i, converter: r, tolerance: s = 8 }) {
|
|
1487
1440
|
const [n, o] = i.vertices;
|
|
1488
|
-
return
|
|
1441
|
+
return $t(e, J(n, o, r), s);
|
|
1489
1442
|
}
|
|
1490
1443
|
static move(e, i) {
|
|
1491
1444
|
return {
|
|
@@ -1512,22 +1465,22 @@ var U = () => typeof crypto < "u" && "randomUUID" in crypto ? crypto.randomUUID(
|
|
|
1512
1465
|
const n = r?.trim();
|
|
1513
1466
|
n && (e.save(), e.beginPath(), e.rect(i.left, i.top, i.width, i.height), e.clip(), e.font = `${s.textFontSize}px ${s.textFontFamily}`, e.globalAlpha = s.textOpacity, e.fillStyle = s.textColor, e.textAlign = "center", e.textBaseline = "middle", e.fillText(n, i.left + i.width / 2, i.top + i.height / 2), e.restore());
|
|
1514
1467
|
}
|
|
1515
|
-
},
|
|
1468
|
+
}, bt = [
|
|
1516
1469
|
"USDJPY",
|
|
1517
1470
|
"GBPJPY",
|
|
1518
1471
|
"AUDJPY",
|
|
1519
1472
|
"EURJPY",
|
|
1520
1473
|
"NZDJPY",
|
|
1521
1474
|
"CADJPY"
|
|
1522
|
-
],
|
|
1475
|
+
], xt = ["BTCUSD", "ETHUSD"], St = [
|
|
1523
1476
|
"XAUUSD",
|
|
1524
1477
|
"USOIL",
|
|
1525
1478
|
"UKOIL",
|
|
1526
1479
|
"XAGUSD"
|
|
1527
|
-
], Tt = (t) =>
|
|
1528
|
-
const n = s.split(".")[0], o = Tt(n), a =
|
|
1480
|
+
], Tt = (t) => bt.some((e) => t.includes(e.slice(3))) ? 0.01 : xt.includes(t) ? 1 : St.includes(t) ? 0.01 : 1e-4, qt = (t, e) => bt.includes(t) ? e * 6.33806 : xt.includes(t) ? e * 1 : (St.includes(t), e * 10), ut = (t, e, i, r, s) => {
|
|
1481
|
+
const n = s.split(".")[0], o = Tt(n), a = qt(n, r);
|
|
1529
1482
|
return (t === "buy" ? i - e : e - i) / o * a;
|
|
1530
|
-
},
|
|
1483
|
+
}, H = class w {
|
|
1531
1484
|
static defaultLongConfig = {
|
|
1532
1485
|
defaultWidthCandles: 10,
|
|
1533
1486
|
defaultStopLossPercent: 0.25,
|
|
@@ -1543,32 +1496,26 @@ var U = () => typeof crypto < "u" && "randomUUID" in crypto ? crypto.randomUUID(
|
|
|
1543
1496
|
midLineColor: "#808080",
|
|
1544
1497
|
midLineOpacity: 0.9,
|
|
1545
1498
|
midLineWidth: 1,
|
|
1546
|
-
midLineStyle: "dashed"
|
|
1547
|
-
handleColor: "#ffffff",
|
|
1548
|
-
handleBorderColor: "#2962ff",
|
|
1549
|
-
handleBorderThickness: 1.5,
|
|
1550
|
-
handleRadius: 5,
|
|
1551
|
-
hoverLineWidth: 2,
|
|
1552
|
-
selectedLineWidth: 2
|
|
1499
|
+
midLineStyle: "dashed"
|
|
1553
1500
|
};
|
|
1554
|
-
static defaultShortConfig = { ...
|
|
1555
|
-
static draw({ ctx: e, activeSymbol: i, shape: r, converter: s, config: n = r.type === "longPosition" ?
|
|
1556
|
-
const l =
|
|
1557
|
-
e.save(), e.fillStyle =
|
|
1558
|
-
const d =
|
|
1559
|
-
e.strokeStyle =
|
|
1501
|
+
static defaultShortConfig = { ...w.defaultLongConfig };
|
|
1502
|
+
static draw({ ctx: e, activeSymbol: i, shape: r, converter: s, config: n = r.type === "longPosition" ? w.defaultLongConfig : w.defaultShortConfig, selected: o = !1, hovered: a = !1 }) {
|
|
1503
|
+
const l = w.getGeometry(r, s);
|
|
1504
|
+
e.save(), e.fillStyle = P(n.profitFillColor, n.profitFillOpacity), e.fillRect(l.profitBox.left, l.profitBox.top, l.profitBox.width, l.profitBox.height), e.fillStyle = P(n.lossFillColor, n.lossFillOpacity), e.fillRect(l.lossBox.left, l.lossBox.top, l.lossBox.width, l.lossBox.height);
|
|
1505
|
+
const d = n.borderWidth;
|
|
1506
|
+
e.strokeStyle = P(n.borderColor, n.borderOpacity), e.lineWidth = d, e.setLineDash(z(n.borderStyle, d)), e.strokeRect(l.box.left, l.box.top, l.box.width, l.box.height), e.beginPath(), e.strokeStyle = P(n.midLineColor, n.midLineOpacity), e.lineWidth = n.midLineWidth, e.setLineDash(z(n.midLineStyle, n.midLineWidth)), e.moveTo(l.box.left, l.entryY), e.lineTo(l.box.right, l.entryY), e.stroke(), E(e), w.drawLabels({
|
|
1560
1507
|
ctx: e,
|
|
1561
1508
|
activeSymbol: i,
|
|
1562
1509
|
shape: r,
|
|
1563
1510
|
geometry: l,
|
|
1564
1511
|
config: n
|
|
1565
|
-
}), (o || a) && V(e,
|
|
1566
|
-
fillColor:
|
|
1567
|
-
borderColor:
|
|
1568
|
-
borderThickness:
|
|
1512
|
+
}), (o || a) && V(e, w.getHandles(r, s), {
|
|
1513
|
+
fillColor: f.handleColor,
|
|
1514
|
+
borderColor: f.handleBorderColor,
|
|
1515
|
+
borderThickness: f.handleBorderThickness
|
|
1569
1516
|
}), e.restore();
|
|
1570
1517
|
}
|
|
1571
|
-
static createFromVertex({ id: e, type: i, entry: r, converter: s, config: n = i === "longPosition" ?
|
|
1518
|
+
static createFromVertex({ id: e, type: i, entry: r, converter: s, config: n = i === "longPosition" ? w.defaultLongConfig : w.defaultShortConfig }) {
|
|
1572
1519
|
const o = s.getTimeForX(s.getXForTime(r.time) + s.getCandleWidth() * n.defaultWidthCandles), a = n.defaultStopLossPercent;
|
|
1573
1520
|
return {
|
|
1574
1521
|
id: e,
|
|
@@ -1580,20 +1527,20 @@ var U = () => typeof crypto < "u" && "randomUUID" in crypto ? crypto.randomUUID(
|
|
|
1580
1527
|
};
|
|
1581
1528
|
}
|
|
1582
1529
|
static getGeometry(e, i) {
|
|
1583
|
-
const r =
|
|
1530
|
+
const r = C(e.entry, i), s = i.getXForTime(e.endTime), n = Math.min(r.x, s), o = Math.max(r.x, s), a = e.type === "longPosition", l = a ? e.takeProfitPercent : e.stopLossPercent, d = a ? e.stopLossPercent : e.takeProfitPercent, u = e.entry.price * (1 + l / 100), g = e.entry.price * (1 - d / 100), m = i.getYForPrice(u), b = i.getYForPrice(g), v = Math.min(m, b, r.y), S = Math.max(m, b, r.y), T = {
|
|
1584
1531
|
left: n,
|
|
1585
|
-
top:
|
|
1532
|
+
top: v,
|
|
1586
1533
|
right: o,
|
|
1587
1534
|
bottom: r.y,
|
|
1588
1535
|
width: o - n,
|
|
1589
|
-
height: Math.abs(r.y -
|
|
1590
|
-
},
|
|
1536
|
+
height: Math.abs(r.y - v)
|
|
1537
|
+
}, k = {
|
|
1591
1538
|
left: n,
|
|
1592
1539
|
top: r.y,
|
|
1593
1540
|
right: o,
|
|
1594
|
-
bottom:
|
|
1541
|
+
bottom: S,
|
|
1595
1542
|
width: o - n,
|
|
1596
|
-
height: Math.abs(
|
|
1543
|
+
height: Math.abs(S - r.y)
|
|
1597
1544
|
};
|
|
1598
1545
|
return {
|
|
1599
1546
|
entryPoint: r,
|
|
@@ -1603,63 +1550,63 @@ var U = () => typeof crypto < "u" && "randomUUID" in crypto ? crypto.randomUUID(
|
|
|
1603
1550
|
lowerPrice: g,
|
|
1604
1551
|
box: {
|
|
1605
1552
|
left: n,
|
|
1606
|
-
top:
|
|
1553
|
+
top: v,
|
|
1607
1554
|
right: o,
|
|
1608
|
-
bottom:
|
|
1555
|
+
bottom: S,
|
|
1609
1556
|
width: o - n,
|
|
1610
|
-
height:
|
|
1557
|
+
height: S - v
|
|
1611
1558
|
},
|
|
1612
|
-
profitBox: a ? T :
|
|
1613
|
-
lossBox: a ?
|
|
1559
|
+
profitBox: a ? T : k,
|
|
1560
|
+
lossBox: a ? k : T
|
|
1614
1561
|
};
|
|
1615
1562
|
}
|
|
1616
|
-
static getHandles(e, i
|
|
1617
|
-
const
|
|
1563
|
+
static getHandles(e, i) {
|
|
1564
|
+
const r = w.getGeometry(e, i);
|
|
1618
1565
|
return [
|
|
1619
|
-
|
|
1566
|
+
x({
|
|
1620
1567
|
shapeId: e.id,
|
|
1621
1568
|
type: "upperHeight",
|
|
1622
1569
|
point: {
|
|
1623
|
-
x:
|
|
1624
|
-
y:
|
|
1570
|
+
x: r.box.left,
|
|
1571
|
+
y: r.box.top
|
|
1625
1572
|
},
|
|
1626
|
-
radius:
|
|
1573
|
+
radius: f.handleRadius,
|
|
1627
1574
|
cursor: "ns-resize"
|
|
1628
1575
|
}),
|
|
1629
|
-
|
|
1576
|
+
x({
|
|
1630
1577
|
shapeId: e.id,
|
|
1631
1578
|
type: "lowerHeight",
|
|
1632
1579
|
point: {
|
|
1633
|
-
x:
|
|
1634
|
-
y:
|
|
1580
|
+
x: r.box.left,
|
|
1581
|
+
y: r.box.bottom
|
|
1635
1582
|
},
|
|
1636
|
-
radius:
|
|
1583
|
+
radius: f.handleRadius,
|
|
1637
1584
|
cursor: "ns-resize"
|
|
1638
1585
|
}),
|
|
1639
|
-
|
|
1586
|
+
x({
|
|
1640
1587
|
shapeId: e.id,
|
|
1641
1588
|
type: "start",
|
|
1642
1589
|
point: {
|
|
1643
|
-
x:
|
|
1644
|
-
y:
|
|
1590
|
+
x: r.entryPoint.x,
|
|
1591
|
+
y: r.entryY
|
|
1645
1592
|
},
|
|
1646
|
-
radius:
|
|
1593
|
+
radius: f.handleRadius,
|
|
1647
1594
|
cursor: "ns-resize"
|
|
1648
1595
|
}),
|
|
1649
|
-
|
|
1596
|
+
x({
|
|
1650
1597
|
shapeId: e.id,
|
|
1651
1598
|
type: "end",
|
|
1652
1599
|
point: {
|
|
1653
|
-
x:
|
|
1654
|
-
y:
|
|
1600
|
+
x: r.endX,
|
|
1601
|
+
y: r.entryY
|
|
1655
1602
|
},
|
|
1656
|
-
radius:
|
|
1603
|
+
radius: f.handleRadius,
|
|
1657
1604
|
cursor: "ew-resize"
|
|
1658
1605
|
})
|
|
1659
1606
|
];
|
|
1660
1607
|
}
|
|
1661
|
-
static hitTest({ point: e, shape: i, converter: r
|
|
1662
|
-
return
|
|
1608
|
+
static hitTest({ point: e, shape: i, converter: r }) {
|
|
1609
|
+
return w.getHandles(i, r).some((s) => j(e, s)) ? !0 : wt(e, w.getGeometry(i, r).box);
|
|
1663
1610
|
}
|
|
1664
1611
|
static move(e, i) {
|
|
1665
1612
|
return {
|
|
@@ -1681,7 +1628,7 @@ var U = () => typeof crypto < "u" && "randomUUID" in crypto ? crypto.randomUUID(
|
|
|
1681
1628
|
} : i === "end" ? {
|
|
1682
1629
|
...e,
|
|
1683
1630
|
endTime: r.time
|
|
1684
|
-
} : i === "upperHeight" ?
|
|
1631
|
+
} : i === "upperHeight" ? w.resizeUpperHeight(e, r.price) : i === "lowerHeight" ? w.resizeLowerHeight(e, r.price) : {
|
|
1685
1632
|
...e,
|
|
1686
1633
|
endTime: s.getTimeForX(s.getXForTime(e.endTime))
|
|
1687
1634
|
};
|
|
@@ -1709,13 +1656,13 @@ var U = () => typeof crypto < "u" && "randomUUID" in crypto ? crypto.randomUUID(
|
|
|
1709
1656
|
static drawLabels({ ctx: e, activeSymbol: i, shape: r, geometry: s, config: n }) {
|
|
1710
1657
|
e.save(), e.font = "11px sans-serif", e.textBaseline = "middle";
|
|
1711
1658
|
const o = r.type, a = Tt(i), l = r.entry.price * (r.takeProfitPercent / 100) / a, d = r.entry.price * (r.stopLossPercent / 100) / a, u = s.box.left + 6, g = l / d;
|
|
1712
|
-
e.fillStyle =
|
|
1659
|
+
e.fillStyle = P(n.profitFillColor, 0.95);
|
|
1713
1660
|
const m = o === "longPosition" ? s.profitBox.top + s.profitBox.height / 10 : s.profitBox.bottom - s.profitBox.height / 10;
|
|
1714
|
-
e.fillText(`${l.toFixed(2)} (${g.toFixed(2)})`, u, m), e.fillStyle =
|
|
1715
|
-
const
|
|
1716
|
-
e.fillText(d.toFixed(1), u,
|
|
1661
|
+
e.fillText(`${l.toFixed(2)} (${g.toFixed(2)})`, u, m), e.fillStyle = P(n.lossFillColor, 0.95);
|
|
1662
|
+
const b = o === "shortPosition" ? s.lossBox.top + s.lossBox.height / 10 : s.lossBox.bottom - s.lossBox.height / 10;
|
|
1663
|
+
e.fillText(d.toFixed(1), u, b);
|
|
1717
1664
|
}
|
|
1718
|
-
},
|
|
1665
|
+
}, Qt = class {
|
|
1719
1666
|
canvas;
|
|
1720
1667
|
ctx;
|
|
1721
1668
|
activeSymbol;
|
|
@@ -1729,15 +1676,18 @@ var U = () => typeof crypto < "u" && "randomUUID" in crypto ? crypto.randomUUID(
|
|
|
1729
1676
|
handleHitboxes = [];
|
|
1730
1677
|
draft = null;
|
|
1731
1678
|
dragState = null;
|
|
1679
|
+
lastTapTime = 0;
|
|
1680
|
+
lastTapShapeId = null;
|
|
1732
1681
|
onShapeAdded;
|
|
1733
1682
|
onShapeModified;
|
|
1734
1683
|
onShapeSelected;
|
|
1684
|
+
onShapeDoubleClicked;
|
|
1735
1685
|
onToolChange;
|
|
1736
1686
|
constructor(t) {
|
|
1737
1687
|
this.canvas = t.canvas;
|
|
1738
1688
|
const e = this.canvas.getContext("2d");
|
|
1739
1689
|
if (!e) throw new Error("Failed to get 2d context for ShapesLayer");
|
|
1740
|
-
this.ctx = e, this.activeSymbol = t.activeSymbol, this.candles = t.candles, this.shapes = t.shapes, this.activeTool = t.activeTool ?? null, this.config = this.mergeConfig(t.config), this.onShapeAdded = t.onShapeAdded, this.onShapeModified = t.onShapeModified, this.onShapeSelected = t.onShapeSelected, this.onToolChange = t.onToolChange;
|
|
1690
|
+
this.ctx = e, this.activeSymbol = t.activeSymbol, this.candles = t.candles, this.shapes = t.shapes, this.activeTool = t.activeTool ?? null, this.config = this.mergeConfig(t.config), this.onShapeAdded = t.onShapeAdded, this.onShapeModified = t.onShapeModified, this.onShapeSelected = t.onShapeSelected, this.onShapeDoubleClicked = t.onShapeDoubleClicked, this.onToolChange = t.onToolChange;
|
|
1741
1691
|
}
|
|
1742
1692
|
setCandles(t) {
|
|
1743
1693
|
this.candles = t;
|
|
@@ -1769,23 +1719,55 @@ var U = () => typeof crypto < "u" && "randomUUID" in crypto ? crypto.randomUUID(
|
|
|
1769
1719
|
this.drawDraft(t), this.rebuildHandleHitboxes();
|
|
1770
1720
|
}
|
|
1771
1721
|
handlePointerEvent(t) {
|
|
1772
|
-
return !this.viewport || this.candles.length === 0 ? !1 : t.type === "contextmenu" ? this.handleContextMenu() : t.type === "pointerdown" || t.type === "mousedown" ? this.handlePointerDown(t) : t.type === "pointermove" || t.type === "mousemove" ? this.handlePointerMove(t) : t.type === "pointerup" || t.type === "mouseup" ? this.handlePointerUp() : !1;
|
|
1722
|
+
return !this.viewport || this.candles.length === 0 ? !1 : t.type === "contextmenu" ? this.handleContextMenu() : t.type === "pointerdown" || t.type === "mousedown" ? this.handlePointerDown(t) : t.type === "pointermove" || t.type === "mousemove" ? this.handlePointerMove(t) : t.type === "pointerup" || t.type === "mouseup" ? this.handlePointerUp() : t.type === "dblclick" ? this.handleDoubleClick(t) : !1;
|
|
1773
1723
|
}
|
|
1774
1724
|
handleKeyboardEvent(t) {
|
|
1775
|
-
|
|
1725
|
+
if (t.key === "Escape" && this.draft?.type === "path")
|
|
1726
|
+
return this.completePathDraft(), !0;
|
|
1727
|
+
if (t.key === "Escape" && this.draft)
|
|
1728
|
+
return this.draft = null, this.setActiveToolAndEmit(null), !0;
|
|
1729
|
+
if (t.key === "Escape" && this.selectedShapeId)
|
|
1730
|
+
return this.setSelectedShapeId(null), !0;
|
|
1731
|
+
if (this.selectedShapeId && !this.draft && !this.activeTool && (t.key === "ArrowLeft" || t.key === "ArrowRight" || t.key === "ArrowUp" || t.key === "ArrowDown")) {
|
|
1732
|
+
const e = this.shapes.find((i) => i.id === this.selectedShapeId);
|
|
1733
|
+
if (e) {
|
|
1734
|
+
const i = this.getArrowKeyDelta(t.key), r = this.moveShape(e, i);
|
|
1735
|
+
return this.emitShapeModified(r), !0;
|
|
1736
|
+
}
|
|
1737
|
+
}
|
|
1738
|
+
return !1;
|
|
1739
|
+
}
|
|
1740
|
+
getArrowKeyDelta(t) {
|
|
1741
|
+
const e = q(this.candles);
|
|
1742
|
+
if (t === "ArrowLeft") return {
|
|
1743
|
+
time: -e,
|
|
1744
|
+
price: 0
|
|
1745
|
+
};
|
|
1746
|
+
if (t === "ArrowRight") return {
|
|
1747
|
+
time: e,
|
|
1748
|
+
price: 0
|
|
1749
|
+
};
|
|
1750
|
+
const i = this.viewport ? this.viewport.priceRange / this.canvas.height * 10 : 0;
|
|
1751
|
+
return t === "ArrowUp" ? {
|
|
1752
|
+
time: 0,
|
|
1753
|
+
price: i
|
|
1754
|
+
} : {
|
|
1755
|
+
time: 0,
|
|
1756
|
+
price: -i
|
|
1757
|
+
};
|
|
1776
1758
|
}
|
|
1777
1759
|
handlePointerDown(t) {
|
|
1778
|
-
const e =
|
|
1760
|
+
const e = $(this.canvas, t), i = ht(e, this.getConverter());
|
|
1779
1761
|
if (this.activeTool)
|
|
1780
|
-
return
|
|
1762
|
+
return ct(t) && this.handleToolPointerDown({
|
|
1781
1763
|
point: e,
|
|
1782
1764
|
vertex: i
|
|
1783
1765
|
}), !0;
|
|
1784
|
-
if (!
|
|
1766
|
+
if (!ct(t)) return !1;
|
|
1785
1767
|
const r = this.findHandleAtPoint(e);
|
|
1786
1768
|
if (r) {
|
|
1787
1769
|
const n = this.shapes.find((o) => o.id === r.shapeId);
|
|
1788
|
-
return n ? (this.setSelectedShapeId(n.id), this.dragState = {
|
|
1770
|
+
return n ? (this.setSelectedShapeId(n.id), this.checkTouchDoubleTap(n, t), this.dragState = {
|
|
1789
1771
|
edit: {
|
|
1790
1772
|
mode: "resize",
|
|
1791
1773
|
shape: n,
|
|
@@ -1800,7 +1782,7 @@ var U = () => typeof crypto < "u" && "randomUUID" in crypto ? crypto.randomUUID(
|
|
|
1800
1782
|
const s = this.findShapeAtPoint(e);
|
|
1801
1783
|
if (s) {
|
|
1802
1784
|
const n = this.findHandleAtPointForShape(s, e);
|
|
1803
|
-
return n ? (this.setSelectedShapeId(s.id), this.dragState = {
|
|
1785
|
+
return n ? (this.setSelectedShapeId(s.id), this.checkTouchDoubleTap(s, t), this.dragState = {
|
|
1804
1786
|
edit: {
|
|
1805
1787
|
mode: "resize",
|
|
1806
1788
|
shape: s,
|
|
@@ -1810,7 +1792,7 @@ var U = () => typeof crypto < "u" && "randomUUID" in crypto ? crypto.randomUUID(
|
|
|
1810
1792
|
startVertex: i
|
|
1811
1793
|
},
|
|
1812
1794
|
lastModifiedShape: s
|
|
1813
|
-
}, this.canvas.style.cursor = n.cursor ?? "grab", !0) : (this.setSelectedShapeId(s.id), this.hoveredShapeId = s.id, this.dragState = {
|
|
1795
|
+
}, this.canvas.style.cursor = n.cursor ?? "grab", !0) : (this.setSelectedShapeId(s.id), this.checkTouchDoubleTap(s, t), this.hoveredShapeId = s.id, this.dragState = {
|
|
1814
1796
|
edit: {
|
|
1815
1797
|
mode: "move",
|
|
1816
1798
|
shape: s,
|
|
@@ -1823,7 +1805,7 @@ var U = () => typeof crypto < "u" && "randomUUID" in crypto ? crypto.randomUUID(
|
|
|
1823
1805
|
return this.setSelectedShapeId(null), this.hoveredShapeId = null, this.canvas.style.cursor = "crosshair", !1;
|
|
1824
1806
|
}
|
|
1825
1807
|
handlePointerMove(t) {
|
|
1826
|
-
const e =
|
|
1808
|
+
const e = $(this.canvas, t), i = ht(e, this.getConverter());
|
|
1827
1809
|
if (this.draft)
|
|
1828
1810
|
return this.updateDraftPreview(i), !0;
|
|
1829
1811
|
if (this.dragState) {
|
|
@@ -1843,6 +1825,16 @@ var U = () => typeof crypto < "u" && "randomUUID" in crypto ? crypto.randomUUID(
|
|
|
1843
1825
|
const t = this.dragState.lastModifiedShape;
|
|
1844
1826
|
return this.dragState = null, this.setSelectedShapeId(t.id), this.emitShapeModified(t), !0;
|
|
1845
1827
|
}
|
|
1828
|
+
handleDoubleClick(t) {
|
|
1829
|
+
if (!this.onShapeDoubleClicked) return !1;
|
|
1830
|
+
const e = $(this.canvas, t), i = this.findShapeAtPoint(e);
|
|
1831
|
+
return i ? (this.onShapeDoubleClicked(this.createShapeSelectedPayload(i)), !0) : !1;
|
|
1832
|
+
}
|
|
1833
|
+
checkTouchDoubleTap(t, e) {
|
|
1834
|
+
if (!(e instanceof PointerEvent) || e.pointerType !== "touch") return;
|
|
1835
|
+
const i = Date.now();
|
|
1836
|
+
t.id === this.lastTapShapeId && i - this.lastTapTime < 300 && this.onShapeDoubleClicked?.(this.createShapeSelectedPayload(t)), this.lastTapTime = i, this.lastTapShapeId = t.id;
|
|
1837
|
+
}
|
|
1846
1838
|
handleContextMenu() {
|
|
1847
1839
|
return this.draft?.type === "path" ? (this.completePathDraft(), !0) : this.activeTool !== null;
|
|
1848
1840
|
}
|
|
@@ -1907,7 +1899,7 @@ var U = () => typeof crypto < "u" && "randomUUID" in crypto ? crypto.randomUUID(
|
|
|
1907
1899
|
}), this.draft = null, this.setActiveToolAndEmit(null));
|
|
1908
1900
|
}
|
|
1909
1901
|
addPositionShape(t, e) {
|
|
1910
|
-
const i = this.getConverter(), r = t === "longPosition" ? this.config.longPosition : this.config.shortPosition, s =
|
|
1902
|
+
const i = this.getConverter(), r = t === "longPosition" ? this.config.longPosition : this.config.shortPosition, s = H.createFromVertex({
|
|
1911
1903
|
id: U(),
|
|
1912
1904
|
type: t,
|
|
1913
1905
|
entry: e,
|
|
@@ -1958,10 +1950,10 @@ var U = () => typeof crypto < "u" && "randomUUID" in crypto ? crypto.randomUUID(
|
|
|
1958
1950
|
return this.resizeShape(e.shape, e.handleType, t, e.handleIndex);
|
|
1959
1951
|
}
|
|
1960
1952
|
moveShape(t, e) {
|
|
1961
|
-
return t.type === "trendline" ?
|
|
1953
|
+
return t.type === "trendline" ? M.move(t, e) : t.type === "rectangle" ? D.move(t, e) : t.type === "path" ? R.move(t, e) : t.type === "fibRetracement" ? L.move(t, e) : H.move(t, e);
|
|
1962
1954
|
}
|
|
1963
1955
|
resizeShape(t, e, i, r) {
|
|
1964
|
-
return t.type === "trendline" ?
|
|
1956
|
+
return t.type === "trendline" ? M.resize(t, e, i) : t.type === "rectangle" ? D.resize(t, e, i) : t.type === "fibRetracement" ? L.resize(t, e, i) : t.type === "path" ? R.resize(t, r ?? -1, i) : H.resize({
|
|
1965
1957
|
shape: t,
|
|
1966
1958
|
handleType: e,
|
|
1967
1959
|
vertex: i,
|
|
@@ -1971,7 +1963,7 @@ var U = () => typeof crypto < "u" && "randomUUID" in crypto ? crypto.randomUUID(
|
|
|
1971
1963
|
drawShape({ shape: t, converter: e, selected: i, hovered: r }) {
|
|
1972
1964
|
if (t.type === "trendline") {
|
|
1973
1965
|
const n = this.getTrendlineConfig(t);
|
|
1974
|
-
|
|
1966
|
+
M.draw({
|
|
1975
1967
|
ctx: this.ctx,
|
|
1976
1968
|
shape: t,
|
|
1977
1969
|
converter: e,
|
|
@@ -1983,7 +1975,7 @@ var U = () => typeof crypto < "u" && "randomUUID" in crypto ? crypto.randomUUID(
|
|
|
1983
1975
|
}
|
|
1984
1976
|
if (t.type === "rectangle") {
|
|
1985
1977
|
const n = this.getRectangleConfig(t);
|
|
1986
|
-
|
|
1978
|
+
D.draw({
|
|
1987
1979
|
ctx: this.ctx,
|
|
1988
1980
|
shape: t,
|
|
1989
1981
|
converter: e,
|
|
@@ -1995,7 +1987,7 @@ var U = () => typeof crypto < "u" && "randomUUID" in crypto ? crypto.randomUUID(
|
|
|
1995
1987
|
}
|
|
1996
1988
|
if (t.type === "path") {
|
|
1997
1989
|
const n = this.getPathConfig(t);
|
|
1998
|
-
|
|
1990
|
+
R.draw({
|
|
1999
1991
|
ctx: this.ctx,
|
|
2000
1992
|
shape: t,
|
|
2001
1993
|
converter: e,
|
|
@@ -2007,7 +1999,7 @@ var U = () => typeof crypto < "u" && "randomUUID" in crypto ? crypto.randomUUID(
|
|
|
2007
1999
|
}
|
|
2008
2000
|
if (t.type === "fibRetracement") {
|
|
2009
2001
|
const n = this.getFibRetracementConfig(t);
|
|
2010
|
-
|
|
2002
|
+
L.draw({
|
|
2011
2003
|
ctx: this.ctx,
|
|
2012
2004
|
shape: t,
|
|
2013
2005
|
converter: e,
|
|
@@ -2018,7 +2010,7 @@ var U = () => typeof crypto < "u" && "randomUUID" in crypto ? crypto.randomUUID(
|
|
|
2018
2010
|
return;
|
|
2019
2011
|
}
|
|
2020
2012
|
const s = this.getPositionConfig(t);
|
|
2021
|
-
|
|
2013
|
+
H.draw({
|
|
2022
2014
|
ctx: this.ctx,
|
|
2023
2015
|
activeSymbol: this.activeSymbol,
|
|
2024
2016
|
shape: t,
|
|
@@ -2031,7 +2023,7 @@ var U = () => typeof crypto < "u" && "randomUUID" in crypto ? crypto.randomUUID(
|
|
|
2031
2023
|
drawDraft(t) {
|
|
2032
2024
|
if (this.draft) {
|
|
2033
2025
|
if (this.draft.type === "trendline") {
|
|
2034
|
-
|
|
2026
|
+
M.drawDraft({
|
|
2035
2027
|
ctx: this.ctx,
|
|
2036
2028
|
vertices: this.draft.vertices,
|
|
2037
2029
|
converter: t,
|
|
@@ -2040,7 +2032,7 @@ var U = () => typeof crypto < "u" && "randomUUID" in crypto ? crypto.randomUUID(
|
|
|
2040
2032
|
return;
|
|
2041
2033
|
}
|
|
2042
2034
|
if (this.draft.type === "rectangle") {
|
|
2043
|
-
|
|
2035
|
+
D.drawDraft({
|
|
2044
2036
|
ctx: this.ctx,
|
|
2045
2037
|
vertices: this.draft.vertices,
|
|
2046
2038
|
converter: t,
|
|
@@ -2049,7 +2041,7 @@ var U = () => typeof crypto < "u" && "randomUUID" in crypto ? crypto.randomUUID(
|
|
|
2049
2041
|
return;
|
|
2050
2042
|
}
|
|
2051
2043
|
if (this.draft.type === "fibRetracement") {
|
|
2052
|
-
|
|
2044
|
+
L.drawDraft({
|
|
2053
2045
|
ctx: this.ctx,
|
|
2054
2046
|
vertices: this.draft.vertices,
|
|
2055
2047
|
converter: t,
|
|
@@ -2057,7 +2049,7 @@ var U = () => typeof crypto < "u" && "randomUUID" in crypto ? crypto.randomUUID(
|
|
|
2057
2049
|
});
|
|
2058
2050
|
return;
|
|
2059
2051
|
}
|
|
2060
|
-
this.draft.type === "path" &&
|
|
2052
|
+
this.draft.type === "path" && R.drawDraft({
|
|
2061
2053
|
ctx: this.ctx,
|
|
2062
2054
|
vertices: this.draft.vertices,
|
|
2063
2055
|
previewVertex: this.draft.previewVertex,
|
|
@@ -2075,18 +2067,18 @@ var U = () => typeof crypto < "u" && "randomUUID" in crypto ? crypto.randomUUID(
|
|
|
2075
2067
|
i && e.push(i), r && e.push(r), this.handleHitboxes = e.flatMap((s) => this.getShapeHandles(s, t));
|
|
2076
2068
|
}
|
|
2077
2069
|
getShapeHandles(t, e) {
|
|
2078
|
-
return t.type === "trendline" ?
|
|
2070
|
+
return t.type === "trendline" ? M.getHandles(t, e) : t.type === "rectangle" ? D.getHandles(t, e) : t.type === "path" ? R.getHandles(t, e) : t.type === "fibRetracement" ? L.getHandles(t, e) : H.getHandles(t, e);
|
|
2079
2071
|
}
|
|
2080
2072
|
findHandleAtPoint(t) {
|
|
2081
2073
|
for (let e = this.handleHitboxes.length - 1; e >= 0; e -= 1) {
|
|
2082
2074
|
const i = this.handleHitboxes[e];
|
|
2083
|
-
if (
|
|
2075
|
+
if (j(t, i)) return i;
|
|
2084
2076
|
}
|
|
2085
2077
|
return null;
|
|
2086
2078
|
}
|
|
2087
2079
|
findHandleAtPointForShape(t, e) {
|
|
2088
2080
|
const i = this.getConverter(), r = this.getShapeHandles(t, i);
|
|
2089
|
-
for (const s of r) if (
|
|
2081
|
+
for (const s of r) if (j(e, s)) return s;
|
|
2090
2082
|
return null;
|
|
2091
2083
|
}
|
|
2092
2084
|
findShapeAtPoint(t) {
|
|
@@ -2098,28 +2090,27 @@ var U = () => typeof crypto < "u" && "randomUUID" in crypto ? crypto.randomUUID(
|
|
|
2098
2090
|
return null;
|
|
2099
2091
|
}
|
|
2100
2092
|
isShapeHit(t, e, i) {
|
|
2101
|
-
return t.type === "trendline" ?
|
|
2093
|
+
return t.type === "trendline" ? M.hitTest({
|
|
2102
2094
|
point: e,
|
|
2103
2095
|
shape: t,
|
|
2104
2096
|
converter: i
|
|
2105
|
-
}) : t.type === "rectangle" ?
|
|
2097
|
+
}) : t.type === "rectangle" ? D.hitTest({
|
|
2106
2098
|
point: e,
|
|
2107
2099
|
shape: t,
|
|
2108
2100
|
converter: i
|
|
2109
|
-
}) : t.type === "path" ?
|
|
2101
|
+
}) : t.type === "path" ? R.hitTest({
|
|
2110
2102
|
point: e,
|
|
2111
2103
|
shape: t,
|
|
2112
2104
|
converter: i
|
|
2113
|
-
}) : t.type === "fibRetracement" ?
|
|
2105
|
+
}) : t.type === "fibRetracement" ? L.hitTest({
|
|
2114
2106
|
point: e,
|
|
2115
2107
|
shape: t,
|
|
2116
2108
|
converter: i,
|
|
2117
2109
|
config: this.getFibRetracementConfig(t)
|
|
2118
|
-
}) :
|
|
2110
|
+
}) : H.hitTest({
|
|
2119
2111
|
point: e,
|
|
2120
2112
|
shape: t,
|
|
2121
|
-
converter: i
|
|
2122
|
-
config: this.getPositionConfig(t)
|
|
2113
|
+
converter: i
|
|
2123
2114
|
});
|
|
2124
2115
|
}
|
|
2125
2116
|
setSelectedShapeId(t) {
|
|
@@ -2204,7 +2195,7 @@ var U = () => typeof crypto < "u" && "randomUUID" in crypto ? crypto.randomUUID(
|
|
|
2204
2195
|
getNearestCandleTimeForX: (e) => {
|
|
2205
2196
|
const i = this.getTimeForX(e);
|
|
2206
2197
|
if (this.candles.length > 0 && i > this.candles[this.candles.length - 1].time) return i;
|
|
2207
|
-
const r =
|
|
2198
|
+
const r = Z(this.candles, i);
|
|
2208
2199
|
return r >= 0 ? this.candles[r].time : i;
|
|
2209
2200
|
},
|
|
2210
2201
|
getCandleWidth: () => t ? this.getCandleStepWidth(t) : 12
|
|
@@ -2213,19 +2204,19 @@ var U = () => typeof crypto < "u" && "randomUUID" in crypto ? crypto.randomUUID(
|
|
|
2213
2204
|
getXForTime(t) {
|
|
2214
2205
|
if (!this.viewport || this.candles.length === 0) return 0;
|
|
2215
2206
|
if (t > this.candles[this.candles.length - 1].time) {
|
|
2216
|
-
const i =
|
|
2207
|
+
const i = q(this.candles);
|
|
2217
2208
|
return (t - this.candles[0].time) / i * this.viewport.candleSpacing + this.viewport.offsetX + this.viewport.candleWidth / 2;
|
|
2218
2209
|
}
|
|
2219
|
-
const e =
|
|
2210
|
+
const e = Z(this.candles, t);
|
|
2220
2211
|
return e < 0 ? 0 : e * this.viewport.candleSpacing + this.viewport.offsetX + this.viewport.candleWidth / 2;
|
|
2221
2212
|
}
|
|
2222
2213
|
getTimeForX(t) {
|
|
2223
2214
|
if (!this.viewport) return Date.now();
|
|
2224
2215
|
const e = Math.round((t - this.viewport.offsetX - this.viewport.candleWidth / 2) / this.viewport.candleSpacing);
|
|
2225
|
-
return e >= 0 && e < this.candles.length ? this.candles[e].time : this.candles.length === 0 ? Date.now() :
|
|
2216
|
+
return e >= 0 && e < this.candles.length ? this.candles[e].time : this.candles.length === 0 ? Date.now() : Zt(this.candles, this.candles[0].time, e);
|
|
2226
2217
|
}
|
|
2227
2218
|
getYForPrice(t) {
|
|
2228
|
-
return this.viewport ?
|
|
2219
|
+
return this.viewport ? O({
|
|
2229
2220
|
price: t,
|
|
2230
2221
|
minPrice: this.viewport.minPrice,
|
|
2231
2222
|
priceRange: this.viewport.priceRange,
|
|
@@ -2233,7 +2224,7 @@ var U = () => typeof crypto < "u" && "randomUUID" in crypto ? crypto.randomUUID(
|
|
|
2233
2224
|
}) : this.canvas.height / 2;
|
|
2234
2225
|
}
|
|
2235
2226
|
getPriceForY(t) {
|
|
2236
|
-
return this.viewport ?
|
|
2227
|
+
return this.viewport ? mt({
|
|
2237
2228
|
y: t,
|
|
2238
2229
|
minPrice: this.viewport.minPrice,
|
|
2239
2230
|
priceRange: this.viewport.priceRange,
|
|
@@ -2246,33 +2237,33 @@ var U = () => typeof crypto < "u" && "randomUUID" in crypto ? crypto.randomUUID(
|
|
|
2246
2237
|
mergeConfig(t) {
|
|
2247
2238
|
return {
|
|
2248
2239
|
trendline: {
|
|
2249
|
-
...
|
|
2240
|
+
...M.defaultConfig,
|
|
2250
2241
|
...t?.trendline ?? {}
|
|
2251
2242
|
},
|
|
2252
2243
|
rectangle: {
|
|
2253
|
-
...
|
|
2244
|
+
...D.defaultConfig,
|
|
2254
2245
|
...t?.rectangle ?? {}
|
|
2255
2246
|
},
|
|
2256
2247
|
path: {
|
|
2257
|
-
...
|
|
2248
|
+
...R.defaultConfig,
|
|
2258
2249
|
...t?.path ?? {}
|
|
2259
2250
|
},
|
|
2260
2251
|
fibRetracement: {
|
|
2261
|
-
...
|
|
2252
|
+
...L.defaultConfig,
|
|
2262
2253
|
...t?.fibRetracement ?? {},
|
|
2263
|
-
levels: t?.fibRetracement?.levels ??
|
|
2254
|
+
levels: t?.fibRetracement?.levels ?? L.defaultConfig.levels
|
|
2264
2255
|
},
|
|
2265
2256
|
shortPosition: {
|
|
2266
|
-
...
|
|
2257
|
+
...H.defaultShortConfig,
|
|
2267
2258
|
...t?.shortPosition ?? {}
|
|
2268
2259
|
},
|
|
2269
2260
|
longPosition: {
|
|
2270
|
-
...
|
|
2261
|
+
...H.defaultLongConfig,
|
|
2271
2262
|
...t?.longPosition ?? {}
|
|
2272
2263
|
}
|
|
2273
2264
|
};
|
|
2274
2265
|
}
|
|
2275
|
-
},
|
|
2266
|
+
}, te = class {
|
|
2276
2267
|
#t;
|
|
2277
2268
|
#e;
|
|
2278
2269
|
isDragging;
|
|
@@ -2473,7 +2464,7 @@ var U = () => typeof crypto < "u" && "randomUUID" in crypto ? crypto.randomUUID(
|
|
|
2473
2464
|
if (t === "startPrice") return this.formatPnlLabel(e.pnl);
|
|
2474
2465
|
const i = t === "stopLoss" ? e.sl : e.tp;
|
|
2475
2466
|
if (!i) return "N/A";
|
|
2476
|
-
const r =
|
|
2467
|
+
const r = ut(e.type, e.openPrice, i, e.volume, e.symbol);
|
|
2477
2468
|
return this.formatPnlLabel(r);
|
|
2478
2469
|
}
|
|
2479
2470
|
getHandleWidth(t) {
|
|
@@ -2580,10 +2571,10 @@ var U = () => typeof crypto < "u" && "randomUUID" in crypto ? crypto.randomUUID(
|
|
|
2580
2571
|
}
|
|
2581
2572
|
drawClosedTradeArrow({ x: t, y: e, type: i, width: r, height: s, config: n }) {
|
|
2582
2573
|
if (r <= 0 || s <= 0) return;
|
|
2583
|
-
const o = this.#e, a = i === "buy", l = a ? n.buyColor : n.sellColor, d = a ? n.buyBorderColor : n.sellBorderColor, u = a ? 1 : -1, g = t, m = e,
|
|
2584
|
-
o.beginPath(), o.moveTo(
|
|
2574
|
+
const o = this.#e, a = i === "buy", l = a ? n.buyColor : n.sellColor, d = a ? n.buyBorderColor : n.sellBorderColor, u = a ? 1 : -1, g = t, m = e, b = t, v = e + u * s, S = s / 2, T = S / Math.SQRT2, k = S / Math.SQRT2, Ht = g - T, kt = g + T, tt = m + u * k, et = Math.max(1, n.shaftWidthRatio), Mt = et + n.borderWidth * 2, it = () => {
|
|
2575
|
+
o.beginPath(), o.moveTo(b, v), o.lineTo(g, m), o.moveTo(g, m), o.lineTo(Ht, tt), o.moveTo(g, m), o.lineTo(kt, tt), o.stroke();
|
|
2585
2576
|
};
|
|
2586
|
-
o.save(), o.globalAlpha = n.opacity, o.lineCap = "round", o.lineJoin = "round", o.strokeStyle = d, o.lineWidth =
|
|
2577
|
+
o.save(), o.globalAlpha = n.opacity, o.lineCap = "round", o.lineJoin = "round", o.strokeStyle = d, o.lineWidth = Mt, it(), o.strokeStyle = l, o.lineWidth = et, it(), o.restore();
|
|
2587
2578
|
}
|
|
2588
2579
|
getTimeX(t) {
|
|
2589
2580
|
if (!this.viewport || this.candles.length === 0 || !Number.isFinite(t)) return null;
|
|
@@ -2643,7 +2634,7 @@ var U = () => typeof crypto < "u" && "randomUUID" in crypto ? crypto.randomUUID(
|
|
|
2643
2634
|
};
|
|
2644
2635
|
}
|
|
2645
2636
|
getPriceY(t, e) {
|
|
2646
|
-
return
|
|
2637
|
+
return O({
|
|
2647
2638
|
price: t,
|
|
2648
2639
|
minPrice: e.minPrice,
|
|
2649
2640
|
priceRange: e.priceRange,
|
|
@@ -2882,7 +2873,7 @@ var U = () => typeof crypto < "u" && "randomUUID" in crypto ? crypto.randomUUID(
|
|
|
2882
2873
|
}), s.save(), s.globalAlpha = r.backgroundOpacity, s.fillStyle = r.backgroundColor, s.fillRect(t, e, i, r.height), s.globalAlpha = r.borderOpacity, s.strokeStyle = r.borderColor, s.lineWidth = r.borderWidth, s.strokeRect(t, e, i, r.height), s.restore();
|
|
2883
2874
|
}
|
|
2884
2875
|
drawTemporaryProtectionPnLLabel({ trade: t, type: e, price: i, handleX: r, y: s, handleWidth: n, handleConfig: o }) {
|
|
2885
|
-
const a = this.#e, l =
|
|
2876
|
+
const a = this.#e, l = ut(t.type, t.openPrice, i, t.volume, t.symbol), d = this.formatPnlLabel(l), u = r + n / 2;
|
|
2886
2877
|
a.save(), a.font = o.font, a.textBaseline = "middle", a.globalAlpha = o.textOpacity, a.fillStyle = this.getProtectionPnlTextColor(e), a.fillText(d, u - a.measureText(d).width / 2, s), a.restore();
|
|
2887
2878
|
}
|
|
2888
2879
|
clearRectArea({ x: t, y: e, width: i, height: r, padding: s = 0 }) {
|
|
@@ -2911,11 +2902,11 @@ var U = () => typeof crypto < "u" && "randomUUID" in crypto ? crypto.randomUUID(
|
|
|
2911
2902
|
formatPnlLabel(t) {
|
|
2912
2903
|
return `${t >= 0 ? "+" : ""}${t.toFixed(2)}`;
|
|
2913
2904
|
}
|
|
2914
|
-
},
|
|
2905
|
+
}, ee = [
|
|
2915
2906
|
"pointerdown",
|
|
2916
2907
|
"pointermove",
|
|
2917
2908
|
"pointerup"
|
|
2918
|
-
],
|
|
2909
|
+
], ie = class {
|
|
2919
2910
|
#t;
|
|
2920
2911
|
#e;
|
|
2921
2912
|
#r;
|
|
@@ -2947,7 +2938,7 @@ var U = () => typeof crypto < "u" && "randomUUID" in crypto ? crypto.randomUUID(
|
|
|
2947
2938
|
return i ? this.handleHoveredHitbox(t, i, e) : (this.resetCursorIfIdle(), !1);
|
|
2948
2939
|
}
|
|
2949
2940
|
isSupportedEventType(t) {
|
|
2950
|
-
return
|
|
2941
|
+
return ee.includes(t);
|
|
2951
2942
|
}
|
|
2952
2943
|
getCanvasMousePoint(t) {
|
|
2953
2944
|
const e = this.#t.getBoundingClientRect(), i = this.#t.width / e.width, r = this.#t.height / e.height;
|
|
@@ -3079,7 +3070,7 @@ var U = () => typeof crypto < "u" && "randomUUID" in crypto ? crypto.randomUUID(
|
|
|
3079
3070
|
consumeEvent(t) {
|
|
3080
3071
|
t.stopPropagation(), t.preventDefault();
|
|
3081
3072
|
}
|
|
3082
|
-
},
|
|
3073
|
+
}, re = class {
|
|
3083
3074
|
#t;
|
|
3084
3075
|
#e;
|
|
3085
3076
|
candles;
|
|
@@ -3165,19 +3156,19 @@ var U = () => typeof crypto < "u" && "randomUUID" in crypto ? crypto.randomUUID(
|
|
|
3165
3156
|
clearCanvas() {
|
|
3166
3157
|
this.#e.clearRect(0, 0, this.#t.width, this.#t.height);
|
|
3167
3158
|
}
|
|
3168
|
-
},
|
|
3159
|
+
}, A = (t) => {
|
|
3169
3160
|
const e = document.createElement("canvas");
|
|
3170
3161
|
return e.className = t, e;
|
|
3171
|
-
},
|
|
3162
|
+
}, se = (t, e) => {
|
|
3172
3163
|
const i = document.createElement("div");
|
|
3173
3164
|
i.className = "trading-reload-chart", i.style.backgroundColor = e, i.tabIndex = 0;
|
|
3174
3165
|
const r = document.createElement("div");
|
|
3175
3166
|
r.className = "trading-reload-chart__layout";
|
|
3176
3167
|
const s = document.createElement("div");
|
|
3177
3168
|
s.className = "trading-reload-chart__stack";
|
|
3178
|
-
const n =
|
|
3169
|
+
const n = A("trading-reload-chart__volume"), o = A("trading-reload-chart__plot"), a = A("trading-reload-chart__shapes"), l = A("trading-reload-chart__trades"), d = A("trading-reload-chart__overlay"), u = A("trading-reload-chart__axis-x");
|
|
3179
3170
|
s.append(n, o, a, l, d, u);
|
|
3180
|
-
const g =
|
|
3171
|
+
const g = A("trading-reload-chart__axis-y");
|
|
3181
3172
|
return r.append(s, g), i.append(r), t.append(i), {
|
|
3182
3173
|
root: i,
|
|
3183
3174
|
layout: r,
|
|
@@ -3191,23 +3182,23 @@ var U = () => typeof crypto < "u" && "randomUUID" in crypto ? crypto.randomUUID(
|
|
|
3191
3182
|
axisYCanvas: g,
|
|
3192
3183
|
interactionTarget: r
|
|
3193
3184
|
};
|
|
3194
|
-
},
|
|
3185
|
+
}, gt = (t) => typeof t == "object" && t !== null && !Array.isArray(t), Lt = (t, e) => {
|
|
3195
3186
|
const i = { ...t };
|
|
3196
3187
|
for (const r of Object.keys(e)) {
|
|
3197
3188
|
const s = e[r], n = t[r];
|
|
3198
3189
|
if (s !== void 0) {
|
|
3199
|
-
if (
|
|
3200
|
-
i[r] =
|
|
3190
|
+
if (gt(s) && gt(n)) {
|
|
3191
|
+
i[r] = Lt(n, s);
|
|
3201
3192
|
continue;
|
|
3202
3193
|
}
|
|
3203
3194
|
i[r] = s;
|
|
3204
3195
|
}
|
|
3205
3196
|
}
|
|
3206
3197
|
return i;
|
|
3207
|
-
},
|
|
3198
|
+
}, ft = (t) => Lt(c, t ?? {}), pt = (t, e) => e === void 0 || t.time >= 1e12 ? t : {
|
|
3208
3199
|
...t,
|
|
3209
3200
|
time: t.time * 1e3 - e
|
|
3210
|
-
},
|
|
3201
|
+
}, ne = class {
|
|
3211
3202
|
#t;
|
|
3212
3203
|
#e;
|
|
3213
3204
|
#r;
|
|
@@ -3225,21 +3216,21 @@ var U = () => typeof crypto < "u" && "randomUUID" in crypto ? crypto.randomUUID(
|
|
|
3225
3216
|
#v = 0;
|
|
3226
3217
|
#y = !1;
|
|
3227
3218
|
#x = 0;
|
|
3228
|
-
#
|
|
3219
|
+
#S = 0;
|
|
3229
3220
|
#p = null;
|
|
3230
3221
|
#w = null;
|
|
3231
3222
|
#P = null;
|
|
3232
3223
|
constructor(t, e) {
|
|
3233
|
-
this.#t = t, this.#e = e, this.#r =
|
|
3224
|
+
this.#t = t, this.#e = e, this.#r = ft(e.config), this.#s = se(t, this.#r.colors.background), this.#h = new zt({
|
|
3234
3225
|
canvas: this.#s.overlayCanvas,
|
|
3235
3226
|
crosshairColor: this.#r.crosshair.color,
|
|
3236
3227
|
crosshairThickness: this.#r.crosshair.thickness,
|
|
3237
3228
|
crosshairStyle: this.#r.crosshair.style
|
|
3238
|
-
}), this.#R(), this.#
|
|
3229
|
+
}), this.#R(), this.#D(), this.#H(), this.updateProps(e);
|
|
3239
3230
|
}
|
|
3240
3231
|
updateProps(t) {
|
|
3241
3232
|
const e = this.#e.activeShapeTool;
|
|
3242
|
-
this.#e = t, this.#r =
|
|
3233
|
+
this.#e = t, this.#r = ft(t.config), this.#s && (this.#s.root.style.backgroundColor = this.#r.colors.background, this.#s.layout.style.setProperty("--axis-x-height", `${this.#r.axis.axisX.height}px`)), !this.#f && t.candles.length > 0 && this.#M(t.candles), this.#i && (t.activeShapeTool !== e && this.#X(t.activeShapeTool), this.#l?.setConfig(this.#r.shapes), this.#l?.setShapes(t.shapes), this.#l?.setActiveTool(t.activeShapeTool), this.#u?.setConfig(this.#r.shapes.previousDayHighLow ?? null), this.#u?.setPreviousDay(t.previousDay), this.#n?.setClosedTrades(t.closedTrades ?? []), this.#b(), this.#B(), this.#g());
|
|
3243
3234
|
}
|
|
3244
3235
|
resetChartView() {
|
|
3245
3236
|
this.#i?.resetView(), this.#g();
|
|
@@ -3249,8 +3240,8 @@ var U = () => typeof crypto < "u" && "randomUUID" in crypto ? crypto.randomUUID(
|
|
|
3249
3240
|
}
|
|
3250
3241
|
#M(t) {
|
|
3251
3242
|
if (!this.#s || this.#f) return;
|
|
3252
|
-
const e = t.map((r) =>
|
|
3253
|
-
this.#c = new
|
|
3243
|
+
const e = t.map((r) => pt(r, this.#e.brokerTimezoneOffsetMs));
|
|
3244
|
+
this.#c = new re({
|
|
3254
3245
|
canvas: this.#s.volumeCanvas,
|
|
3255
3246
|
candles: e,
|
|
3256
3247
|
bullishColor: this.#r.volume.bullishColor,
|
|
@@ -3259,7 +3250,7 @@ var U = () => typeof crypto < "u" && "randomUUID" in crypto ? crypto.randomUUID(
|
|
|
3259
3250
|
height: this.#r.volume.height,
|
|
3260
3251
|
bottomOffset: this.#r.volume.bottomOffset,
|
|
3261
3252
|
minBarHeight: this.#r.volume.minBarHeight
|
|
3262
|
-
}), this.#i = new
|
|
3253
|
+
}), this.#i = new _t({
|
|
3263
3254
|
canvas: this.#s.candleCanvas,
|
|
3264
3255
|
candles: e,
|
|
3265
3256
|
baseCandleWidth: this.#r.candles.defaultWidth,
|
|
@@ -3269,7 +3260,7 @@ var U = () => typeof crypto < "u" && "randomUUID" in crypto ? crypto.randomUUID(
|
|
|
3269
3260
|
autoFollowLatestCandle: this.#r.candles.autoFollowLatestCandle,
|
|
3270
3261
|
autoFollowThresholdCandles: this.#r.candles.autoFollowThresholdCandles,
|
|
3271
3262
|
rightOffsetCandles: this.#r.candles.rightOffsetCandles
|
|
3272
|
-
}), this.#l = new
|
|
3263
|
+
}), this.#l = new Qt({
|
|
3273
3264
|
canvas: this.#s.shapesCanvas,
|
|
3274
3265
|
activeSymbol: this.#e.activeSymbol,
|
|
3275
3266
|
candles: e,
|
|
@@ -3285,6 +3276,9 @@ var U = () => typeof crypto < "u" && "randomUUID" in crypto ? crypto.randomUUID(
|
|
|
3285
3276
|
onShapeSelected: (r) => {
|
|
3286
3277
|
this.#e.onShapeSelected?.(r);
|
|
3287
3278
|
},
|
|
3279
|
+
onShapeDoubleClicked: (r) => {
|
|
3280
|
+
this.#e.onShapeDoubleClicked?.(r);
|
|
3281
|
+
},
|
|
3288
3282
|
onToolChange: (r) => {
|
|
3289
3283
|
this.#e.onActiveShapeToolChange?.(r);
|
|
3290
3284
|
}
|
|
@@ -3293,14 +3287,14 @@ var U = () => typeof crypto < "u" && "randomUUID" in crypto ? crypto.randomUUID(
|
|
|
3293
3287
|
i && (this.#u = new Gt({
|
|
3294
3288
|
ctx: i,
|
|
3295
3289
|
config: this.#r.shapes.previousDayHighLow ?? null
|
|
3296
|
-
}), this.#u.setPreviousDay(this.#e.previousDay)), this.#n = new
|
|
3290
|
+
}), this.#u.setPreviousDay(this.#e.previousDay)), this.#n = new te({ canvas: this.#s.tradesCanvas }), this.#n.setCandles(e), this.#n.setClosedTrades(this.#e.closedTrades ?? []), this.#b(), this.#o = new Ot({
|
|
3297
3291
|
canvas: this.#s.axisXCanvas,
|
|
3298
3292
|
candles: e
|
|
3299
|
-
}), this.#d = new Vt({ canvas: this.#s.axisYCanvas }), this.#a = new
|
|
3293
|
+
}), this.#d = new Vt({ canvas: this.#s.axisYCanvas }), this.#a = new ie({
|
|
3300
3294
|
canvas: this.#s.tradesCanvas,
|
|
3301
3295
|
getHandleHitboxes: () => this.#m() ? [] : this.#n?.handleHitboxes ?? [],
|
|
3302
3296
|
getCurrentPrice: () => this.#i?.liveCandle?.close ?? 0,
|
|
3303
|
-
onDrag: (r) => this.#
|
|
3297
|
+
onDrag: (r) => this.#W(r),
|
|
3304
3298
|
onMissingProtectionDrag: (r) => this.#F(r),
|
|
3305
3299
|
onMissingProtectionDragEnd: (r) => this.#Y(r),
|
|
3306
3300
|
onMissingProtectionDragCancel: () => this.#O(),
|
|
@@ -3312,7 +3306,7 @@ var U = () => typeof crypto < "u" && "randomUUID" in crypto ? crypto.randomUUID(
|
|
|
3312
3306
|
if (!this.#s) return;
|
|
3313
3307
|
this.#P = new AbortController();
|
|
3314
3308
|
const { signal: t } = this.#P, e = this.#s.interactionTarget;
|
|
3315
|
-
e.addEventListener("pointerdown", (i) => this.#N(i), { signal: t }), e.addEventListener("pointerup", (i) => this.#
|
|
3309
|
+
e.addEventListener("pointerdown", (i) => this.#N(i), { signal: t }), e.addEventListener("pointerup", (i) => this.#G(i), { signal: t }), e.addEventListener("pointermove", (i) => this.#_(i), { signal: t }), e.addEventListener("pointerenter", (i) => this.#U(i), { signal: t }), e.addEventListener("pointerleave", () => this.#$(), { signal: t }), e.addEventListener("contextmenu", (i) => this.#J(i), { signal: t }), e.addEventListener("dblclick", (i) => this.#K(i), { signal: t }), e.addEventListener("wheel", (i) => this.#V(i), {
|
|
3316
3310
|
passive: !1,
|
|
3317
3311
|
signal: t
|
|
3318
3312
|
}), this.#s.axisYCanvas.addEventListener("wheel", (i) => this.#z(i), {
|
|
@@ -3320,12 +3314,12 @@ var U = () => typeof crypto < "u" && "randomUUID" in crypto ? crypto.randomUUID(
|
|
|
3320
3314
|
signal: t
|
|
3321
3315
|
}), document.addEventListener("keydown", (i) => this.#j(i), { signal: t });
|
|
3322
3316
|
}
|
|
3323
|
-
#
|
|
3317
|
+
#D() {
|
|
3324
3318
|
this.#w = new ResizeObserver(() => {
|
|
3325
3319
|
this.#H(), this.#g();
|
|
3326
3320
|
}), this.#w.observe(this.#t);
|
|
3327
3321
|
}
|
|
3328
|
-
#
|
|
3322
|
+
#A() {
|
|
3329
3323
|
const t = this.#r.axis.axisY.width, e = this.#r.axis.axisX.height, i = this.#t.clientWidth, r = this.#t.clientHeight;
|
|
3330
3324
|
return {
|
|
3331
3325
|
axisYWidth: t,
|
|
@@ -3339,26 +3333,26 @@ var U = () => typeof crypto < "u" && "randomUUID" in crypto ? crypto.randomUUID(
|
|
|
3339
3333
|
}
|
|
3340
3334
|
#H() {
|
|
3341
3335
|
if (!this.#s) return;
|
|
3342
|
-
const { plotWidth: t, plotHeight: e, axisYWidth: i, axisXHeight: r } = this.#
|
|
3336
|
+
const { plotWidth: t, plotHeight: e, axisYWidth: i, axisXHeight: r } = this.#A();
|
|
3343
3337
|
if (this.#i && this.#v > 0 && t !== this.#v) {
|
|
3344
3338
|
const s = t - this.#v;
|
|
3345
3339
|
this.#i.panHorizontally(s);
|
|
3346
3340
|
}
|
|
3347
3341
|
this.#v = t, this.#C(this.#s.volumeCanvas, t, e), this.#C(this.#s.candleCanvas, t, e), this.#C(this.#s.shapesCanvas, t, e), this.#C(this.#s.overlayCanvas, t, e), this.#C(this.#s.tradesCanvas, t, e), this.#C(this.#s.axisXCanvas, t, r), this.#C(this.#s.axisYCanvas, i, e);
|
|
3348
3342
|
}
|
|
3349
|
-
#
|
|
3343
|
+
#T() {
|
|
3350
3344
|
this.#i && (this.#o?.setCandles(this.#i.candles), this.#o?.setViewport(this.#i.viewport), this.#o?.render(), this.#d?.setViewport(this.#i.viewport), this.#d?.render());
|
|
3351
3345
|
}
|
|
3352
3346
|
#g() {
|
|
3353
|
-
this.#i && (this.#c?.setCandles(this.#i.candles), this.#c?.setLiveCandle(this.#i.liveCandle), this.#c?.setViewport(this.#i.viewport), this.#c?.render(), this.#i.render(), this.#l?.setCandles(this.#i.candles), this.#l?.setViewport(this.#i.viewport), this.#l?.render(), this.#u?.setViewport(this.#i.viewport), this.#u?.render(), this.#n?.setCandles(this.#i.candles), this.#n?.setViewport(this.#i.viewport), this.#n?.isDragging ? this.#n.renderLiveFeed() : this.#n?.render(), this.#
|
|
3347
|
+
this.#i && (this.#c?.setCandles(this.#i.candles), this.#c?.setLiveCandle(this.#i.liveCandle), this.#c?.setViewport(this.#i.viewport), this.#c?.render(), this.#i.render(), this.#l?.setCandles(this.#i.candles), this.#l?.setViewport(this.#i.viewport), this.#l?.render(), this.#u?.setViewport(this.#i.viewport), this.#u?.render(), this.#n?.setCandles(this.#i.candles), this.#n?.setViewport(this.#i.viewport), this.#n?.isDragging ? this.#n.renderLiveFeed() : this.#n?.render(), this.#T(), this.#h?.render());
|
|
3354
3348
|
}
|
|
3355
3349
|
#m() {
|
|
3356
3350
|
return this.#e.activeShapeTool !== null;
|
|
3357
3351
|
}
|
|
3358
|
-
#
|
|
3352
|
+
#X(t) {
|
|
3359
3353
|
t !== null && (this.#y = !1, this.#n?.setIsDragging(!1), this.#a?.cancelActiveInteraction()), this.#l?.setActiveTool(t);
|
|
3360
3354
|
}
|
|
3361
|
-
#
|
|
3355
|
+
#I() {
|
|
3362
3356
|
const t = this.#e.openTrades ?? [];
|
|
3363
3357
|
return this.#p ? t.map((e) => e.ticket !== this.#p?.ticket ? e : {
|
|
3364
3358
|
...e,
|
|
@@ -3367,15 +3361,15 @@ var U = () => typeof crypto < "u" && "randomUUID" in crypto ? crypto.randomUUID(
|
|
|
3367
3361
|
}) : t;
|
|
3368
3362
|
}
|
|
3369
3363
|
#b() {
|
|
3370
|
-
this.#n?.setTrades(this.#
|
|
3364
|
+
this.#n?.setTrades(this.#I());
|
|
3371
3365
|
}
|
|
3372
|
-
#
|
|
3366
|
+
#B() {
|
|
3373
3367
|
const t = this.#e.liveCandle;
|
|
3374
3368
|
if (!t || !this.#i) return;
|
|
3375
|
-
const e =
|
|
3369
|
+
const e = pt(t, this.#e.brokerTimezoneOffsetMs);
|
|
3376
3370
|
this.#i.updateLiveCandle(e), this.#n?.setLiveCandle(this.#i.liveCandle), this.#n?.setCandles(this.#i.candles);
|
|
3377
3371
|
}
|
|
3378
|
-
#
|
|
3372
|
+
#W({ trade: t, type: e, price: i }) {
|
|
3379
3373
|
this.#n && (this.#n.setIsDragging(!0), this.#p = {
|
|
3380
3374
|
ticket: t.ticket,
|
|
3381
3375
|
...e === "stopLoss" ? { sl: i } : {},
|
|
@@ -3410,7 +3404,7 @@ var U = () => typeof crypto < "u" && "randomUUID" in crypto ? crypto.randomUUID(
|
|
|
3410
3404
|
this.#h.updateMousePosition(t.clientX, t.clientY), this.#h.render();
|
|
3411
3405
|
return;
|
|
3412
3406
|
}
|
|
3413
|
-
const e =
|
|
3407
|
+
const e = vt(this.#s.overlayCanvas, t), i = this.#i.getNearestCandleIndexByX(e.x), r = i === null ? null : this.#i.candles[i] ?? null, s = i === null ? e.x : this.#i.getRawCandleSnapX(e.x);
|
|
3414
3408
|
this.#h.updateMousePosition(t.clientX, t.clientY, { snapX: s });
|
|
3415
3409
|
const n = this.#i.getPriceAtY(this.#h.mouseY);
|
|
3416
3410
|
this.#d?.setCrosshair({
|
|
@@ -3421,12 +3415,12 @@ var U = () => typeof crypto < "u" && "randomUUID" in crypto ? crypto.randomUUID(
|
|
|
3421
3415
|
visible: !0,
|
|
3422
3416
|
x: this.#h.mouseX,
|
|
3423
3417
|
candle: r
|
|
3424
|
-
}), this.#
|
|
3418
|
+
}), this.#T(), this.#h.render();
|
|
3425
3419
|
}
|
|
3426
|
-
#
|
|
3427
|
-
this.#h?.hide(), this.#o?.hideCrosshair(), this.#d?.hideCrosshair(), this.#
|
|
3420
|
+
#E() {
|
|
3421
|
+
this.#h?.hide(), this.#o?.hideCrosshair(), this.#d?.hideCrosshair(), this.#T(), this.#h?.render();
|
|
3428
3422
|
}
|
|
3429
|
-
#
|
|
3423
|
+
#V(t) {
|
|
3430
3424
|
if (!this.#i || !this.#n) return;
|
|
3431
3425
|
this.#m() || this.#a?.handlePointerEvent(t), t.preventDefault();
|
|
3432
3426
|
const e = t.deltaY < 0 ? 1 : -1;
|
|
@@ -3443,51 +3437,54 @@ var U = () => typeof crypto < "u" && "randomUUID" in crypto ? crypto.randomUUID(
|
|
|
3443
3437
|
this.#g();
|
|
3444
3438
|
return;
|
|
3445
3439
|
}
|
|
3446
|
-
this.#m() || this.#a?.handlePointerEvent(t) || (this.#y = !0, this.#x = t.clientX, this.#
|
|
3440
|
+
this.#m() || this.#a?.handlePointerEvent(t) || (this.#y = !0, this.#x = t.clientX, this.#S = t.clientY);
|
|
3447
3441
|
}
|
|
3448
|
-
#
|
|
3442
|
+
#_(t) {
|
|
3449
3443
|
const e = this.#l?.handlePointerEvent(t) ?? !1;
|
|
3450
3444
|
if (this.#m() || this.#a?.handlePointerEvent(t), this.#L(t), e) {
|
|
3451
3445
|
this.#g(), this.#L(t);
|
|
3452
3446
|
return;
|
|
3453
3447
|
}
|
|
3454
3448
|
if (!this.#y || !this.#i || this.#m()) return;
|
|
3455
|
-
const i = t.clientX - this.#x, r = t.clientY - this.#
|
|
3456
|
-
this.#x = t.clientX, this.#
|
|
3449
|
+
const i = t.clientX - this.#x, r = t.clientY - this.#S;
|
|
3450
|
+
this.#x = t.clientX, this.#S = t.clientY, this.#i.panHorizontally(i), this.#i.panVertically(r), this.#g(), this.#L(t);
|
|
3457
3451
|
}
|
|
3458
|
-
#
|
|
3452
|
+
#G(t) {
|
|
3459
3453
|
if (this.#y = !1, this.#l?.handlePointerEvent(t) ?? !1) {
|
|
3460
3454
|
this.#g();
|
|
3461
3455
|
return;
|
|
3462
3456
|
}
|
|
3463
3457
|
this.#m() || this.#a?.handlePointerEvent(t);
|
|
3464
3458
|
}
|
|
3465
|
-
#
|
|
3459
|
+
#U(t) {
|
|
3466
3460
|
document.body.style.cursor = "crosshair", this.#l?.handlePointerEvent(t), this.#m() || this.#a?.handlePointerEvent(t);
|
|
3467
3461
|
}
|
|
3468
3462
|
#$() {
|
|
3469
|
-
this.#l?.clearHoverState(), document.body.style.cursor = "", this.#
|
|
3463
|
+
this.#l?.clearHoverState(), document.body.style.cursor = "", this.#E();
|
|
3470
3464
|
}
|
|
3471
3465
|
#J(t) {
|
|
3472
3466
|
((this.#l?.handlePointerEvent(t) ?? !1) || this.#m()) && (t.preventDefault(), t.stopPropagation(), this.#g());
|
|
3473
3467
|
}
|
|
3468
|
+
#K(t) {
|
|
3469
|
+
this.#l?.handlePointerEvent(t);
|
|
3470
|
+
}
|
|
3474
3471
|
#j(t) {
|
|
3475
3472
|
(this.#l?.handleKeyboardEvent(t) ?? !1) && (t.preventDefault(), this.#g());
|
|
3476
3473
|
}
|
|
3477
|
-
},
|
|
3478
|
-
const s =
|
|
3479
|
-
return o.current = i,
|
|
3474
|
+
}, le = Rt(({ className: t, style: e, ...i }, r) => {
|
|
3475
|
+
const s = N(null), n = N(null), o = N(i);
|
|
3476
|
+
return o.current = i, Dt(r, () => ({ resetChartView() {
|
|
3480
3477
|
n.current?.resetChartView();
|
|
3481
|
-
} })),
|
|
3478
|
+
} })), rt(() => {
|
|
3482
3479
|
const a = s.current;
|
|
3483
3480
|
if (!a) return;
|
|
3484
|
-
const l = new
|
|
3481
|
+
const l = new ne(a, o.current);
|
|
3485
3482
|
return n.current = l, () => {
|
|
3486
3483
|
l.destroy(), n.current = null;
|
|
3487
3484
|
};
|
|
3488
|
-
}, []),
|
|
3485
|
+
}, []), rt(() => {
|
|
3489
3486
|
n.current?.updateProps(o.current);
|
|
3490
|
-
}, [i]), /* @__PURE__ */
|
|
3487
|
+
}, [i]), /* @__PURE__ */ At("div", {
|
|
3491
3488
|
ref: s,
|
|
3492
3489
|
className: t,
|
|
3493
3490
|
style: {
|
|
@@ -3499,5 +3496,5 @@ var U = () => typeof crypto < "u" && "randomUUID" in crypto ? crypto.randomUUID(
|
|
|
3499
3496
|
});
|
|
3500
3497
|
export {
|
|
3501
3498
|
c as CHART_CONFIG,
|
|
3502
|
-
|
|
3499
|
+
le as TradingReload
|
|
3503
3500
|
};
|