Adding Day #39

MadushankaRajapaksha · Jun 29, 2023 · ba183cb · ba183cb
1 parent 68350a0
commit ba183cb
Show file tree

Hide file tree

Showing 9 changed files with 143 additions and 1 deletion.
diff --git a/Day #39 - Tradingview Widget/Method-2/index.html b/Day #39 - Tradingview Widget/Method-2/index.html
@@ -0,0 +1,58 @@
+<!DOCTYPE html>
+<html lang="en">
+
+<head>
+    <meta charset="UTF-8">
+    <meta name="viewport" content="width=device-width, initial-scale=1.0">
+    <link rel="stylesheet" href="style.css">
+    <title>Day #39 - Tradingview Api - Method #2 | AsmrProg</title>
+</head>
+
+<body>
+
+    <!-- TradingView Widget BEGIN -->
+    <div class="tradingview-widget-container">
+        <div id="tradingview_33f92"></div>
+        <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>
+        <script type="text/javascript" src="https://s3.tradingview.com/tv.js"></script>
+        <script type="text/javascript">
+            new TradingView.widget(
+                {
+                    "autosize": true,
+                    "symbol": "BITSTAMP:BTCUSD",
+                    "interval": "D",
+                    "timezone": "Etc/UTC",
+                    "theme": "light",
+                    "style": "1",
+                    "locale": "en",
+                    "toolbar_bg": "#f1f3f6",
+                    "enable_publishing": false,
+                    "withdateranges": true,
+                    "hide_side_toolbar": false,
+                    "allow_symbol_change": true,
+                    "watchlist": [
+                        "BITSTAMP:ETHUSD",
+                        "BINANCE:BNBUSD"
+                    ],
+                    "details": true,
+                    "hotlist": true,
+                    "calendar": true,
+                    "studies": [
+                        "STD;EMA"
+                    ],
+                    "show_popup_button": true,
+                    "popup_width": "1000",
+                    "popup_height": "650",
+                    "container_id": "tradingview_33f92"
+                }
+            );
+        </script>
+    </div>
+    <!-- TradingView Widget END -->
+
+
+
+</body>
+
+</html>
diff --git a/Day #39 - Tradingview Widget/Method-2/style.css b/Day #39 - Tradingview Widget/Method-2/style.css
@@ -0,0 +1,4 @@
+#tradingview_33f92{
+    width: 100%;
+    height: 100vh;
+}
diff --git a/Day #39 - Tradingview Widget/README.md b/Day #39 - Tradingview Widget/README.md
@@ -0,0 +1,10 @@
+# Day #39
+
+### Tradingview Widget
+In this tutorial ([Open in Youtube](https://youtu.be/zAwzrIHP7wE)), I am gonna showing to you how to use tradingview widget api in javascript. Also this code is fully responsive and we show you 2 method of coding for it❗️
+
+# Screenshot
+Here we have project screenshot :
+
+![screenshot](screenshot.png)
+![screenshot](screenshot2.png)
diff --git a/Day #39 - Tradingview Widget/index.html b/Day #39 - Tradingview Widget/index.html
@@ -0,0 +1,29 @@
+<!DOCTYPE html>
+<html lang="en">
+
+<head>
+    <meta charset="UTF-8">
+    <meta name="viewport" content="width=device-width, initial-scale=1.0">
+    <link rel="stylesheet" href="style.css">
+    <title>Day #39 - Tradingview Widget | AsmrProg</title>
+</head>
+
+<body>
+
+    <div class="tradingview-widget-container">
+        <div id="chart"></div>
+        <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>
+    </div>
+
+
+    <script src="https://s3.tradingview.com/tv.js"></script>
+    <script src="index.js"></script>
+</body>
+
+</html>
diff --git a/Day #39 - Tradingview Widget/index.js b/Day #39 - Tradingview Widget/index.js
@@ -0,0 +1,30 @@
+new TradingView.widget(
+    {
+        "autosize": true,
+        "symbol": "BINANCE:BTCUSDT",
+        "interval": "240",
+        "timezzone": "Etc/Utc",
+        "theme": "dark",
+        "style": "1",
+        "locale": "en",
+        "toolbar_bg": "#f1f3f6",
+        "enable_publishing": true,
+        "withdateranges": false,
+        "hide_side_toolbar": true,
+        "allow_symbol_change": true,
+        "watchlist": [
+            "BINANCE:BTCUSDT",
+            "BINANCE:ETHUSDT"
+        ],
+        "details": true,
+        "hotlist": true,
+        "calendar": true,
+        "studies": [
+            "STD;SMA"
+        ],
+        "container_id": "chart",
+        "show_popup_button": true,
+        "popup_width": "1000",
+        "popup_height": "650"
+    }
+);
diff --git a/Day #39 - Tradingview Widget/screenshot.png b/Day #39 - Tradingview Widget/screenshot.png
diff --git a/Day #39 - Tradingview Widget/screenshot2.png b/Day #39 - Tradingview Widget/screenshot2.png
diff --git a/Day #39 - Tradingview Widget/style.css b/Day #39 - Tradingview Widget/style.css
@@ -0,0 +1,10 @@
+*{
+    margin: 0;
+    padding: 0;
+    box-sizing: border-box;
+}
+
+#chart{
+    width: 100%;
+    height: 100vh;
+}
diff --git a/README.md b/README.md
@@ -48,8 +48,9 @@ Here we have list of projects:
 36. Stock Tracker App
 37. Box Shadow Generator
 38. Movie App (TheMovieDB)
+39. Tradingview Widget
 
-## Where is rest 62 Projects
+## Where is rest 61 Projects
 
 We create a project each 3 days with voting on our <a href="https://youtube.com/@AsmrProg" target="_blank">Youtube</a> channel.
 You can vote for upcoming projects on our channel **community** page :wink: