nick5363 commited on
Commit
5d98ac6
·
verified ·
1 Parent(s): 8df101b

Upload index.html

Browse files
Files changed (1) hide show
  1. index.html +363 -0
index.html ADDED
@@ -0,0 +1,363 @@
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
1
+ <!DOCTYPE html>
2
+ <html lang="en">
3
+ <head>
4
+ <meta charset="UTF-8">
5
+ <meta name="viewport" content="width=device-width, initial-scale=1.0">
6
+ <title>TradingView Widgets + News</title>
7
+ <style>
8
+ body {
9
+ background-color: #0f0f0f;
10
+ color: white;
11
+ font-family: -apple-system, BlinkMacSystemFont, "Segoe UI", sans-serif;
12
+ margin: 0;
13
+ padding: 0;
14
+ height: 100vh;
15
+ display: flex;
16
+ flex-direction: column;
17
+ overflow: hidden;
18
+ }
19
+ h1 {
20
+ font-size: 1.0rem;
21
+ margin: 10px 0;
22
+ text-align: center;
23
+ }
24
+ .clock-container {
25
+ margin: 2px auto;
26
+ text-align: center;
27
+ font-size: 0.4rem;
28
+ width: 100%;
29
+ max-width: 415px;
30
+ }
31
+ .clock-container a {
32
+ color: white;
33
+ text-decoration: none;
34
+ }
35
+ .market-overview {
36
+ background-color: #1a1a1a;
37
+ padding: 10px;
38
+ margin: 5px auto;
39
+ width: 100%;
40
+ max-width: 415px;
41
+ border-radius: 5px;
42
+ box-sizing: border-box;
43
+ }
44
+ .market-overview h2 {
45
+ font-size: 0.95rem;
46
+ margin: 0 0 10px 0;
47
+ }
48
+ .tab-content {
49
+ flex: 1;
50
+ overflow-y: auto;
51
+ padding: 10px;
52
+ width: 100%;
53
+ max-width: 415px;
54
+ margin: 0 auto;
55
+ box-sizing: border-box;
56
+ }
57
+ .tab-content > div {
58
+ display: none;
59
+ }
60
+ .tab-content > div.active {
61
+ display: block;
62
+ }
63
+ .tab-content iframe,
64
+ .tab-content .tradingview-widget-container {
65
+ width: 100% !important;
66
+ max-width: 415px;
67
+ margin: 0 auto;
68
+ }
69
+ .tabs {
70
+ position: fixed;
71
+ bottom: 0;
72
+ width: 100%;
73
+ background-color: #1a1a1a;
74
+ display: flex;
75
+ justify-content: space-around;
76
+ padding: 10px 0;
77
+ border-top: 1px solid #333;
78
+ }
79
+ .tabs button {
80
+ background-color: transparent;
81
+ color: #888;
82
+ border: none;
83
+ padding: 6px 2px;
84
+ cursor: pointer;
85
+ font-size: 0.75rem;
86
+ flex: 1;
87
+ margin: 0 5px;
88
+ white-space: nowrap;
89
+ }
90
+ .tabs button.active {
91
+ color: white;
92
+ font-weight: bold;
93
+ }
94
+ .tabs button:hover {
95
+ color: white;
96
+ }
97
+ @media (max-width: 430px) {
98
+ h1 {
99
+ font-size: 0.6rem;
100
+ }
101
+ .clock-container {
102
+ font-size: 0.4rem;
103
+ }
104
+ .market-overview h2 {
105
+ font-size: 1rem;
106
+ }
107
+ .tabs button {
108
+ font-size: 0.6rem;
109
+ padding: 8px 5px;
110
+ }
111
+ .tab-content .tradingview-widget-container {
112
+ height: 330px !important; /* Điều chỉnh chiều cao chart để vừa màn hình */
113
+ }
114
+ }
115
+ </style>
116
+ </head>
117
+ <body>
118
+
119
+ <h1>NhatTranView Dashboard</h1>
120
+
121
+ <div class="clock-container">
122
+ <script src="https://cdn.logwork.com/widget/digital.js"></script>
123
+ <a href="https://logwork.com/current-time-in-los-angeles-united-states-california" class="digital-clock" data-style="round" data-size="348" data-timezone="America/Los_Angeles" data-language="en">Los Angeles, United States</a>
124
+ </div>
125
+
126
+ <div class="market-overview">
127
+
128
+ <div class="tradingview-widget-container">
129
+ <div class="tradingview-widget-container__widget"></div>
130
+ <div class="tradingview-widget-copyright"><a href="https://www.tradingview.com/" rel="noopener nofollow" target="_blank"><span class="blue-text">Track all markets on TradingView</span></a></div>
131
+ <script type="text/javascript" src="https://s3.tradingview.com/external-embedding/embed-widget-ticker-tape.js" async>
132
+ {
133
+ "symbols": [
134
+ { "proName": "FOREXCOM:SPXUSD", "title": "S&P 500 Index" },
135
+ { "description": "DJI", "proName": "FOREXCOM:DJI" },
136
+ { "description": "NASDAQ", "proName": "FOREXCOM:NSXUSD" },
137
+ { "description": "BITCOIN", "proName": "INDEX:BTCUSD" },
138
+ { "description": "GOLD", "proName": "CAPITALCOM:GOLD" },
139
+ { "description": "VIX", "proName": "FXOPEN:VIX" }
140
+ ],
141
+ "showSymbolLogo": true,
142
+ "isTransparent": false,
143
+ "displayMode": "compact",
144
+ "colorTheme": "dark",
145
+ "locale": "en"
146
+ }
147
+ </script>
148
+ </div>
149
+ </div>
150
+
151
+ <div class="tab-content">
152
+ <div id="chart" class="active">
153
+
154
+ <!-- TradingView Widget BEGIN -->
155
+ <div class="tradingview-widget-container" style="height:100%;width:100%">
156
+ <div class="tradingview-widget-container__widget" style="height:calc(100% - 32px);width:100%"></div>
157
+ <div class="tradingview-widget-copyright"><a href="https://www.tradingview.com/" rel="noopener nofollow" target="_blank"><span class="blue-text">Track all markets on TradingView</span></a></div>
158
+ <script type="text/javascript" src="https://s3.tradingview.com/external-embedding/embed-widget-advanced-chart.js" async>
159
+ {
160
+ "autosize": true,
161
+ "symbol": "IG:NASDAQ",
162
+ "interval": "60",
163
+ "timezone": "America/Los_Angeles",
164
+ "theme": "light",
165
+ "style": "1",
166
+ "locale": "en",
167
+ "allow_symbol_change": true,
168
+ "save_image": false,
169
+ "studies": [
170
+ "STD;Donchian_Channels",
171
+ "STD;MACD"
172
+ ],
173
+ "hide_volume": true,
174
+ "support_host": "https://www.tradingview.com"
175
+ }
176
+ </script>
177
+ </div>
178
+ <!-- TradingView Widget END -->
179
+ </div>
180
+
181
+ <div id="futures">
182
+
183
+ <!-- TradingView Widget BEGIN -->
184
+ <div class="tradingview-widget-container">
185
+ <div class="tradingview-widget-container__widget"></div>
186
+ <div class="tradingview-widget-copyright"><a href="https://www.tradingview.com/" rel="noopener nofollow" target="_blank"><span class="blue-text">Track all markets on TradingView</span></a></div>
187
+ <script type="text/javascript" src="https://s3.tradingview.com/external-embedding/embed-widget-market-overview.js" async>
188
+ {
189
+ "colorTheme": "dark",
190
+ "dateRange": "1D",
191
+ "showChart": false,
192
+ "locale": "en",
193
+ "width": "980",
194
+ "height": "610",
195
+ "largeChartUrl": "",
196
+ "isTransparent": false,
197
+ "showSymbolLogo": true,
198
+ "showFloatingTooltip": false,
199
+ "tabs": [
200
+ {
201
+ "title": "Futures",
202
+ "symbols": [
203
+ {
204
+ "s": "VANTAGE:DJ30FT",
205
+ "d": "DOW JONES FT"
206
+ },
207
+ {
208
+ "s": "VANTAGE:SP500FT",
209
+ "d": "S&P 500 FT"
210
+ },
211
+ {
212
+ "s": "IG:NASDAQ",
213
+ "d": "NASDAQ 100 FT"
214
+ }
215
+ ],
216
+ "originalTitle": "Futures"
217
+ }
218
+ ]
219
+ }
220
+ </script>
221
+ </div>
222
+ <!-- TradingView Widget END --><!-- TradingView Widget END -->
223
+ </div>
224
+
225
+ <div id="news">
226
+
227
+ <iframe src="https://nick5363-web.hf.space" frameborder="0" width="100%" height="400"></iframe>
228
+ </div>
229
+
230
+ <div id="Expected Move">
231
+
232
+ <iframe
233
+ src="https://nick5363-nhat-tran.hf.space"
234
+ frameborder="0"
235
+ width="850"
236
+ height="450"></iframe>
237
+ </div>
238
+
239
+ <div id="ER">
240
+
241
+ <iframe
242
+ src="https://m.investing.com/earnings-calendar/"
243
+ width="100%"
244
+ height="850"
245
+ frameborder="0"
246
+ style="border: none; border-radius: 8px; background-color: #0f0f0f;">
247
+ </iframe>
248
+ </div>
249
+
250
+ <div id="heatmap">
251
+
252
+ <div class="tradingview-widget-container">
253
+ <div class="tradingview-widget-container__widget"></div>
254
+ <div class="tradingview-widget-copyright"><a href="https://www.tradingview.com/" rel="noopener nofollow" target="_blank"><span class="blue-text">Track all markets on TradingView</span></a></div>
255
+ <script type="text/javascript" src="https://s3.tradingview.com/external-embedding/embed-widget-stock-heatmap.js" async>
256
+ {
257
+ "exchanges": [],
258
+ "dataSource": "SPX500",
259
+ "grouping": "sector",
260
+ "blockSize": "market_cap_basic",
261
+ "blockColor": "change",
262
+ "locale": "en",
263
+ "symbolUrl": "",
264
+ "colorTheme": "dark",
265
+ "hasTopBar": false,
266
+ "isDataSetEnabled": false,
267
+ "isZoomEnabled": true,
268
+ "hasSymbolTooltip": true,
269
+ "isMonoSize": false,
270
+ "width": "100%",
271
+ "height": 400
272
+ }
273
+ </script>
274
+ </div>
275
+ </div>
276
+
277
+
278
+
279
+
280
+
281
+ <div id="mke" style="width: 100%; padding: 10px 0;">
282
+
283
+
284
+ <iframe
285
+ src="https://sslecal2.investing.com?ecoDayBackground=%23260707&defaultFont=%23ed5503&innerBorderColor=%23140808&borderColor=%230f0808&ecoDayFontColor=%23050101&columns=exc_flags,exc_importance,exc_event,exc_actual,exc_previous&category=_employment,_economicActivity,_inflation,_credit,_centralBanks,_confidenceIndex,_balance,_Bonds&importance=1,2,3&features=timeselector&countries=5&calType=day&timeZone=5&lang=1"
286
+ width="415"
287
+ height="500"
288
+ frameborder="0"
289
+ style="border: none;">
290
+ </iframe>
291
+
292
+ <div style="font-family: Arial, Helvetica, sans-serif; font-size: 11px; color: #999; text-align: center; margin-top: 6px;">
293
+ Real Time Economic Calendar by
294
+ <a href="https://www.investing.com/" target="_blank" style="color: #4fa2ff; font-weight: bold;">Investing.com</a>
295
+ </div>
296
+ </div>
297
+
298
+
299
+ <div id="F&G">
300
+ <div style="max-width: 415px; margin: 0 auto; padding: 10px;">
301
+
302
+ <iframe
303
+ src="https://feargreedmeter.com/fear-and-greed-index"
304
+ width="100%"
305
+ height="600"
306
+ frameborder="0"
307
+ style="border: none; border-radius: 8px; background-color: #0f0f0f;">
308
+ </iframe>
309
+ </div>
310
+ </div>
311
+
312
+ <div id="exchange-rate">
313
+
314
+ <div class="exchange-rate-content">
315
+ <script type="text/javascript" src="https://tygiausd.org/TyGiaScript/short/Widgets"></script>
316
+ <noscript>Vui lòng bật JavaScript để xem <a href="https://tygiausd.org/">tỷ giá</a></noscript>
317
+ </div>
318
+ </div>
319
+ </div>
320
+
321
+
322
+ <div class="tabs">
323
+ <button class="tab-button active" onclick="openTab('chart')">Chart</button>
324
+ <button class="tab-button" onclick="openTab('futures')">Futures</button>
325
+ <button class="tab-button" onclick="openTab('F&G')">Fear</button>
326
+ <button class="tab-button" onclick="openTab('ER')">ER</button>
327
+ <button class="tab-button" onclick="openTab('news')">News</button>
328
+ <button class="tab-button" onclick="openTab('heatmap')">Heat Map</button>
329
+ <button class="tab-button" onclick="openTab('mke')">Events</button>
330
+ <button class="tab-button" onclick="openTab('exchange-rate')">Tỷ Giá</button>
331
+ <button class="tab-button" onclick="openTab('Expected Move')">E-Move</button>
332
+ </div>
333
+
334
+ <script>
335
+ function openTab(tabName) {
336
+ // Hide all tab contents
337
+ const tabContents = document.querySelectorAll('.tab-content > div');
338
+ tabContents.forEach(content => {
339
+ content.classList.remove('active');
340
+ });
341
+
342
+ // Remove active class from all buttons
343
+ const tabButtons = document.querySelectorAll('.tab-button');
344
+ tabButtons.forEach(button => {
345
+ button.classList.remove('active');
346
+ });
347
+
348
+ // Show the selected tab content
349
+ const selectedTab = document.getElementById(tabName);
350
+ if (selectedTab) {
351
+ selectedTab.classList.add('active');
352
+ }
353
+
354
+ // Add active class to the clicked button
355
+ const clickedButton = document.querySelector(`button[onclick="openTab('${tabName}')"]`);
356
+ if (clickedButton) {
357
+ clickedButton.classList.add('active');
358
+ }
359
+ }
360
+ </script>
361
+
362
+ </body>
363
+ </html>