body.html
Changed around line 1
+
+
+
+
+
+
index.scroll
Changed around line 1
+ buildHtml
+ baseUrl https://rpgquest.scroll.pub
+ metaTags
+ editButton /edit.html
+ title RPG Quest: A Browser-Based Adventure
+ style.css
+ body.html
+ script.js
prompt.json
Changed around line 1
+ {
+ "id": "3381811e-a647-4310-a7ea-7217f04d6a0b",
+ "object": "chat.completion",
+ "created": 1735321091,
+ "model": "deepseek-chat",
+ "choices": [
+ {
+ "index": 0,
+ "message": {
+ "role": "assistant",
+ "content": "---domain---\nrpgquest.scroll.pub\n---index.scroll---\nbuildHtml\nbaseUrl https://rpgquest.scroll.pub\nmetaTags\neditButton /edit.html\ntitle RPG Quest: A Browser-Based Adventure\nstyle.css\nbody.html\nscript.js\n---body.html---\n
\n \n \n \n \n
\n---style.css---\nbody {\n margin: 0;\n font-family: 'Arial', sans-serif;\n background-color: #1e1e1e;\n color: #fff;\n display: flex;\n justify-content: center;\n align-items: center;\n height: 100vh;\n overflow: hidden;\n}\n\n#game-container {\n position: relative;\n width: 800px;\n height: 600px;\n background-color: #333;\n border: 2px solid #555;\n overflow: hidden;\n}\n\n.character {\n position: absolute;\n width: 40px;\n height: 40px;\n background-color: #ff6347;\n border-radius: 50%;\n transition: all 0.2s ease;\n}\n\n#player {\n background-color: #00bfff;\n}\n\n#npc {\n background-color: #32cd32;\n}\n\n#message-box {\n position: absolute;\n bottom: 10px;\n left: 10px;\n width: 780px;\n padding: 10px;\n background-color: rgba(0, 0, 0, 0.8);\n border: 1px solid #555;\n color: #fff;\n text-align: center;\n display: none;\n}\n---script.js---\nconst player = document.getElementById('player');\nconst enemy = document.getElementById('enemy');\nconst npc = document.getElementById('npc');\nconst messageBox = document.getElementById('message-box');\n\nlet playerX = 400;\nlet playerY = 300;\nlet enemyX = 200;\nlet enemyY = 200;\nlet npcX = 600;\nlet npcY = 400;\n\nconst speed = 5;\nconst enemySpeed = 2;\nconst npcSpeed = 1;\nconst attackRange = 50;\nconst escapeThreshold = 20;\nlet enemyHealth = 100;\n\nfunction updatePositions() {\n player.style.left = `${playerX}px`;\n player.style.top = `${playerY}px`;\n enemy.style.left = `${enemyX}px`;\n enemy.style.top = `${enemyY}px`;\n npc.style.left = `${npcX}px`;\n npc.style.top = `${npcY}px`;\n}\n\nfunction movePlayer(direction) {\n switch (direction) {\n case 'ArrowUp': playerY -= speed; break;\n case 'ArrowDown': playerY += speed; break;\n case 'ArrowLeft': playerX -= speed; break;\n case 'ArrowRight': playerX += speed; break;\n }\n updatePositions();\n}\n\nfunction moveEnemy() {\n const dx = playerX - enemyX;\n const dy = playerY - enemyY;\n const distance = Math.sqrt(dx * dx + dy * dy);\n\n if (distance < attackRange) {\n enemyX += dx / distance * enemySpeed;\n enemyY += dy / distance * enemySpeed;\n if (distance < 10) {\n messageBox.textContent = 'Enemy attacks!';\n messageBox.style.display = 'block';\n setTimeout(() => messageBox.style.display = 'none', 1000);\n }\n } else if (enemyHealth < escapeThreshold) {\n enemyX -= dx / distance * enemySpeed;\n enemyY -= dy / distance * enemySpeed;\n } else {\n enemyX += Math.cos(Date.now() / 1000) * enemySpeed;\n enemyY += Math.sin(Date.now() / 1000) * enemySpeed;\n }\n updatePositions();\n}\n\nfunction moveNPC() {\n npcX += (Math.random() - 0.5) * npcSpeed;\n npcY += (Math.random() - 0.5) * npcSpeed;\n updatePositions();\n}\n\nnpc.addEventListener('click', () => {\n messageBox.textContent = 'NPC: Hello, adventurer!';\n messageBox.style.display = 'block';\n setTimeout(() => messageBox.style.display = 'none', 2000);\n});\n\ndocument.addEventListener('keydown', (e) => {\n if (['ArrowUp', 'ArrowDown', 'ArrowLeft', 'ArrowRight'].includes(e.key)) {\n movePlayer(e.key);\n }\n});\n\nsetInterval(moveEnemy, 100);\nsetInterval(moveNPC, 100);\n---end---"+ },
+ "logprobs": null,
+ "finish_reason": "stop"
+ }
+ ],
+ "usage": {
+ "prompt_tokens": 467,
+ "completion_tokens": 1049,
+ "total_tokens": 1516,
+ "prompt_cache_hit_tokens": 0,
+ "prompt_cache_miss_tokens": 467
+ },
+ "system_fingerprint": "fp_f1afce2943"
+ }
readme.scroll
Changed around line 1
+ # rpgquest.scroll.pub
+ Website generated by DeepSeek from prompt: Create a browser based HTML RPG game: Generate in-line JavaScript code for a simple RPG game AI. The AI governs NPCs and enemies in a browser-based game. The AI should include: Features: Enemy AI Behavior: Basic Attack Logic: Enemies detect the player within a specific range and attack when in proximity. Patrol Mode: Enemies follow a predefined path when not engaged. Escape Mechanic: Enemies flee when their health drops below a threshold. NPC Behavior: Interaction Logic: NPCs respond to player actions, such as initiating dialogues when clicked. Movement Patterns: NPCs roam randomly within a defined area. Player Commands: Allow the player to control interactions (e.g., attack, talk) via simple button clicks or keypresses. HTML Integration: Render characters and environments using
elements styled with CSS. Update positions dynamically with JavaScript. Scalability: Code should be modular for adding more characters, behaviors, or levels. Output Example: Provide a minimal working example with: An enemy that patrols and attacks the player on proximity. An NPC that displays a message when clicked. Basic player movement with arrow keys.
script.js
Changed around line 1
+ const player = document.getElementById('player');
+ const enemy = document.getElementById('enemy');
+ const npc = document.getElementById('npc');
+ const messageBox = document.getElementById('message-box');
+
+ let playerX = 400;
+ let playerY = 300;
+ let enemyX = 200;
+ let enemyY = 200;
+ let npcX = 600;
+ let npcY = 400;
+
+ const speed = 5;
+ const enemySpeed = 2;
+ const npcSpeed = 1;
+ const attackRange = 50;
+ const escapeThreshold = 20;
+ let enemyHealth = 100;
+
+ function updatePositions() {
+ player.style.left = `${playerX}px`;
+ player.style.top = `${playerY}px`;
+ enemy.style.left = `${enemyX}px`;
+ enemy.style.top = `${enemyY}px`;
+ npc.style.left = `${npcX}px`;
+ npc.style.top = `${npcY}px`;
+ }
+
+ function movePlayer(direction) {
+ switch (direction) {
+ case 'ArrowUp': playerY -= speed; break;
+ case 'ArrowDown': playerY += speed; break;
+ case 'ArrowLeft': playerX -= speed; break;
+ case 'ArrowRight': playerX += speed; break;
+ }
+ updatePositions();
+ }
+
+ function moveEnemy() {
+ const dx = playerX - enemyX;
+ const dy = playerY - enemyY;
+ const distance = Math.sqrt(dx * dx + dy * dy);
+
+ if (distance < attackRange) {
+ enemyX += dx / distance * enemySpeed;
+ enemyY += dy / distance * enemySpeed;
+ if (distance < 10) {
+ messageBox.textContent = 'Enemy attacks!';
+ messageBox.style.display = 'block';
+ setTimeout(() => messageBox.style.display = 'none', 1000);
+ }
+ } else if (enemyHealth < escapeThreshold) {
+ enemyX -= dx / distance * enemySpeed;
+ enemyY -= dy / distance * enemySpeed;
+ } else {
+ enemyX += Math.cos(Date.now() / 1000) * enemySpeed;
+ enemyY += Math.sin(Date.now() / 1000) * enemySpeed;
+ }
+ updatePositions();
+ }
+
+ function moveNPC() {
+ npcX += (Math.random() - 0.5) * npcSpeed;
+ npcY += (Math.random() - 0.5) * npcSpeed;
+ updatePositions();
+ }
+
+ npc.addEventListener('click', () => {
+ messageBox.textContent = 'NPC: Hello, adventurer!';
+ messageBox.style.display = 'block';
+ setTimeout(() => messageBox.style.display = 'none', 2000);
+ });
+
+ document.addEventListener('keydown', (e) => {
+ if (['ArrowUp', 'ArrowDown', 'ArrowLeft', 'ArrowRight'].includes(e.key)) {
+ movePlayer(e.key);
+ }
+ });
+
+ setInterval(moveEnemy, 100);
+ setInterval(moveNPC, 100);
style.css
Changed around line 1
+ body {
+ margin: 0;
+ font-family: 'Arial', sans-serif;
+ background-color: #1e1e1e;
+ color: #fff;
+ display: flex;
+ justify-content: center;
+ align-items: center;
+ height: 100vh;
+ overflow: hidden;
+ }
+
+ #game-container {
+ position: relative;
+ width: 800px;
+ height: 600px;
+ background-color: #333;
+ border: 2px solid #555;
+ overflow: hidden;
+ }
+
+ .character {
+ position: absolute;
+ width: 40px;
+ height: 40px;
+ background-color: #ff6347;
+ border-radius: 50%;
+ transition: all 0.2s ease;
+ }
+
+ #player {
+ background-color: #00bfff;
+ }
+
+ #npc {
+ background-color: #32cd32;
+ }
+
+ #message-box {
+ position: absolute;
+ bottom: 10px;
+ left: 10px;
+ width: 780px;
+ padding: 10px;
+ background-color: rgba(0, 0, 0, 0.8);
+ border: 1px solid #555;
+ color: #fff;
+ text-align: center;
+ display: none;
+ }