commit a2fb933624dbc23f1ba2a6da66903f91b074d629
Author: root <root@hub.scroll.pub> Date: 2024-12-28 08:52:41 +0000 Subject: Initial commit diff --git a/body.html b/body.html new file mode 100644 index 0000000..a5790c9 --- /dev/null +++ b/body.html @@ -0,0 +1,46 @@ +<header> + <h1>BirdieBoard</h1> + <p>Where friendly golf competitions come to life!</p> +</header> + +<main> + <section id="score-submission"> + <h2>Submit Your Score</h2> + <form id="score-form"> + <label for="name">Name:</label> + <input type="text" id="name" required> + + <label for="score">Gross Score:</label> + <input type="number" id="score" required> + + <label for="handicap">Your Handicap:</label> + <input type="number" id="handicap" required> + + <label for="course-handicap">Course Handicap:</label> + <input type="number" id="course-handicap" required> + + <button type="submit">Submit Score</button> + </form> + <div id="notification-area"></div> + </section> + + <section id="leaderboard"> + <h2>Group Leaderboard</h2> + <table> + <thead> + <tr> + <th>Rank</th> + <th>Player</th> + <th>Net Score</th> + </tr> + </thead> + <tbody id="leaderboard-body"> + <!-- Leaderboard rows will be populated here --> + </tbody> + </table> + </section> +</main> + +<footer> + <p>Join a group and start competing with your friends today!</p> +</footer> \ No newline at end of file diff --git a/index.scroll b/index.scroll new file mode 100644 index 0000000..31f06f5 --- /dev/null +++ b/index.scroll @@ -0,0 +1,8 @@ +buildHtml +baseUrl https://birdieboard.scroll.pub +metaTags +editButton /edit.html +title BirdieBoard - Golf Score Leaderboard +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..4b86ce9 --- /dev/null +++ b/prompt.json @@ -0,0 +1,25 @@ +{ + "id": "cb95f3b3-40dc-4de9-b49e-dbe3038ea8f5", + "object": "chat.completion", + "created": 1735375940, + "model": "deepseek-chat", + "choices": [ + { + "index": 0, + "message": { + "role": "assistant", + "content": "---domain---\nbirdieboard.scroll.pub\n---index.scroll---\nbuildHtml\nbaseUrl https://birdieboard.scroll.pub\nmetaTags\neditButton /edit.html\ntitle BirdieBoard - Golf Score Leaderboard\nstyle.css\nbody.html\nscript.js\n---body.html---\n<header>\n <h1>BirdieBoard</h1>\n <p>Where friendly golf competitions come to life!</p>\n</header>\n\n<main>\n <section id=\"score-submission\">\n <h2>Submit Your Score</h2>\n <form id=\"score-form\">\n <label for=\"name\">Name:</label>\n <input type=\"text\" id=\"name\" required>\n \n <label for=\"score\">Gross Score:</label>\n <input type=\"number\" id=\"score\" required>\n \n <label for=\"handicap\">Your Handicap:</label>\n <input type=\"number\" id=\"handicap\" required>\n \n <label for=\"course-handicap\">Course Handicap:</label>\n <input type=\"number\" id=\"course-handicap\" required>\n \n <button type=\"submit\">Submit Score</button>\n </form>\n <div id=\"notification-area\"></div>\n </section>\n\n <section id=\"leaderboard\">\n <h2>Group Leaderboard</h2>\n <table>\n <thead>\n <tr>\n <th>Rank</th>\n <th>Player</th>\n <th>Net Score</th>\n </tr>\n </thead>\n <tbody id=\"leaderboard-body\">\n <!-- Leaderboard rows will be populated here -->\n </tbody>\n </table>\n </section>\n</main>\n\n<footer>\n <p>Join a group and start competing with your friends today!</p>\n</footer>\n---style.css---\n:root {\n --primary-color: #2ecc71;\n --secondary-color: #3498db;\n --background-color: #f4f4f4;\n --text-color: #333;\n --border-radius: 8px;\n --box-shadow: 0 2px 4px rgba(0,0,0,0.1);\n}\n\nbody {\n font-family: 'Segoe UI', sans-serif;\n line-height: 1.6;\n margin: 0;\n padding: 0;\n background-color: var(--background-color);\n color: var(--text-color);\n}\n\nheader {\n background: var(--primary-color);\n color: white;\n padding: 2rem;\n text-align: center;\n border-bottom: 4px solid darken(var(--primary-color), 10%);\n}\n\nmain {\n max-width: 800px;\n margin: 2rem auto;\n padding: 0 1rem;\n}\n\n#score-submission {\n background: white;\n padding: 2rem;\n border-radius: var(--border-radius);\n box-shadow: var(--box-shadow);\n margin-bottom: 2rem;\n}\n\nform {\n display: grid;\n gap: 1rem;\n}\n\nlabel {\n font-weight: bold;\n}\n\ninput {\n padding: 0.5rem;\n border: 1px solid #ddd;\n border-radius: var(--border-radius);\n}\n\nbutton {\n background: var(--secondary-color);\n color: white;\n padding: 0.75rem;\n border: none;\n border-radius: var(--border-radius);\n cursor: pointer;\n transition: background 0.3s ease;\n}\n\nbutton:hover {\n background: darken(var(--secondary-color), 10%);\n}\n\n#notification-area {\n margin-top: 1rem;\n padding: 1rem;\n background: #f8f9fa;\n border-radius: var(--border-radius);\n display: none;\n}\n\n#leaderboard {\n background: white;\n padding: 2rem;\n border-radius: var(--border-radius);\n box-shadow: var(--box-shadow);\n}\n\ntable {\n width: 100%;\n border-collapse: collapse;\n}\n\nth, td {\n padding: 0.75rem;\n text-align: left;\n border-bottom: 1px solid #ddd;\n}\n\nth {\n background: var(--primary-color);\n color: white;\n}\n\ntr:hover {\n background-color: #f5f5f5;\n}\n\nfooter {\n text-align: center;\n padding: 1rem;\n background: var(--text-color);\n color: white;\n}\n\n@media (max-width: 600px) {\n header h1 {\n font-size: 1.5rem;\n }\n \n main {\n padding: 0 0.5rem;\n }\n \n #score-submission, #leaderboard {\n padding: 1rem;\n }\n}\n---script.js---\nconst players = [];\nconst notificationArea = document.getElementById('notification-area');\nconst leaderboardBody = document.getElementById('leaderboard-body');\n\ndocument.getElementById('score-form').addEventListener('submit', function(e) {\n e.preventDefault();\n \n const name = document.getElementById('name').value;\n const grossScore = parseInt(document.getElementById('score').value);\n const handicap = parseInt(document.getElementById('handicap').value);\n const courseHandicap = parseInt(document.getElementById('course-handicap').value);\n \n const netScore = grossScore - handicap - courseHandicap;\n \n const player = {\n name,\n grossScore,\n handicap,\n courseHandicap,\n netScore,\n date: new Date()\n };\n \n players.push(player);\n updateLeaderboard();\n showNotification(`${name} scored a net ${netScore}!`);\n \n // Clear form\n this.reset();\n});\n\nfunction updateLeaderboard() {\n // Sort players by net score\n players.sort((a, b) => a.netScore - b.netScore);\n \n // Clear current leaderboard\n leaderboardBody.innerHTML = '';\n \n // Add new rows\n players.forEach((player, index) => {\n const row = document.createElement('tr');\n \n const rankCell = document.createElement('td');\n rankCell.textContent = index + 1;\n \n const nameCell = document.createElement('td');\n nameCell.textContent = player.name;\n \n const scoreCell = document.createElement('td');\n scoreCell.textContent = player.netScore;\n \n row.appendChild(rankCell);\n row.appendChild(nameCell);\n row.appendChild(scoreCell);\n \n leaderboardBody.appendChild(row);\n });\n \n // Show update notification\n if (players.length > 1) {\n showNotification('Leaderboard updated!');\n }\n}\n\nfunction showNotification(message) {\n notificationArea.textContent = message;\n notificationArea.style.display = 'block';\n \n setTimeout(() => {\n notificationArea.style.display = 'none';\n }, 3000);\n}\n---end---" + }, + "logprobs": null, + "finish_reason": "stop" + } + ], + "usage": { + "prompt_tokens": 296, + "completion_tokens": 1468, + "total_tokens": 1764, + "prompt_cache_hit_tokens": 0, + "prompt_cache_miss_tokens": 296 + }, + "system_fingerprint": "fp_f1afce2943" +} \ No newline at end of file diff --git a/readme.scroll b/readme.scroll new file mode 100644 index 0000000..5c8ad43 --- /dev/null +++ b/readme.scroll @@ -0,0 +1,2 @@ +# birdieboard.scroll.pub +Website generated by DeepSeek from prompt: I want a website where users can submit their golf scores, users join groups with their friends and their golf scores are ranked on a leaderboard by net score that is calculated both on the users handicap and the course handicap. Also, there are lots of playful notifications for when users submit scores and the leaderboard updates \ No newline at end of file diff --git a/script.js b/script.js new file mode 100644 index 0000000..6060257 --- /dev/null +++ b/script.js @@ -0,0 +1,72 @@ +const players = []; +const notificationArea = document.getElementById('notification-area'); +const leaderboardBody = document.getElementById('leaderboard-body'); + +document.getElementById('score-form').addEventListener('submit', function(e) { + e.preventDefault(); + + const name = document.getElementById('name').value; + const grossScore = parseInt(document.getElementById('score').value); + const handicap = parseInt(document.getElementById('handicap').value); + const courseHandicap = parseInt(document.getElementById('course-handicap').value); + + const netScore = grossScore - handicap - courseHandicap; + + const player = { + name, + grossScore, + handicap, + courseHandicap, + netScore, + date: new Date() + }; + + players.push(player); + updateLeaderboard(); + showNotification(`${name} scored a net ${netScore}!`); + + // Clear form + this.reset(); +}); + +function updateLeaderboard() { + // Sort players by net score + players.sort((a, b) => a.netScore - b.netScore); + + // Clear current leaderboard + leaderboardBody.innerHTML = ''; + + // Add new rows + players.forEach((player, index) => { + const row = document.createElement('tr'); + + const rankCell = document.createElement('td'); + rankCell.textContent = index + 1; + + const nameCell = document.createElement('td'); + nameCell.textContent = player.name; + + const scoreCell = document.createElement('td'); + scoreCell.textContent = player.netScore; + + row.appendChild(rankCell); + row.appendChild(nameCell); + row.appendChild(scoreCell); + + leaderboardBody.appendChild(row); + }); + + // Show update notification + if (players.length > 1) { + showNotification('Leaderboard updated!'); + } +} + +function showNotification(message) { + notificationArea.textContent = message; + notificationArea.style.display = 'block'; + + setTimeout(() => { + notificationArea.style.display = 'none'; + }, 3000); +} \ No newline at end of file diff --git a/style.css b/style.css new file mode 100644 index 0000000..12c5870 --- /dev/null +++ b/style.css @@ -0,0 +1,124 @@ +:root { + --primary-color: #2ecc71; + --secondary-color: #3498db; + --background-color: #f4f4f4; + --text-color: #333; + --border-radius: 8px; + --box-shadow: 0 2px 4px rgba(0,0,0,0.1); +} + +body { + font-family: 'Segoe UI', sans-serif; + line-height: 1.6; + margin: 0; + padding: 0; + background-color: var(--background-color); + color: var(--text-color); +} + +header { + background: var(--primary-color); + color: white; + padding: 2rem; + text-align: center; + border-bottom: 4px solid darken(var(--primary-color), 10%); +} + +main { + max-width: 800px; + margin: 2rem auto; + padding: 0 1rem; +} + +#score-submission { + background: white; + padding: 2rem; + border-radius: var(--border-radius); + box-shadow: var(--box-shadow); + margin-bottom: 2rem; +} + +form { + display: grid; + gap: 1rem; +} + +label { + font-weight: bold; +} + +input { + padding: 0.5rem; + border: 1px solid #ddd; + border-radius: var(--border-radius); +} + +button { + background: var(--secondary-color); + color: white; + padding: 0.75rem; + border: none; + border-radius: var(--border-radius); + cursor: pointer; + transition: background 0.3s ease; +} + +button:hover { + background: darken(var(--secondary-color), 10%); +} + +#notification-area { + margin-top: 1rem; + padding: 1rem; + background: #f8f9fa; + border-radius: var(--border-radius); + display: none; +} + +#leaderboard { + background: white; + padding: 2rem; + border-radius: var(--border-radius); + box-shadow: var(--box-shadow); +} + +table { + width: 100%; + border-collapse: collapse; +} + +th, td { + padding: 0.75rem; + text-align: left; + border-bottom: 1px solid #ddd; +} + +th { + background: var(--primary-color); + color: white; +} + +tr:hover { + background-color: #f5f5f5; +} + +footer { + text-align: center; + padding: 1rem; + background: var(--text-color); + color: white; +} + +@media (max-width: 600px) { + header h1 { + font-size: 1.5rem; + } + + main { + padding: 0 0.5rem; + } + + #score-submission, #leaderboard { + padding: 1rem; + } +} \ No newline at end of file