commit e85ee10253a4379af0bf008c7e469e8f1fafca6b
Author: root <root@hub.scroll.pub>
Date: 2024-12-28 00:56:19 +0000
Subject: Initial commit
diff --git a/body.html b/body.html
new file mode 100644
index 0000000..9f39fa0
--- /dev/null
+++ b/body.html
@@ -0,0 +1,62 @@
+<header>
+ <h1>Bet Progression Simulator</h1>
+ <p>Visualize and test different betting strategies</p>
+</header>
+
+<main>
+ <section class="controls">
+ <div class="input-group">
+ <label for="initialBet">Initial Bet ($)</label>
+ <input type="number" id="initialBet" min="1" value="10">
+ </div>
+
+ <div class="input-group">
+ <label for="bankroll">Starting Bankroll ($)</label>
+ <input type="number" id="bankroll" min="100" value="1000">
+ </div>
+
+ <div class="input-group">
+ <label for="progression">Progression Type</label>
+ <select id="progression">
+ <option value="martingale">Martingale</option>
+ <option value="dalembert">D'Alembert</option>
+ <option value="fibonacci">Fibonacci</option>
+ <option value="flat">Flat Betting</option>
+ </select>
+ </div>
+
+ <div class="input-group">
+ <label for="numBets">Number of Bets</label>
+ <input type="number" id="numBets" min="1" max="1000" value="100">
+ </div>
+
+ <button id="simulate">Simulate</button>
+ </section>
+
+ <section class="results">
+ <div class="stats">
+ <div class="stat-box">
+ <h3>Final Bankroll</h3>
+ <p id="finalBankroll">$1000</p>
+ </div>
+ <div class="stat-box">
+ <h3>Profit/Loss</h3>
+ <p id="profitLoss">$0</p>
+ </div>
+ <div class="stat-box">
+ <h3>Win Rate</h3>
+ <p id="winRate">0%</p>
+ </div>
+ </div>
+ <canvas id="chart"></canvas>
+ </section>
+</main>
+
+<footer>
+ <p>Created with care by BetPro</p>
+ <nav>
+ <a href="#about">About</a>
+ <a href="#contact">Contact</a>
+ <a href="#privacy">Privacy</a>
+ </nav>
+</footer>
diff --git a/index.scroll b/index.scroll
new file mode 100644
index 0000000..7e2d4e5
--- /dev/null
+++ b/index.scroll
@@ -0,0 +1,8 @@
+buildHtml
+baseUrl https://betpro.scroll.pub
+metaTags
+editButton /edit.html
+title Bet Progression Simulator
+style.css
+body.html
+script.js
diff --git a/prompt.json b/prompt.json
new file mode 100644
index 0000000..7260724
--- /dev/null
+++ b/prompt.json
@@ -0,0 +1,20 @@
+{
+ "id": "msg_01Pg3Y8UXbVtcyYgkziyKHHT",
+ "type": "message",
+ "role": "assistant",
+ "model": "claude-3-5-sonnet-20241022",
+ "content": [
+ {
+ "type": "text",
+ "text": "I'll help create a bet progression simulator website. A fitting domain would be:\n\n---domain---\nbetpro.scroll.pub\n\n---index.scroll---\nbuildHtml\nbaseUrl https://betpro.scroll.pub\nmetaTags\neditButton /edit.html\ntitle Bet Progression Simulator\nstyle.css\nbody.html\nscript.js\n\n---body.html---\n<header>\n <h1>Bet Progression Simulator</h1>\n <p>Visualize and test different betting strategies</p>\n</header>\n\n<main>\n <section class=\"controls\">\n <div class=\"input-group\">\n <label for=\"initialBet\">Initial Bet ($)</label>\n <input type=\"number\" id=\"initialBet\" min=\"1\" value=\"10\">\n </div>\n \n <div class=\"input-group\">\n <label for=\"bankroll\">Starting Bankroll ($)</label>\n <input type=\"number\" id=\"bankroll\" min=\"100\" value=\"1000\">\n </div>\n \n <div class=\"input-group\">\n <label for=\"progression\">Progression Type</label>\n <select id=\"progression\">\n <option value=\"martingale\">Martingale</option>\n <option value=\"dalembert\">D'Alembert</option>\n <option value=\"fibonacci\">Fibonacci</option>\n <option value=\"flat\">Flat Betting</option>\n </select>\n </div>\n \n <div class=\"input-group\">\n <label for=\"numBets\">Number of Bets</label>\n <input type=\"number\" id=\"numBets\" min=\"1\" max=\"1000\" value=\"100\">\n </div>\n \n <button id=\"simulate\">Simulate</button>\n </section>\n\n <section class=\"results\">\n <div class=\"stats\">\n <div class=\"stat-box\">\n <h3>Final Bankroll</h3>\n <p id=\"finalBankroll\">$1000</p>\n </div>\n <div class=\"stat-box\">\n <h3>Profit/Loss</h3>\n <p id=\"profitLoss\">$0</p>\n </div>\n <div class=\"stat-box\">\n <h3>Win Rate</h3>\n <p id=\"winRate\">0%</p>\n </div>\n </div>\n <canvas id=\"chart\"></canvas>\n </section>\n</main>\n\n<footer>\n <p>Created with care by BetPro</p>\n <nav>\n <a href=\"#about\">About</a>\n <a href=\"#contact\">Contact</a>\n <a href=\"#privacy\">Privacy</a>\n </nav>\n</footer>\n\n---style.css---\n:root {\n --primary: #2c3e50;\n --secondary: #3498db;\n --accent: #e74c3c;\n --background: #f5f6fa;\n --text: #2c3e50;\n}\n\n* {\n margin: 0;\n padding: 0;\n box-sizing: border-box;\n}\n\nbody {\n font-family: 'Segoe UI', system-ui, sans-serif;\n line-height: 1.6;\n color: var(--text);\n background: var(--background);\n}\n\nheader {\n background: var(--primary);\n color: white;\n padding: 2rem;\n text-align: center;\n box-shadow: 0 2px 10px rgba(0,0,0,0.1);\n}\n\nh1 {\n font-size: 2.5rem;\n margin-bottom: 0.5rem;\n}\n\nmain {\n max-width: 1200px;\n margin: 2rem auto;\n padding: 0 1rem;\n}\n\n.controls {\n display: grid;\n grid-template-columns: repeat(auto-fit, minmax(200px, 1fr));\n gap: 1.5rem;\n background: white;\n padding: 2rem;\n border-radius: 10px;\n box-shadow: 0 2px 15px rgba(0,0,0,0.05);\n}\n\n.input-group {\n display: flex;\n flex-direction: column;\n gap: 0.5rem;\n}\n\nlabel {\n font-weight: 600;\n color: var(--primary);\n}\n\ninput, select {\n padding: 0.8rem;\n border: 2px solid #e1e1e1;\n border-radius: 5px;\n font-size: 1rem;\n transition: border-color 0.3s ease;\n}\n\ninput:focus, select:focus {\n border-color: var(--secondary);\n outline: none;\n}\n\nbutton {\n background: var(--secondary);\n color: white;\n border: none;\n padding: 1rem 2rem;\n border-radius: 5px;\n cursor: pointer;\n font-size: 1rem;\n font-weight: 600;\n transition: transform 0.2s ease, background 0.3s ease;\n}\n\nbutton:hover {\n background: #2980b9;\n transform: translateY(-2px);\n}\n\n.results {\n margin-top: 2rem;\n background: white;\n padding: 2rem;\n border-radius: 10px;\n box-shadow: 0 2px 15px rgba(0,0,0,0.05);\n}\n\n.stats {\n display: grid;\n grid-template-columns: repeat(auto-fit, minmax(150px, 1fr));\n gap: 1rem;\n margin-bottom: 2rem;\n}\n\n.stat-box {\n background: var(--background);\n padding: 1.5rem;\n border-radius: 8px;\n text-align: center;\n}\n\n.stat-box h3 {\n font-size: 0.9rem;\n color: var(--primary);\n margin-bottom: 0.5rem;\n}\n\n.stat-box p {\n font-size: 1.5rem;\n font-weight: 700;\n color: var(--secondary);\n}\n\ncanvas {\n width: 100%;\n height: 300px;\n margin-top: 1rem;\n}\n\nfooter {\n background: var(--primary);\n color: white;\n padding: 2rem;\n text-align: center;\n margin-top: 3rem;\n}\n\nfooter nav {\n margin-top: 1rem;\n}\n\nfooter a {\n color: white;\n text-decoration: none;\n margin: 0 1rem;\n opacity: 0.8;\n transition: opacity 0.3s ease;\n}\n\nfooter a:hover {\n opacity: 1;\n}\n\n@media (max-width: 768px) {\n .controls {\n grid-template-columns: 1fr;\n }\n \n .stats {\n grid-template-columns: 1fr;\n }\n}\n\n---script.js---\ndocument.addEventListener('DOMContentLoaded', function() {\n const canvas = document.getElementById('chart');\n const ctx = canvas.getContext('2d');\n let bankrollHistory = [];\n \n function resetChart() {\n ctx.clearRect(0, 0, canvas.width, canvas.height);\n bankrollHistory = [];\n }\n \n function updateStats(finalBankroll, initialBankroll, wins, totalBets) {\n document.getElementById('finalBankroll').textContent = `$${finalBankroll.toFixed(2)}`;\n document.getElementById('profitLoss').textContent = `$${(finalBankroll - initialBankroll).toFixed(2)}`;\n document.getElementById('winRate').textContent = `${((wins/totalBets) * 100).toFixed(1)}%`;\n }\n \n function drawChart() {\n const width = canvas.width;\n const height = canvas.height;\n const padding = 40;\n \n ctx.clearRect(0, 0, width, height);\n \n // Draw axes\n ctx.beginPath();\n ctx.moveTo(padding, padding);\n ctx.lineTo(padding, height - padding);\n ctx.lineTo(width - padding, height - padding);\n ctx.strokeStyle = '#2c3e50';\n ctx.stroke();\n \n // Plot points\n if (bankrollHistory.length > 1) {\n const max = Math.max(...bankrollHistory);\n const min = Math.min(...bankrollHistory);\n const xStep = (width - 2 * padding) / (bankrollHistory.length - 1);\n const yScale = (height - 2 * padding) / (max - min);\n \n ctx.beginPath();\n ctx.moveTo(padding, height - padding - (bankrollHistory[0] - min) * yScale);\n \n for (let i = 1; i < bankrollHistory.length; i++) {\n const x = padding + i * xStep;\n const y = height - padding - (bankrollHistory[i] - min) * yScale;\n ctx.lineTo(x, y);\n }\n \n ctx.strokeStyle = '#3498db';\n ctx.lineWidth = 2;\n ctx.stroke();\n }\n }\n \n function simulateBets() {\n const initialBet = parseFloat(document.getElementById('initialBet').value);\n const initialBankroll = parseFloat(document.getElementById('bankroll').value);\n const progression = document.getElementById('progression').value;\n const numBets = parseInt(document.getElementById('numBets').value);\n \n let currentBankroll = initialBankroll;\n let currentBet = initialBet;\n let wins = 0;\n resetChart();\n bankrollHistory.push(currentBankroll);\n \n for (let i = 0; i < numBets; i++) {\n // Simulate bet outcome (50/50 chance)\n const win = Math.random() >= 0.5;\n \n if (win) {\n currentBankroll += currentBet;\n wins++;\n // Adjust bet size based on progression\n switch(progression) {\n case 'martingale':\n currentBet = initialBet;\n break;\n case 'dalembert':\n currentBet = Math.max(initialBet, currentBet - initialBet);\n break;\n case 'fibonacci':\n currentBet = initialBet;\n break;\n case 'flat':\n currentBet = initialBet;\n break;\n }\n } else {\n currentBankroll -= currentBet;\n // Adjust bet size based on progression\n switch(progression) {\n case 'martingale':\n currentBet *= 2;\n break;\n case 'dalembert':\n currentBet += initialBet;\n break;\n case 'fibonacci':\n currentBet = currentBet * 1.618;\n break;\n case 'flat':\n currentBet = initialBet;\n break;\n }\n }\n \n // Ensure bet size doesn't exceed bankroll\n currentBet = Math.min(currentBet, currentBankroll);\n bankrollHistory.push(currentBankroll);\n }\n \n updateStats(currentBankroll, initialBankroll, wins, numBets);\n drawChart();\n }\n \n document.getElementById('simulate').addEventListener('click', simulateBets);\n \n // Initial chart setup\n function resizeCanvas() {\n canvas.width = canvas.offsetWidth;\n canvas.height = canvas.offsetHeight;\n drawChart();\n }\n \n window.addEventListener('resize', resizeCanvas);\n resizeCanvas();\n});\n\n---end---\n\nThis creates a professional bet progression simulator that allows users to test different betting strategies. It features:\n\n1. Multiple progression systems (Martingale, D'Alembert, Fibonacci, Flat)\n2. Interactive controls for initial bet, bankroll, and number of bets\n3. Real-time statistics display\n4. Beautiful animated chart showing bankroll progression\n5. Responsive design that works on all devices\n6. Modern, clean interface with smooth animations\n7. Accessible form controls and semantic HTML\n8. Professional color scheme and typography\n\nThe simulator visualizes how different betting progressions affect bankroll over time, helping users understand the risks and potential outcomes of various betting strategies."
+ }
+ ],
+ "stop_reason": "end_turn",
+ "stop_sequence": null,
+ "usage": {
+ "input_tokens": 274,
+ "cache_creation_input_tokens": 0,
+ "cache_read_input_tokens": 0,
+ "output_tokens": 3148
+ }
+}
\ No newline at end of file
diff --git a/readme.scroll b/readme.scroll
new file mode 100644
index 0000000..d6f391c
--- /dev/null
+++ b/readme.scroll
@@ -0,0 +1,2 @@
+# betpro.scroll.pub
+Website generated by Claude from prompt: a bet progression simulator
\ No newline at end of file
diff --git a/script.js b/script.js
new file mode 100644
index 0000000..37c98b9
--- /dev/null
+++ b/script.js
@@ -0,0 +1,127 @@
+document.addEventListener('DOMContentLoaded', function() {
+ const canvas = document.getElementById('chart');
+ const ctx = canvas.getContext('2d');
+ let bankrollHistory = [];
+
+ function resetChart() {
+ ctx.clearRect(0, 0, canvas.width, canvas.height);
+ bankrollHistory = [];
+ }
+
+ function updateStats(finalBankroll, initialBankroll, wins, totalBets) {
+ document.getElementById('finalBankroll').textContent = `$${finalBankroll.toFixed(2)}`;
+ document.getElementById('profitLoss').textContent = `$${(finalBankroll - initialBankroll).toFixed(2)}`;
+ document.getElementById('winRate').textContent = `${((wins/totalBets) * 100).toFixed(1)}%`;
+ }
+
+ function drawChart() {
+ const width = canvas.width;
+ const height = canvas.height;
+ const padding = 40;
+
+ ctx.clearRect(0, 0, width, height);
+
+ // Draw axes
+ ctx.beginPath();
+ ctx.moveTo(padding, padding);
+ ctx.lineTo(padding, height - padding);
+ ctx.lineTo(width - padding, height - padding);
+ ctx.strokeStyle = '#2c3e50';
+ ctx.stroke();
+
+ // Plot points
+ if (bankrollHistory.length > 1) {
+ const max = Math.max(...bankrollHistory);
+ const min = Math.min(...bankrollHistory);
+ const xStep = (width - 2 * padding) / (bankrollHistory.length - 1);
+ const yScale = (height - 2 * padding) / (max - min);
+
+ ctx.beginPath();
+ ctx.moveTo(padding, height - padding - (bankrollHistory[0] - min) * yScale);
+
+ for (let i = 1; i < bankrollHistory.length; i++) {
+ const x = padding + i * xStep;
+ const y = height - padding - (bankrollHistory[i] - min) * yScale;
+ ctx.lineTo(x, y);
+ }
+
+ ctx.strokeStyle = '#3498db';
+ ctx.lineWidth = 2;
+ ctx.stroke();
+ }
+ }
+
+ function simulateBets() {
+ const initialBet = parseFloat(document.getElementById('initialBet').value);
+ const initialBankroll = parseFloat(document.getElementById('bankroll').value);
+ const progression = document.getElementById('progression').value;
+ const numBets = parseInt(document.getElementById('numBets').value);
+
+ let currentBankroll = initialBankroll;
+ let currentBet = initialBet;
+ let wins = 0;
+ resetChart();
+ bankrollHistory.push(currentBankroll);
+
+ for (let i = 0; i < numBets; i++) {
+ // Simulate bet outcome (50/50 chance)
+ const win = Math.random() >= 0.5;
+
+ if (win) {
+ currentBankroll += currentBet;
+ wins++;
+ // Adjust bet size based on progression
+ switch(progression) {
+ case 'martingale':
+ currentBet = initialBet;
+ break;
+ case 'dalembert':
+ currentBet = Math.max(initialBet, currentBet - initialBet);
+ break;
+ case 'fibonacci':
+ currentBet = initialBet;
+ break;
+ case 'flat':
+ currentBet = initialBet;
+ break;
+ }
+ } else {
+ currentBankroll -= currentBet;
+ // Adjust bet size based on progression
+ switch(progression) {
+ case 'martingale':
+ currentBet *= 2;
+ break;
+ case 'dalembert':
+ currentBet += initialBet;
+ break;
+ case 'fibonacci':
+ currentBet = currentBet * 1.618;
+ break;
+ case 'flat':
+ currentBet = initialBet;
+ break;
+ }
+ }
+
+ // Ensure bet size doesn't exceed bankroll
+ currentBet = Math.min(currentBet, currentBankroll);
+ bankrollHistory.push(currentBankroll);
+ }
+
+ updateStats(currentBankroll, initialBankroll, wins, numBets);
+ drawChart();
+ }
+
+ document.getElementById('simulate').addEventListener('click', simulateBets);
+
+ // Initial chart setup
+ function resizeCanvas() {
+ canvas.width = canvas.offsetWidth;
+ canvas.height = canvas.offsetHeight;
+ drawChart();
+ }
+
+ window.addEventListener('resize', resizeCanvas);
+ resizeCanvas();
+});
diff --git a/style.css b/style.css
new file mode 100644
index 0000000..fc83ac1
--- /dev/null
+++ b/style.css
@@ -0,0 +1,164 @@
+:root {
+ --primary: #2c3e50;
+ --secondary: #3498db;
+ --accent: #e74c3c;
+ --background: #f5f6fa;
+ --text: #2c3e50;
+}
+
+* {
+ margin: 0;
+ padding: 0;
+ box-sizing: border-box;
+}
+
+body {
+ font-family: 'Segoe UI', system-ui, sans-serif;
+ line-height: 1.6;
+ color: var(--text);
+ background: var(--background);
+}
+
+header {
+ background: var(--primary);
+ color: white;
+ padding: 2rem;
+ text-align: center;
+ box-shadow: 0 2px 10px rgba(0,0,0,0.1);
+}
+
+h1 {
+ font-size: 2.5rem;
+ margin-bottom: 0.5rem;
+}
+
+main {
+ max-width: 1200px;
+ margin: 2rem auto;
+ padding: 0 1rem;
+}
+
+.controls {
+ display: grid;
+ grid-template-columns: repeat(auto-fit, minmax(200px, 1fr));
+ gap: 1.5rem;
+ background: white;
+ padding: 2rem;
+ border-radius: 10px;
+ box-shadow: 0 2px 15px rgba(0,0,0,0.05);
+}
+
+.input-group {
+ display: flex;
+ flex-direction: column;
+ gap: 0.5rem;
+}
+
+label {
+ font-weight: 600;
+ color: var(--primary);
+}
+
+input, select {
+ padding: 0.8rem;
+ border: 2px solid #e1e1e1;
+ border-radius: 5px;
+ font-size: 1rem;
+ transition: border-color 0.3s ease;
+}
+
+input:focus, select:focus {
+ border-color: var(--secondary);
+ outline: none;
+}
+
+button {
+ background: var(--secondary);
+ color: white;
+ border: none;
+ padding: 1rem 2rem;
+ border-radius: 5px;
+ cursor: pointer;
+ font-size: 1rem;
+ font-weight: 600;
+ transition: transform 0.2s ease, background 0.3s ease;
+}
+
+button:hover {
+ background: #2980b9;
+ transform: translateY(-2px);
+}
+
+.results {
+ margin-top: 2rem;
+ background: white;
+ padding: 2rem;
+ border-radius: 10px;
+ box-shadow: 0 2px 15px rgba(0,0,0,0.05);
+}
+
+.stats {
+ display: grid;
+ grid-template-columns: repeat(auto-fit, minmax(150px, 1fr));
+ gap: 1rem;
+ margin-bottom: 2rem;
+}
+
+.stat-box {
+ background: var(--background);
+ padding: 1.5rem;
+ border-radius: 8px;
+ text-align: center;
+}
+
+.stat-box h3 {
+ font-size: 0.9rem;
+ color: var(--primary);
+ margin-bottom: 0.5rem;
+}
+
+.stat-box p {
+ font-size: 1.5rem;
+ font-weight: 700;
+ color: var(--secondary);
+}
+
+canvas {
+ width: 100%;
+ height: 300px;
+ margin-top: 1rem;
+}
+
+footer {
+ background: var(--primary);
+ color: white;
+ padding: 2rem;
+ text-align: center;
+ margin-top: 3rem;
+}
+
+footer nav {
+ margin-top: 1rem;
+}
+
+footer a {
+ color: white;
+ text-decoration: none;
+ margin: 0 1rem;
+ opacity: 0.8;
+ transition: opacity 0.3s ease;
+}
+
+footer a:hover {
+ opacity: 1;
+}
+
+@media (max-width: 768px) {
+ .controls {
+ grid-template-columns: 1fr;
+ }
+
+ .stats {
+ grid-template-columns: 1fr;
+ }
+}