commit 5effeb8d5289507abb32a278e1ef182a6e783cbf
Author: root <root@hub.scroll.pub> Date: 2024-12-29 00:27:25 +0000 Subject: Initial commit diff --git a/body.html b/body.html new file mode 100644 index 0000000..a99f8dd --- /dev/null +++ b/body.html @@ -0,0 +1,16 @@ +<header> + <h1>Pong Game</h1> + <p>Relive the classic arcade experience!</p> +</header> +<main> + <div class="game-container"> + <canvas id="pongCanvas" width="800" height="600"></canvas> + </div> + <div class="controls"> + <p>Player 1: W (Up) / S (Down)</p> + <p>Player 2: Arrow Up / Arrow Down</p> + </div> +</main> +<footer> + <p>Enjoy the game!</p> +</footer> \ No newline at end of file diff --git a/index.scroll b/index.scroll new file mode 100644 index 0000000..7866b0d --- /dev/null +++ b/index.scroll @@ -0,0 +1,8 @@ +buildHtml +baseUrl https://pong.scroll.pub +metaTags +editButton /edit.html +title Pong Game - Classic Arcade Fun +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..efe246f --- /dev/null +++ b/prompt.json @@ -0,0 +1,25 @@ +{ + "id": "b9e8d1e5-755c-40c0-a9fc-5fd893499a66", + "object": "chat.completion", + "created": 1735432028, + "model": "deepseek-chat", + "choices": [ + { + "index": 0, + "message": { + "role": "assistant", + "content": "---domain---\npong.scroll.pub\n---index.scroll---\nbuildHtml\nbaseUrl https://pong.scroll.pub\nmetaTags\neditButton /edit.html\ntitle Pong Game - Classic Arcade Fun\nstyle.css\nbody.html\nscript.js\n---body.html---\n<header>\n <h1>Pong Game</h1>\n <p>Relive the classic arcade experience!</p>\n</header>\n<main>\n <div class=\"game-container\">\n <canvas id=\"pongCanvas\" width=\"800\" height=\"600\"></canvas>\n </div>\n <div class=\"controls\">\n <p>Player 1: W (Up) / S (Down)</p>\n <p>Player 2: Arrow Up / Arrow Down</p>\n </div>\n</main>\n<footer>\n <p>Enjoy the game!</p>\n</footer>\n---style.css---\n* {\n margin: 0;\n padding: 0;\n box-sizing: border-box;\n}\n\nbody {\n font-family: 'Arial', sans-serif;\n background: linear-gradient(135deg, #1e3c72, #2a5298);\n color: #fff;\n min-height: 100vh;\n display: flex;\n flex-direction: column;\n align-items: center;\n justify-content: center;\n padding: 20px;\n}\n\nheader {\n text-align: center;\n margin-bottom: 30px;\n}\n\nh1 {\n font-size: 3rem;\n text-shadow: 2px 2px 4px rgba(0, 0, 0, 0.3);\n}\n\np {\n font-size: 1.2rem;\n margin-top: 10px;\n}\n\n.game-container {\n background: #000;\n border: 5px solid #fff;\n border-radius: 10px;\n box-shadow: 0 0 20px rgba(255, 255, 255, 0.3);\n margin-bottom: 20px;\n}\n\n.controls {\n text-align: center;\n font-size: 1.1rem;\n margin-top: 20px;\n}\n\nfooter {\n margin-top: 30px;\n text-align: center;\n font-size: 1rem;\n}\n\n@media (max-width: 768px) {\n h1 {\n font-size: 2rem;\n }\n\n .game-container {\n width: 100%;\n height: auto;\n }\n\n canvas {\n width: 100%;\n height: auto;\n }\n}\n---script.js---\nconst canvas = document.getElementById('pongCanvas');\nconst ctx = canvas.getContext('2d');\n\nconst paddleWidth = 10, paddleHeight = 100;\nconst ballRadius = 10;\n\nlet paddle1Y = 250, paddle2Y = 250;\nlet ballX = 400, ballY = 300;\nlet ballSpeedX = 5, ballSpeedY = 5;\n\nlet upPressed = false, downPressed = false;\nlet arrowUpPressed = false, arrowDownPressed = false;\n\ndocument.addEventListener('keydown', keyDownHandler);\ndocument.addEventListener('keyup', keyUpHandler);\n\nfunction keyDownHandler(e) {\n if (e.key === 'w') upPressed = true;\n if (e.key === 's') downPressed = true;\n if (e.key === 'ArrowUp') arrowUpPressed = true;\n if (e.key === 'ArrowDown') arrowDownPressed = true;\n}\n\nfunction keyUpHandler(e) {\n if (e.key === 'w') upPressed = false;\n if (e.key === 's') downPressed = false;\n if (e.key === 'ArrowUp') arrowUpPressed = false;\n if (e.key === 'ArrowDown') arrowDownPressed = false;\n}\n\nfunction drawPaddle(x, y) {\n ctx.fillStyle = '#fff';\n ctx.fillRect(x, y, paddleWidth, paddleHeight);\n}\n\nfunction drawBall() {\n ctx.beginPath();\n ctx.arc(ballX, ballY, ballRadius, 0, Math.PI * 2);\n ctx.fillStyle = '#fff';\n ctx.fill();\n ctx.closePath();\n}\n\nfunction draw() {\n ctx.clearRect(0, 0, canvas.width, canvas.height);\n\n drawPaddle(0, paddle1Y);\n drawPaddle(canvas.width - paddleWidth, paddle2Y);\n drawBall();\n\n if (upPressed && paddle1Y > 0) paddle1Y -= 7;\n if (downPressed && paddle1Y < canvas.height - paddleHeight) paddle1Y += 7;\n if (arrowUpPressed && paddle2Y > 0) paddle2Y -= 7;\n if (arrowDownPressed && paddle2Y < canvas.height - paddleHeight) paddle2Y += 7;\n\n ballX += ballSpeedX;\n ballY += ballSpeedY;\n\n if (ballY + ballRadius > canvas.height || ballY - ballRadius < 0) {\n ballSpeedY = -ballSpeedY;\n }\n\n if (ballX - ballRadius < paddleWidth && ballY > paddle1Y && ballY < paddle1Y + paddleHeight) {\n ballSpeedX = -ballSpeedX;\n }\n\n if (ballX + ballRadius > canvas.width - paddleWidth && ballY > paddle2Y && ballY < paddle2Y + paddleHeight) {\n ballSpeedX = -ballSpeedX;\n }\n\n if (ballX - ballRadius < 0 || ballX + ballRadius > canvas.width) {\n resetBall();\n }\n\n requestAnimationFrame(draw);\n}\n\nfunction resetBall() {\n ballX = canvas.width / 2;\n ballY = canvas.height / 2;\n ballSpeedX = -ballSpeedX;\n}\n\ndraw();\n---end---" + }, + "logprobs": null, + "finish_reason": "stop" + } + ], + "usage": { + "prompt_tokens": 237, + "completion_tokens": 1254, + "total_tokens": 1491, + "prompt_cache_hit_tokens": 0, + "prompt_cache_miss_tokens": 237 + }, + "system_fingerprint": "fp_f1afce2943" +} \ No newline at end of file diff --git a/readme.scroll b/readme.scroll new file mode 100644 index 0000000..df91a9f --- /dev/null +++ b/readme.scroll @@ -0,0 +1,2 @@ +# pong.scroll.pub +Website generated by DeepSeek from prompt: pong game \ No newline at end of file diff --git a/script.js b/script.js new file mode 100644 index 0000000..0269c48 --- /dev/null +++ b/script.js @@ -0,0 +1,84 @@ +const canvas = document.getElementById('pongCanvas'); +const ctx = canvas.getContext('2d'); + +const paddleWidth = 10, paddleHeight = 100; +const ballRadius = 10; + +let paddle1Y = 250, paddle2Y = 250; +let ballX = 400, ballY = 300; +let ballSpeedX = 5, ballSpeedY = 5; + +let upPressed = false, downPressed = false; +let arrowUpPressed = false, arrowDownPressed = false; + +document.addEventListener('keydown', keyDownHandler); +document.addEventListener('keyup', keyUpHandler); + +function keyDownHandler(e) { + if (e.key === 'w') upPressed = true; + if (e.key === 's') downPressed = true; + if (e.key === 'ArrowUp') arrowUpPressed = true; + if (e.key === 'ArrowDown') arrowDownPressed = true; +} + +function keyUpHandler(e) { + if (e.key === 'w') upPressed = false; + if (e.key === 's') downPressed = false; + if (e.key === 'ArrowUp') arrowUpPressed = false; + if (e.key === 'ArrowDown') arrowDownPressed = false; +} + +function drawPaddle(x, y) { + ctx.fillStyle = '#fff'; + ctx.fillRect(x, y, paddleWidth, paddleHeight); +} + +function drawBall() { + ctx.beginPath(); + ctx.arc(ballX, ballY, ballRadius, 0, Math.PI * 2); + ctx.fillStyle = '#fff'; + ctx.fill(); + ctx.closePath(); +} + +function draw() { + ctx.clearRect(0, 0, canvas.width, canvas.height); + + drawPaddle(0, paddle1Y); + drawPaddle(canvas.width - paddleWidth, paddle2Y); + drawBall(); + + if (upPressed && paddle1Y > 0) paddle1Y -= 7; + if (downPressed && paddle1Y < canvas.height - paddleHeight) paddle1Y += 7; + if (arrowUpPressed && paddle2Y > 0) paddle2Y -= 7; + if (arrowDownPressed && paddle2Y < canvas.height - paddleHeight) paddle2Y += 7; + + ballX += ballSpeedX; + ballY += ballSpeedY; + + if (ballY + ballRadius > canvas.height || ballY - ballRadius < 0) { + ballSpeedY = -ballSpeedY; + } + + if (ballX - ballRadius < paddleWidth && ballY > paddle1Y && ballY < paddle1Y + paddleHeight) { + ballSpeedX = -ballSpeedX; + } + + if (ballX + ballRadius > canvas.width - paddleWidth && ballY > paddle2Y && ballY < paddle2Y + paddleHeight) { + ballSpeedX = -ballSpeedX; + } + + if (ballX - ballRadius < 0 || ballX + ballRadius > canvas.width) { + resetBall(); + } + + requestAnimationFrame(draw); +} + +function resetBall() { + ballX = canvas.width / 2; + ballY = canvas.height / 2; + ballSpeedX = -ballSpeedX; +} + +draw(); \ No newline at end of file diff --git a/style.css b/style.css new file mode 100644 index 0000000..35b143b --- /dev/null +++ b/style.css @@ -0,0 +1,68 @@ +* { + margin: 0; + padding: 0; + box-sizing: border-box; +} + +body { + font-family: 'Arial', sans-serif; + background: linear-gradient(135deg, #1e3c72, #2a5298); + color: #fff; + min-height: 100vh; + display: flex; + flex-direction: column; + align-items: center; + justify-content: center; + padding: 20px; +} + +header { + text-align: center; + margin-bottom: 30px; +} + +h1 { + font-size: 3rem; + text-shadow: 2px 2px 4px rgba(0, 0, 0, 0.3); +} + +p { + font-size: 1.2rem; + margin-top: 10px; +} + +.game-container { + background: #000; + border: 5px solid #fff; + border-radius: 10px; + box-shadow: 0 0 20px rgba(255, 255, 255, 0.3); + margin-bottom: 20px; +} + +.controls { + text-align: center; + font-size: 1.1rem; + margin-top: 20px; +} + +footer { + margin-top: 30px; + text-align: center; + font-size: 1rem; +} + +@media (max-width: 768px) { + h1 { + font-size: 2rem; + } + + .game-container { + width: 100%; + height: auto; + } + + canvas { + width: 100%; + height: auto; + } +} \ No newline at end of file