Last 10 Commits for forexfolio.scroll.pub

commit c06fabc71d2e13fd350b77c727641455171309fa Author: root <root@hub.scroll.pub> Date: 2024-12-30 22:54:07 +0000 Subject: Initial commit diff --git a/body.html b/body.html new file mode 100644 index 0000000..2bd11bf --- /dev/null +++ b/body.html @@ -0,0 +1,75 @@ +<header> + <h1>Forex Trading Journal</h1> + <p>Track, Analyze, and Improve Your Trading Performance</p> +</header> + +<main> + <section class="trade-entry"> + <h2>New Trade</h2> + <form id="tradeForm"> + <div class="form-group"> + <label for="currencyPair">Currency Pair:</label> + <input type="text" id="currencyPair" required> + </div> + <div class="form-group"> + <label for="entryPrice">Entry Price:</label> + <input type="number" step="0.0001" id="entryPrice" required> + </div> + <div class="form-group"> + <label for="exitPrice">Exit Price:</label> + <input type="number" step="0.0001" id="exitPrice" required> + </div> + <div class="form-group"> + <label for="positionSize">Position Size:</label> + <input type="number" step="0.01" id="positionSize" required> + </div> + <div class="form-group"> + <label for="notes">Notes:</label> + <textarea id="notes"></textarea> + </div> + <button type="submit">Add Trade</button> + </form> + </section> + + <section class="trade-history"> + <h2>Trade History</h2> + <div class="filters"> + <label for="filterCurrency">Filter by Currency:</label> + <select id="filterCurrency"> + <option value="">All</option> + </select> + </div> + <div class="trade-list"> +  + </div> + </section> + + <section class="analytics"> + <h2>Performance Analytics</h2> + <div class="stats-grid"> + <div class="stat-card"> + <h3>Total Trades</h3> + <p id="totalTrades">0</p> + </div> + <div class="stat-card"> + <h3>Win Rate</h3> + <p id="winRate">0%</p> + </div> + <div class="stat-card"> + <h3>Average Profit</h3> + <p id="avgProfit">0</p> + </div> + <div class="stat-card"> + <h3>Total P&L</h3> + <p id="totalPL">0</p> + </div> + </div> + <div class="chart-container"> + <canvas id="performanceChart"></canvas> + </div> + </section> +</main> + +<footer> + <p>Forex Trading Journal - Your Path to Better Trading Decisions</p> +</footer> \ No newline at end of file diff --git a/index.scroll b/index.scroll new file mode 100644 index 0000000..7f545cb --- /dev/null +++ b/index.scroll @@ -0,0 +1,8 @@ +buildHtml +baseUrl https://forexfolio.scroll.pub +metaTags +editButton /edit.html +title Forex Trading Journal - Track & Analyze Your Trades +style.css +body.html +script.js \ No newline at end of file diff --git a/prompt.json b/prompt.json new file mode 100644 index 0000000..a743919 --- /dev/null +++ b/prompt.json @@ -0,0 +1,25 @@ +{ + "id": "acfb7c49-cc93-45fd-be58-281358d8bc0b", + "object": "chat.completion", + "created": 1735599215, + "model": "deepseek-chat", + "choices": [ + { + "index": 0, + "message": { + "role": "assistant", + "content": "---domain---\nforexfolio.scroll.pub\n---index.scroll---\nbuildHtml\nbaseUrl https://forexfolio.scroll.pub\nmetaTags\neditButton /edit.html\ntitle Forex Trading Journal - Track & Analyze Your Trades\nstyle.css\nbody.html\nscript.js\n---body.html---\n<header>\n <h1>Forex Trading Journal</h1>\n <p>Track, Analyze, and Improve Your Trading Performance</p>\n</header>\n\n<main>\n <section class=\"trade-entry\">\n <h2>New Trade</h2>\n <form id=\"tradeForm\">\n <div class=\"form-group\">\n <label for=\"currencyPair\">Currency Pair:</label>\n <input type=\"text\" id=\"currencyPair\" required>\n </div>\n <div class=\"form-group\">\n <label for=\"entryPrice\">Entry Price:</label>\n <input type=\"number\" step=\"0.0001\" id=\"entryPrice\" required>\n </div>\n <div class=\"form-group\">\n <label for=\"exitPrice\">Exit Price:</label>\n <input type=\"number\" step=\"0.0001\" id=\"exitPrice\" required>\n </div>\n <div class=\"form-group\">\n <label for=\"positionSize\">Position Size:</label>\n <input type=\"number\" step=\"0.01\" id=\"positionSize\" required>\n </div>\n <div class=\"form-group\">\n <label for=\"notes\">Notes:</label>\n <textarea id=\"notes\"></textarea>\n </div>\n <button type=\"submit\">Add Trade</button>\n </form>\n </section>\n\n <section class=\"trade-history\">\n <h2>Trade History</h2>\n <div class=\"filters\">\n <label for=\"filterCurrency\">Filter by Currency:</label>\n <select id=\"filterCurrency\">\n <option value=\"\">All</option>\n </select>\n </div>\n <div class=\"trade-list\">\n \n </div>\n </section>\n\n <section class=\"analytics\">\n <h2>Performance Analytics</h2>\n <div class=\"stats-grid\">\n <div class=\"stat-card\">\n <h3>Total Trades</h3>\n <p id=\"totalTrades\">0</p>\n </div>\n <div class=\"stat-card\">\n <h3>Win Rate</h3>\n <p id=\"winRate\">0%</p>\n </div>\n <div class=\"stat-card\">\n <h3>Average Profit</h3>\n <p id=\"avgProfit\">0</p>\n </div>\n <div class=\"stat-card\">\n <h3>Total P&L</h3>\n <p id=\"totalPL\">0</p>\n </div>\n </div>\n <div class=\"chart-container\">\n <canvas id=\"performanceChart\"></canvas>\n </div>\n </section>\n</main>\n\n<footer>\n <p>Forex Trading Journal - Your Path to Better Trading Decisions</p>\n</footer>\n---style.css---\n:root {\n --primary-color: #2c3e50;\n --secondary-color: #3498db;\n --accent-color: #e74c3c;\n --background-color: #ecf0f1;\n --text-color: #2c3e50;\n --card-bg: #fff;\n --shadow: 0 2px 10px rgba(0, 0, 0, 0.1);\n}\n\n* {\n box-sizing: border-box;\n margin: 0;\n padding: 0;\n}\n\nbody {\n font-family: 'Segoe UI', sans-serif;\n line-height: 1.6;\n color: var(--text-color);\n background-color: var(--background-color);\n padding: 20px;\n}\n\nheader {\n text-align: center;\n margin-bottom: 40px;\n padding: 40px 0;\n background: var(--primary-color);\n color: white;\n border-radius: 10px;\n}\n\nh1 {\n font-size: 2.5rem;\n margin-bottom: 10px;\n}\n\nh2 {\n color: var(--primary-color);\n margin-bottom: 20px;\n}\n\nsection {\n background: var(--card-bg);\n padding: 20px;\n border-radius: 10px;\n box-shadow: var(--shadow);\n margin-bottom: 30px;\n}\n\n.form-group {\n margin-bottom: 15px;\n}\n\nlabel {\n display: block;\n margin-bottom: 5px;\n font-weight: 600;\n}\n\ninput, textarea, select {\n width: 100%;\n padding: 10px;\n border: 1px solid #ddd;\n border-radius: 5px;\n font-size: 1rem;\n}\n\nbutton {\n background: var(--secondary-color);\n color: white;\n border: none;\n padding: 10px 20px;\n border-radius: 5px;\n cursor: pointer;\n transition: background 0.3s ease;\n}\n\nbutton:hover {\n background: #2980b9;\n}\n\n.trade-list {\n display: grid;\n gap: 15px;\n}\n\n.trade-entry {\n background: var(--card-bg);\n padding: 15px;\n border-radius: 5px;\n box-shadow: var(--shadow);\n}\n\n.stats-grid {\n display: grid;\n grid-template-columns: repeat(auto-fit, minmax(200px, 1fr));\n gap: 20px;\n margin-bottom: 30px;\n}\n\n.stat-card {\n text-align: center;\n padding: 20px;\n background: var(--card-bg);\n border-radius: 10px;\n box-shadow: var(--shadow);\n}\n\n.chart-container {\n max-width: 800px;\n margin: 0 auto;\n}\n\nfooter {\n text-align: center;\n margin-top: 40px;\n padding: 20px;\n background: var(--primary-color);\n color: white;\n border-radius: 10px;\n}\n\n@media (max-width: 768px) {\n h1 {\n font-size: 2rem;\n }\n \n .stats-grid {\n grid-template-columns: 1fr;\n }\n}\n---script.js---\n// Initialize trade data\nlet trades = [];\nlet currencyPairs = new Set();\n\n// DOM Elements\nconst tradeForm = document.getElementById('tradeForm');\nconst tradeList = document.querySelector('.trade-list');\nconst filterCurrency = document.getElementById('filterCurrency');\nconst totalTrades = document.getElementById('totalTrades');\nconst winRate = document.getElementById('winRate');\nconst avgProfit = document.getElementById('avgProfit');\nconst totalPL = document.getElementById('totalPL');\nconst performanceChart = document.getElementById('performanceChart');\n\n// Chart initialization\nconst ctx = performanceChart.getContext('2d');\nconst chart = new Chart(ctx, {\n type: 'line',\n data: {\n labels: [],\n datasets: [{\n label: 'Cumulative P&L',\n data: [],\n borderColor: '#3498db',\n fill: false\n }]\n },\n options: {\n responsive: true,\n maintainAspectRatio: false,\n scales: {\n y: {\n beginAtZero: true\n }\n }\n }\n});\n\n// Add trade event\ntradeForm.addEventListener('submit', function(e) {\n e.preventDefault();\n \n const trade = {\n currencyPair: document.getElementById('currencyPair').value,\n entryPrice: parseFloat(document.getElementById('entryPrice').value),\n exitPrice: parseFloat(document.getElementById('exitPrice').value),\n positionSize: parseFloat(document.getElementById('positionSize').value),\n notes: document.getElementById('notes').value,\n date: new Date().toLocaleString()\n };\n \n trades.push(trade);\n currencyPairs.add(trade.currencyPair);\n updateCurrencyFilter();\n renderTrades();\n updateAnalytics();\n tradeForm.reset();\n});\n\n// Render trades\nfunction renderTrades(filter = '') {\n tradeList.innerHTML = '';\n const filteredTrades = filter ? trades.filter(t => t.currencyPair === filter) : trades;\n \n filteredTrades.forEach(trade => {\n const tradeDiv = document.createElement('div');\n tradeDiv.className = 'trade-entry';\n const pnl = (trade.exitPrice - trade.entryPrice) * trade.positionSize;\n \n tradeDiv.innerHTML = `\n <h3>${trade.currencyPair}</h3>\n <p>Entry: ${trade.entryPrice} | Exit: ${trade.exitPrice}</p>\n <p>Position Size: ${trade.positionSize}</p>\n <p>P&L: <span class=\"${pnl >= 0 ? 'positive' : 'negative'}\">${pnl.toFixed(2)}</span></p>\n <p>${trade.notes}</p>\n <small>${trade.date}</small>\n `;\n \n tradeList.appendChild(tradeDiv);\n });\n}\n\n// Update currency filter options\nfunction updateCurrencyFilter() {\n filterCurrency.innerHTML = '<option value=\"\">All</option>';\n currencyPairs.forEach(pair => {\n const option = document.createElement('option');\n option.value = pair;\n option.textContent = pair;\n filterCurrency.appendChild(option);\n });\n}\n\n// Update analytics\nfunction updateAnalytics() {\n totalTrades.textContent = trades.length;\n \n const winningTrades = trades.filter(t => (t.exitPrice - t.entryPrice) * t.positionSize > 0).length;\n winRate.textContent = trades.length ? `${((winningTrades / trades.length) * 100).toFixed(1)}%` : '0%';\n \n const totalProfit = trades.reduce((sum, t) => sum + (t.exitPrice - t.entryPrice) * t.positionSize, 0);\n totalPL.textContent = totalProfit.toFixed(2);\n avgProfit.textContent = trades.length ? (totalProfit / trades.length).toFixed(2) : '0';\n \n // Update chart\n const cumulativePL = [];\n let runningTotal = 0;\n trades.forEach(t => {\n runningTotal += (t.exitPrice - t.entryPrice) * t.positionSize;\n cumulativePL.push(runningTotal);\n });\n \n chart.data.labels = trades.map((_, i) => `Trade ${i + 1}`);\n chart.data.datasets[0].data = cumulativePL;\n chart.update();\n}\n\n// Filter trades by currency\nfilterCurrency.addEventListener('change', function() {\n renderTrades(this.value);\n});\n\n// Initial setup\nupdateCurrencyFilter();\nrenderTrades();\n---end---" + }, + "logprobs": null, + "finish_reason": "stop" + } + ], + "usage": { + "prompt_tokens": 243, + "completion_tokens": 2322, + "total_tokens": 2565, + "prompt_cache_hit_tokens": 0, + "prompt_cache_miss_tokens": 243 + }, + "system_fingerprint": "fp_f1afce2943" +} \ No newline at end of file diff --git a/readme.scroll b/readme.scroll new file mode 100644 index 0000000..1e75bab --- /dev/null +++ b/readme.scroll @@ -0,0 +1,2 @@ +# forexfolio.scroll.pub +Website generated by DeepSeek from prompt: build a nice forex trading journal with nice visuals \ No newline at end of file diff --git a/script.js b/script.js new file mode 100644 index 0000000..c0f7649 --- /dev/null +++ b/script.js @@ -0,0 +1,125 @@ +// Initialize trade data +let trades = []; +let currencyPairs = new Set(); + +// DOM Elements +const tradeForm = document.getElementById('tradeForm'); +const tradeList = document.querySelector('.trade-list'); +const filterCurrency = document.getElementById('filterCurrency'); +const totalTrades = document.getElementById('totalTrades'); +const winRate = document.getElementById('winRate'); +const avgProfit = document.getElementById('avgProfit'); +const totalPL = document.getElementById('totalPL'); +const performanceChart = document.getElementById('performanceChart'); + +// Chart initialization +const ctx = performanceChart.getContext('2d'); +const chart = new Chart(ctx, { + type: 'line', + data: { + labels: [], + datasets: [{ + label: 'Cumulative P&L', + data: [], + borderColor: '#3498db', + fill: false + }] + }, + options: { + responsive: true, + maintainAspectRatio: false, + scales: { + y: { + beginAtZero: true + } + } + } +}); + +// Add trade event +tradeForm.addEventListener('submit', function(e) { + e.preventDefault(); + + const trade = { + currencyPair: document.getElementById('currencyPair').value, + entryPrice: parseFloat(document.getElementById('entryPrice').value), + exitPrice: parseFloat(document.getElementById('exitPrice').value), + positionSize: parseFloat(document.getElementById('positionSize').value), + notes: document.getElementById('notes').value, + date: new Date().toLocaleString() + }; + + trades.push(trade); + currencyPairs.add(trade.currencyPair); + updateCurrencyFilter(); + renderTrades(); + updateAnalytics(); + tradeForm.reset(); +}); + +// Render trades +function renderTrades(filter = '') { + tradeList.innerHTML = ''; + const filteredTrades = filter ? trades.filter(t => t.currencyPair === filter) : trades; + + filteredTrades.forEach(trade => { + const tradeDiv = document.createElement('div'); + tradeDiv.className = 'trade-entry'; + const pnl = (trade.exitPrice - trade.entryPrice) * trade.positionSize; + + tradeDiv.innerHTML = ` + <h3>${trade.currencyPair}</h3> + <p>Entry: ${trade.entryPrice} | Exit: ${trade.exitPrice}</p> + <p>Position Size: ${trade.positionSize}</p> + <p>P&L: <span class="${pnl >= 0 ? 'positive' : 'negative'}">${pnl.toFixed(2)}</span></p> + <p>${trade.notes}</p> + <small>${trade.date}</small> + `; + + tradeList.appendChild(tradeDiv); + }); +} + +// Update currency filter options +function updateCurrencyFilter() { + filterCurrency.innerHTML = '<option value="">All</option>'; + currencyPairs.forEach(pair => { + const option = document.createElement('option'); + option.value = pair; + option.textContent = pair; + filterCurrency.appendChild(option); + }); +} + +// Update analytics +function updateAnalytics() { + totalTrades.textContent = trades.length; + + const winningTrades = trades.filter(t => (t.exitPrice - t.entryPrice) * t.positionSize > 0).length; + winRate.textContent = trades.length ? `${((winningTrades / trades.length) * 100).toFixed(1)}%` : '0%'; + + const totalProfit = trades.reduce((sum, t) => sum + (t.exitPrice - t.entryPrice) * t.positionSize, 0); + totalPL.textContent = totalProfit.toFixed(2); + avgProfit.textContent = trades.length ? (totalProfit / trades.length).toFixed(2) : '0'; + + // Update chart + const cumulativePL = []; + let runningTotal = 0; + trades.forEach(t => { + runningTotal += (t.exitPrice - t.entryPrice) * t.positionSize; + cumulativePL.push(runningTotal); + }); + + chart.data.labels = trades.map((_, i) => `Trade ${i + 1}`); + chart.data.datasets[0].data = cumulativePL; + chart.update(); +} + +// Filter trades by currency +filterCurrency.addEventListener('change', function() { + renderTrades(this.value); +}); + +// Initial setup +updateCurrencyFilter(); +renderTrades(); \ No newline at end of file diff --git a/style.css b/style.css new file mode 100644 index 0000000..83d1c30 --- /dev/null +++ b/style.css @@ -0,0 +1,133 @@ +:root { + --primary-color: #2c3e50; + --secondary-color: #3498db; + --accent-color: #e74c3c; + --background-color: #ecf0f1; + --text-color: #2c3e50; + --card-bg: #fff; + --shadow: 0 2px 10px rgba(0, 0, 0, 0.1); +} + +* { + box-sizing: border-box; + margin: 0; + padding: 0; +} + +body { + font-family: 'Segoe UI', sans-serif; + line-height: 1.6; + color: var(--text-color); + background-color: var(--background-color); + padding: 20px; +} + +header { + text-align: center; + margin-bottom: 40px; + padding: 40px 0; + background: var(--primary-color); + color: white; + border-radius: 10px; +} + +h1 { + font-size: 2.5rem; + margin-bottom: 10px; +} + +h2 { + color: var(--primary-color); + margin-bottom: 20px; +} + +section { + background: var(--card-bg); + padding: 20px; + border-radius: 10px; + box-shadow: var(--shadow); + margin-bottom: 30px; +} + +.form-group { + margin-bottom: 15px; +} + +label { + display: block; + margin-bottom: 5px; + font-weight: 600; +} + +input, textarea, select { + width: 100%; + padding: 10px; + border: 1px solid #ddd; + border-radius: 5px; + font-size: 1rem; +} + +button { + background: var(--secondary-color); + color: white; + border: none; + padding: 10px 20px; + border-radius: 5px; + cursor: pointer; + transition: background 0.3s ease; +} + +button:hover { + background: #2980b9; +} + +.trade-list { + display: grid; + gap: 15px; +} + +.trade-entry { + background: var(--card-bg); + padding: 15px; + border-radius: 5px; + box-shadow: var(--shadow); +} + +.stats-grid { + display: grid; + grid-template-columns: repeat(auto-fit, minmax(200px, 1fr)); + gap: 20px; + margin-bottom: 30px; +} + +.stat-card { + text-align: center; + padding: 20px; + background: var(--card-bg); + border-radius: 10px; + box-shadow: var(--shadow); +} + +.chart-container { + max-width: 800px; + margin: 0 auto; +} + +footer { + text-align: center; + margin-top: 40px; + padding: 20px; + background: var(--primary-color); + color: white; + border-radius: 10px; +} + +@media (max-width: 768px) { + h1 { + font-size: 2rem; + } + + .stats-grid { + grid-template-columns: 1fr; + } +} \ No newline at end of file