Add 3 files
Browse files- README.md +6 -4
- index.html +553 -19
- prompts.txt +2 -0
README.md
CHANGED
@@ -1,10 +1,12 @@
|
|
1 |
---
|
2 |
-
title:
|
3 |
-
emoji:
|
4 |
colorFrom: gray
|
5 |
-
colorTo:
|
6 |
sdk: static
|
7 |
pinned: false
|
|
|
|
|
8 |
---
|
9 |
|
10 |
-
Check out the configuration reference at https://huggingface.co/docs/hub/spaces-config-reference
|
|
|
1 |
---
|
2 |
+
title: tad
|
3 |
+
emoji: 馃惓
|
4 |
colorFrom: gray
|
5 |
+
colorTo: purple
|
6 |
sdk: static
|
7 |
pinned: false
|
8 |
+
tags:
|
9 |
+
- deepsite
|
10 |
---
|
11 |
|
12 |
+
Check out the configuration reference at https://huggingface.co/docs/hub/spaces-config-reference
|
index.html
CHANGED
@@ -1,19 +1,553 @@
|
|
1 |
-
<!
|
2 |
-
<html>
|
3 |
-
|
4 |
-
|
5 |
-
|
6 |
-
|
7 |
-
|
8 |
-
|
9 |
-
|
10 |
-
|
11 |
-
|
12 |
-
|
13 |
-
|
14 |
-
|
15 |
-
|
16 |
-
|
17 |
-
|
18 |
-
|
19 |
-
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
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>Trading Agent Dashboard</title>
|
7 |
+
<script src="https://cdn.tailwindcss.com"></script>
|
8 |
+
<script src="https://cdn.jsdelivr.net/npm/chart.js"></script>
|
9 |
+
<script src="https://cdnjs.cloudflare.com/ajax/libs/font-awesome/6.4.0/js/all.min.js"></script>
|
10 |
+
<style>
|
11 |
+
.gradient-bg {
|
12 |
+
background: linear-gradient(135deg, #1e3a8a 0%, #1e40af 100%);
|
13 |
+
}
|
14 |
+
.signal-buy {
|
15 |
+
background-color: rgba(74, 222, 128, 0.2);
|
16 |
+
border-left: 4px solid rgba(74, 222, 128, 1);
|
17 |
+
}
|
18 |
+
.signal-sell {
|
19 |
+
background-color: rgba(248, 113, 113, 0.2);
|
20 |
+
border-left: 4px solid rgba(248, 113, 113, 1);
|
21 |
+
}
|
22 |
+
.fade-in {
|
23 |
+
animation: fadeIn 0.5s ease-in-out;
|
24 |
+
}
|
25 |
+
@keyframes fadeIn {
|
26 |
+
from { opacity: 0; transform: translateY(10px); }
|
27 |
+
to { opacity: 1; transform: translateY(0); }
|
28 |
+
}
|
29 |
+
.loading-spinner {
|
30 |
+
border: 4px solid rgba(0, 0, 0, 0.1);
|
31 |
+
border-radius: 50%;
|
32 |
+
border-top: 4px solid #3b82f6;
|
33 |
+
width: 40px;
|
34 |
+
height: 40px;
|
35 |
+
animation: spin 1s linear infinite;
|
36 |
+
}
|
37 |
+
@keyframes spin {
|
38 |
+
0% { transform: rotate(0deg); }
|
39 |
+
100% { transform: rotate(360deg); }
|
40 |
+
}
|
41 |
+
</style>
|
42 |
+
</head>
|
43 |
+
<body class="bg-gray-100 font-sans">
|
44 |
+
<div class="min-h-screen">
|
45 |
+
<!-- Header -->
|
46 |
+
<header class="gradient-bg text-white shadow-lg">
|
47 |
+
<div class="container mx-auto px-4 py-6">
|
48 |
+
<div class="flex justify-between items-center">
|
49 |
+
<div>
|
50 |
+
<h1 class="text-3xl font-bold">Trading Agent Dashboard</h1>
|
51 |
+
<p class="text-blue-200">Analyze any stock with different trading strategies</p>
|
52 |
+
</div>
|
53 |
+
<div class="flex items-center space-x-4">
|
54 |
+
<div class="bg-blue-800 px-4 py-2 rounded-lg">
|
55 |
+
<span class="text-blue-200">Last updated:</span>
|
56 |
+
<span id="current-date" class="font-medium"></span>
|
57 |
+
</div>
|
58 |
+
</div>
|
59 |
+
</div>
|
60 |
+
</div>
|
61 |
+
</header>
|
62 |
+
|
63 |
+
<!-- Main Content -->
|
64 |
+
<main class="container mx-auto px-4 py-8">
|
65 |
+
<!-- Stock Search -->
|
66 |
+
<div class="bg-white rounded-xl shadow-md p-6 mb-8 fade-in">
|
67 |
+
<h2 class="text-2xl font-semibold text-gray-800 mb-4">Search for a Stock</h2>
|
68 |
+
<div class="flex flex-col md:flex-row gap-4">
|
69 |
+
<div class="flex-1">
|
70 |
+
<label for="stock-symbol" class="block text-sm font-medium text-gray-700 mb-1">Stock Symbol</label>
|
71 |
+
<div class="relative">
|
72 |
+
<input type="text" id="stock-symbol" placeholder="e.g. AAPL, MSFT, JPM"
|
73 |
+
class="w-full px-4 py-2 border border-gray-300 rounded-md focus:ring-blue-500 focus:border-blue-500">
|
74 |
+
<div id="symbol-error" class="hidden absolute inset-y-0 right-0 pr-3 flex items-center pointer-events-none">
|
75 |
+
<i class="fas fa-exclamation-circle text-red-500"></i>
|
76 |
+
</div>
|
77 |
+
</div>
|
78 |
+
<p id="symbol-error-text" class="mt-1 text-sm text-red-600 hidden">Please enter a valid stock symbol</p>
|
79 |
+
</div>
|
80 |
+
<div class="flex-1">
|
81 |
+
<label for="time-period" class="block text-sm font-medium text-gray-700 mb-1">Time Period</label>
|
82 |
+
<select id="time-period" class="w-full px-4 py-2 border border-gray-300 rounded-md focus:ring-blue-500 focus:border-blue-500">
|
83 |
+
<option value="1mo">1 Month</option>
|
84 |
+
<option value="3mo">3 Months</option>
|
85 |
+
<option value="6mo">6 Months</option>
|
86 |
+
<option value="1y" selected>1 Year</option>
|
87 |
+
<option value="2y">2 Years</option>
|
88 |
+
<option value="5y">5 Years</option>
|
89 |
+
<option value="max">Max Available</option>
|
90 |
+
</select>
|
91 |
+
</div>
|
92 |
+
<div class="flex items-end">
|
93 |
+
<button id="search-stock" class="px-6 py-2 bg-blue-600 text-white rounded-md hover:bg-blue-700 transition-colors">
|
94 |
+
<i class="fas fa-search mr-2"></i> Analyze
|
95 |
+
</button>
|
96 |
+
</div>
|
97 |
+
</div>
|
98 |
+
<div id="stock-info" class="mt-4 hidden">
|
99 |
+
<div class="flex items-center">
|
100 |
+
<div class="mr-4">
|
101 |
+
<h3 id="stock-name" class="text-xl font-semibold"></h3>
|
102 |
+
<p id="stock-symbol-display" class="text-gray-600"></p>
|
103 |
+
</div>
|
104 |
+
<div class="ml-auto">
|
105 |
+
<span id="current-price" class="text-2xl font-bold"></span>
|
106 |
+
<span id="price-change" class="ml-2 px-2 py-1 rounded-full text-sm"></span>
|
107 |
+
</div>
|
108 |
+
</div>
|
109 |
+
</div>
|
110 |
+
</div>
|
111 |
+
|
112 |
+
<!-- Loading Indicator -->
|
113 |
+
<div id="loading-indicator" class="hidden flex flex-col items-center justify-center py-12">
|
114 |
+
<div class="loading-spinner mb-4"></div>
|
115 |
+
<p class="text-gray-600">Fetching stock data and analyzing strategies...</p>
|
116 |
+
</div>
|
117 |
+
|
118 |
+
<!-- Strategy Selector -->
|
119 |
+
<div id="strategy-selector" class="bg-white rounded-xl shadow-md p-6 mb-8 fade-in hidden">
|
120 |
+
<h2 class="text-2xl font-semibold text-gray-800 mb-4">Select Trading Strategy</h2>
|
121 |
+
<div class="grid grid-cols-1 md:grid-cols-3 gap-4">
|
122 |
+
<div class="strategy-card bg-white border border-gray-200 rounded-lg p-4 hover:shadow-lg transition-shadow cursor-pointer" data-strategy="turtle">
|
123 |
+
<div class="flex items-center mb-2">
|
124 |
+
<div class="bg-green-100 p-2 rounded-full mr-3">
|
125 |
+
<i class="fas fa-turtle text-green-600"></i>
|
126 |
+
</div>
|
127 |
+
<h3 class="text-lg font-medium">Turtle Trading</h3>
|
128 |
+
</div>
|
129 |
+
<p class="text-gray-600 text-sm">Based on 20-day highs and lows for entry/exit signals</p>
|
130 |
+
</div>
|
131 |
+
<div class="strategy-card bg-white border border-gray-200 rounded-lg p-4 hover:shadow-lg transition-shadow cursor-pointer" data-strategy="moving-average">
|
132 |
+
<div class="flex items-center mb-2">
|
133 |
+
<div class="bg-blue-100 p-2 rounded-full mr-3">
|
134 |
+
<i class="fas fa-chart-line text-blue-600"></i>
|
135 |
+
</div>
|
136 |
+
<h3 class="text-lg font-medium">Moving Average</h3>
|
137 |
+
</div>
|
138 |
+
<p class="text-gray-600 text-sm">Uses short (2.5%) and long (5%) moving average crossovers</p>
|
139 |
+
</div>
|
140 |
+
<div class="strategy-card bg-white border border-gray-200 rounded-lg p-4 hover:shadow-lg transition-shadow cursor-pointer" data-strategy="comparison">
|
141 |
+
<div class="flex items-center mb-2">
|
142 |
+
<div class="bg-purple-100 p-2 rounded-full mr-3">
|
143 |
+
<i class="fas fa-balance-scale text-purple-600"></i>
|
144 |
+
</div>
|
145 |
+
<h3 class="text-lg font-medium">Strategy Comparison</h3>
|
146 |
+
</div>
|
147 |
+
<p class="text-gray-600 text-sm">Compare performance of all available strategies</p>
|
148 |
+
</div>
|
149 |
+
</div>
|
150 |
+
</div>
|
151 |
+
|
152 |
+
<!-- Dashboard Content -->
|
153 |
+
<div id="dashboard-content">
|
154 |
+
<!-- Default view (Turtle Trading) -->
|
155 |
+
<div class="strategy-view" id="turtle-view">
|
156 |
+
<!-- Performance Metrics -->
|
157 |
+
<div class="grid grid-cols-1 md:grid-cols-4 gap-4 mb-8">
|
158 |
+
<div class="bg-white rounded-lg shadow p-4">
|
159 |
+
<div class="flex items-center">
|
160 |
+
<div class="bg-green-100 p-3 rounded-full mr-3">
|
161 |
+
<i class="fas fa-dollar-sign text-green-600"></i>
|
162 |
+
</div>
|
163 |
+
<div>
|
164 |
+
<p class="text-gray-500 text-sm">Initial Capital</p>
|
165 |
+
<h3 class="text-xl font-semibold">$10,000</h3>
|
166 |
+
</div>
|
167 |
+
</div>
|
168 |
+
</div>
|
169 |
+
<div class="bg-white rounded-lg shadow p-4">
|
170 |
+
<div class="flex items-center">
|
171 |
+
<div class="bg-blue-100 p-3 rounded-full mr-3">
|
172 |
+
<i class="fas fa-chart-bar text-blue-600"></i>
|
173 |
+
</div>
|
174 |
+
<div>
|
175 |
+
<p class="text-gray-500 text-sm">Final Balance</p>
|
176 |
+
<h3 class="text-xl font-semibold" id="turtle-final-balance">$12,450</h3>
|
177 |
+
</div>
|
178 |
+
</div>
|
179 |
+
</div>
|
180 |
+
<div class="bg-white rounded-lg shadow p-4">
|
181 |
+
<div class="flex items-center">
|
182 |
+
<div class="bg-purple-100 p-3 rounded-full mr-3">
|
183 |
+
<i class="fas fa-percentage text-purple-600"></i>
|
184 |
+
</div>
|
185 |
+
<div>
|
186 |
+
<p class="text-gray-500 text-sm">Return</p>
|
187 |
+
<h3 class="text-xl font-semibold" id="turtle-return">24.5%</h3>
|
188 |
+
</div>
|
189 |
+
</div>
|
190 |
+
</div>
|
191 |
+
<div class="bg-white rounded-lg shadow p-4">
|
192 |
+
<div class="flex items-center">
|
193 |
+
<div class="bg-yellow-100 p-3 rounded-full mr-3">
|
194 |
+
<i class="fas fa-exchange-alt text-yellow-600"></i>
|
195 |
+
</div>
|
196 |
+
<div>
|
197 |
+
<p class="text-gray-500 text-sm">Total Trades</p>
|
198 |
+
<h3 class="text-xl font-semibold" id="turtle-trades">18</h3>
|
199 |
+
</div>
|
200 |
+
</div>
|
201 |
+
</div>
|
202 |
+
</div>
|
203 |
+
|
204 |
+
<!-- Price Chart with Signals -->
|
205 |
+
<div class="bg-white rounded-xl shadow-md p-6 mb-8">
|
206 |
+
<div class="flex justify-between items-center mb-4">
|
207 |
+
<h2 class="text-2xl font-semibold text-gray-800" id="turtle-chart-title">Stock Price with Turtle Trading Signals</h2>
|
208 |
+
<div class="flex space-x-2">
|
209 |
+
<button class="time-period-btn px-3 py-1 bg-blue-100 text-blue-700 rounded-md text-sm" data-period="1m">1M</button>
|
210 |
+
<button class="time-period-btn px-3 py-1 bg-blue-600 text-white rounded-md text-sm" data-period="6m">6M</button>
|
211 |
+
<button class="time-period-btn px-3 py-1 bg-blue-100 text-blue-700 rounded-md text-sm" data-period="1y">1Y</button>
|
212 |
+
<button class="time-period-btn px-3 py-1 bg-blue-100 text-blue-700 rounded-md text-sm" data-period="all">All</button>
|
213 |
+
</div>
|
214 |
+
</div>
|
215 |
+
<div class="h-96">
|
216 |
+
<canvas id="turtleChart"></canvas>
|
217 |
+
</div>
|
218 |
+
</div>
|
219 |
+
|
220 |
+
<!-- Trade Log -->
|
221 |
+
<div class="bg-white rounded-xl shadow-md p-6">
|
222 |
+
<h2 class="text-2xl font-semibold text-gray-800 mb-4">Trade Execution Log</h2>
|
223 |
+
<div class="overflow-x-auto">
|
224 |
+
<table class="min-w-full divide-y divide-gray-200">
|
225 |
+
<thead class="bg-gray-50">
|
226 |
+
<tr>
|
227 |
+
<th class="px-6 py-3 text-left text-xs font-medium text-gray-500 uppercase tracking-wider">Date</th>
|
228 |
+
<th class="px-6 py-3 text-left text-xs font-medium text-gray-500 uppercase tracking-wider">Action</th>
|
229 |
+
<th class="px-6 py-3 text-left text-xs font-medium text-gray-500 uppercase tracking-wider">Units</th>
|
230 |
+
<th class="px-6 py-3 text-left text-xs font-medium text-gray-500 uppercase tracking-wider">Price</th>
|
231 |
+
<th class="px-6 py-3 text-left text-xs font-medium text-gray-500 uppercase tracking-wider">Value</th>
|
232 |
+
<th class="px-6 py-3 text-left text-xs font-medium text-gray-500 uppercase tracking-wider">Return</th>
|
233 |
+
<th class="px-6 py-3 text-left text-xs font-medium text-gray-500 uppercase tracking-wider">Balance</th>
|
234 |
+
</tr>
|
235 |
+
</thead>
|
236 |
+
<tbody id="turtle-trades-body" class="bg-white divide-y divide-gray-200">
|
237 |
+
<!-- Trade rows will be inserted here by JavaScript -->
|
238 |
+
</tbody>
|
239 |
+
</table>
|
240 |
+
</div>
|
241 |
+
</div>
|
242 |
+
</div>
|
243 |
+
|
244 |
+
<!-- Moving Average View (hidden by default) -->
|
245 |
+
<div class="strategy-view hidden" id="moving-average-view">
|
246 |
+
<!-- Similar structure as turtle-view but for moving average strategy -->
|
247 |
+
</div>
|
248 |
+
|
249 |
+
<!-- Comparison View (hidden by default) -->
|
250 |
+
<div class="strategy-view hidden" id="comparison-view">
|
251 |
+
<!-- Similar structure but comparing both strategies -->
|
252 |
+
</div>
|
253 |
+
</div>
|
254 |
+
</main>
|
255 |
+
|
256 |
+
<!-- Footer -->
|
257 |
+
<footer class="gradient-bg text-white py-6">
|
258 |
+
<div class="container mx-auto px-4">
|
259 |
+
<div class="flex flex-col md:flex-row justify-between items-center">
|
260 |
+
<div class="mb-4 md:mb-0">
|
261 |
+
<h2 class="text-xl font-bold">Trading Agent Dashboard</h2>
|
262 |
+
<p class="text-blue-200">Machine Learning in Asset Management</p>
|
263 |
+
</div>
|
264 |
+
<div class="flex space-x-4">
|
265 |
+
<a href="#" class="text-blue-200 hover:text-white"><i class="fab fa-github fa-lg"></i></a>
|
266 |
+
<a href="#" class="text-blue-200 hover:text-white"><i class="fab fa-linkedin fa-lg"></i></a>
|
267 |
+
<a href="#" class="text-blue-200 hover:text-white"><i class="fab fa-twitter fa-lg"></i></a>
|
268 |
+
</div>
|
269 |
+
</div>
|
270 |
+
<div class="border-t border-blue-800 mt-6 pt-6 text-center text-blue-200 text-sm">
|
271 |
+
<p>漏 2023 Trading Agent Dashboard. Stock data provided by Yahoo Finance.</p>
|
272 |
+
</div>
|
273 |
+
</div>
|
274 |
+
</footer>
|
275 |
+
</div>
|
276 |
+
|
277 |
+
<script>
|
278 |
+
// Set current date
|
279 |
+
document.getElementById('current-date').textContent = new Date().toLocaleDateString('en-US', {
|
280 |
+
year: 'numeric',
|
281 |
+
month: 'long',
|
282 |
+
day: 'numeric'
|
283 |
+
});
|
284 |
+
|
285 |
+
// Strategy selector
|
286 |
+
const strategyCards = document.querySelectorAll('.strategy-card');
|
287 |
+
const strategyViews = document.querySelectorAll('.strategy-view');
|
288 |
+
|
289 |
+
strategyCards.forEach(card => {
|
290 |
+
card.addEventListener('click', function() {
|
291 |
+
// Remove active class from all cards
|
292 |
+
strategyCards.forEach(c => c.classList.remove('border-blue-500', 'ring-2', 'ring-blue-300'));
|
293 |
+
|
294 |
+
// Add active class to clicked card
|
295 |
+
this.classList.add('border-blue-500', 'ring-2', 'ring-blue-300');
|
296 |
+
|
297 |
+
// Hide all views
|
298 |
+
strategyViews.forEach(view => view.classList.add('hidden'));
|
299 |
+
|
300 |
+
// Show selected view
|
301 |
+
const strategy = this.getAttribute('data-strategy');
|
302 |
+
document.getElementById(`${strategy}-view`).classList.remove('hidden');
|
303 |
+
});
|
304 |
+
});
|
305 |
+
|
306 |
+
// Stock search functionality
|
307 |
+
document.getElementById('search-stock').addEventListener('click', function() {
|
308 |
+
const symbol = document.getElementById('stock-symbol').value.trim().toUpperCase();
|
309 |
+
const period = document.getElementById('time-period').value;
|
310 |
+
|
311 |
+
if (!symbol) {
|
312 |
+
document.getElementById('symbol-error').classList.remove('hidden');
|
313 |
+
document.getElementById('symbol-error-text').classList.remove('hidden');
|
314 |
+
return;
|
315 |
+
}
|
316 |
+
|
317 |
+
document.getElementById('symbol-error').classList.add('hidden');
|
318 |
+
document.getElementById('symbol-error-text').classList.add('hidden');
|
319 |
+
|
320 |
+
// Show loading indicator
|
321 |
+
document.getElementById('loading-indicator').classList.remove('hidden');
|
322 |
+
document.getElementById('strategy-selector').classList.add('hidden');
|
323 |
+
document.getElementById('dashboard-content').classList.add('hidden');
|
324 |
+
|
325 |
+
// Simulate API call with setTimeout (in a real app, you'd use fetch or axios)
|
326 |
+
setTimeout(() => {
|
327 |
+
// Hide loading indicator
|
328 |
+
document.getElementById('loading-indicator').classList.add('hidden');
|
329 |
+
|
330 |
+
// Show stock info
|
331 |
+
document.getElementById('stock-info').classList.remove('hidden');
|
332 |
+
document.getElementById('stock-name').textContent = `${symbol} Company Name`;
|
333 |
+
document.getElementById('stock-symbol-display').textContent = `${symbol} | NYSE`;
|
334 |
+
document.getElementById('current-price').textContent = `$152.75`;
|
335 |
+
|
336 |
+
// Random price change for demo
|
337 |
+
const changePercent = (Math.random() * 4 - 2).toFixed(2);
|
338 |
+
const changeElement = document.getElementById('price-change');
|
339 |
+
changeElement.textContent = `${changePercent}%`;
|
340 |
+
if (changePercent >= 0) {
|
341 |
+
changeElement.classList.add('bg-green-100', 'text-green-800');
|
342 |
+
} else {
|
343 |
+
changeElement.classList.add('bg-red-100', 'text-red-800');
|
344 |
+
}
|
345 |
+
|
346 |
+
// Update strategy selector and dashboard
|
347 |
+
document.getElementById('strategy-selector').classList.remove('hidden');
|
348 |
+
document.getElementById('dashboard-content').classList.remove('hidden');
|
349 |
+
|
350 |
+
// Update chart titles with the new symbol
|
351 |
+
document.getElementById('turtle-chart-title').textContent = `${symbol} Price with Turtle Trading Signals`;
|
352 |
+
|
353 |
+
// Generate random performance data for demo
|
354 |
+
const finalBalance = (10000 + Math.random() * 5000).toFixed(2);
|
355 |
+
const returnPercent = ((finalBalance - 10000) / 10000 * 100).toFixed(2);
|
356 |
+
const tradeCount = Math.floor(Math.random() * 15) + 5;
|
357 |
+
|
358 |
+
document.getElementById('turtle-final-balance').textContent = `$${finalBalance}`;
|
359 |
+
document.getElementById('turtle-return').textContent = `${returnPercent}%`;
|
360 |
+
document.getElementById('turtle-trades').textContent = tradeCount;
|
361 |
+
|
362 |
+
// Generate random trades for demo
|
363 |
+
const tradesBody = document.getElementById('turtle-trades-body');
|
364 |
+
tradesBody.innerHTML = '';
|
365 |
+
|
366 |
+
const startPrice = 100 + Math.random() * 50;
|
367 |
+
let currentBalance = 10000;
|
368 |
+
let sharesOwned = 0;
|
369 |
+
|
370 |
+
for (let i = 0; i < tradeCount; i++) {
|
371 |
+
const isBuy = i % 2 === 0;
|
372 |
+
const date = new Date();
|
373 |
+
date.setDate(date.getDate() - (tradeCount - i) * 3);
|
374 |
+
|
375 |
+
const price = (startPrice + (i * 2) + (Math.random() * 5 - 2.5)).toFixed(2);
|
376 |
+
const shares = Math.floor(Math.random() * 10) + 1;
|
377 |
+
const value = (shares * price).toFixed(2);
|
378 |
+
|
379 |
+
let returnPercent = '';
|
380 |
+
let rowClass = '';
|
381 |
+
|
382 |
+
if (isBuy) {
|
383 |
+
rowClass = 'signal-buy';
|
384 |
+
sharesOwned += shares;
|
385 |
+
currentBalance -= shares * price;
|
386 |
+
} else {
|
387 |
+
rowClass = 'signal-sell';
|
388 |
+
const buyPrice = (price - 5 - Math.random() * 5).toFixed(2);
|
389 |
+
returnPercent = (((price - buyPrice) / buyPrice) * 100).toFixed(2);
|
390 |
+
sharesOwned -= shares;
|
391 |
+
currentBalance += shares * price;
|
392 |
+
}
|
393 |
+
|
394 |
+
const row = document.createElement('tr');
|
395 |
+
row.className = rowClass;
|
396 |
+
row.innerHTML = `
|
397 |
+
<td class="px-6 py-4 whitespace-nowrap">${date.toLocaleDateString()}</td>
|
398 |
+
<td class="px-6 py-4 whitespace-nowrap">
|
399 |
+
<span class="px-2 py-1 ${isBuy ? 'bg-green-100 text-green-800' : 'bg-red-100 text-red-800'} rounded-full text-xs">
|
400 |
+
${isBuy ? 'BUY' : 'SELL'}
|
401 |
+
</span>
|
402 |
+
</td>
|
403 |
+
<td class="px-6 py-4 whitespace-nowrap">${shares}</td>
|
404 |
+
<td class="px-6 py-4 whitespace-nowrap">$${price}</td>
|
405 |
+
<td class="px-6 py-4 whitespace-nowrap">$${value}</td>
|
406 |
+
<td class="px-6 py-4 whitespace-nowrap">${returnPercent || '-'}${returnPercent ? '%' : ''}</td>
|
407 |
+
<td class="px-6 py-4 whitespace-nowrap">$${currentBalance.toFixed(2)}</td>
|
408 |
+
`;
|
409 |
+
|
410 |
+
tradesBody.appendChild(row);
|
411 |
+
}
|
412 |
+
|
413 |
+
// Update charts with new data
|
414 |
+
updateCharts(symbol, period);
|
415 |
+
|
416 |
+
}, 1500); // Simulate network delay
|
417 |
+
});
|
418 |
+
|
419 |
+
function updateCharts(symbol, period) {
|
420 |
+
// Generate random chart data based on period
|
421 |
+
let labels = [];
|
422 |
+
let prices = [];
|
423 |
+
let buySignals = [];
|
424 |
+
let sellSignals = [];
|
425 |
+
|
426 |
+
const now = new Date();
|
427 |
+
let pointCount = 20;
|
428 |
+
|
429 |
+
if (period === '1m') pointCount = 20;
|
430 |
+
else if (period === '3m') pointCount = 60;
|
431 |
+
else if (period === '6m') pointCount = 120;
|
432 |
+
else if (period === '1y') pointCount = 240;
|
433 |
+
else pointCount = 500;
|
434 |
+
|
435 |
+
let basePrice = 100 + Math.random() * 50;
|
436 |
+
|
437 |
+
for (let i = 0; i < pointCount; i++) {
|
438 |
+
const date = new Date(now);
|
439 |
+
date.setDate(date.getDate() - (pointCount - i));
|
440 |
+
|
441 |
+
labels.push(date.toLocaleDateString('en-US', { month: 'short', day: 'numeric' }));
|
442 |
+
|
443 |
+
// Random price movement
|
444 |
+
basePrice += Math.random() * 2 - 1;
|
445 |
+
prices.push(basePrice);
|
446 |
+
|
447 |
+
// Random buy/sell signals for demo
|
448 |
+
if (i > 0 && i % 5 === 0) {
|
449 |
+
buySignals.push({ x: i, y: basePrice - 2 });
|
450 |
+
sellSignals.push({ x: i + 3, y: basePrice + 2 });
|
451 |
+
} else {
|
452 |
+
buySignals.push(null);
|
453 |
+
sellSignals.push(null);
|
454 |
+
}
|
455 |
+
}
|
456 |
+
|
457 |
+
// Turtle Trading Chart
|
458 |
+
const turtleCtx = document.getElementById('turtleChart').getContext('2d');
|
459 |
+
|
460 |
+
// Destroy previous chart if it exists
|
461 |
+
if (window.turtleChart) {
|
462 |
+
window.turtleChart.destroy();
|
463 |
+
}
|
464 |
+
|
465 |
+
window.turtleChart = new Chart(turtleCtx, {
|
466 |
+
type: 'line',
|
467 |
+
data: {
|
468 |
+
labels: labels,
|
469 |
+
datasets: [
|
470 |
+
{
|
471 |
+
label: `${symbol} Close Price`,
|
472 |
+
data: prices,
|
473 |
+
borderColor: '#3b82f6',
|
474 |
+
backgroundColor: 'rgba(59, 130, 246, 0.1)',
|
475 |
+
borderWidth: 2,
|
476 |
+
fill: true,
|
477 |
+
tension: 0.1
|
478 |
+
},
|
479 |
+
{
|
480 |
+
label: 'Buy Signals',
|
481 |
+
data: buySignals,
|
482 |
+
borderColor: '#10b981',
|
483 |
+
backgroundColor: '#10b981',
|
484 |
+
borderWidth: 2,
|
485 |
+
pointRadius: 6,
|
486 |
+
pointHoverRadius: 8,
|
487 |
+
showLine: false
|
488 |
+
},
|
489 |
+
{
|
490 |
+
label: 'Sell Signals',
|
491 |
+
data: sellSignals,
|
492 |
+
borderColor: '#ef4444',
|
493 |
+
backgroundColor: '#ef4444',
|
494 |
+
borderWidth: 2,
|
495 |
+
pointRadius: 6,
|
496 |
+
pointHoverRadius: 8,
|
497 |
+
showLine: false
|
498 |
+
}
|
499 |
+
]
|
500 |
+
},
|
501 |
+
options: {
|
502 |
+
responsive: true,
|
503 |
+
maintainAspectRatio: false,
|
504 |
+
plugins: {
|
505 |
+
legend: {
|
506 |
+
position: 'top',
|
507 |
+
},
|
508 |
+
tooltip: {
|
509 |
+
mode: 'index',
|
510 |
+
intersect: false,
|
511 |
+
}
|
512 |
+
},
|
513 |
+
scales: {
|
514 |
+
y: {
|
515 |
+
beginAtZero: false,
|
516 |
+
grid: {
|
517 |
+
drawBorder: false
|
518 |
+
}
|
519 |
+
},
|
520 |
+
x: {
|
521 |
+
grid: {
|
522 |
+
display: false
|
523 |
+
}
|
524 |
+
}
|
525 |
+
}
|
526 |
+
}
|
527 |
+
});
|
528 |
+
}
|
529 |
+
|
530 |
+
// Time period buttons
|
531 |
+
document.querySelectorAll('.time-period-btn').forEach(btn => {
|
532 |
+
btn.addEventListener('click', function() {
|
533 |
+
// Update button styles
|
534 |
+
document.querySelectorAll('.time-period-btn').forEach(b => {
|
535 |
+
b.classList.remove('bg-blue-600', 'text-white');
|
536 |
+
b.classList.add('bg-blue-100', 'text-blue-700');
|
537 |
+
});
|
538 |
+
|
539 |
+
this.classList.remove('bg-blue-100', 'text-blue-700');
|
540 |
+
this.classList.add('bg-blue-600', 'text-white');
|
541 |
+
|
542 |
+
// Get current symbol and update chart
|
543 |
+
const symbol = document.getElementById('stock-symbol').value.trim().toUpperCase();
|
544 |
+
const period = this.getAttribute('data-period');
|
545 |
+
|
546 |
+
if (symbol) {
|
547 |
+
updateCharts(symbol, period);
|
548 |
+
}
|
549 |
+
});
|
550 |
+
});
|
551 |
+
</script>
|
552 |
+
<p style="border-radius: 8px; text-align: center; font-size: 12px; color: #fff; margin-top: 16px;position: fixed; left: 8px; bottom: 8px; z-index: 10; background: rgba(0, 0, 0, 0.8); padding: 4px 8px;">Made with <img src="https://enzostvs-deepsite.hf.space/logo.svg" alt="DeepSite Logo" style="width: 16px; height: 16px; vertical-align: middle;display:inline-block;margin-right:3px;filter:brightness(0) invert(1);"><a href="https://enzostvs-deepsite.hf.space" style="color: #fff;text-decoration: underline;" target="_blank" >DeepSite</a> - 馃К <a href="https://enzostvs-deepsite.hf.space?remix=MarcRyan/tad" style="color: #fff;text-decoration: underline;" target="_blank" >Remix</a></p></body>
|
553 |
+
</html>
|
prompts.txt
ADDED
@@ -0,0 +1,2 @@
|
|
|
|
|
|
|
1 |
+
## Further recommendation, test multiple frameworks, see what works better on average. ## Open source RL: https://docs.google.com/spreadsheets/d/1EeFPd-XIQ3mq_9snTlAZSsFY7Hbnmd7P5bbT8LPuMn0/edit#gid=0 import numpy as np import pandas as pd import matplotlib.pyplot as plt import seaborn as sns sns.set() This notebook is part of a series on machine learning asset managment. https://ssrn.com/abstract=3420952 I have had some enquiries about future releases, I will post future content on the FirmAI Linkedin page. !pip install yfinance --upgrade --no-cache-dir Collecting yfinance Downloading https://files.pythonhosted.org/packages/74/f8/cdfaf864e77b9f8a7688b07a3b990321e56b30bb316d7d241f584f330cd1/yfinance-0.1.43.tar.gz Requirement already satisfied, skipping upgrade: pandas>=0.24 in /usr/local/lib/python3.6/dist-packages (from yfinance) (0.24.2) Requirement already satisfied, skipping upgrade: numpy>=1.15 in /usr/local/lib/python3.6/dist-packages (from yfinance) (1.16.4) Requirement already satisfied, skipping upgrade: requests>=2.20 in /usr/local/lib/python3.6/dist-packages (from yfinance) (2.21.0) Requirement already satisfied, skipping upgrade: multitasking>=0.0.7 in /usr/local/lib/python3.6/dist-packages (from yfinance) (0.0.9) Requirement already satisfied, skipping upgrade: pytz>=2011k in /usr/local/lib/python3.6/dist-packages (from pandas>=0.24->yfinance) (2018.9) Requirement already satisfied, skipping upgrade: python-dateutil>=2.5.0 in /usr/local/lib/python3.6/dist-packages (from pandas>=0.24->yfinance) (2.5.3) Requirement already satisfied, skipping upgrade: chardet<3.1.0,>=3.0.2 in /usr/local/lib/python3.6/dist-packages (from requests>=2.20->yfinance) (3.0.4) Requirement already satisfied, skipping upgrade: idna<2.9,>=2.5 in /usr/local/lib/python3.6/dist-packages (from requests>=2.20->yfinance) (2.8) Requirement already satisfied, skipping upgrade: certifi>=2017.4.17 in /usr/local/lib/python3.6/dist-packages (from requests>=2.20->yfinance) (2019.6.16) Requirement already satisfied, skipping upgrade: urllib3<1.25,>=1.21.1 in /usr/local/lib/python3.6/dist-packages (from requests>=2.20->yfinance) (1.24.3) Requirement already satisfied, skipping upgrade: six>=1.5 in /usr/local/lib/python3.6/dist-packages (from python-dateutil>=2.5.0->pandas>=0.24->yfinance) (1.12.0) Building wheels for collected packages: yfinance Building wheel for yfinance (setup.py) ... done Stored in directory: /tmp/pip-ephem-wheel-cache-u0vc464v/wheels/e8/9b/5a/a0dc81508455c34afcf2833513c3b9de3f39662d9ee2f92612 Successfully built yfinance Installing collected packages: yfinance Successfully installed yfinance-0.1.43 ## Save future files to your drive ## In this notebook control for multiple testing import numpy as np from google.colab import drive drive.mount('/content/drive',force_remount=True) %cd "/content/drive/My Drive/FirmAI/FinML/Data/Agent Trading" Go to this URL in a browser: https://accounts.google.com/o/oauth2/auth?client_id=947318989803-6bn6qk8qdgf4n4g3pfee6491hc0brc4i.apps.googleusercontent.com&redirect_uri=urn%3Aietf%3Awg%3Aoauth%3A2.0%3Aoob&scope=email%20https%3A%2F%2Fwww.googleapis.com%2Fauth%2Fdocs.test%20https%3A%2F%2Fwww.googleapis.com%2Fauth%2Fdrive%20https%3A%2F%2Fwww.googleapis.com%2Fauth%2Fdrive.photos.readonly%20https%3A%2F%2Fwww.googleapis.com%2Fauth%2Fpeopleapi.readonly&response_type=code Enter your authorization code: 路路路路路路路路路路 Mounted at /content/drive /content/drive/My Drive/FirmAI/FinML/Data/Agent Trading from pandas_datareader import data as pdr import fix_yahoo_finance as yf yf.pdr_override() df_full = pdr.get_data_yahoo("JPM", start="2018-01-01").reset_index() df_full.to_csv('output/JPM.csv',index=False) df_full.head() df= df_full.copy() name = 'Turtle Trading Agent' count = int(np.ceil(len(df) * 0.1)) signals = pd.DataFrame(index=df.index) signals['signal'] = 0.0 signals['trend'] = df['Close'] signals['RollingMax'] = (signals.trend.shift(1).rolling(count).max()) signals['RollingMin'] = (signals.trend.shift(1).rolling(count).min()) signals.loc[signals['RollingMax'] < signals.trend, 'signal'] = -1 signals.loc[signals['RollingMin'] > signals.trend, 'signal'] = 1 signalsdef buy_stock( real_movement, signal, initial_money = 10000, max_buy = 1, max_sell = 1, ): """ real_movement = actual movement in the real world delay = how much interval you want to delay to change our decision from buy to sell, vice versa initial_state = 1 is buy, 0 is sell initial_money = 1000, ignore what kind of currency max_buy = max quantity for share to buy max_sell = max quantity for share to sell """ starting_money = initial_money states_sell = [] states_buy = [] current_inventory = 0 def buy(i, initial_money, current_inventory): shares = initial_money // real_movement[i] if shares < 1: print( 'day %d: total balances %f, not enough money to buy a unit price %f' % (i, initial_money, real_movement[i]) ) else: if shares > max_buy: buy_units = max_buy else: buy_units = shares initial_money -= buy_units * real_movement[i] current_inventory += buy_units print( 'day %d: buy %d units at price %f, total balance %f' % (i, buy_units, buy_units * real_movement[i], initial_money) ) states_buy.append(0) return initial_money, current_inventory for i in range(real_movement.shape[0] - int(0.025 * len(df))): state = signal[i] if state == 1: initial_money, current_inventory = buy( i, initial_money, current_inventory ) states_buy.append(i) elif state == -1: if current_inventory == 0: print('day %d: cannot sell anything, inventory 0' % (i)) else: if current_inventory > max_sell: sell_units = max_sell else: sell_units = current_inventory current_inventory -= sell_units total_sell = sell_units * real_movement[i] initial_money += total_sell try: invest = ( (real_movement[i] - real_movement[states_buy[-1]]) / real_movement[states_buy[-1]] ) * 100 except: invest = 0 print( 'day %d, sell %d units at price %f, investment %f %%, total balance %f,' % (i, sell_units, total_sell, invest, initial_money) ) states_sell.append(i) invest = ((initial_money - starting_money) / starting_money) * 100 total_gains = initial_money - starting_money return states_buy, states_sell, total_gains, invest df= df_full.copy() name = 'Moving Average agent' short_window = int(0.025 * len(df)) long_window = int(0.05 * len(df)) signals = pd.DataFrame(index=df.index) signals['signal'] = 0.0 signals['short_ma'] = df['Close'].rolling(window=short_window, min_periods=1, center=False).mean() signals['long_ma'] = df['Close'].rolling(window=long_window, min_periods=1, center=False).mean() signals['signal'][short_window:] = np.where(signals['short_ma'][short_window:] > signals['long_ma'][short_window:], 1.0, 0.0) signals['positions'] = signals['signal'].diff() signals def buy_stock( real_movement, signal, initial_money = 10000, max_buy = 1, max_sell = 1, ): """ real_movement = actual movement in the real world delay = how much interval you want to delay to change our decision from buy to sell, vice versa initial_state = 1 is buy, 0 is sell initial_money = 1000, ignore what kind of currency max_buy = max quantity for share to buy max_sell = max quantity for share to sell """ starting_money = initial_money states_sell = [] states_buy = [] current_inventory = 0 def buy(i, initial_money, current_inventory): shares = initial_money // real_movement[i] if shares < 1: print( 'day %d: total balances %f, not enough money to buy a unit price %f' % (i, initial_money, real_movement[i]) ) else: if shares > max_buy: buy_units = max_buy else: buy_units = shares initial_money -= buy_units * real_movement[i] current_inventory += buy_units print( 'day %d: buy %d units at price %f, total balance %f' % (i, buy_units, buy_units * real_movement[i], initial_money) ) states_buy.append(0) return initial_money, current_inventory for i in range(real_movement.shape[0] - int(0.025 * len(df))): state = signal[i] if state == 1: initial_money, current_inventory = buy( i, initial_money, current_inventory ) states_buy.append(i) elif state == -1: if current_inventory == 0: print('day %d: cannot sell anything, inventory 0' % (i)) else: if current_inventory > max_sell: sell_units = max_sell else: sell_units = current_inventory current_inventory -= sell_units total_sell = sell_units * real_movement[i] initial_money += total_sell try: invest = ( (real_movement[i] - real_movement[states_buy[-1]]) / real_movement[states_buy[-1]] ) * 100 except: invest = 0 print( 'day %d, sell %d units at price %f, investment %f %%, total balance %f,' % (i, sell_units, total_sell, invest, initial_money) ) states_sell.append(i) invest = ((initial_money - starting_money) / starting_money) * 100 total_gains = initial_money - starting_money return states_buy, states_sell, total_gains, invest
|
2 |
+
ensure i can request any stock
|